We are still actively working on the spam issue.
Difference between revisions of "HTML"
m (→How it works: fix up) |
(→How it works: fix up more) |
||
Line 8: | Line 8: | ||
This is a simple HTML5 page. It does not follow a standard indentation style to emphasize each separate element | This is a simple HTML5 page. It does not follow a standard indentation style to emphasize each separate element | ||
<pre> | <pre> | ||
+ | <!-- This is an HTML Comment --> | ||
<!DOCTYPE html> <!-- The HTML5 simplified document type. Previously it was more complex --> | <!DOCTYPE html> <!-- The HTML5 simplified document type. Previously it was more complex --> | ||
− | <html lang=" | + | <html lang="en-US"> <!-- the en-US part is technically optional, but the W3C heavily recommends putting the charset in the second HTML deceleration --> |
<head> <!-- The head element contains pre-load information --> | <head> <!-- The head element contains pre-load information --> | ||
− | <meta charset="UTF-8/> <!-- This declares the page to be rendered in UTF-8. Prior to HTML5, it was more complex --> | + | <meta charset="UTF-8"/> <!-- This declares the page to be rendered in UTF-8. Prior to HTML5, it was more complex --> |
+ | |||
+ | <meta description="author" content="Install Gentoo Wiki"/> <!-- Optional but still nice --> | ||
<title>Example Page</title> | <title>Example Page</title> | ||
+ | |||
+ | <link rel="stylesheet" type="text/css" href="/style.css"/> <!-- Link to a [[CSS]] File. Optional but you probably want it --> | ||
</head> | </head> | ||
Line 53: | Line 58: | ||
really love it!</p> | really love it!</p> | ||
− | <p>HELLO<br/> WORLD</p> <!-- This breaks the paragraph to a single line --> | + | <p>HELLO<br/>WORLD</p> <!-- This breaks the paragraph to a single line --> |
</article> | </article> | ||
Line 71: | Line 76: | ||
This is a very basic example. To actually make a page, you need much more than basic HTML. You need [[CSS]], and a lot of other stuff, like (maybe) [[JavaScript]]. | This is a very basic example. To actually make a page, you need much more than basic HTML. You need [[CSS]], and a lot of other stuff, like (maybe) [[JavaScript]]. | ||
+ | |||
+ | Please also note that reguardless of the system the file is hosted on, HTML uses the standard [[UNIX]] filesystem addresses. This means if you use [[Windows|Windon't]], "/" is the root directory and not "C:\\". You can also use "../" to reference a directory above the current, though this is discouraged. |
Revision as of 04:13, 19 January 2016
The Hypertext Markup Language is a common code system created by Tim Burners-Lee to render documents over the Internet. It was a primary part of the W3 Project. Originally based off SGML, HTML v5 removed the "esoteric" SGML code deceleration, making it simpler.
History
Tim Berners-Lee was working at CERN (kinda like the German Skynet, mixed with MIT, and a little bit of sci-fi), he noticed that the method in which they were transferring documents was abysmal. He then crated a new transfer system, allowing plain-text documents to be transfered. He then noticed that plain-text was shit for what they were doing. So then he created HTML 1. Then HTML2. Then HTML3. Then HTML4. Then HTML4.01. HTML 4.01 was finalized in 1997, and became the universal standard until 2014, when HTML5 became public.
How it works
This is a simple HTML5 page. It does not follow a standard indentation style to emphasize each separate element
<!-- This is an HTML Comment --> <!DOCTYPE html> <!-- The HTML5 simplified document type. Previously it was more complex --> <html lang="en-US"> <!-- the en-US part is technically optional, but the W3C heavily recommends putting the charset in the second HTML deceleration --> <head> <!-- The head element contains pre-load information --> <meta charset="UTF-8"/> <!-- This declares the page to be rendered in UTF-8. Prior to HTML5, it was more complex --> <meta description="author" content="Install Gentoo Wiki"/> <!-- Optional but still nice --> <title>Example Page</title> <link rel="stylesheet" type="text/css" href="/style.css"/> <!-- Link to a [[CSS]] File. Optional but you probably want it --> </head> <body> <!-- This starts the actual page --> <header> <!-- An HTML5 semantic element, allowing alignment of the page. Previously, semantic elements did not exist --> <h1>Example page!</h1> <!-- A level 1 header --> </header> <main> <!-- Another HTML5 Semantic Element --> <section> <!-- Another HTML5 Semantic Element. Note how we did not close the main yet --> <h2>My First Section</h2> <!-- Level 2 header --> <article> <!-- Another HTML5 Semantic Element. Note how we did not close the section yet --> <aside> <!-- An HTML5 Semantic Element, used for figures in the side of the element --> <figure> <!-- An HTML5 Element, for the creation of a figure --> <img src="/assets/example.png" alt="This is fallback text for a picture"/> <!-- An embedded image --> <figcaption>Fig. 1: an example photograph</figcaption> <!-- An HTML5 element used for the caption of a figure --> </figure> </aside> <h2>A great day to code:</h2> <p>This is a great sample of an html code. I love it so much, and I just <!-- Paragraph. Note how a line break does not effect it. If you wish to break, do <br/> --> really love it!</p> <p>HELLO<br/>WORLD</p> <!-- This breaks the paragraph to a single line --> </article> </section> <footer> <!-- An HTML5 Semantic Element --> <small><address>©2015 YOUR NAME HERE CC-BY-SA 4.0 Int. and GNU GPL v3</address></small> <!-- A standard, basic footer --> </footer> </body> </html> <!-- Note: Used to close the html lang="en-US", not the document-type deceleration -->
This is a very basic example. To actually make a page, you need much more than basic HTML. You need CSS, and a lot of other stuff, like (maybe) JavaScript.
Please also note that reguardless of the system the file is hosted on, HTML uses the standard UNIX filesystem addresses. This means if you use Windon't, "/" is the root directory and not "C:\\". You can also use "../" to reference a directory above the current, though this is discouraged.