Introduction to HTML
A Brief Introduction to HTML Language
by Meg Ropp for TE 402
Web pages are created using HTML (HyperText Markup Language) codes which are hidden when you view these pages using a browser like Netscape. For example, the different "tags" in HTML can tell the computers how to display text, graphics, video and create links to the same or other web pages. Most of these tags are used in pairs before and after the text or object that is being formatted and you can always tell the last tag by the slash just inside the less than sign. Here are some common tags which will help you create functional web pages quickly!
- <H1> </H1>
- A level 1 heading will make the text large and separated by some white space. In addition, you can choose headings which decrease in size all the way to H6. The heading of this page, "A Brief Introduction to HTML Language" is a level 1 heading." by Meg Ropp for TE 402" is a level 3 heading.
- <br>
- Inserts a line break within a paragraph.
- <P>
- Inserts a break between paragraphs resulting in white space.
- <CENTER> </CENTER>
- Whatever is between the beginning and ending tags will be centered on the web page.
- <A HREF=> </A>
- Is an anchor to another web page. You type in a URL between these two tags. Making a link to HomePage Maker would look like this:
<A HREF="http://letsnet.msu.edu/hpm.fcgi"></A>
- <UL> </UL>
- Items in an unordered list will be indented with extra space between them and they begin with bullets. Each bulleted item within the two tags must be prefaced with the <LI> tag.
- <IMG SRC=>
- With the image tag, you enter the complete path name of the image file or just the name of the image if it is stored in the same folder or directory as the web page. An example would be <IMG SRC=http://www.educ.msu.edu/homepages/Dewey/myphoto.gif>
or <IMG SRC=myphoto.gif> if it is in the same folder.
Using Netscape, your first self study assignment is to take a look at the first screen of my K12 Science page which is available at:
http://www.educ.msu.edu/homepages/ropp/K12science.html
Now click and hold down on the "View" menu item and move your mouse until you highlight the "Document Source" option and then lift up your finger to select it. A Macintosh application named "SimpleText" should automatically open the source text and now you can see the html code that is normally hidden. Use the multifinder to compare the document with html codes with the Netscape version and try to get a feel for how html language is used.