creating a web page html: the language of the web
TRANSCRIPT
Creating a Web Page
HTML: The Language of the WEB
HTML• To create a web page you use a special
language that Browsers can read.
Hyper Text
Markup
Language
The Web Browser• is the software program on YOUR
computer
The Web Browser
• Can locate HTML documents on any server anywhere in the world.
HTML Documents
• Simple TEXT documents.
• Created with a simple text editor
Some Text Editors
• The WordPad in Windows– Start Accessories WordPad
• The NotePad in Windows– Start Accessories NotePad
• MS WORD in Windows
Start an HTML document
<HTML>
</HTML>
•These are <TAGS>•They tell the Browser that an HTML document is coming.
Header Stuff
<HTML>
<HEAD>
<TITLE> My Page
</TITLE>
</HEAD>
• Goes into the Blue line
• A place for a title
Next comes the <Body>
<BODY>
</BODY>
This is the main part of your document.
Modifiers
• <BODY BGCOLOR=“006600”>
HTML Codes entered in a TEXT editor
<HTML>
< HEAD >
< TITLE >
< /TITLE >
< /HEAD >
< BODY >
</ BODY >
</HTML>
<HTML> tags indicate code is written in HTML
< TITLE > tags identify the Title.
< HEAD > tags surround information about the web page
< BODY > tags surround the portion of the document that will appear in the browser window.
SPACES . .The paragraph tag
• < P > • < / P >
• Adds extra blank lines before text to separate it from any text that precedes it.
Section headings
<H1></H1>
• Makes the headings BIG and Black
and Bold
How Big???
This is <H1>This is <H2>This is <H3>This is <H4>This is <H5>
This is <H6>
Center It…Formats the heading< H1 ALIGN=CENTER >
My favorite Sport.
< /H1 >
•Also try < Center >
•Don’t forget to close the tag
</H1>
< H1 ALIGN = LEFT >
• Just use <P> </P>
• This is the Default
Creating Lists
HTML supports three kinds of lists:– Ordered lists
– Unordered lists
– Definition lists
Ordered Lists
a list in numeric order
My Favorite Movies1. Mouse Hunt
2. Mary Poppins
3. Something about Mary
Ordered Lists
<H3>My Favorite Movies</H3>
<OL>
<LI>Something About Mary
<LI>Mary Poppins
<LI>Mouse Hunt
</OL>
Unordered Lists
• Items have no particular orderFamous Male Actors
• Roy Rogers
• Gene Autry
• Hopalong Cassity
http://westerns.com/sounds/roy_rogers-west_is_in_my_soul.mp3
Unordered List bullet list
<H3>Famous Male Actors</H3>
<UL>
<LI>Roy Rogers
<LI>Gene Autry
<LI> Hopalong Cassity
</UL>
The Definition List
• A list of Terms followed by a definition line
Famous Movie Horses– Topper
• Hopilong Cassidy’s horse
– Trigger• Roy Roger’s Horse
– Champion• Gene Autry’s Horse
Definition List
<H3>Famous Movie Horses</H3><DL><DT>Topper
<DD>Hopalong Cassity’s Horse<DT>Trigger
<DD>Roy Roger’s Horse<DT>Champion
<DD>Gene Autry’s Horse</DL>
Character Tags
A <Tag> you apply to an individual character.
2 Kinds– Logical - how you use text
– Physical – how text looks
Logical Tags
<EM> Emphasized mode
• Indicates that characters should be emphasized in some way..itallics
<STRONG>
• Emphasizes text more strongly than <EM>
Physical Character Tags
• How characters look<B> bold
<I> Itallics
<BIG> big
<SMALL> small
<SUB> subscript
<SUP> superscript
Big BLACK Lines
• <HR> Horizontal Rule
• Adjust the WIDTH to ¾
<HR WIDTH=75%>
• Center the HR
<HR ALIGN=CENTER>
• Set the SIZE <HR SIZE=12>
More < HR > stuff
• Do it All in one HR TAG
<HR ALIGN=CENTER
SIZE=12
WIDTH=75%>
• Or<HR ALIGN=CENTER SIZE=12 WIDTH=75%>
