Toplax
-
Upload
xavier-badosa -
Category
Technology
-
view
6.688 -
download
0
description
Transcript of Toplax
![Page 1: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/1.jpg)
TOPLAXThe right approach to Ajax
Xavier Badosa
![Page 2: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/2.jpg)
• Not only D2D navigation (“hypertext”: document to document)
• But also web applications (RIA: micro-updating)
A richer World Wide Web
![Page 3: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/3.jpg)
• Not only D2D navigation (“hypertext”: document to document)
• But also web applications (RIA: micro-updating)
A richer World Wide Web
AJAX or Ajax
• A sexy name for XMLHttpRequest()
![Page 4: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/4.jpg)
• Not only D2D navigation (“hypertext”: document to document)
• But also web applications (RIA: micro-updating)
A richer World Wide Web
AJAX or Ajax
• A sexy name for XMLHttpRequest()
• Better usability (interactivity, speed, location, etc.)
![Page 5: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/5.jpg)
• Not only D2D navigation (“hypertext”: document to document)
• But also web applications (RIA: micro-updating)
A richer World Wide Web
AJAX or Ajax
• A sexy name for XMLHttpRequest()
• Better usability (interactivity, speed, location, etc.)
But...
![Page 6: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/6.jpg)
URI?
• Reference, links, bookmarks...
• History, Back...
![Page 7: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/7.jpg)
URI?
• Reference, links, bookmarks...
• History, Back...
Solutions
• Append an anchor to the current location (#) (for example, Really Simply History (RSH) framework)
• Use Ajax mainly in middle pages (exclude entry and result pages)
![Page 8: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/8.jpg)
J is for Javascript...
![Page 9: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/9.jpg)
J is for Javascript... A is not for accessible...
![Page 10: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/10.jpg)
The Accessibility Problem
J is for Javascript... A is not for accessible...
![Page 11: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/11.jpg)
The Accessibility Problem
The classic solution
• Progressive enhancement
• Graceful degradation
J is for Javascript... A is not for accessible...
XHTMLeXtensible Hypertext Markup Language
JSJavaScript
CSSCascading Style Sheet
![Page 12: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/12.jpg)
The Accessibility Problem
The classic solution
• Progressive enhancement
• Graceful degradation
J is for Javascript... A is not for accessible...
XHTMLeXtensible Hypertext Markup Language
JSJavaScript
CSSCascading Style Sheet
Jeremy Keith’s Pun:
![Page 13: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/13.jpg)
The Accessibility Problem
The classic solution
• Progressive enhancement
• Graceful degradation
J is for Javascript... A is not for accessible...
XHTMLeXtensible Hypertext Markup Language
JSJavaScript
CSSCascading Style Sheet
Jeremy Keith’s Pun: “Hijax”
![Page 14: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/14.jpg)
J is for Javascript... A is not for accessible...
XHTMLeXtensible Hypertext Markup Language
JSJavaScript
CSSCascading Style Sheet
![Page 15: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/15.jpg)
J is for Javascript... A is not for accessible...
XHTMLeXtensible Hypertext Markup Language
JSJavaScript
CSSCascading Style Sheet
XHTML
JS CSS
![Page 16: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/16.jpg)
J is for Javascript... A is not for accessible...
XHTMLeXtensible Hypertext Markup Language
JSJavaScript
CSSCascading Style Sheet
XHTML
JS CSSCSS
XHTML
JS
![Page 17: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/17.jpg)
J is for Javascript... A is not for accessible...
XHTMLeXtensible Hypertext Markup Language
JSJavaScript
CSSCascading Style Sheet
XHTML
JS CSSCSS
XHTML
JS
AJAX
![Page 18: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/18.jpg)
J is for Javascript... A is not for accessible...
XHTMLeXtensible Hypertext Markup Language
JSJavaScript
CSSCascading Style Sheet
XHTML
JS CSSCSS
XHTML
JS
AJAXToplayered
![Page 19: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/19.jpg)
J is for Javascript... A is not for accessible...
XHTMLeXtensible Hypertext Markup Language
JSJavaScript
CSSCascading Style Sheet
XHTML
JS CSSCSS
XHTML
JS
AJAXToplayered
Or...
![Page 20: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/20.jpg)
AJAXToplayered
TOPLAX
![Page 21: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/21.jpg)
AJAXToplayered
TOPLAXFrom cleanser to medicine
![Page 22: Toplax](https://reader035.fdocuments.net/reader035/viewer/2022070317/55632a92d8b42a5c7b8b473d/html5/thumbnails/22.jpg)
AJAXToplayered
TOPLAXFrom cleanser to medicine
Thank you
Xavier Badosa