Wikiversity

Exam 98-383: Introduction to Programming using HTML and CSS/Understand HTML Fundamentals

< Exam 98-383: Introduction to Programming using HTML and CSS

This lesson covers HTML fundamentals, including markup, metadata, and industry best practices.[1]

Readings edit

  1. Mozilla: HTML Basics

Activities edit

  1. W3Schools: HTML Exercises

Construct markup that uses metadata elements edit

Includes script; noscript; style; link; meta tags, including encoding, keywords, viewport, and translate.

script edit

The HTML <script> element is used to embed or refer to an executable code; this is typically used to embed or refer to JavaScript code.[2]

Examples: 

<script src="javascript.js"></script>

<script>
  document.write("Hello Wikiversity!");
</script>

noscript edit

The HTML <noscript> element defines a section of HTML to be inserted if a script type on the page is unsupported or if scripting is currently turned off in the browser.[3][4]

Example: 

<noscript>Your browser does not support JavaScript!</noscript>

style edit

The HTML <style> element contains style information for a document, or part of a document.[5]

Example: 

<style>
body {
  color: blue;
}
</style>

link edit

The HTML <link> element specifies relationships between the current document and an external resource.[6]

Example: 

<head>
  <link href="style.css" rel="stylesheet" type="text/css">
</head>

meta tags edit

The HTML <meta> element represents metadata that cannot be represented by other HTML meta-related elements.[7][8][9][10]

Examples: 

<head>
  <meta charset="UTF-8">
  <meta name="keywords" content="HTML,CSS">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="google" content="notranslate">
  <meta http-equiv="refresh" content="60">
</head>

Construct well-formed markup that conforms to industry best practices edit

Includes DOCTYPE declaration; HTML; head; body; proper syntax, including closing tags and commonly used symbols; comments

DOCTYPE edit

In HTML, the doctype is the required <!DOCTYPE html> preamble found at the top of all documents.[11]

Example: 

<!DOCTYPE html>

html edit

The HTML <html> element represents the root (top-level element) of an HTML document.[12]

Example: 

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
  </body>
</html>

head edit

The HTML <head> element provides general information (metadata) about the document, including its title and links to its scripts and style sheets.[13]

Example: 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Page Title</title>
    <link href="style.css" rel="stylesheet">
    <script src="javascript.js"></script>
  </head>
  <body>
  </body>
</html>

body edit

The HTML <body> Element represents the content of an HTML document.[14]

Example: 

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <h1>Heading</h1>
    <p>Content</p>
  </body>
</html>

Common Symbols edit

An HTML entity is a piece of text ("string") that begins with an ampersand (&) and ends with a semicolon (;). Entities are frequently used to display reserved characters (which would otherwise be interpreted as HTML code), and invisible characters (like non-breaking spaces).[15][16]

Example: 

&nbsp;  <!-- non-breaking space -->
&lt;    <!-- less than -->
&gt;    <!-- greater than -->
&amp;   <!-- ampersand -->
&quot;  <!-- double quote -->
&apos;  <!-- single quote -->

Comments edit

Comments are represented in HTML and XML as content between <!-- and -->.[17][18]

Example: 

<!-- This is a comment. -->

See Also edit

References edit

  1. ↑ Microsoft: Exam 98-383 Introduction to Programming using HTML and CSS
  2. ↑ Mozilla: script
  3. ↑ Mozilla: noscript
  4. ↑ W3Schools: noscript
  5. ↑ Mozilla: style
  6. ↑ Mozilla: link
  7. ↑ Mozilla meta
  8. ↑ W3Schools: meta
  9. ↑ Google: Meta tags that Google understands
  10. ↑ Mozilla: meta
  11. ↑ Mozilla: DOCTYPE
  12. ↑ Mozilla: html
  13. ↑ Mozilla: head
  14. ↑ Mozilla: body
  15. ↑ Mozilla: Entity
  16. ↑ W3Schools: HTML Entities
  17. ↑ Mozilla: Comment
  18. ↑ W3Schools: HTML Comments
Retrieved from "https://en.wikiversity.org/w/index.php?title=Exam_98-383:_Introduction_to_Programming_using_HTML_and_CSS/Understand_HTML_Fundamentals&oldid=2210138"