Newbie's Guide to Web Design - Lesson 1
Retail Sign Shops Network
Members Log-in Join the Retail Sign Shops Network List your Sign Shop Find a Sign Shop Consumer Buyer's Guide
Find a Sign Shop

Newbie's Guide to Web Design

HTML Lesson 1

Ok enough with the introduction lets get on with learning HTML. As I said in the introduction HTML is a simple formatting language that will allow you to organize and display various kinds of text and graphics and will create an interface that will allow interaction with other kinds of scripts and programs. HTML is viewed through your browser and can be viewed either online or from your hard drive.

Let's get started by launching all the software that we will need. You already have a copy of a web browser launched because you are viewing this page. You will need to launch a second copy of the web browser though so you can view your web page as we build it and still be able to read this page. You will then need to launch a copy of the editing software you are going to use. I would recommend using Notepad or some other simple text editing software. If you are using Windows you will find Notepad by going to the Start menu then going to Programs/Accessories/Notepad.

Now you should have two copies of your browser open and one text editor. A trick I use in Windows to toggle between the programs I am running is to do an Alt/Tab. When you hold down the Alt key and push the Tab key a small pop up screen will show you all of the programs you are running. While still holding down the Alt key keep pushing the Tab key and it will toggle through the programs. Learning these shortcuts will greatly speed up the time you spend creating and editing your pages.

All HTML tags are put between the greater than and less than signs like this <html>. HTML tags are not case sensitive, you can use all caps, or all lower case or any combination of the two. When I started coding I used all caps but as I started typing my code and mixing in the page content I got tired of turning the cap locks on and off so I started using all lower case and I have been doing it ever since. Something else you need to know about HTML is that it will only recognize a single space between letters, numbers, words or sentences and it doesn't know what a tab is. It see this, "This is my first page", the same as this, "This      is      my       first       page". You can put a thousand spaces or tabs between two words and it will only show as a single space. In fact I am having to use a special set of tags to show you this effect.

As another side note I am having to use another set of special tags to show the greater than and less than signs. Under normal viewing anything between these two signs is considered part of the code and is not displayed.

With a few exceptions, (that I will point out as I get to them), all tags must have an end tag. The browser will read a tag and do what it says until you tell it to stop with an end tag. For instance this is the tag for bolding text <b>, what ever text comes after this tag will be bolded until it sees this tag </b>. The forward slash indicates to the browser to stop performing the task.

The first set of tags you will need to learn are the <html></html> tags. The rest of the your entire web page will appear between these two tags. In fact you can actually make a web page with just these two tags. Go to your text editor and type in these two tags. Then in-between the tags type a simple message like this.

<html>This is my first web page.</html>

You will then need to save the page to your hard drive in a place that you will remember. I have a folder on my hard drive called html, (imagine that). Name your page what every you would like but the it must end with .html to indicate that it is an HTML page. You will also have to get used to not putting spaces in the names of your pages like you do with Word and other documents. Use a name like this, "mywebpage.html", or this, "my_web_page.html", not this, "my web page.html". There can be no breaks in the name. You will also want to avoid using things like the ampersand, pound and dollar signs when naming your pages. They are used a lot on code and can confuse the computer.

Once you have saved the page go to the other open version of your web browser and where it says http://www.retailsignshops.com, (or what ever appears) and type in the location of the new html page you created. For most of you it will be on your C: drive. I have a partitioned drive so mine is stored on my D: drive. It really doesn't matter as long as you know where it is. Again it is not case sensitive. You can use D: or d: and it will go to that drive. After you type in the drive you want to go to just hit enter and it will take you to that drive. You can then click through your files until you see your new web page. Click on your page and it should display your message in the browser with out showing the HTML tags. If you don't see your page you will need to make sure you type your tags exactly like this, <html></html>. HTML is not very forgiving and if the syntax is off the page will either not appear or it will appear in some bizarre way.

Congratulations you just created your first web page. Now let's move on to lesson 2 and talk about the head and body tags.

Go to Lesson 2.

SignIndustry.com
RetailSignShops.com



» Home Page
» About Us
» Contact Us

Members Area

» Member Home Page
» Message Boards
» Business Tips
» Newbie's Guide
» How to FTP
» Internet Glossary
» Search the Database
» List your Sign Shop
» Edit Listing

Sponsored by SignIndustry.com

Home Page | Members Area | List your Sign Shop | Find a Sign Shop | Buyer's Guide

Powered by SignIndustry.com