MTA HTML5 Application Development Fundamentals 2 — Questions and Answers
Question 1: What is the purpose of CSS media queries in responsive web design?
- Embedding media files in web pages
- Applying different styles based on device characteristics like screen width (Correct answer)
- Loading external fonts
- Controlling video playback
Correct answer: Applying different styles based on device characteristics like screen width
CSS media queries apply different style rules based on device characteristics such as screen width, height, or orientation, enabling responsive designs that adapt to different devices.
Question 2: Which JavaScript method is used to make asynchronous HTTP requests to a server?
- setTimeout()
- addEventListener()
- fetch() (Correct answer)
- querySelector()
Correct answer: fetch()
The fetch() API provides a modern, promise-based way to make asynchronous HTTP requests to servers and APIs, replacing the older XMLHttpRequest (XHR) approach.
Question 3: What does the 'alt' attribute on an HTML <img> element provide?
- The image file format
- Alternative text displayed when the image cannot load and read by screen readers (Correct answer)
- The image dimensions
- A tooltip on hover
Correct answer: Alternative text displayed when the image cannot load and read by screen readers
The alt attribute provides a text alternative for images that is displayed when the image fails to load and is read by screen readers for accessibility.
Question 4: What is the purpose of the HTML5 <semantic> elements like <header>, <nav>, <article>, and <footer>?
- Adding visual styling to the page
- Providing meaningful structure that improves accessibility and SEO (Correct answer)
- Executing JavaScript code
- Loading external content
Correct answer: Providing meaningful structure that improves accessibility and SEO
HTML5 semantic elements convey meaning about the content they contain, helping browsers, screen readers, and search engines understand the document structure.
Question 5: What is the difference between sessionStorage and localStorage in HTML5?
- sessionStorage is server-side; localStorage is client-side
- sessionStorage is cleared when the browser tab is closed; localStorage persists indefinitely (Correct answer)
- sessionStorage holds more data than localStorage
- localStorage requires user authentication; sessionStorage does not
Correct answer: sessionStorage is cleared when the browser tab is closed; localStorage persists indefinitely
sessionStorage stores data only for the duration of a browser session (cleared when the tab closes), while localStorage persists data with no expiration until explicitly cleared.
Question 6: Which HTML5 API allows web applications to work offline by caching resources?
- localStorage API
- Service Worker API (Correct answer)
- IndexedDB API
- Web Storage API
Correct answer: Service Worker API
Service Workers are JavaScript files that run in the background, intercepting network requests and caching resources to enable offline functionality and faster load times.
What is the purpose of CSS media queries in responsive web design?