ddrueding
Fixture
I threw this together in the last few minutes for a friend. If you have input that would be great. I don't want it any longer or more complicated than what it is, but if there are errors or clarifications that would be fab.
Summary:
Web pages are made of a bunch of HTML files and some other supporting files. HTML files are just text files that have the extension .HTML, .html, .HTM, or .htm. The text in the files is the raw code that pages are made of. Supporting files could include pictures, videos, or other stuff that the HTML files refer to.
Creating a file:
The first thing that you need to do is create a blank .HTML file. Here’s how:
Click on Start -> All Programs -> Accessories -> Notepad
This is the most basic text editor in the Windows world, and a great place to start. You start with a blank .txt file, but we want .html.
Click on File -> Save as…
You’ll notice that the “Save as type” is .txt – Change it to “All Files”
You’ll notice that the file name is *.txt – change it to “index.html” and save it somewhere you’ll remember it. (Desktop maybe?)
You now have a blank .html file. If you open this file in a web browser, all the tags and code will be translated to what you see on the screen. This is how you will test your work.
All pages should start with this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<body>
And end with this:
</body>
</html>
(feel free to copy/paste this into the top/bottom of your pages)
Basically, this tells browsers how to read your page.
Tags:
Tags are what make a page more than plain text. Tags allow you to change the appearance of text, insert pictures, and do pretty much everything else. All tags are the same. They begin with a less-than sign: < and end with a greater-than sign: >. What goes inside the < and > is the tag. Learning HTML is learning the tag to perform whatever command you want to do.
Here are the tags you’ll need, in order of importance:
Line Breaks (same as pressing enter – just pressing enter in the code does nothing)
<br>
Links (something that you can click to go to another page)
<A HREF="web address here">what you want the link to say</A>
Example
<A HREF="http://www.tweakt.com">Tweak’t Gaming Center</A>
Images (any picture on your page)
<IMG SRC="filename">
Example
<IMG SRC="image.gif">
Text Formatting (Changing the appearance of text)
<strong>Bold</strong>
<em>Italic</em>
<font size=5>big</size>
Size can be from 1 to 7 (normal is 3)
Combining Tags Examples
<A HREF="http://www.tweakt.com"><IMG SRC="image.gif"></A>
<A HREF="http://www.tweakt.com"><strong>Tweak’t Gaming Center</strong></A>
<A HREF="http://www.tweakt.com"><strong><em>Tweak’t</em> Gaming Center</strong></A>
This is enough to create a fun page. When you have this down, I’ll give you cheat sheet #2, which begins “forget all that formatting stuff and use CSS”.
Summary:
Web pages are made of a bunch of HTML files and some other supporting files. HTML files are just text files that have the extension .HTML, .html, .HTM, or .htm. The text in the files is the raw code that pages are made of. Supporting files could include pictures, videos, or other stuff that the HTML files refer to.
Creating a file:
The first thing that you need to do is create a blank .HTML file. Here’s how:
Click on Start -> All Programs -> Accessories -> Notepad
This is the most basic text editor in the Windows world, and a great place to start. You start with a blank .txt file, but we want .html.
Click on File -> Save as…
You’ll notice that the “Save as type” is .txt – Change it to “All Files”
You’ll notice that the file name is *.txt – change it to “index.html” and save it somewhere you’ll remember it. (Desktop maybe?)
You now have a blank .html file. If you open this file in a web browser, all the tags and code will be translated to what you see on the screen. This is how you will test your work.
All pages should start with this:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<body>
And end with this:
</body>
</html>
(feel free to copy/paste this into the top/bottom of your pages)
Basically, this tells browsers how to read your page.
Tags:
Tags are what make a page more than plain text. Tags allow you to change the appearance of text, insert pictures, and do pretty much everything else. All tags are the same. They begin with a less-than sign: < and end with a greater-than sign: >. What goes inside the < and > is the tag. Learning HTML is learning the tag to perform whatever command you want to do.
Here are the tags you’ll need, in order of importance:
Line Breaks (same as pressing enter – just pressing enter in the code does nothing)
<br>
Links (something that you can click to go to another page)
<A HREF="web address here">what you want the link to say</A>
Example
<A HREF="http://www.tweakt.com">Tweak’t Gaming Center</A>
Images (any picture on your page)
<IMG SRC="filename">
Example
<IMG SRC="image.gif">
Text Formatting (Changing the appearance of text)
<strong>Bold</strong>
<em>Italic</em>
<font size=5>big</size>
Size can be from 1 to 7 (normal is 3)
Combining Tags Examples
<A HREF="http://www.tweakt.com"><IMG SRC="image.gif"></A>
<A HREF="http://www.tweakt.com"><strong>Tweak’t Gaming Center</strong></A>
<A HREF="http://www.tweakt.com"><strong><em>Tweak’t</em> Gaming Center</strong></A>
This is enough to create a fun page. When you have this down, I’ll give you cheat sheet #2, which begins “forget all that formatting stuff and use CSS”.
