# Internet Fundamentals/HTML

Hypertext Markup Language (HTML) is the standard markup language for creating web pages and web applications. This lesson introduces HTML.

## Objectives and Skills

Objectives and skills for this lesson include:
* Understand basic HTML page structure.
* Create simple web pages.
* Review the requirements
** Review the requirements of the document
** Select the appropriate markup language, based on organizational standards
** Review the document structure
* Create the document structure
** Create and assign, the basic elements of the document
** Mark-up sections of the document to depict the structure
* Validate the documents
** Validate the markup of the language document, against the requirements
** Validate the markup of the language document, in different browsers

## Readings

* Wikipedia: HTML
* Wikipedia: HTML editor

## Multimedia

* YouTube: The Internet: HTTP and HTML
* YouTube: Learn HTML in 12 Minutes

## Student Presentations

* YouTube: How to Link Bitbucket to Visual Studio Code (Using GIT)
* YouTube: How to Use a Online HTML Editor
* YouTube: HTML Basics
* YouTube: How to Create a Simple HTML page
* YouTube: HTML Tags to Create a Website
* YouTube: Internet Fundamentals: Getting Started with HTML
* YouTube: Installing Visual Studio Code and Essential Plugins

## Activities

* Complete one or more of the following tutorials:
** W3Schools: Introduction to HTML
** TutorialsPoint: HTML
** Mozilla: Getting Started with HTML
** SoloLearn: HTML Course
* Create a simple web page.
** Review ShayHowe: Building Your First Web Page.
** Use HTML Online: Editor to create a simple web page about your favorite hobby.
** Include an <img> tag to add one or more free images from Wikimedia Commons to your page.
* Validate your web page.
** Review W3C: Validating your HTML.
** Use the W3C: Validator to validate your web page. Make any necessary corrections to pass the validation test.
* Research free web hosting services. Select a free hosting service and add your new web page to the web server. Access the web page using a web browser to confirm that it displays correctly. See Bitbucket/Website Hosting for a free source code control and HTML/CSS/JavaScript hosting option.
* Research free HTML editors. Consider downloading and installing an HTML editor.

## Lesson Summary

* Hypertext Markup Language (HTML) is the standard markup language for creating web pages and web applications.
* Web browsers receive HTML documents from a web server or from local storage and render them into multimedia web pages.
* HTML describes the structure of a web page semantically and originally included cues for the appearance of the document.
* HTML elements are the building blocks of HTML pages.
* With HTML constructs, images and other objects, such as interactive forms, may be embedded into the rendered page.
* HTML provides a means to create structured documents by denoting structural semantics for text such as headings, paragraphs, lists, links, quotes and other items.
* HTML elements are delineated by tags, written using angle brackets. Browsers do not display the HTML tags, but use them to interpret the content of the page.
* HTML can embed programs written in a scripting language such as JavaScript which affect the behavior and content of web pages.
* Inclusion of CSS defines the look and layout of content.
* The World Wide Web Consortium (W3C), maintainer of both the HTML and the CSS standards, has encouraged the use of CSS over explicit presentational HTML since 1997.
* The current HTML standard is HTML5, completed and standardized on 28 October 2014.
* HTML markup consists of several key components, including those called tags (and their attributes), character-based data types, character references and entity references.
* HTML tags most commonly come in pairs, although some represent empty elements and so are unpaired. The first tag in such a pair is the start tag, and the second is the end tag. They may also be called opening tags and closing tags.
* The general form of an HTML element is <tag attribute1="value1" attribute2="value2">content</tag>.
* Some HTML elements are defined as empty elements and take the form <tag attribute1="value1" attribute2="value2">.
* If attributes are not mentioned, default values are used in each case.
* A typical HTML document includes:
* The HTML document type declaration, DOCTYPE, triggers standards mode rendering.
* <html> and </html> tags describe the web page.
* <head> and </head> tags describe page metadata.
* meta charset describes page character encoding. The default encoding for HTML5 is UTF-8.
* <title> and </title> tags describe the page title.
* <body> and </body> tags describe the visible page content.
* <p> and </p> tags describe paragraphs.
* <a> and </a> tags describe anchors (hyperlinks).
* <br> tags describe line breaks.
* <h1> and </h1> and similar tags describe content headings.
* <img> tags describe images.
* <!-- and --> enclose comments.
* Special characters may be entered using &code; syntax. Examples include:
** & - &amp;
** < - &lt;
** > - &gt;
* Semantic HTML is a way of writing HTML that emphasizes the meaning of the encoded information over its presentation (look).
* Presentational markup tags are deprecated in current HTML in favor of using CSS to describe content presentation.

## Key Terms
### attribute

    A modifier of an HTML element type.

### element

    An individual component of an HTML document or web page.

### HTML (Hypertext Markup Language)

    The standard markup language for creating web pages and web applications.

### HTML tags

    Are the hidden keywords within a web page that define how your web browser must format and display the content.

### HTTP (Hypertext Transfer Protocol)

    An application protocol for distributed, collaborative, and hypermedia information systems.

### markup language

    A system for annotating a document in a way that is syntactically distinguishable from the text.

### metadata

    Is used by browsers (how to display content or reload page), search engines (keywords), and other web services.

### SGML (Standard Generalized Markup Language)

    A standard for defining generalized markup languages for documents.

### W3C (World Wide Web Consortium)

    The main international standards organization for the World Wide Web.

### WYSIWYG (What You See Is What You Get)

    A system in which content (text and graphics) can be edited in a form closely resembling its appearance when printed or displayed as a finished product.

## Assessments

* Flashcards: Quizlet: HTML
* Quiz: Quizlet: HTML

## See Also

* HTML
* Web Foundations
* Training.gov.au: Create a simple markup language document
* ShayHowe: Building Your First Web Page
* Saylor: HTML and CSS for Beginners
* PHP-T-POINT: HTML Tutorial