Third-party Content

Web Architecture and Information Management [./]
Spring 2011 — INFO 153 (CCN 42509)

Erik Wilde and Dilan Mahendran, UC Berkeley School of Information
2011-04-06

Creative Commons License [http://creativecommons.org/licenses/by/3.0/]

This work is licensed under a CC
Attribution 3.0 Unported License
[http://creativecommons.org/licenses/by/3.0/]

Contents Erik Wilde and Dilan Mahendran: Third-party Content

Contents

Erik Wilde and Dilan Mahendran: Third-party Content

(2) Abstract

HTML pages served by one web server can "host" content from a 3rd-party web server. That functionality is basic to the Web, but it has only really been exploited in recent years. In this lecture we'll look at methods for including 3rd-party content in web page, and some common patterns of application that use these methods.



Erik Wilde and Dilan Mahendran: Third-party Content

(3) The Rise of 3rd-Party Content

img/webparts.png [http://blogs.zdnet.com/Hinchcliffe/?p=80]

Transclusion Technologies

Outline (Transclusion Technologies)

  1. Transclusion Technologies [5]
  2. Third-Party Content Patterns [6]

(5) Transclusion



(6) iframes

<iframe src="http://mobile.yelp.com/biz/qHmamQPCAKkia9X0uryA8g" width="50%" height="450px" style="float: right; margin: 20px;">


(7) Embedded Objects

<object width="640" height="385" style="float: right; margin: 20px;">
<param name="movie" value="http://www.youtube.com/v/lAl28d6tbko&hl=en_US&fs=1&"></param>
<param name="allowFullScreen" value="true"></param>
<param name="allowscriptaccess" value="always"></param>
<embed src="http://www.youtube.com/v/lAl28d6tbko&hl=en_US&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="640" height="385"></embed>
</object>


(8) Javascript Widgets

<script type="text/javascript" src="http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js"></script>
<script>if (WIDGETBOX) WIDGETBOX.renderWidget('d8e2e8e9-8b6d-4f9f-a143-b1dd4347e398');</script>


(9) Server-Side Transclusion

img/transclusion.png


Third-Party Content Patterns

Outline (Third-Party Content Patterns)

  1. Transclusion Technologies [5]
  2. Third-Party Content Patterns [6]

(11) Social Media

img/widgetnetworkeffect.png [http://blogs.zdnet.com/Hinchcliffe/?p=80]

(12) Widget Marketing Success

img/myspace_vs_youtube.png


(13) Widget Portals

img/igoogle.gif [http://google.com/ig]

img/netvibes.png [http://netvibes.com]


(14) Widget Platforms

img/fb-platform.jpg [http://www.facebook.com/platform_tour.php]

img/google_wave.jpg [http://code.google.com/apis/wave/]


(15) Advertising



(16) “Outsourcing”

img/disqus.gif [http://disqus.com/]

img/gravatar.png [http://en.gravatar.com/]


Erik Wilde and Dilan Mahendran: Third-party Content

(17) Conclusions



2011-04-06 Web Architecture and Information Management [./]
Spring 2011 — INFO 153 (CCN 42509)