Website Design Website Design MCQ 4 — Questions and Answers
Question 1: Which accessibility attribute provides alternative text for images?
- alt (Correct answer)
- title
- aria-label
- longdesc
Correct answer: alt
The alt attribute on <img> elements provides descriptive text for screen readers and displays when the image cannot load.
Question 2: What is the recommended minimum contrast ratio for normal text according to WCAG AA standards?
- 4.5:1 (Correct answer)
- 3:1
- 7:1
- 2:1
Correct answer: 4.5:1
WCAG AA requires a minimum contrast ratio of 4.5:1 for normal text to ensure readability for users with visual impairments.
Question 3: What is a hero image in web design?
- A large, prominent banner image displayed at the top of a page (Correct answer)
- The website's logo image
- A user profile photograph
- An image carousel with multiple slides
Correct answer: A large, prominent banner image displayed at the top of a page
A hero image is a large, full-width or oversized image placed prominently at the top of a webpage to immediately engage visitors.
Question 4: Which layout approach uses a 12-column grid system commonly seen in frameworks like Bootstrap?
- Grid-based layout (Correct answer)
- Flexbox layout
- Float-based layout
- Table layout
Correct answer: Grid-based layout
Grid-based layouts divide the page into equal columns (typically 12) allowing designers to align content consistently and create responsive designs.
Question 5: What does the CSS 'display: flex' property enable?
- A one-dimensional layout model for arranging items in rows or columns (Correct answer)
- A two-dimensional grid layout system
- Absolute positioning of child elements
- Inline block behavior for the element
Correct answer: A one-dimensional layout model for arranging items in rows or columns
Flexbox creates a flexible container where child elements can be arranged, aligned, and distributed along a single axis (row or column).
Question 6: What is the purpose of a style guide in web design?
- To document consistent design standards including colors, fonts, and UI components (Correct answer)
- To instruct developers on coding best practices
- To outline the project timeline and milestones
- To list all pages in the website sitemap
Correct answer: To document consistent design standards including colors, fonts, and UI components
A style guide defines the visual and design standards for a project, ensuring consistency across all pages and team members.
Question 7: Which image format supports animation natively in web browsers?
- GIF (Correct answer)
- PNG
- JPEG
- WebP
Correct answer: GIF
GIF (Graphics Interchange Format) has supported frame-based animation since its introduction and is widely used for simple animated images.
Which accessibility attribute provides alternative text for images?