Introduction to HTML

Slide 1 Hard-Coding What is hard-coding? –Creating the page in a text editor just using HTML A Web designer should know how to hard- code an html file –To create simple web pages –To understand what is going on behind the scenes of a web page –So he/she can fix any problem with the webpage being worked on

Slide 2 What is HTML? HTML stands for Hyper Text Markup Language –Set of commands which tell browser where to find graphics, text, and links Created to allow people from all over the world to view documents on the WWW Different platforms can view the same documents simultaneously anywhere in the world on any computer system

Slide 3 What is an HTML File? A text file containing small markup tags –Tags are words or commands that appear in brackets Must have an htm or html file extension Can be created using a simple text editor –program that will allow you to type and save work as a TEXT file (the one we’ll use is Notepad) –key in all the tags by hand

Slide 4 Tags Tags tell the Web browser how to display the page –Everything that is not enclosed in tags will show up as text –Browsers know tags because they’re always enclosed in brackets usually always in pairs Melanie Ending tag has forward slash / (end indicator) –If it’s not enclosed in brackets, it will appear on the screen Example: HTML for a simple sentence –My name is Melanie Brunson.

Slide 5 More about Tags Can use CAPS, lower case, or MiXeD –Doesn’t matter inside of tags –However, we always use lowercase tags –Why? Because of the latest web standards. The next generation of HTML (XHTML) demands lowercase tags Cannot have spaces: White Space –All area on screen that doesn’t contain text –Browsers ignore white space –Need special tags to do line breaks or create large spaces Space key, or striking enter doesn’t give white space

1 st Codes Notice the first codes – Specifies what version of HTML is used on the page (!- Indicates a comment that will not appear on the page) – Tells the browser to interpret every tag as HTML code until it reaches These tags will always start and end a page ( ) – This contains information about your page such as title & author Used to catalog the page, does not appear in browser Utah Education Network The title is what you will see in the Title Bar of the browser – This contains the content that you see in your browser Slide 6

Slide 7 To Insert White Space Line break – (this tag does not need a closing tag) Equal to pressing “Enter” on the keyboard Moves text down to next line Paragraph break – Equal to pressing “Enter” twice on the keyboard Moves text down and leaves blank line between

Slide 8 To View HTML View: Source (or right-mouse click & View Source) Go to and view sourcehttp://

Slide 9 HTML Document Three Main Parts –Document Type Definition (DTD) –Header Information such as title, keywords, description, etc. –Body Content displayed on Browser

Slide 10 Try It –Open Notepad (a text editor) Go to: Start  All Programs  Accessories  Notepad –Type the Following Your Name Homepage This is my first homepage. This text is bold –Be sure to save your text file with.html extension ( firstpage.html ) –View your page in your browser