Our Mission
Our mission is to provide
you with as many tools as
possible for a little as
possible to start your own
home computing business
and be successful.
you with as many tools as
possible for a little as
possible to start your own
home computing business
and be successful.
| Contact us: 205-541-1408 |
ABCs of Computing at Home
Web Page Design
| Designing Your Web Page |
Once you have chosen your domain name and website host, it is time to
design you own site.
You can surf the Internet for look at similar sites. You may want to model
your site from one of theirs or try something new. You select a web design
template based on your website content and alter it.
Some web hosts will even design a site from your specifications, but it may
be very costly.
A basic setup for your first web site will work for now. It will be the perfect
learning tool. You will find several of these free on the Internet. You can also
find Free Blogs.
Some web hosts will allow you to fill out a sample and view it before
deciding to buy. This is good practice.
In any event, the design will help keep visitors coming back. An unattractive
site or one that is too complicated to maneuver will only aggravate visitors,
so keep it simple for you first attempt.
Once you have completed designing the template, you will enter your
content. If you are working with a program, on the page where you want to
place text, click insert and text. Move the box to where you want it. Expand or
collapse it as you need to. Double click in the box and type your content or
clip and paste from a word document. If you are working with Front Page
using HTML documents, use this basic format:
Example of an opening tag:
<html>
<head>
<title>Page Title</title>
</head>
<body>
The main part of the document goes here.
</body>
</html>
Example of a closing tag:
HTML in red are opening and closing tags. They define how a web page is
presented.
Another example:
Opening tag: <title>
Closing tag: </title>
HTML documents must include an opening <html> tag at the top of the file,
and the closing </html> tag at the end of the file.
Notice in the basic format the <head> section is below the opening <html>.
Your web page keywords, description, and page title will go in this section.
Again, you will have a opening and closing tag: <head> </head> Your
keyword, description, and title tags must be placed between these tags.
The title of your web page will go between these tags: <title> </title> This title
will appear at the top of the browser window when someone opens your
web page. A bookmark will reflect the title of this page.
Meta tags <meta> are used to describe your site and search engines use
them to catalog your web page.
Your content is the body of the page (text, images, and links) and appears
after the closing head tag </head> with <body> and ends with </body>. In
the body you can set up a background image, page color, text color, or HTML
links.
Example:
<body bgcolor="#000000" text="#ffffff" link="#0000ff" vlink="#800080">.
Experiment with the HTML. You can use a blank form and insert the code
then view it in the browser to see the outcome.
An easy way to navigate through an extremely long page is the use of anchor
links. It connects a section of your page to a particular area (a short cut). An
anchor link consists of two parts:
The link code:
<a href="#myLink">Link</a>
The anchor code:
<a name="myLink">Anchor</a>
Note that the difference between the two links is the # symbol within the tag,
as well as the <a name> tag. To create your anchor links:
First build your link code:
<a href="#myLink">Link</a>
(Note that this link features a # symbol within the tag, which tells the browser
to link to a corresponding anchor tag named myLink.)
Now create your anchor link. Use the exact same name as in your link code:
<a name="myLink">Anchor</a>
Once again, this is not a normal link, because the link uses the word name
instead of href. Which is important, because it tells the browser where to go
when your first link is clicked.
<a name="news">The Latest News</a>
<a href="#news">News</a>
Or:
<a name="style">Styles</a>
<a href="#style">Cardigan Sweaters</a>
To see an example of a working anchor link, click "link":
link
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
anchor
design you own site.
You can surf the Internet for look at similar sites. You may want to model
your site from one of theirs or try something new. You select a web design
template based on your website content and alter it.
Some web hosts will even design a site from your specifications, but it may
be very costly.
A basic setup for your first web site will work for now. It will be the perfect
learning tool. You will find several of these free on the Internet. You can also
find Free Blogs.
Some web hosts will allow you to fill out a sample and view it before
deciding to buy. This is good practice.
In any event, the design will help keep visitors coming back. An unattractive
site or one that is too complicated to maneuver will only aggravate visitors,
so keep it simple for you first attempt.
Once you have completed designing the template, you will enter your
content. If you are working with a program, on the page where you want to
place text, click insert and text. Move the box to where you want it. Expand or
collapse it as you need to. Double click in the box and type your content or
clip and paste from a word document. If you are working with Front Page
using HTML documents, use this basic format:
Example of an opening tag:
<html>
<head>
<title>Page Title</title>
</head>
<body>
The main part of the document goes here.
</body>
</html>
Example of a closing tag:
HTML in red are opening and closing tags. They define how a web page is
presented.
Another example:
Opening tag: <title>
Closing tag: </title>
HTML documents must include an opening <html> tag at the top of the file,
and the closing </html> tag at the end of the file.
Notice in the basic format the <head> section is below the opening <html>.
Your web page keywords, description, and page title will go in this section.
Again, you will have a opening and closing tag: <head> </head> Your
keyword, description, and title tags must be placed between these tags.
The title of your web page will go between these tags: <title> </title> This title
will appear at the top of the browser window when someone opens your
web page. A bookmark will reflect the title of this page.
Meta tags <meta> are used to describe your site and search engines use
them to catalog your web page.
Your content is the body of the page (text, images, and links) and appears
after the closing head tag </head> with <body> and ends with </body>. In
the body you can set up a background image, page color, text color, or HTML
links.
Example:
<body bgcolor="#000000" text="#ffffff" link="#0000ff" vlink="#800080">.
Experiment with the HTML. You can use a blank form and insert the code
then view it in the browser to see the outcome.
An easy way to navigate through an extremely long page is the use of anchor
links. It connects a section of your page to a particular area (a short cut). An
anchor link consists of two parts:
The link code:
<a href="#myLink">Link</a>
The anchor code:
<a name="myLink">Anchor</a>
Note that the difference between the two links is the # symbol within the tag,
as well as the <a name> tag. To create your anchor links:
First build your link code:
<a href="#myLink">Link</a>
(Note that this link features a # symbol within the tag, which tells the browser
to link to a corresponding anchor tag named myLink.)
Now create your anchor link. Use the exact same name as in your link code:
<a name="myLink">Anchor</a>
Once again, this is not a normal link, because the link uses the word name
instead of href. Which is important, because it tells the browser where to go
when your first link is clicked.
<a name="news">The Latest News</a>
<a href="#news">News</a>
Or:
<a name="style">Styles</a>
<a href="#style">Cardigan Sweaters</a>
To see an example of a working anchor link, click "link":
link
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
space
anchor
 |
| |
 |
| |
 |
| |
 |
| |
 |
| |
 |
| |
 |
| |
 |
| |
 |
| |
 |
| |
 |