Unit 1: HTML Fundamentals - Practice Quiz

CSE326 — Internet Programming 60 Questions
0 Correct 0 Wrong 60 Left
0/60

1 What is the Internet?

Introduction to Internet and Web Technologies Easy
A. A type of web page
B. A single computer program
C. A local printer network
D. A global network of connected computers

2 What does HTTP stand for?

Introduction to Internet and Web Technologies Easy
A. Hyperlink Text Transfer Process
B. Home Tool Transfer Protocol
C. HyperText Transfer Protocol
D. HighText Transmission Program

3 In a client-server model, what does a client usually do?

Client-Server Architecture Easy
A. Creates the Internet protocol
B. Controls all network cables
C. Requests services or resources
D. Stores every website permanently

4 What is the main role of a web server?

Client-Server Architecture Easy
A. Replace the user's web browser
B. Type content into web forms
C. Display pages on a monitor
D. Deliver web resources to clients

5 What does HTML stand for?

HTML5 Fundamentals Easy
A. HighText Machine Language
B. HyperText Markup Language
C. Hyperlink Text Management Language
D. Home Tool Markup Language

6 Which declaration identifies an HTML5 document?

HTML5 Fundamentals Easy
A. <doctype html5>
B. <html version="5">
C. <!DOCTYPE html>
D. <document type="html">

7 Which element contains the visible content of an HTML document?

HTML Document Structure Easy
A. <body>
B. <title>
C. <meta>
D. <head>

8 Which element contains metadata and links to resources?

HTML Document Structure Easy
A. <footer>
B. <head>
C. <main>
D. <body>

9 What is an HTML attribute?

HTML Elements and Attributes Easy
A. A type of browser window
B. A separate web server
C. A visible page heading
D. Extra information in an opening tag

10 Which attribute specifies the destination of a hyperlink?

HTML Elements and Attributes Easy
A. class
B. src
C. alt
D. href

11 Which HTML element represents the most important heading?

Text Formatting Easy
A. <h6>
B. <h1>
C. <header>
D. <head>

12 Which element is commonly used to display emphasized text?

Text Formatting Easy
A. <sub>
B. <em>
C. <small>
D. <mark>

13 Which element creates an unordered list?

Lists Easy
A. <ol>
B. <ul>
C. <list>
D. <li>

14 Which element defines an item in an HTML list?

Lists Easy
A. <item>
B. <li>
C. <point>
D. <list-item>

15 Which element is used to add an image to a web page?

Hyperlinks and Images Easy
A. <img>
B. <src>
C. <image>
D. <picture-img>

16 What is the purpose of the alt attribute on an image?

Hyperlinks and Images Easy
A. Create a page hyperlink
B. Describe the image in text
C. Set the image file type
D. Control the image animation

17 What does SVG stand for?

SVG Graphics Easy
A. Scalable Vector Graphics
B. Standard Visual Grid
C. Simple Vector Graph
D. Scalable View Generator

18 Which HTML element embeds audio content?

Multimedia Elements: Audio, Video and Iframes Easy
A. <music>
B. <audio>
C. <media>
D. <sound>

19 Which attribute displays playback controls for an HTML video?

Multimedia Elements: Audio, Video and Iframes Easy
A. controls
B. playing
C. toolbar
D. buttons

20 What is the main purpose of SEO?

SEO Fundamentals Easy
A. Increase computer storage space
B. Improve visibility in search results
C. Prevent all website errors
D. Replace HTML with CSS

21 A user enters https://shop.example.com/products in a browser. Which technology first translates shop.example.com into an IP address?

Introduction to Internet and Web Technologies Medium
A. The Transport Layer Security protocol (TLS)
B. The Domain Name System (DNS)
C. The Hypertext Transfer Protocol (HTTP)
D. The browser's HTML rendering engine

22 A website loads its HTML successfully, but its stylesheet request returns HTTP status 404. What should the browser conclude?

Introduction to Internet and Web Technologies Medium
A. The stylesheet requires user authentication
B. The stylesheet loaded but contained invalid CSS declarations that the browser could not execute
C. The stylesheet was permanently redirected
D. The stylesheet resource was not found

23 An online store must prevent users from changing product prices before checkout. Where should the final price validation occur?

Client-Server Architecture Medium
A. In the browser before submitting the form
B. In the HTML using a hidden input
C. On the server before processing payment
D. In CSS by preventing the price from being selected, edited, inspected, or copied

24 A browser submits a login form, and the server returns a session cookie. What is the cookie's main role in later requests?

Client-Server Architecture Medium
A. It resolves the application's domain name to an IP address
B. It permanently stores the user's password inside the HTML document
C. It helps the server associate requests with the logged-in session
D. It converts the server's HTML response into a DOM tree

25 Which declaration should appear at the beginning of a modern HTML5 document to request standards-mode rendering?

HTML5 Fundamentals Medium
A. <!DOCTYPE HTML5>
B. <meta standard="html5">
C. <!DOCTYPE html>
D. <html version="5">

26 A page contains navigation links, an independent blog post, and a footer. Which set of HTML5 elements best represents these roles?

HTML5 Fundamentals Medium
A. <nav>, <article>, and <footer>
B. <menu>, <content>, and <bottom>
C. <links>, <section>, and <end>
D. <div class="nav">, <div class="article">, and <div class="footer"> because HTML5 semantic elements should be avoided

27 A page uses <script src="app.js" defer></script> inside <head>. When is app.js executed?

HTML Document Structure Medium
A. Immediately when the parser encounters the script element
B. After HTML parsing finishes and before DOMContentLoaded
C. Before the browser begins parsing the document body
D. Only after every image and stylesheet has finished loading

28 Which placement correctly defines the document's character encoding for reliable interpretation by the browser?

HTML Document Structure Medium
A. <encoding type="UTF-8"> immediately after the closing </html> tag
B. <meta charset="UTF-8"> near the start of <head>
C. <charset value="UTF-8"> inside the root <html> element
D. <meta charset="UTF-8"> near the end of <body>

29 Given <button disabled="false">Save</button>, how will a conforming browser treat the button?

HTML Elements and Attributes Medium
A. The button is hidden
B. The button is enabled only when JavaScript converts the string value from false to a Boolean
C. The button remains disabled
D. The button becomes enabled

30 Several labels need the same CSS styling, while each label may also need a unique JavaScript identifier. Which attribute assignment is most appropriate?

HTML Elements and Attributes Medium
A. Use a separate inline style attribute as the unique identifier for each label
B. Use a shared id and a unique class
C. Use a shared class and a unique id
D. Use only a shared id on every label

31 A warning sentence must visually emphasize the word "Important" and also communicate its strong importance to assistive technologies. Which element is most suitable?

Text Formatting Medium
A. <b>Important</b>
B. <strong>Important</strong>
C. <span style="font-weight: bold">Important</span> with no semantic indication of importance
D. <mark>Important</mark>

32 An ordered list must display three steps numbered 4, 5, and 6. Which markup is appropriate?

Lists Medium
A. <ol start="4"><li>A</li><li>B</li><li>C</li></ol>
B. <ol value="4"><li>A</li><li>B</li><li>C</li></ol>
C. <ul start="4"><li>A</li><li>B</li><li>C</li></ul>
D. <ol><li start="4">A</li><li>B</li><li>C</li></ol>

33 The current page is https://example.com/docs/guides/start.html. What URL does the relative link <a href="../api.html">API</a> resolve to?

Hyperlinks and Images Medium
A. https://example.com/docs/guides/start.html/api.html
B. https://example.com/docs/guides/api.html
C. https://example.com/api.html
D. https://example.com/docs/api.html

34 A company logo is also a link to the home page. Which markup gives the image an appropriate accessible name?

Hyperlinks and Images Medium
A. <a href="/"><img src="logo.png" alt="Acme home"></a>
B. <a href="/"><img src="logo.png" alt=""></a>
C. <a href="/"><img src="logo.png" title="Image"></a>
D. <a href="/"><img src="logo.png" aria-hidden="true"></a>

35 An inline SVG uses <svg viewBox="0 0 200 100" width="400" height="200">. A circle centered at (100, 50) is rendered where within the SVG viewport?

SVG Graphics Medium
A. At one quarter of the viewport width
B. At the center only if JavaScript recalculates every coordinate after the browser finishes loading
C. At the top-left of the viewport
D. At the center of the viewport

36 A developer needs each shape in an icon to respond independently to CSS hover rules. Which approach is most suitable?

SVG Graphics Medium
A. Load the SVG through an <img> element
B. Convert the SVG into a JPEG image
C. Place the SVG markup inline in the HTML
D. Use the SVG as a CSS background and rely on selectors from the page to target every internal path

37 A video should provide English captions that viewers can enable. Which child element should be added inside <video>?

Multimedia Elements: Audio, Video and Iframes Medium
A. <meta name="captions" content="captions.vtt">
B. <source kind="captions" lang="en" src="captions.vtt">
C. <caption lang="en" src="captions.vtt">
D. <track kind="captions" srclang="en" src="captions.vtt">

38 An untrusted page is embedded with <iframe sandbox src="external.html"></iframe>. What is the default effect of the empty sandbox attribute?

Multimedia Elements: Audio, Video and Iframes Medium
A. It applies restrictions only after a list of denied capabilities is added to the attribute
B. It permits same-origin access but blocks pop-ups
C. It permits scripts but blocks forms
D. It applies all sandbox restrictions

39 An e-commerce site uses the title Products on every product page. Which revision most directly improves search-result relevance?

SEO Fundamentals Medium
A. Give each page a concise, descriptive, unique title
B. Use a long title containing every product category, shipping rule, company address, and support detail
C. Remove the title and use only an <h1> element
D. Repeat the same product keywords many times in the title

40 Two URLs serve identical article content, but one is the preferred URL for search indexing. Which element should the duplicate page include?

SEO Fundamentals Medium
A. <link rel="stylesheet" href="preferred-url">
B. <meta name="duplicate" content="preferred-url">
C. <a rel="index" href="preferred-url">
D. <link rel="canonical" href="preferred-url">

41 A user navigates to https://example.com/manual.html#installation. Which statement correctly describes how the fragment identifier affects the initial page request?

Introduction to Internet and Web Technologies Hard
A. The browser omits #installation from the HTTP request and processes the fragment after receiving the resource.
B. The DNS resolver receives #installation and maps it to the server hosting that section.
C. The TLS handshake encrypts #installation separately before the HTTP request is transmitted.
D. The browser sends #installation in the HTTP request target so the server can return that section.

42 A browser has a cached representation with an ETag and sends If-None-Match. The server replies with 304 Not Modified and updated cache headers. What should the browser do?

Client-Server Architecture Hard
A. Discard the cached body because a 304 response contains no representation.
B. Reuse the cached body and apply applicable metadata from the 304 response.
C. Treat the response as an empty successful page and replace the cached body.
D. Repeat the request without If-None-Match before displaying any content.

43 Two tabs from the same browser profile open the same origin. Authentication uses a normal session cookie, while temporary UI state uses sessionStorage. Which behavior should generally be expected?

Client-Server Architecture Hard
A. Each tab sends a separate session cookie, while both tabs share all web storage.
B. Each tab sends a separate session cookie, while both tabs share sessionStorage.
C. Both tabs send the same session cookie, while each tab has separate sessionStorage.
D. Both tabs send the same session cookie, while each tab has separate localStorage.

44 A modern page begins directly with <html> and omits <!doctype html>. Its elements otherwise use valid HTML5 syntax. What is the most important consequence?

HTML5 Fundamentals Hard
A. The browser may enter quirks mode and use legacy layout behavior despite valid elements.
B. The browser disables semantic elements because their definitions depend on the doctype.
C. The document is parsed as XML and requires every element to be explicitly closed.
D. The document is treated as plain text because HTML5 requires an explicit MIME declaration.

45 The document URL is https://example.test/docs/page.html and its <head> contains <base href="/assets/v2/">. To which absolute URL does <a href="#api">API</a> resolve?

HTML Document Structure Hard
A. https://example.test/docs/#api
B. https://example.test/assets/v2/#api
C. https://example.test/assets/v2/page.html#api
D. https://example.test/docs/page.html#api

46 A server sends an HTML document without an HTTP charset parameter. The document contains <meta charset="utf-8">, but that declaration begins after the first 1024 bytes. Which assessment is correct?

HTML Document Structure Hard
A. The declaration is conforming because UTF-8 declarations have no required byte position.
B. The declaration is conforming because it appears anywhere inside the <head> element.
C. The declaration is nonconforming because an HTML encoding declaration must occur within the first 1024 bytes.
D. The declaration is ignored only when the document also contains an external stylesheet.

47 Consider <button disabled="false">A</button> and <button disabled="0">B</button>. Assuming no script changes their states, which result follows HTML boolean-attribute rules?

HTML Elements and Attributes Hard
A. Both buttons are enabled because their values are falsy.
B. Both buttons are disabled because the attribute is present.
C. Button A is disabled, while button B is enabled.
D. Button A is enabled, while button B is disabled.

48 An input appears outside a form: <input name="coupon" value="SAVE" form="checkout">. Later, the page contains <form id="checkout"><button>Pay</button></form>. What happens when the form is submitted normally?

HTML Elements and Attributes Hard
A. The input is included because its form attribute associates it with checkout.
B. The input is included only if JavaScript moves it inside the form before submission.
C. The input is excluded because the form attribute works only on submit buttons.
D. The input is excluded because only descendants of a form can be successful controls.

49 Which mapping most accurately reflects the semantic purpose of the HTML elements <strong>, <em>, <b>, and <i>?

Text Formatting Hard
A. <strong> makes text larger, <em> makes text smaller, <b> marks importance, and <i> marks stress.
B. <strong> marks urgency, <em> marks citations, <b> marks definitions, and <i> marks keyboard input.
C. <strong> marks stress, <em> marks importance, <b> marks quotations, and <i> marks deleted text.
D. <strong> marks importance, <em> marks stress, <b> draws attention, and <i> marks alternate voice.

50 What marker values are generated by <ol reversed start="10"><li>A</li><li value="4">B</li><li>C</li></ol>?

Lists Hard
A. A is 3, B is 4, and C is 10.
B. A is 10, B is 9, and C is 8.
C. A is 10, B is 4, and C is 3.
D. A is 10, B is 4, and C is 5.

51 For <a href="https://external.test" target="_blank" rel="noreferrer">Open</a>, which behavior is specifically requested by noreferrer?

Hyperlinks and Images Hard
A. Preserve the opener relationship but prevent the destination from using browser storage.
B. Suppress all cookies and prevent the new page from executing client-side scripts.
C. Preserve referrer information but force the destination into a private browsing context.
D. Suppress referrer information and prevent the new page from obtaining an opener.

52 An image has srcset="600.jpg 600w, 1200.jpg 1200w, 1800.jpg 1800w" and sizes="(max-width: 600px) 100vw, 50vw". At a 1200 CSS-pixel viewport and device-pixel ratio 2, which candidate is the nominal best match, ignoring cache and network heuristics?

Hyperlinks and Images Hard
A. 600.jpg, because sizes is evaluated independently of pixel density.
B. 600.jpg, because the image occupies 600 CSS pixels.
C. 1800.jpg, because the viewport width is multiplied by the density.
D. 1200.jpg, because the 600-pixel slot is rendered at 2x density.

53 A 1000-pixel-wide viewport loads the following markup. The browser supports WebP but not AVIF. Which resource is selected?

<picture><source media="(min-width: 900px)" type="image/avif" srcset="wide.avif"><source type="image/webp" srcset="photo.webp"><img src="photo.jpg" alt="Product"></picture>

Hyperlinks and Images Hard
A. photo.jpg, because <source> elements apply only below their media breakpoint.
B. photo.jpg, because an unsupported first <source> forces the <img> fallback.
C. photo.webp, because the AVIF source is unsupported and the WebP source is usable.
D. wide.avif, because its media query is the first one that matches.

54 An SVG has width="400", height="200", and viewBox="0 0 100 100" with the default preserveAspectRatio. How is the square viewBox mapped into the viewport?

SVG Graphics Hard
A. It is scaled uniformly to 400 by 400 pixels and clipped by 100 pixels vertically.
B. It is stretched nonuniformly to 400 by 200 pixels with no unused viewport area.
C. It remains 100 by 100 pixels and is centered with margins on all four sides.
D. It is scaled uniformly to 200 by 200 pixels and centered with 100-pixel side margins.

55 An SVG path contains two concentric closed subpaths drawn in the same direction. How do fill-rule="nonzero" and fill-rule="evenodd" typically differ for the inner region?

SVG Graphics Hard
A. nonzero fills the inner region, while evenodd treats it as a hole.
B. nonzero creates a hole, while evenodd fills the inner region.
C. Both rules create a hole because the subpaths are concentric.
D. Both rules fill the region because subpath direction is always ignored.

56 A modern browser supports the <video> element, but none of the supplied <source> formats can be decoded. What happens to a paragraph placed as fallback content inside <video>?

Multimedia Elements: Audio, Video and Iframes Hard
A. The paragraph remains undisplayed because it is fallback for browsers lacking <video> support.
B. The paragraph replaces the controls only after the user presses the play button.
C. The paragraph is displayed automatically because all media sources failed.
D. The paragraph is displayed only when every <source> has an explicit invalid type.

57 Client-side code executes const result = video.play(); on an unmuted video without a user gesture. What is the robust way to handle modern browser autoplay policies?

Multimedia Elements: Audio, Video and Iframes Hard
A. Treat result as a promise and handle rejection, such as a NotAllowedError.
B. Treat result as a boolean and retry immediately whenever it equals false.
C. Assume playback starts because calling play() overrides declarative autoplay rules.
D. Wait for loadedmetadata, after which play() cannot be blocked by policy.

58 A same-origin page is embedded using <iframe sandbox="allow-scripts" src="/tool.html"></iframe>. Which statement best describes the embedded page?

Multimedia Elements: Audio, Video and Iframes Hard
A. Its scripts may run, and it retains the parent origin because the URL is same-origin.
B. Its scripts may run, but it receives an opaque origin for same-origin security checks.
C. Its scripts are blocked because allow-same-origin is required before allow-scripts works.
D. Its scripts may run only after the parent grants access through postMessage().

59 Several URLs expose substantially identical content and each duplicate contains <link rel="canonical" href="https://example.com/preferred">. What does the canonical link do?

SEO Fundamentals Hard
A. It permanently redirects browsers and search engines to the preferred URL before rendering.
B. It guarantees that only the preferred URL can appear in every search engine's results.
C. It prevents crawlers from requesting the duplicate URLs while preserving them for users.
D. It provides a consolidation hint to search engines but does not redirect users or guarantee selection.

60 A developer writes <button type="button"><a href="/checkout">Checkout</a></button> to obtain button styling and navigation. What is the best correction?

HTML Best Practices Hard
A. Keep both elements but add role="link" to the outer button for clearer semantics.
B. Reverse the nesting so the button becomes the only child of the hyperlink.
C. Use a single <a href="/checkout"> and style it appropriately for the navigation action.
D. Keep both elements but remove the button's type attribute to normalize activation.