Created
May 10, 2012 18:20
-
-
Save JGallardo/2654865 to your computer and use it in GitHub Desktop.
Very Barebone HTML5 template w/ comments on how to use
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- | |
Anything between <!-- --> is a comment. It is only visible in a text editor and does not affect how the code affects what is shown. These are here to pass notes between developers. In the head tag is where you enter metadata. Your name (optional) | |
This document was created by Juan Gallardo, a student of DeVry University. To be a study aid to students of web design. | |
--> | |
<!-- the <!DOCTYPE html> as shown below is how you immediately know if the document is written in HTML5 as opposed to HTML4.01 or earlier --> | |
<!DOCTYPE html> | |
<head> | |
<!-- But the title of the site here between the <title> tags. It will display on the tab of the internet browser --> | |
<title> </title> | |
<!-- | |
* Right before the <head> tag ends is where you link to the .css file/s which control how the content is displayed. | |
* You can also inlcude the styling between a <style> </style> but it is not recommended because a seperate style sheet reduces time for updates later, makes it easier to debug, and allows you to easily change out styles. | |
* I normally only do styling in the <style> </style> tags when I am building a very simple mobile site. | |
* This is how I built the first page for www.boxhas.info which is a very concise guide to QR codes whose purpose it to very quickly show consumers what a QR code is, how to use it, and then guide them to download a reader for their mobile phone. The site was created for my clients in marketing to be able to quickly guide their customers to get a QR reader and scan the code. | |
--> | |
</head> | |
<!-- This is where you begin to enter your code that will display on the page --> | |
<body> | |
<!-- | |
* The header is where you can include navigation items. | |
* Many minimalist styled pages will have an image here. The ideally image should quickly portray the mission of your site visually. | |
* Prior to HTML5, instead of <header> , there would normally be a <div> with an id assigned to the header. It could look like, <div id="header"> | |
--> | |
<header> | |
</header> | |
<!-- | |
* This is where the main content will go. | |
* You will make many <div> tags to hold elements of the page. | |
* They are to be styled in the .css | |
* The main div will usually be styled as <div id="wrapper"> | |
--> | |
<div> | |
</div> | |
<!-- Here between the <footer> tags is where you can enter copyright info or anything you would like to write at the bottom of the page --> | |
<footer> | |
</footer> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment