Flashcards · 0417 · Topic 21

Website authoring flashcards

13 cards on Topic 21, subtopics 21.1 to 21.3. Pick a subtopic or study them all.

Study mode needs JavaScript. Every card is listed below, so you can still cover the answers and test yourself.

All 13 cards

For a quick read-through or printing. Cover the right-hand side to test yourself.

Name the three web development layers and the language for each: Content layer: HTML (text, images and structure). Presentation layer: CSS (colours, fonts, layout). Behaviour layer: usually JavaScript (what happens when the user interacts).
Why separate content from presentation?: The look of a whole site can be changed by editing one stylesheet without touching the content, and the same content can be styled differently for phones and desktops.
Which layer would validate a form or show a menu?: The behaviour layer.

What goes in the head section and the body section of an HTML page?: Head: information about the page, such as its title (shown on the browser tab) and links to stylesheets. Body: everything visible on the page.
Which HTML elements make bulleted and numbered lists?: ul makes an unordered (bulleted) list and ol an ordered (numbered) list. Each item goes in an li element.
What are the src and alt attributes of an img element?: src gives the image file's location. alt gives text shown if the image fails to load and read aloud by screen readers.
Why use relative file paths such as images/logo.png?: They still work when the site's folder is moved to a web server. Absolute paths such as C:\Users\... break on another computer.
Which elements build an HTML table?: table for the table, tr for each row, th for header cells and td for data cells.

What are the parts of a CSS rule?: A selector (what to style) and declarations inside curly brackets, each a property, a colon, a value and a semicolon, e.g. h1 { color: navy; }.
External vs internal vs inline CSS: External: rules in a separate .css file linked from each page; best for a whole site. Internal: rules in a style element in the page head; that page only. Inline: a style attribute on one element.
Class selector vs id selector: A class (.note) can be used on many elements on a page. An id (#banner) applies to one element only, because an id must be unique.
CSS margin vs padding: Margin is the space outside an element's border. Padding is the space inside, between the border and the content.
When CSS rules conflict, which wins?: The more specific rule. An inline style overrides internal and external rules for that element.