01
True or false
1 point
True or false: Every element in a layout must obey the grid exactly.
Free Practice Quiz Question List
5 Layout and Grid Systems Online Quiz Questions
Use this free practice quiz with 20 questions to review 5 Layout and Grid Systems, test your knowledge, and prepare for your next test or exam.
20 questions
02
Fill in the blank
1 point
In a column grid, the spaces between columns are called .
03
Choose one
1 point
A page feels crowded, but all of its content must remain. Which response best follows the layout guidance?
- A
Reduce the text size until every element fits
- B
Review the spacing, line length, and number of columns
- C
Remove the margins so content reaches the page edges
- D
Add more alignment lines to divide the page into smaller areas
04
Written response
1 point
What type of grid can help text lines in adjacent columns line up horizontally?
05
True or false
1 point
True or false: A screen layout may visually rearrange items in a way that conflicts with the underlying reading and keyboard-navigation order, as long as the visual design looks balanced.
- A
True
- B
False
06
Choose all
1 point
A multi-column screen layout becomes cramped at a narrow viewport. Which changes follow the responsive layout guidance? Select all that apply.
- A
Reduce the number of columns when space is limited
- B
Shrink the entire fixed-page layout proportionally at every viewport size
- C
Allow items to stack on a narrow screen
- D
Preserve comfortable reading widths and spacing
07
Written response
1 point
What type of layout repeats similar units, making it useful for a catalog of product cards?
08
Fill in the blank
1 point
For a printed page, artwork intended to extend to the edge of the trimmed page must account for .
09
Choose one
1 point
In a CSS Grid card layout, what does the gap declaration control?
- A
It defines the width of the page margins
- B
It changes the content order for keyboard navigation
- C
It sets spacing between the cards
- D
It specifies the viewport size at which the layout changes
10
Choose all
1 point
After setting the format and defining a grid, which actions belong in a practical layout process? Select all that apply.
- A
Reserve regions for titles, navigation, content, and supporting information
- B
Align and space related elements using shared edges and a consistent system
- C
Add as many competing alignment lines as possible
- D
Check hierarchy and flow, then test and refine the layout
11
Choose one
1 point
When choosing a breakpoint for a responsive layout, what should guide the decision?
- A
Use the same breakpoint for every project
- B
Set it to match the width of a particular device model
- C
Set it when the content no longer fits comfortably
- D
Wait until the layout is entirely unreadable before changing it
12
Open ended
1 point
Explain two important differences between designing a print layout and designing a screen layout. Include at least one practical consideration for each medium.
13
Choose one
1 point
A feature page needs a stronger focal point. Which use of a grid departure is supported by the layout guidance?
- A
Never allow an element to cross a grid boundary
- B
Allow a headline or image to cross a boundary for emphasis while keeping other alignments consistent
- C
Remove all alignment relationships once one element crosses a boundary
- D
Make every element cross the same boundary to preserve balance
14
True or false
1 point
True or false: A spacing scale is effective only if it uses the same fixed increments in every medium and project.
- A
True
- B
False
15
Choose one
1 point
A page contains a set of closely related controls and a separate set of supporting notes. Which spacing choice would best help readers recognize the two groups?
- A
Use the same large gap between every element.
- B
Use smaller gaps within the group and larger gaps around it.
- C
Reduce text size so the items appear less crowded.
- D
Add more alignment lines between the items.
16
Choose one
1 point
A designer wants lines of body text in adjacent columns to align horizontally. Which grid is designed to support that goal?
- A
A column grid aligns text lines horizontally across pages.
- B
A baseline grid determines the page's outer margins.
- C
A baseline grid aligns text lines horizontally across columns or pages.
- D
A module grid aligns only images along vertical edges.
17
Choose one
1 point
A three-column card layout becomes cramped on a narrow screen. Which change best follows the material's guidance for adapting the layout?
- A
Stack the cards into fewer columns while preserving comfortable reading widths and spacing.
- B
Keep the three-column layout and shrink every card until it fits.
- C
Remove the gaps between cards so the original columns remain.
- D
Change the content order to match the cards' new visual positions.
18
Choose one
1 point
A print design includes a background image that must reach the trimmed page edge and small legal text that must remain readable. Which production approach is appropriate?
- A
Place essential text beyond the trim edge and omit bleed.
- B
Use a screen breakpoint to control the printed page margins.
- C
Avoid margins so artwork can fill the page without production adjustments.
- D
Keep essential content inside safe margins and include bleed for artwork extending to the edge.
19
Written response
1 point
What is the name for the space between columns in a grid?
20
Written response
1 point
What CSS system provides a two-dimensional way to place content in rows and columns?