WGU C777 OBJECTIVE ASSESSMENT
WITH ACTUAL CORRECT QUESTIONS
AND VERIFIED DETAILED ANSWERS
Section 1: HTML5 Fundamentals & Semantic Markup (Q1–Q35)
1. A developer is building a product detail page and wants the main content area to be
programmatically identifiable as the primary content of the document. Which HTML5 element
is most appropriate?
A. <div id="main">
B. <main>
C. <section class="primary">
D. <article id="content">
B. <main>
The <main> element represents the dominant content of the <body> and improves
document outline and accessibility. Unlike generic <div> elements, <main> conveys semantic
meaning to assistive technologies .
2. Which HTML5 element should be used to define independent, self-contained content that
could be distributed and reused (e.g., a blog post or news article)?
A. <section>
B. <div>
C. <article>
D. <aside>
C. <article>
The <article> element represents a self-contained composition that could stand alone and
be syndicated. <section> groups related content, <div> is a generic container, and <aside>
contains tangentially related content .
3. A navigation menu should be marked up so that assistive technologies can identify it as
navigation. Which element is preferred?
,A. <div class="nav">
B. <menu>
C. <nav>
D. <header>
C. <nav>
The <nav> element explicitly identifies a section of navigation links for user agents and
assistive technologies. Using semantic elements improves accessibility and document structure .
4. A page has a sidebar with tangential content such as related links and advertisements.
Which HTML5 element is most semantic for this region?
A. <section>
B. <aside>
C. <footer>
D. <div class="sidebar">
B. <aside>
The <aside> element represents content that is tangentially related to the surrounding
content and is commonly presented as a sidebar. It should not be used for main content .
5. Which HTML5 element represents the primary heading of a webpage?
A. <h6>
B. <header>
C. <h1>
D. <title>
C. <h1>
The <h1> element represents the primary heading of a page or major content section. The
<title> element defines the document title shown in the browser tab, while <header> is a
structural container .
6. Which HTML5 element is specifically designed to group related form controls and provide a
visible caption for the group?
A. <div> with a heading
B. <fieldset> with a nested <legend>
,C. Multiple <label> elements
D. <table> for layout
B. <fieldset> with a nested <legend>
<fieldset> groups related controls, and <legend> provides an accessible caption for the
group. This improves form organization and accessibility .
7. Which attribute should a developer use to bind a <label> element to an <input> element?
A. bind
B. for
C. name
D. id
B. for
The for attribute in <label> associates it with a specific input element by matching the
input's id. This improves accessibility by allowing screen readers to announce the label when
the input receives focus .
8. A developer wants to provide a short description that appears when the user hovers over
an abbreviation such as "HTML." Which attribute is appropriate?
A. alt
B. title
C. aria-label
D. data-tooltip
B. title
The title attribute on an <abbr> element (or other elements) supplies advisory information
commonly displayed as a tooltip. This provides additional context for abbreviations and
acronyms .
9. Which HTML5 element is used to display the result of a calculation in a form?
A. <input type="output">
B. <output>
C. <result>
D. <display>
, B. <output>
The <output> element displays the result of a calculation or user input in a form. It is
semantically appropriate for showing calculated values that update dynamically .
10. What is the purpose of the <datalist> element?
A. Define a list of options hidden until a button is clicked
B. Display a read-only text field
C. Provide suggestions to the user for a form input field
D. Create a multi-select dropdown menu
C. Provide suggestions to the user for a form input field
The <datalist> element provides autocomplete suggestions for an input field, offering a list
of predefined options while still allowing free-form input .
11. Which HTML5 input type provides built-in validation for email format and displays an
appropriate virtual keyboard on mobile devices?
A. type="text"
B. type="email"
C. type="url"
D. type="password"
B. type="email"
The email input type provides built-in validation for email format and can display an
appropriate virtual keyboard on mobile devices. This reduces the need for JavaScript-based
validation .
12. A developer needs to embed a scalable vector logo that remains sharp at any size and can
be styled with CSS. Which format is preferred?
A. Large PNG file
B. Inline or referenced SVG
C. JPEG with high compression
D. Animated GIF
WITH ACTUAL CORRECT QUESTIONS
AND VERIFIED DETAILED ANSWERS
Section 1: HTML5 Fundamentals & Semantic Markup (Q1–Q35)
1. A developer is building a product detail page and wants the main content area to be
programmatically identifiable as the primary content of the document. Which HTML5 element
is most appropriate?
A. <div id="main">
B. <main>
C. <section class="primary">
D. <article id="content">
B. <main>
The <main> element represents the dominant content of the <body> and improves
document outline and accessibility. Unlike generic <div> elements, <main> conveys semantic
meaning to assistive technologies .
2. Which HTML5 element should be used to define independent, self-contained content that
could be distributed and reused (e.g., a blog post or news article)?
A. <section>
B. <div>
C. <article>
D. <aside>
C. <article>
The <article> element represents a self-contained composition that could stand alone and
be syndicated. <section> groups related content, <div> is a generic container, and <aside>
contains tangentially related content .
3. A navigation menu should be marked up so that assistive technologies can identify it as
navigation. Which element is preferred?
,A. <div class="nav">
B. <menu>
C. <nav>
D. <header>
C. <nav>
The <nav> element explicitly identifies a section of navigation links for user agents and
assistive technologies. Using semantic elements improves accessibility and document structure .
4. A page has a sidebar with tangential content such as related links and advertisements.
Which HTML5 element is most semantic for this region?
A. <section>
B. <aside>
C. <footer>
D. <div class="sidebar">
B. <aside>
The <aside> element represents content that is tangentially related to the surrounding
content and is commonly presented as a sidebar. It should not be used for main content .
5. Which HTML5 element represents the primary heading of a webpage?
A. <h6>
B. <header>
C. <h1>
D. <title>
C. <h1>
The <h1> element represents the primary heading of a page or major content section. The
<title> element defines the document title shown in the browser tab, while <header> is a
structural container .
6. Which HTML5 element is specifically designed to group related form controls and provide a
visible caption for the group?
A. <div> with a heading
B. <fieldset> with a nested <legend>
,C. Multiple <label> elements
D. <table> for layout
B. <fieldset> with a nested <legend>
<fieldset> groups related controls, and <legend> provides an accessible caption for the
group. This improves form organization and accessibility .
7. Which attribute should a developer use to bind a <label> element to an <input> element?
A. bind
B. for
C. name
D. id
B. for
The for attribute in <label> associates it with a specific input element by matching the
input's id. This improves accessibility by allowing screen readers to announce the label when
the input receives focus .
8. A developer wants to provide a short description that appears when the user hovers over
an abbreviation such as "HTML." Which attribute is appropriate?
A. alt
B. title
C. aria-label
D. data-tooltip
B. title
The title attribute on an <abbr> element (or other elements) supplies advisory information
commonly displayed as a tooltip. This provides additional context for abbreviations and
acronyms .
9. Which HTML5 element is used to display the result of a calculation in a form?
A. <input type="output">
B. <output>
C. <result>
D. <display>
, B. <output>
The <output> element displays the result of a calculation or user input in a form. It is
semantically appropriate for showing calculated values that update dynamically .
10. What is the purpose of the <datalist> element?
A. Define a list of options hidden until a button is clicked
B. Display a read-only text field
C. Provide suggestions to the user for a form input field
D. Create a multi-select dropdown menu
C. Provide suggestions to the user for a form input field
The <datalist> element provides autocomplete suggestions for an input field, offering a list
of predefined options while still allowing free-form input .
11. Which HTML5 input type provides built-in validation for email format and displays an
appropriate virtual keyboard on mobile devices?
A. type="text"
B. type="email"
C. type="url"
D. type="password"
B. type="email"
The email input type provides built-in validation for email format and can display an
appropriate virtual keyboard on mobile devices. This reduces the need for JavaScript-based
validation .
12. A developer needs to embed a scalable vector logo that remains sharp at any size and can
be styled with CSS. Which format is preferred?
A. Large PNG file
B. Inline or referenced SVG
C. JPEG with high compression
D. Animated GIF
