Bulletproof Ajax
Upcoming SlideShare
Loading in...5
×
 

Like this? Share it with your network

Share

Bulletproof Ajax

on

  • 2,334 views

Amedia 2007 Europe, London june 7th-8th

Amedia 2007 Europe, London june 7th-8th

Statistics

Views

Total Views
2,334
Views on SlideShare
2,334
Embed Views
0

Actions

Likes
2
Downloads
49
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Bulletproof Ajax Presentation Transcript

  • 1. Bulletproof Ajax
  • 2. Bulletproof progressive enhancement
  • 3. behaviour JavaScript presentation CSS structureHTML content
  • 4. <p> This is the introduction </p> <p style=quot;font-weight:boldquot;> This is the introduction </p> <p class=quot;introquot;> This is the introduction </p> .intro { font-weight:bold; }
  • 5. <a href=quot;help.htmlquot;> Need help? </a> <a href=quot;help.htmlquot; onclick=quot;window.open (this.href); return false;quot;> Need help? </a> <a href=quot;help.htmlquot; class=quot;helpquot;> Need help? </a>
  • 6. window.onload = function() { // get links with class help // loop through links link.onclick = function(){ window.open(this.href); return false; }; };
  • 7. beware <a href=quot;javascript:...quot;> <a href=quot;#quot; onclick= quot;...quot;>
  • 8. communicating with the server without refreshing the whole page. Ajax
  • 9. communicating with the server without refreshing frames the whole page. iframe Flash XMLHttpRequest
  • 10. Microsoft IE5 Mozilla Safari Opera W3C XMLHttpRequest
  • 11. send responseText open status browser XHR server XMLHttpRequest
  • 12. speed
  • 13. thin client
  • 14. thin client browser server displaying data processing
  • 15. fat client
  • 16. fat client browser XHR server displaying data processing
  • 17. dumb waiter
  • 18. progressive enhancement using XMLHttpRequest
  • 19. progressive enhancement Hijax
  • 20. browser server displaying data processing
  • 21. deceptively fat client browser XHR server displaying data processing
  • 22. { navigation search main content browser server on form log shopping cart footer
  • 23. navigation search main content browser XHR log on form shopping cart footer
  • 24. paradox? plan for Ajax from the start implement Ajax at the end
  • 25. pattern recognition add a comment log on add to cart rate this search results? pagination?
  • 26. documents applications
  • 27. design challenges
  • 28. WTF? what is happening? what just happened?
  • 29. beyond the browser the back button bookmarking
  • 30. user testing
  • 31. Accessibility Just Ain’t eXciting
  • 32. “Unless a way can be found to notify screen readers of updated content, Ajax techniques cannot be considered accessible.”
  • 33. “This Ajax application is usable by screen- reader users some of the time. They aren’t totally shut out, but it isn’t totally easy for them, either.”
  • 34. “The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect.”
  • 35. k thx bai adactio.com http://flickr.com/photos/flydown/42047131/ http://flickr.com/photos/bizzygirl/291918549/ http://flickr.com/photos/benchan/150094224/ http://flickr.com/photos/rogerjones/121736518/ http://flickr.com/photos/chuckbiscuito/161971512/