 |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
In
order to create a website, you need
two things:
1) The BlueVoda website Builder and 2)
A hosting company. And
if you are just starting out, you
definitely need someone to be there
if you need help or have questions
about building your site. |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
This page explains everything that is needed for anyone wanting to create their own website. Below this paragraph is the table of contents. Click on any of the content subjects and it will take you to that section of the guide. To return to the table of contents at any time, click the "Return to Index" link in the frame on the side of the page. I hope this guide is helpful. |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Getting StartedIf you are creating your website offline, do so in any text editing or word processing document. Make sure that when you save your document, you save it as a "text", "plain text" or "text only" document. Otherwise it will not be read properly by a web browser. Once you have created your page(s), you will need to contact your ISP about how to go about uploading them to your server. If you have a UNIX account, you can create your website online. You first need to get a program that can access your UNIX account. Once you can access
your account, you need to make a new directory called
"public_html". You can do this by typing: Next, you need to think
of a filename for your page (this is not a title, but
what will be in the URL). A common filename for a main
web page, is "index". Once you've decided on this, add
".html" to the end of it. Then type (i.e.) If you have made separate directories for pages and graphics, then you need to include that in the URL also. Lets say that you made a directory for all of your web pages, called "Pages". The new URL would be: http://www.domain.com/~username/Pages/index.html TitleThe first thing to put
on your web page, is a title. The title is what will
show up in the very top of the window. Let's say that
your title is going to be "John Doe's Web Page", you
would type: Headings HTML has six levels of
headings, numbered 1 through 6, with 1 being the
largest. Headings are displayed in larger, or smaller
fonts, and usually bolder. If you wanted to type
"Hello", this is what you would type for each heading,
and what the outcome is: <h1>Hello</h1> Hello
Hello
Hello
Hello
Hello
HelloParagraphs Whenever you have more
than a sentence of writing, you should have paragraphs.
Personally, I don't see what the difference is, but I do
it anyway, because then I can find a certain spot better
when programing. To Make a paragraph of "This is a web
page. How do you like what I've done? Please e-mail me
with any suggestions at a@a.com", type:
ListsThere are two types of lists that you can make in HTML, dotted, and numbered. To make a dotted list of: red, orange, green, blue, purple, black, and brown, type: <UL> The result is:
To make a numbered list of: red, orange, green, blue, purple, black, and brown, type: <OL> The result looks like:
Forced Line BreaksThere are many cases in which you want to end typing on one line, and start on the next. To do this, you can use a simple HTML command. This is one of the few commands that you don't have to put an ending command on. Let's say that you wanted to say "Hello, how are you?", but with each word on a separate line. All you have to type is: Hello,<BR>how<BR>are<BR>you? The outcome is: Hello, Horizontal RulesEvery now and then, you
might want to have a horizontal rule, or line in your
page. Horizontal rules can be many different sizes and
lengths. You can also have the line be solid black, by
typing NOSHADE. Here are several examples of sizes and
widths, and what the outcome is: <HR SIZE=1 WIDTH=100%> <HR SIZE=5 WIDTH=50%> <HR SIZE=25 WIDTH=75%> <HR SIZE=3 WIDTH=100%> <HR NOSHADE SIZE=1 WIDTH=100%> <HR NOSHADE SIZE=3 WIDTH=100%> <HR NOSHADE SIZE=10 WIDTH=20%> Character FormattingYou may want to
format some of your text differently than others using
text styles. There are several types of styles of text
that you can use: bold,
italic, underline, <b>, </b> for bold <i>, </i> for italic <u>, </u> for underlined <strike>,
<strike> for <sup>, </sup> for superscript <sub>, </sub> for subscript <tt>, </tt> for teletype <blink>, </blink> for text (very annoying)
LinkingURLsWhen you make a link,
you are making colored text or even a graphic (talked
about later). When somebody clicks on this text, it will
take them to another web page, or possibly a certain
section of a web page. Let's say that you wanted to make
a link from your web page, to Yahoo!. The URL of Yahoo!
is: <A HREF="http://www.yahoo.com">What
ever text that you want to be colored goes here</A> The result would be:
What
ever text that you want to be colored goes here You can go ahead and
try it if you want to. Links to Specific SectionsSometimes, you might
want to have a link that will take you further down a
page, or to a certain section of another page. An
example of this is the index to this web page. You click
on the colored text, and it takes you to that section.
To do this, you need to do two things. The first, is to
make the link, and the second, is to make where the link
will lead to. NOTE:
You cannot make links to specific sections within a
different document unless either you have write
permission to the coded source of that document or that
document already contains in-document named links. <A
HREF="#spot">Colored Text Otherwise, you would
add "#spot" to the end of the URL. <A NAME = "spot"> Mailto LinksMost people like to
have a link on their web page that automatically sends
e-mail to an address. If you want to do this, and your
name is Dan, and your e-mail address is a@a.com, type: <A
HREF="mailto:a@a.com">Dan</a> Here is the result of
typing this: Dan Graphics
Putting Images On A PageOn almost EVERY web
page on the net, there is some kind of graphic. I would
HIGHLY RECOMMEND that you have AT LEAST one picture on
your page. There are mainly two kinds of ways to have
graphics on your web page. The first, is to use a
graphic that is on another web page somewhere on the
web. The second, is to upload the graphic to your own
account. Personally, I prefer to use the upload method.
If you are using the other way, there is always a chance
that the person who made that page will decide to delete
that graphic. Then a symbol with a circle, square, and
triangle will appear where the graphic was supposed to
be, sometimes it will look like it has been torn through
the middle: 1) <IMG SRC="http://www.VODAHOST.com/members/web/Images/pic.gif"> The result is:
2) Alternate Text for ImagesSome World Wide Web browsers cannot display images. Some users turn off image loading even if their software can display images (especially if they are using a modem or have a slow connection). HTML provides a command to tell readers what they are missing on your pages. The "ALT" attribute lets you specify text to be displayed instead of an image. For example: <IMG SRC="pic.gif" ALT="How to make a web page"> In this example, "pic.gif" is the picture of a sign. With graphics-capable viewers that have image-loading turned on, you see the graphic. With a non-graphic browser or if image-loading is turned off, the words "How to make a web page" is shown in your window. You should try to include alternate text for each image you use in your document, as it is a courtesy for your readers. Animated GraphicsSome people like to put animation on their web pages. It actually is not that hard. Here is some background history. Most GIFs over the years have only one image per file. According to "technical specifications from 1987", a GIF could have had more than one image per file, making it like a slide show presentation and not a single image. However, most programs that work with GIF are designed around the idea of one image per file. So the multi-image aspect of GIFs was forgotten. In 1989, they added timing and various other abilities to the GIF format, including transparency. Nobody used these new additions either. Then the Web took off. Transparency and interlacing became features people wanted to use and software companies began supporting those features. In order to have animation on your web page, you need to download a program that was made to fit more that one GIF in a file. Background, text, and link ColorOn most pages, you want to have a specific color for the background,
text, unvisited links, visited links, and active links. In order to do
this, you need to find the code number for the specific color that you
are looking for.
Here is a HUGE list of code numbers, and here is how you
would display this in your page. NOTE: Type these ONLY right below your
title. NOTE: You must have the "#" sign before the actual code.
You can also string two or more of these commands together: <body bgcolor="#000015" text="#000020" link="#000050"
vlink="#7a7777" alink="#8f8e8d"> Background GraphicsInstead of having a solid color as a background, you might want to
have one graphic that repeats over and over to create a background.
Here are several places that you can go to find background graphics.
The text that you would type in for a background called "bk.gif" would
be: <body background="bk.gif"> Linking with graphicsSometimes on your web page, you might want to have a graphic that is
a link. This is quite simple, since you just mix the two commands of
linking, and displaying graphics. Here is an example of a graphic that
leads to Yahoo: Here is what you would type in for, first the plain graphic-link, and
second, the graphic-link with text: <A href="http://www.yahoo.com"><IMG SRC="http://www.infhost.com/members/web/Images/yahoo.gif"></A> <A href="http://www.yahoo.com"><IMG SRC="http://www.infhost.com/members/web/Images/yahoo.gif">Yahoo!</A>
Image MapsBefore you create an image map, you need to make sure that your
server supports them. Then, you can follow these steps. First, you need
to create an image. Draw a picture with sections that could lead to
certain places. Second, you need to create an image map file. There are
several programs that can do this for you. I recommend
WebMap, for the Mac. You can go to Yahoo's Image Map Directory for others. Fill-out FormsGetting StartedFill-out forms let a reader return information to a Web server for
some action. For example, suppose you collect names and email addresses
so you can email some information to people who request it. This
processing of incoming data is usually handled by a script or program
written in Perl or another language that manipulates text, files, and
information. If you want to, you can write this program yourself, but I
have no idea how to do it. I would check with your server. I know that
many servers have scripts available for its users. Let's pretend that
the one that I'm going to use is called "fb.pl". This will send a
response to your fillout form directly to your email address. This script is not real, it is just an example.
Check with your ISP to see if they have built-in scripts. FormMethod/ActionThe first thing that you type for your guestbook is the Form Method
and Action. This is where you enter the Perl script. Most servers and
Internet Providers have scripts like this that they provide for you.
Check with yours. You cannot have any kind of forms without having a
script. The address of the one that I'll be using is: <FORM METHOD="POST" ACTION="http://www.domain.com/cgi-bin/fb.pl"> Here is what it will look like:
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
 |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
web design principlesWhen you start thinking about designing your web site create website , you need to think about how the colors you choose will affect visitor's perception of the site and how design layout can help "pull the design together". Good design is virtually invisible, bad design often screams out loud. If your web site is well designed and the layout of information helps the usability of the web site, visitors will return. If you don't think about how the design and color scheme can affect the user experience, visitors may never come back after finding your site un-usable. An important issue to consider in choosing a color scheme is to remember to design for those with color blindness, this usually helps make your site usable for everyone else too!
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
Choosing color
tips on choosing colorfirst impressions
color psychologyThink about color psychology - how color makes people feel
color combinationsThink about which color combinations work
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| How to create a
website Welcome to BlueVoda, BlueVoda is committed to helping you create your first website and getting you online as quickly as possible. Creating your first website can be a daunting and confusing task. Where do I get started? What should I do? However, it does not have to be this way, creating a web page can be a fun and rewarding experience if you just follow a few simple guidelines, which we will outline for you here. The first thing that you should do when getting ready to create your first website is to define it. What do you want your website to do? Do not just start constructing your page, really think about it. You should think about how you want it to look, what information you want to provide to your perspective customer in order to persuade him to buy your product or service rather than going elsewhere. Be sure that you organize the page well, think of your Home Page like the Table of Contents page in a book, it is there so that your customers know where to go in your site for their particular needs, or just to familiarize themselves with your product. Lastly, when defining your site you should do your research. Always visit your competitions web site to see how they have organized their site, so you can make yours better, whether it is just including more information about your product, or simply making a better designed site. Now that you have given some serious thought to how you want your web site to look, and what you want to include in it, you need to think of a name for it. There are various approaches to finding the right name for your web site. The first is to make the name logical, for instance, Nike’s web site is nike.com. Another approach is to make the name memorable so that your customers can type it in without thought, the name does not have to be descriptive of the product you sell, for example amazon.com sells books. Further, you should keep the name as short as possible so that it is easy for your customers to type into the url field. Now that you have your web page named and given some thought into how you want it to look, here are some pointers for building your site. If you have pictures on your web page go over them first with a photo editing program, like pix resizer, so that the customer’s browser does not have to crunch them. This will also speed up the download speed of your page so that the customer can view quickly without having to wait for large picture files to appear on the screen. One of the most annoying things for people surfing the web are pages that take a long time to download. All those fancy graphics will not do you any good if instead of waiting for the page to download the viewer closes his browser and goes elsewhere, so consider going light on the pictures and heavy on the information content. You should also put some serious thought into what color fonts you are going to use, and the background color as well. When in doubt, remember that a white background with black text has been successful for thousands of years! Your website should also be easy to navigate, all your links should be obvious to the viewer, and should be self explanatory or have information about where the link will take them. Try to keep the number of links you have low, the viewer does not want to spend a lot of time waiting for links to download, chances are, like you, he is pretty busy! Further, always link back to your homepage in order to make navigating your web page easier for your potential customers create a website. Now, before you even open up BlueVoda, you should construct your web site on paper. Decide the number of pages you want to have inside of your site, and determine logical titles for them. Think of any pictures that you might want to put on each page and where you are going to put them in order to be most effective. You should plan out your hyperlinks now, create a website as it will make keeping track of them later a lot easier and save you time trying to figure out why they are not working properly. Decide where you want to put any buttons that you might create for hyperlinks as well. Lastly write out any information content you will be putting onto your web page in Microsoft Word first so you can detect any spelling errors you might have made. You can cut and paste parts into BlueVoda later. create a website Lastly, familiarize yourself with BlueVoda before you start using it. Watch the free tutorial videos that we offer so that you have an idea of what you can do with BlueVoda. Further, you should make a practice page first so that you can get a feel for BlueVoda and some experience using it before you start constructing a page which you will publish on the World Wide Web . It takes two to three months to learn how to use Dreamweaver and at least a month to learn FrontPage, while you can learn BlueVoda in hours. Practice adding and deleting text, pictures, and hyperlinks until you can do these actions with ease. Building a web site with BlueVoda is simple and easy if you follow the above steps. The most important part of the construction process actually takes place before you open BlueVoda. Think of constructing your web site like taking a test back in school, those who prepared before the test probably did better than those who just went in without even opening their books. So be sure to prepare before you start, think of the content you want to put in, think about your links, think about your web site’s name, draw up an outline on paper before you start constructing the page and most importantly WATCH THE TUTORIALS before you start! In a nutshell “Plan Your Work and Work Your Plan” |
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Article By Mario Dorizas
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
| Home CSS Google Myhostingteacher.com | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
