<!DOCTYPE html>
<html>

<head>

  <meta charset="UTF-8">

  <title>CodePen - A Pen by  Justin Kams</title>

</head>

<body>

<html>
<head>

<title>The Basics of The Web and HTML</title>

</head>

<body>

<h2>The Basics of The Web and HTML</h2>

<p><em></em></p>

<p><em><h3>The Basics of the World Wide Web</h3></em>
The world wide web is a collection of computers with html files on them. The computers communcate
and share the html files when the user requests it in the browser. When a person goes to a web 
page like <a href="www.google.com">www.google.com</a>, their computer sends a HTTP Request to 
a server. The server finds the appropriate<b> HTML</b> document and sends it back to the user's 
computer where a web browser interprets the page and displays it on the user's screen.</p>

<p><em><h3>HTML</h3></em>
<b>HTML</b> stands for <em>Hypertext Markup Language</em>. <b>HTML</b> documents form the majority of the content
on the web. <b>HTML</b> documents contain text content which describes <em>"what you see"</em> and markup 
which describes <em>"how it looks"</em>. This video gives a good overview.</p>

<p><em><h3>Tags and Elements</h3></em>
<b>HTML</b> documents are made of <b>HTML</b> elements. When writing <b>HTML</b>, we tell browsers the
type of each element by using <b>HTML</b> tags. This video explains the distinction well.</p>

<p><em><h3>HTML Attributes</h3></em>
  There are many attributes. One for starters is the anchor tag. The anchor tag is used to include 
  links in the material. These tags would be nested in the less than greater brackets, and consist 
  of <em>'a href="link" /a'</em>. View this webpage for a 
  <a href="http://www.w3schools.com/tags/tag_a.asp">description</a>. 
</p>

<p><em><h3>Images</h3></em>
  Images can be added to web content. These tags will again have the less than and greater than
  brackets surrounding them, and consist of <em>'img src="url" alt="text"'</em>.
  These tags are known as void tags and do not need content included. Also the alt attribute at
  the end of the tag, diplays text in the event the image request is broken.
</p>

<p><em><h3>Whitespace</h3></em>
  Browsers automatically put text on one line, unless told othrwise. To render text on multiple
  lines, use the tag <em>'br'</em> which stands for break, or <em>'p'</em>, which stands for
  paragraph.
</p>

<p><em><h3>Why Computers are Stupid</h3></em>
Computers are stupid because they interpret instructions literally. This makes them very 
unforgiving since a small mistake by a programmer can cause huge problems in a program.</p>

<p><em><h3>Inline vs Block Elements</h3></em>
HTML elements are either inline or block. Block elements form an <em>"invisible box"</em> around the 
content inside of them.</p>

<p><em><h3>HTML Document</h3></em>
  Lastly a typical html document will be ordered as follows:
  <ol>
    <li>!DOCTYPE HTML</li>
    <li>html</li>
    <li>head</li>
    <li>/head</li>
    <li>body</li>
    <li>tags 'content' /tags</li>
    <li>/body</li>
    <li>/html</li>
  </ol>

</p>

</body>
</html>

</body>

</html>