Lesson 2: HTML5 Coding
show the tag for fixed spaced font
<code> <kbd> <samp>
show the tag for word definitions
<dfn>
show the tag for emphasis
<em> </em>
What are 6 tags for creating headings? List all 6
<h1> </h1> <h2> </h2> <h3> </h3> <h4> </h4> <h5> </h5> <h6> </h6>
show the tag for strong
<strong> </strong>
block-level elements
A markup element that affects at least an entire paragraph.
text-level elements
A markup element that affects single characters or words.
Describe a Web Site File Structure
A website file structure would consist of planning out and making files title whatever your website is about. So name of project, home, index.html, and all others that will appear on your webpage.
<html> - define xmlns
If your content needs to conform to XHTML, then specify the XML namespace attribute The default entry is xmlns="http://www.w3.org/1999/xhtml".
Show the proper tag nesting in markup language
Placing a pair of tags within another pair of tags <h1> <em> ... </em> </h1>
<!DOCTYPE> declaration
The <!DOCTYPE declaration is the first tag in an HTML document. It informs the interpreter (usually a Web browser) what version of HTML the Web page is written in. Previous to HTML5, the <!DOCTYPE> declaration was an SGML statement and required a fairly complex declaration. In HTML5, however, the tag is written as only <!DOCTYPE html>. The declaration is not case-sensitive, but it is almost always written in uppercase letters by Web developers (it will be uppercase in this course).
<body>
This tag begins the body of the document and includes all the content of the Web page, such as the text, video, hyperlinks and images. The <body> tag is placed after the <head> tag.
<title>
This tag identifies the document title. Most browsers will display the title in the browse's title bar. The <title> tag is placed within the <head> container tags.
Show the tag and describe what an ordered list creates
a numbered list. Uses the <ol> element and requires a closing tag.
<html> - define manifest
an attribute used for offline browsing. It lists the address of the HTML document's cache manifest. The manifest attribute requires each page you want cached to include the attribute. This technique is considered more reliable than a traditional browser cache.
<html> - define lang
configures the page to use a particular language. For instance, a Web document written in English would use <html lang="en"> and a document written in French would use <html lang="fr">. This attribute is helpful for search engines and speech synthesizers. It is a universal attribute that can be used with many different elements besides <html>.
element
provides the main instruction of the tag. An element is required in every tag. Elements include <body>, <p>, <h1>, <title>, <table> and many others.
element or markup tag
specific components of an HTML document that can provide content and attributes to a Web page. Each element provides meaning to the page, such as identifying the title of the document or specifying where a video or audio file should be placed
attribute
specifies a quality or describes a certain aspect of the element. For example, a hyperlink is added to a Web page by using the <a>, or anchor, element. The href attribute is added, which identifies the hyperlink reference. Many elements require specified attributes, but some do not. An attribute is required in a tag only if the element requires it.
<meta> - define charset
specifies the character set used in HTML documents (which is often set by the Web server for HTML documents, rather than by the document itself). It usually specifies the Unicode character set, which is standard in today's Web pages:
container tag
tags that come in pairs. Container tags use starting and ending tags. For example, when you want emphasis (italic) text, you will contain the text between starting and ending <em> </em> tags. These tags are also called the opening and closing tags
empty tag
tags that stand alone. Empty tags are those that do not directly format a specified block of text, and therefore one tag can execute the instruction. For example, if you want to create a line break, you insert the <br> tag at the point you want the break to occur.
<html>
The <html> tag is used as a container for the entire HTML document. It nests all code except for the <!DOCTYPE> declaration.
<link>
The <link> tag references a style sheet and is recommended for HTML5. A style sheet usually has a .css file name extension and a file name similar to the page to which it is linked (e.g., syb.css for the HTML page named syb.html). Style sheets are often placed in a subdirectory for the Web page. This subdirectory contains all images and associated files for the page. The <link> tag is placed within the <head> container tags.
<meta>
The <meta> tag can specify various information about the document, known as metadata. This metadata can include a document description, revision dates, and keywords to help search engines index the page. It also specifies the HTML5 character set used, which is usually UTF-8. The <meta> tag is placed within the <head> container tags.
Document Type Declaration
The document type declaration, or <!DOCTYPE> declaration, describes the markup language and version of your code. It is placed at the very top of your document.
<head>
The head section allows you to insert <meta> tags (which describe the nature of the document), links to style sheets, and the <title> tag.
value
gives value to the element and its attribute. For example, <a href="http://www.ciwcertified.com"> has a value that instructs the hyperlink to access the CIW Certified Web site. Like attributes, values are optional in a tag unless required by a specified attribute to the element. Values are used only with attributes; elements do not take values directly. Values should be surrounded by quotation marks; they are not required, but placing values in quotation marks is considered good coding practice.
<meta> - define name
values include "keywords," "description" and "author. " This attribute must be accompanied by the content attribute. The "keywords" value of the name attribute allows you to specify individual words as the value in the accompanying content attribute; these words are used by search engines to match pages to search keywords, and to describe the meaning of the document. The "description" value of the name attribute allows you to specify entire sentences as the value in the accompanying content attribute; these sentences display in search engines to describe the purpose of the document.
