L8: Dynamic Web Pages: Effective Use of AJAX

Question 1

What is AJAX?

Answer 1

Asynchronous JavaScript & XML.

Remote scripting. An approach for making server requests without reloading the whole page.

Question 2

What does AJAX rely on?

Answer 2

• Server request browser function (XMLHttpRequest) –> Request to the server for more data.
• Uses document object model (DOM) scripting to make changes to the current page.

Question 3

AJAX =

Answer 3

DHTML + XMLHTTPrequest

Question 4

DHTML is a tecnique using:

Answer 4

• XHTML
• CSS
• JavaScript
• DOM

Question 5

Ajax relies on DHTML and what other web technology?

Answer 5

XMLHttpRequest

Question 6

without implementing AJAX:

Answer 6

• Request is for a url

* Anything that is returned must be a complete page with appropriate headers.

Question 7

with the implementation of AJAX:

Answer 7

• Client-side scripts use XMLHttpRequest to make a request for data.
• The data does not have to be XML
• Request can complete at anytime but user is not left waiting for a new page updates achieved through the DOM.

Question 8

​The main advantages of Ajax:

Answer 8

• It’s faster to load a certain section of a webpage than returning a whole page.
• Data-oriented requests mean greater code reuse - especially on the server side.
• Overall approach can be more like a desktop application.

Question 9

The disadvantages of Ajax:

Answer 9

• The asynchronous data requests rely on technology that can vary from browser to browser.
• Different code needed on different browsers
• Requests may not complete in a timely fashion (or not at all)
• Pages laden with code take longer to load
• Network overheads may make short transfers slow in proportion

Question 10

AJAX: Installation

Answer 10

Plug-in or installation required

Question 11

AJAX: Speedy Start

Answer 11

How quickly users can start to interact

Question 12

AJAX: Granularity

Answer 12

The smallest unit of data updates

Question 13

AJAX: Portability

Answer 13

Portability across platforms

Question 14

AJAX: Maintenance

Answer 14

Difficulty of making and distributing changes

Question 15

AJAX: Sophistication

Answer 15

Richness of the user experience

Question 16

UML

Answer 16

(Unified Modeling Language) is a standard language for specifying, visualizing, constructing, and documenting the artifacts of software systems.

Question 17

Gran·u·lar·i·ty

Answer 17

the scale or level of detail present in a set of data or other phenomenon.

Question 18

AJAX can prevent ____________________.

Answer 18

unnecessary page reloads.

Question 19

How does Ajax reduce the effects of change blindness?

Answer 19

Eliminates page reloads and reduces load times.

Question 20

Ajax can prevent unnecessary page reloads but error messages and other feedback still need to be obvious. What are some ways to achieve that?

Answer 20

• Use color and animation appropriately

* Consider the position of feedback

Question 21

Updating pages without reloading is only effective if…

Answer 21

• users are looking in the right place or

* the change attracts attention by being large, colorful or animated.

Question 22

Inattention blindness- even large changes may not be seen if..

Answer 22

• The task is demanding

* Users are stressed or fatigued

Question 23

Change blindness- changes will not be noticed, especially if…

Answer 23

• a page reload is involved

* Users are distracted

Question 24

Attentional gambling - users will not attend to content or navigation if..

Answer 24

• If it isn’t where they expected it to be

* If they are distracted

Question 25

What are some perceptual issues in web design?

Answer 25

* Inattention Blindness * Change Blindness * Attentional (Gambling) Blindness

Question 26

What is change blindness?

Answer 26

We cannot see the differences between two images when they are separated by a blank field.

Question 27

Reloading the whole page runs the risk of...

Answer 27

change blindness

Question 28

Every page element is represented in the...

Answer 28

Document Object Model

Question 29

How does scripted enhancements work in practice?

Answer 29

1. Every page element is represented in the DOM 2. Each can have a unique ID and a class name (provided through tags) 3. Scripts can access elements by ID, class or by "walking the model".

Question 30

What is the focus in Graceful Degradation?

Answer 30

Failing Safe aka Fault Tolerance

Question 31

How do you preserve expected navigation behavior?

Answer 31

* Ensure that browser back and forward buttons still do what users expect * Do not navigate back and forward buttons to a separate section of the page. Go back in the user's journey history.

Question 32

What assistive technology do disabled users rely on to use the web?

Answer 32

* Screen readers * Magnifiers * Braille output devices * Alternative pointing devices * Speech recognition

Question 33

Web solutions must work in harmony with _____ ______.

Answer 33

Assistive technology

Question 34

WAI

Answer 34

Web Application Interface

Question 35

The only technology that is guaranteed to work with search engines is ______.

Answer 35

HTML

Question 36

To work with search engines, start with a working HTML page and use ______ ______ to add interactivity.

Answer 36

progressive enhancement. Google now claims to index dynamic pages(but results vary).

Question 37

ARIA

Answer 37

Accessible Rich Internet Applications

Question 38

T or F: Most accessibility aides do understand JS, but dynamic updates still rely on upcoming technology(ARIA).

Answer 38

True

Question 39

What does ARIA provide?

Answer 39

Identification of page elements (with roles and landmarks) and a mechanism for notifying browsers of dynamic updates (live regions).

Question 40

How does Ajax reduce the effects of change blindness?

Answer 40

Eliminates page reloads

Question 41

What is ARIA in web technology?

Answer 41

An accessibility standard