Anatomy of a Webpage 2
Jump to navigation
Jump to search
This class is a continuation of the Anatomy series, discussing CSS. Students are expected to have a basic understanding of HTML.
Basic Terminology
- Elements
HTML elements are also knows as tags, such as <html>, <div>, and <p>.
- ID
Used to identify an individual element in a document. There should be no duplicate IDs in an HTML document; each should be unique.
- Class
- Imports
- Media Queries
- Transitions
- Frameworks
Instructor Notes
- Students should launch Leafpad, and create a new file on the desktop with their first name, in lowercase "name.html". Contents should be the Beginning HTML Structure. (below)
- Double-click that file to open it in the browser.
- Begin building the HTML structure, bit-by-bit, discussing things such as proper syntax.
- make changes
- save changes
- reload browser
- Students should find a simple image (like a kitty) and download it to the desktop, named "name.jpg" or similar.
Beginning HTML Structure
<html>
<head>
<title>My First Webpage</title>
</head>
<body>
<h1>Headline</h1>
<p>Paragraph text.</p>
<h2>Headline</h2>
<p>Paragraph text.</p>
<div>
<h1>Headline</h1>
<p>Paragraph text.</p>
<h2>Headline</h2>
<p>Paragraph text.</p>
</div>
</body>
</html>