View
1.252
Download
2
Category
Preview:
DESCRIPTION
Presented at Lullabot's 2011 Do It With Drupal conference, in Brooklyn New York. http://2011.doitwithdrupal.com/2011/sessions/its-not-your-fathers-web-designing-html-apis For the last twenty years, we have been creating websites from inside of a certain set of constraints — inside the limits of the technology that runs the web. We became so used to those constraints, we stopped thinking about them. But HTML5 changes many of these limits. The new HTML specs define a lot more than markup — there's a lot about databases, communication protocols, and how websites & browsers talk to each other. Radical stuff that will redefine the creature formerly-known as the "web page". Come hear a non-nerd explanation of the specific possibilities created by the new HTML. Don't just wait around to see how other people implement these technologies. Learn about HTML5 APIs yourself, and envision the web of the future.
Citation preview
DESIGNING FOR HTML5 APIS
IT'S NOT YOUR PARENT'S WEB ANYMORE
JEN SIMMONSjensimmons.com
twitter: jensimmons
Bartik for Drupal 7
5by5.tv/webahead
http://venusinfurs.net/2006/06/10/f-train/
DECISIONS STICK
AROUND
An innovator is not someone who creates something amazing out of nothing.
An innovator is someone who wakes up to the constraints caused by false assumptions, and breaks out of them.
INTERNET
FTP BBSeMailUsenetLISTSERV IRCGopher
1971 1973197319791986 19881991
CompuServThe Source
DelphiGEnie
AppleLinkeWorld
America OnLine
HYPERTEXT
WEB 1.0
The World-Wide Web (W3) was developed to be a pool of human knowledge, which would allow collaborators in remote sites to share their ideas and all aspects of a common project… The idea of the Web was prompted by positive experience of a small “home-brew” personal hypertext system used for keeping track of personal information on a distributed project. The Web was designed so that if it was used independently for two projects, then no major centralized changes would have to be made, but the information could smoothly reshape to represent the new state of knowledge.
— Tim Berners-Lee, 1994
LINKHTMLHTTP
WEB 1.0Find somethingReadLook at imagesClick links to !nd more things
WEB 2.0
WEB 2.0CommentSign inAdd text, photos, video, audioConnect to other usersBuy thingsParticipate, not just read
WEB 3.0
STORAGE
Local StorageSession Storagekey|value pairs
WEB STORAGE
full-fledged client-side databasealso, WebSQL
INDEX DB
APPLICATION CACHE
WEB SOCKETS
CROSS ORIGIN COMMUNICATION
RESPONSIVE DESIGN
•28.8k modem
•600x 480
•keyboard & mouse
• 56.6k
•800x 680
•keyboard & mouse
•dsl
• 1024x768
•keyboard & mouse
•!os
• 1024x768+
•keyboard & mouse
• 3g
• 320x480
• touch screen
• !os, cable, dsl, satellite, dial-up, 4g, 3g, 3g in certain cities, edge
•widths: 320, 480, 600, 768, 1024, 1200, 1330, 1440, 1900...
• keyboard, mouse, touch, screenreader, large text
SO WHAT?OR, ER, WHY?
LEARN MORE
Pro HTML5 ProgrammingPeter Lubbers, Brian Albers,and Frank Salim
prohtml5.comcoupon code at 5by5.tv/webahead/1
Ethan Marcotte's Responsive Web Designabookapart.com
dev.w3.org/html5/spec/Overview.html
THE SPEC ITSELF
netmagazine.com/features/ethan-marcottes-20-favourite-responsive-sites
5by5.tv/webahead
jensimmons.comtwitter: jensimmons
THANKS!
Recommended