HTML CRASH COURSE

What is HTML?  Hyper Text Markup Language  The language used to make web pages  Written by using tags

What is a TAG?  TAGs are instructions. They tell the computer what to do to make the web page look the way you want it to look.  TAGs are surrounded by angle brackets  There are 2 types of TAGs Start Tag End Tag (end tags ALWAYS have a / BEFORE the word) Examples:,,,,,,

Basic HTML code This is the foundation of our web page. EVERY web page must have this basic code. Your web browser uses the tags to decide how to display your content

What is the Basic HTML code? Stuff on your page

The text between describes the web page

The text between and provides information about the page

The text between and provides a title for the page

The text between and describes the visible page content

You must have ALL the basic HTML code for your website to work. If something is missing an angle bracket… If something is misspelled… If something is out of order…

HTML structure-It has pairs Page Title My code goes here between the and tags I Love Color The colors of the rainbow are as follows: Anything after the and tags WILL NOT show up on the web page

HTML Elements Everything from the start tag to the end tag This text is bolded

HTML elements can be nested (inside) other elements Page Title My code goes here between the and tags I Love Color The colors of the rainbow are as follows:

Writing HTML code in Notepad++ 1.Type in the basic HTML code This space is necessary because your tags and content go here between the and tags

Writing HTML code in Notepad++ 2. Set your Language (H  HTML) This will turn your basic code BLUE

Writing HTML code in Notepad++ 3. Save as… (in your Web Design folder on the M drive)

Just a few more things…

Opening your code in Notepad++ If you double click on your file, it will open your code in an internet browser

Opening your code in Notepad++ If you want to edit the code, you need to open Notepad++ Then go to File  Open and then find your M drive, your web design folder, and the file

And now I can edit my code Notice that my content and tags are between the and tags

Useful words and tags to know This tag will center text and images This tag will create a heading This tag Italicizes the font This tag Bolds the font This tag moves your text or image down 1 line This tag + hex value changes the font color Hex valueThis is the code that indicates a specific color If I want to make my font Purple, then I need to use the hex value of 9900CC So my tag would look like this: My Purple Text If I don’t put in the end font tag ( ) then ALL my text after the start font tag will be purple.

When I want to start a new page… Then you can type in the basic HTML code, set your Language, and Save as

Now you’re ready to start writing your content and tags!