Web Foundations/HTML Documents
This lesson introduces HTML documents.
Objectives and Skills
editObjectives and skills for this lesson include:[1][2]
- Demonstrate knowledge required to create a web page.
- Use the most current version of Hypertext Markup Language (HTML5) to create web pages.
- Design web pages to industry standards.
Articles
editVideos
editExamples
editComments
editComments are to write text that will not be shown in an HTML document.
<!-- comment text -->
HTML
editThe html
element is the root element of an HTML document and contains all other elements.[3]
<html>
<!-- head -->
<!-- body -->
</html>
Head
editThe head
element contains the processing information and metadata for an HTML document.[4]
<head>
<!-- title -->
<!-- style sheet links -->
<!-- metadata -->
</head>
Title
editThe title
element defines a document title.[5]
<title>title</title>
Style Sheet
editThe link
element points the browser at a style sheet to use when presenting the HTML document to the user.[6]
<link href="style.css" rel="stylesheet" type="text/css">
Metadata
editThe meta
element can be used to specify additional metadata about a document.[7]
<meta charset="UTF-8">
Body
editThe body
element contains the displayable content of an HTML document.[8]
<body>
<!-- page content -->
</body>
Basic HTML5 Page
edit<!DOCTYPE html>
<html>
<head>
<title>title</title>
<link href="style.css" rel="stylesheet" type="text/css">
<meta charset="UTF-8">
</head>
<body>
<!-- page content -->
</body>
</html>
Key Vocabulary
edit- DOCument TYPE Declaration <!DOCTYPE>
- Html tag
- Head tag
- Body tag
- Title tag
- Meta tag
- Link tag
Activities
edit- Complete the tutorials:
- Using your selected HTML editor, create a basic HTML5 page.
- Add an appropriate
title
to the page. - Include your name, such as
Hello Wikiversity!
, in the body of the page.
- Add an appropriate
- Validate your HTML code using the W3C Markup Validation Service.
- Add your HTML page to your free web hosting service. Access the web page using a web browser to confirm that it displays correctly.
See Also
editReferences
edit