Web 2.0

Daniel ChapmanWebmaker’s Meeting, January 2007

What is Web 2.0?

• A buzzword

• A phrase used by journalists in any new article referring to the Internet

• A collection of ideas and concepts, most famously outlined in Tim O’Reilly’s article, “What is Web 2.0?”

What is Web 2.0?

• Some of the O’Reily Article Web 2.0 concepts include:

• Web 2.0 is about Services, not packaged software - simple, smart web-based services rather than full-blown, packaged software releases

• User control over unique, hard-to-recreate data sources that get richer as more people use them

• Trusting users as co-developers

• Harnessing collective intelligence - user powered information

• Light, easy to use user interfaces

OK, But what does that really mean?

• Seeing Web 2.0 as something more fundamental: Playing to the Internet’s inherent strengths:

• Harnessing the collective over the select few - sharing and collaborating through user-driven connections and content decisions, rather than through a top-down approach.

• Examples include: Tagging, embedded content sharing and content collaborations through Web services or shared APIs

• Allowing users to create organic connections between content, much like the way “average joe” Web content is generated.

OK, But what does that really mean?

Examples

•Popular Science vs Engadget

•Wikipedia vs Encyclopedia Britannica

•YouTube vs Cable

•Google Adwords vs DoubleClick

• Information presented in small, digestible segments

• Content provided in a way best suited to the medium

• Smart, targeted distribution, instead of traditional wide-net broadcasting

OK, But what does that really mean?

What does this mean for what we do?

• How does this idea of people-powered content work with State Government?

• Open-ended, unregulated Internet culture

vs

Hierarchical, structured entities with a need to provide, authoritative information.

What does this mean for what we do?

Ideas we can agree on:

• The continuous roll out - end of the 1.0, 2.0, 3.0 version number era.

• Good simple, clear-cut design. Less is more. (White space is a good thing)

• Use of AJAX where appropriate to create richer user experiences without sacrificing accessibility.

• Losing control is OK:Technologies like RSS, iCal or ICS, blogs and Web services allow for content to be manipulated away from the Web page.

What does this mean for what we do?

Ideas that are a harder sell for State Government:

• Tagging vs. traditional hierarchyLetting users dictate how portal information is best organized through tagging vs. category maps or other traditional navigation methods. Is this a good service for citizens browsing Government sites?

• Syndicating portal content to other Web sites Is syndicating site content through Web services desirable for state Web sites? Example: Customized versions of Amazon, eBay, Craigslist create unique and sometimes unintended consequences. Is this worth the risk for the possible return?

Under the hood (What the heck is AJAX anyway?)

• Asynchronous Javascript and XML

• Asynchronous: Content can be added to an existing Web page, or within the DOM (Domain Object Model) after page load, resulting in more dynamic content delivery.

• Javascript: Javascript used to create a more dynamic user experience (creating effects traditionally associated with plugins such as Quicktime or Flash), only without the need for plugins.

• XML: Standard markup format for getting data in and out.

• Other technologies used in conjunction with AJAX include:

• HTML / XHTML

• CSS

Under the hood (What the heck is AJAX anyway?)

Some of the most famous AJAX / Web 2.0 examples include:

•Flickr

•Basecamp

•Google Maps

Flickr

Features:

•Dynamic AJAX “photostream” slideshows

•User-driven tagging

•User comments and permalinking

•RSS feeds

Basecamp

Features:

•Dynamic content manipulation

•Animated feedback, prompts and other AJAX goodies add to the user experience - more desktop app, less Web site

•RSS Feeds

•iCal Feeds

Google Maps

Features:

•Live content refresh and manipulation without page refreshes

•API for easy integration with other data sources

RI.gov and AJAX

RI.gov examples:

•Secretary of State Point of Sale application

•Photo Gallery

•A-Z Guide

RI.gov Photo Gallery

Features:

•Use of JQuery AJAX library

•Use of Thickbox JQuery add-on for slideshow effects

•Slideshow remains accessible even with javascript turned off (degrades gracefully)

•Formatting can easily be adjusted through a dedicated style sheet

RI.gov Photo Gallery

www.RI.gov/photocontest/

RI.gov A-Z Guide

Features:

•Use of JQuery Library

•Dynamic XML data load for additional agency information from the Secretary of State’s office

RI.gov A-Z Guide

www.RI.gov/guide/

RI.gov SOS Point of Sale

Features:

•Designed from the ground-up to mimic an existing desktop application

•Uses the lightweight AJAX library JQuery

•Dynamic XML calls load data into pages wherever possible without page refreshes

•Use of tab index allows for extensive keyboard use, reducing mouse use for quick data entry

RI.gov SOS Point of Sale

Things we can do to be ready for Web 2.0

• Separate substance from style. CSS-driven design, with clean database-driven content and semantic page markup. This helps makes our content ready for stripped-down syndication through Web services when we’re ready for them.

• Allow for user-driven remixing of contentLosing control is OK!

Hype vs Reality

• Question:Is Web 2.0 a cohesive, well-defined concept worthy of widespread adoption, or a buzzword centered around disparate, naturally evolving ideas?

Answer? Both.

• Trends and buzzwords evolve faster than the public’s ability to catch up. Our responsibility is to help all citizens interact with Rhode Island State Government online, no matter what what skill set.

Sources

• What is Web 2.0 Tim O’Reilyhttp://www.oreillynet.com/pub/a/oreilly/tim/news/2005/09/30/what-is-web-20.html

• JQuery: New Wave Javascripthttp://jquery.com/

• Thickbox 2.1http://jquery.com/demo/thickbox/

• Wikipedia: Web 2.0http://en.wikipedia.org/wiki/Web_2.0

• Wikipedia: AJAXhttp://en.wikipedia.org/wiki/AJAX

• Web 2.0 for Designers Richard MacManushttp://www.digital-web.com/articles/web_2_for_designers/

• Web 3.0 Jeffery Zeldmanhttp://www.alistapart.com/articles/web3point0/