WGU C779 Web Development Foundations Study
Guide Actual Exam 2026/2027 – 100% Correct
Verified Answers with Detailed Rationales – Pass
Guaranteed – A+ Graded
Section 1: HTML5 Fundamentals (25 Questions)
Q1: Which HTML5 semantic element is most appropriate for the primary navigation
links of a website?
A. <nav> [CORRECT]
B. <header>
C. <menu>
D. <navigation>
Correct Answer: A
Rationale: The <nav> element is specifically designed to define a block of major
navigation links. While <header> might contain navigation, it is more generic and
describes introductory content, not specifically the navigation structure itself. <menu>
is an older, deprecated element in HTML5 for context menus, and <navigation> is
not a valid HTML5 tag.
Q2: What is the primary difference between the <section> and <article> elements?
A. <section> cannot contain headings, while <article> must contain an <h1>
B. <article> represents a self-contained, independently distributable piece of content,
while <section> is a thematic grouping of content [CORRECT]
C. <section> is for sidebar content, while <article> is for main content areas
D. <article> is block-level, while <section> is inline-level
Correct Answer: B
,Rationale: The <article> element is intended for content that could stand alone (like
a blog post or news article), whereas <section> groups related content thematically
but doesn't imply standalone distribution. Both can contain headings and are block-level
elements, making the other distractors incorrect.
Q3: When constructing a form, which input type provides built-in client-side validation
for email format without requiring JavaScript?
A. <input type="text" pattern="email">
B. <input type="email"> [CORRECT]
C. <input type="mail">
D. <input type="text" validate="email">
Correct Answer: B
Rationale: The type="email" attribute triggers the browser's built-in email format
validation, checking for the "@" symbol and proper domain structure before submission.
The pattern attribute exists but requires a regex value, not a string like "email," and
"mail" is not a valid input type.
Q4: A developer needs to associate a <label> with an <input> element. Which
method provides the best accessibility and usability?
A. Wrapping the input inside the label without any attributes
B. Using the for attribute on the label matching the input's id attribute [CORRECT]
C. Using the name attribute on both elements with identical values
D. Placing the label immediately before the input in the DOM
Correct Answer: B
Rationale: Explicit association using for and id creates a programmatic link that
assistive technologies recognize, allowing users to click the label to focus the input.
While nesting works implicitly, the explicit for/id method is the most robust and widely
supported approach for accessibility.
Q5: What is the purpose of the <figure> and <figcaption> elements when used
together?
A. To create a responsive image gallery with thumbnails
, B. To semantically associate a caption with content like images, diagrams, or code
blocks [CORRECT]
C. To center-align visual content automatically using default browser styles
D. To prevent images from being downloaded until they enter the viewport
Correct Answer: B
Rationale: <figure> represents self-contained content (often media) that is referenced
in the main document flow, while <figcaption> provides a visible caption describing
that content. This semantic relationship helps screen readers understand the
association between media and its description.
Q6: Which HTML5 attribute ensures that an input field must be filled out before form
submission?
A. mandatory
B. required [CORRECT]
C. obligate
D. validate
Correct Answer: B
Rationale: The Boolean required attribute is the standard HTML5 mechanism for
enforcing that a field contain a value before the form can be submitted. Browsers will
display a validation message if the user attempts to submit with empty required fields.
Q7: Consider the following code snippet:
HTMLPreviewCopy
<details>
<summary>Click for more info</summary>
<p>Additional details here.</p>
</details>
What is the default behavior when this renders in a modern browser?
A. The paragraph is always visible, but the summary is hidden
B. The content inside <details> is visible only when the user clicks or activates the
<summary> element [CORRECT]
C. The content is visible by default and hides when clicked
D. The browser ignores these tags as they require JavaScript to function
Guide Actual Exam 2026/2027 – 100% Correct
Verified Answers with Detailed Rationales – Pass
Guaranteed – A+ Graded
Section 1: HTML5 Fundamentals (25 Questions)
Q1: Which HTML5 semantic element is most appropriate for the primary navigation
links of a website?
A. <nav> [CORRECT]
B. <header>
C. <menu>
D. <navigation>
Correct Answer: A
Rationale: The <nav> element is specifically designed to define a block of major
navigation links. While <header> might contain navigation, it is more generic and
describes introductory content, not specifically the navigation structure itself. <menu>
is an older, deprecated element in HTML5 for context menus, and <navigation> is
not a valid HTML5 tag.
Q2: What is the primary difference between the <section> and <article> elements?
A. <section> cannot contain headings, while <article> must contain an <h1>
B. <article> represents a self-contained, independently distributable piece of content,
while <section> is a thematic grouping of content [CORRECT]
C. <section> is for sidebar content, while <article> is for main content areas
D. <article> is block-level, while <section> is inline-level
Correct Answer: B
,Rationale: The <article> element is intended for content that could stand alone (like
a blog post or news article), whereas <section> groups related content thematically
but doesn't imply standalone distribution. Both can contain headings and are block-level
elements, making the other distractors incorrect.
Q3: When constructing a form, which input type provides built-in client-side validation
for email format without requiring JavaScript?
A. <input type="text" pattern="email">
B. <input type="email"> [CORRECT]
C. <input type="mail">
D. <input type="text" validate="email">
Correct Answer: B
Rationale: The type="email" attribute triggers the browser's built-in email format
validation, checking for the "@" symbol and proper domain structure before submission.
The pattern attribute exists but requires a regex value, not a string like "email," and
"mail" is not a valid input type.
Q4: A developer needs to associate a <label> with an <input> element. Which
method provides the best accessibility and usability?
A. Wrapping the input inside the label without any attributes
B. Using the for attribute on the label matching the input's id attribute [CORRECT]
C. Using the name attribute on both elements with identical values
D. Placing the label immediately before the input in the DOM
Correct Answer: B
Rationale: Explicit association using for and id creates a programmatic link that
assistive technologies recognize, allowing users to click the label to focus the input.
While nesting works implicitly, the explicit for/id method is the most robust and widely
supported approach for accessibility.
Q5: What is the purpose of the <figure> and <figcaption> elements when used
together?
A. To create a responsive image gallery with thumbnails
, B. To semantically associate a caption with content like images, diagrams, or code
blocks [CORRECT]
C. To center-align visual content automatically using default browser styles
D. To prevent images from being downloaded until they enter the viewport
Correct Answer: B
Rationale: <figure> represents self-contained content (often media) that is referenced
in the main document flow, while <figcaption> provides a visible caption describing
that content. This semantic relationship helps screen readers understand the
association between media and its description.
Q6: Which HTML5 attribute ensures that an input field must be filled out before form
submission?
A. mandatory
B. required [CORRECT]
C. obligate
D. validate
Correct Answer: B
Rationale: The Boolean required attribute is the standard HTML5 mechanism for
enforcing that a field contain a value before the form can be submitted. Browsers will
display a validation message if the user attempts to submit with empty required fields.
Q7: Consider the following code snippet:
HTMLPreviewCopy
<details>
<summary>Click for more info</summary>
<p>Additional details here.</p>
</details>
What is the default behavior when this renders in a modern browser?
A. The paragraph is always visible, but the summary is hidden
B. The content inside <details> is visible only when the user clicks or activates the
<summary> element [CORRECT]
C. The content is visible by default and hides when clicked
D. The browser ignores these tags as they require JavaScript to function
