Introduction
World Wide Web entered in our vocabulary in 1995. Since then, everybody wants to create his or her own Web page and "to publish" it. This page give you some advice, tricks and hints on creating your Web pages and Web site.
The Web pages files format is called the HTML for Hyper Text Markup Language. This format consists of codes for the various available options. An instruction is always framed by a "<". Most instructions work in pairs to indicate the beginning and the end of an option. These instructions are almost identical except for the end pair that as "/" right after the "<". For example, the instructions <P> and </P> indicate the beginning and the end of a paragraph. So, the instructions <B> and </B> indicates the beginning and the end of text put in bold. There are also instructions that work alone such as <BR> to end a line and begin a new line. Some of the basic instructions are described in the HTML codes Web page.
The HTML format does not offer all the same possibilities that a common Word document. The level of control of the presentation is limited. The presentation changes according to the resolution of the screen of the computer of the user. On a PC, the screen resolutions most often used are of 640 by 480 pixels (points of light), 800 X 600 and 1024 X 768. There are even the resolutions 1200 X 1024 and 1600 X 1200 for 17 , 19 and 21 inches screens. All this to say that the same text will appear differently according to the resolution chosen by the user and not the designer.
Another difficulty with the HTML format is that the font that you use for your Web page may not available on the reader's computer. The operating system will substitute for a font that is available.
What is the difference between a Web page and a Web site?
A Web page is a file that contains the text, the images and links to other pages or documents. A Web site is a group pages on a subject, a business, an organization. For example, this Web site as over 200 Web pages with 1700 images. A Web site has also a main page. It's the Web page that helps the readers to navigate on the site to find the desired information.
A site should be also structured. How is a Web page connected with the other one? Are there one or several ways for the readers to navigate through the site? For example, this site concentrates on training material for data processing. It covers six subjects: General, Internet, Word, Excel, Access and PowerPoint. At the begining and end of every page, there are several navigation buttons you can press to go to the previous or next page of the subject in question then to return to the training page. The learning material Web page gives you the choice of the various subjects and returns you to this page after the "tour" of the pages of the subject.
You've certainly heard the expression to " surf the Web ". In fact, the users quickly glance through Web pages until they find what they need. So, it's necessary to structure a site to help them find easily and quickly what they need. This can be made by using a " site map ", a search tools for the site, the good main page and especially the good structure to navigate the site.
Advice
+The first question that you should ask yourself is to whom is this site for ? What is it supposed to be ? What does it cover ? Is is to inform? To educate? To amuse or to sell? This will affect all the decisions that you'll have to take for the presentation of your site and its pages.
+The most important element of your site is, and will always be, the content. Make sure to have the content answers the expectations of your readers.
+Be sure that your site is easy to navigate. That the navigation buttons are easy to understand and are easily accessible. Don't assume that the user knows the Web pages principles. Don't forget the K.I.S.S. rule (Keep It Simple Stupid!). A clear presentation is always best. Do not overload pages. Leave some space between the various parts of your text.
+Small is beautiful! Keep the contents of your Web pages small. Cut the contents into several pages if necessary. Nobody likes waiting. That's even more true on the Web. Although the communication lines in companies are rather fast, that may not the case at home. 56 Kps modems are sharply slower than what people use at work.
+Use the smallest possible images to pass your message. The bigger the image, the more time the reader will have to wait to see the image. Some image editors allow you also to reduce the number of colors of the image. If you want to show a big image, give the choice to the reader by creating a link on a small image to a the bigger image. The image does not take a place on the page and is available so necessary.
+Be consistent ! Use the same presentation style and the same navigation buttons through all your site. Always place the navigation buttons in the same place on each of the pages of your site, usually on top and maybe at the bottom. This facilitates the readers' understanding on how to navigate on your site.
+Make links to other sites that complements yours. You don't have to put everything on your site if another site is already created some content and explains better a particular point or subject. In short, don't reinvent the wheel!
+Besides using small images, reuse the same images if you can. Because they are already stored for your browser, they don't need to be retransfered. This accelerates seeing the page. You can easily reuse the presentation style and the navigation buttons.
+A Web page is never ended. In fact, you must constantly update Web pages when you have something to add. So, it never really ends. It's always in construction. No need to inform about it the world with " on construction " posters ! Place the date of last time that the Web page was updated. The users can know that they have already seen this page in past or age of the page.
+A little suggestions: inform them in amusing them. No need to be serious all the time. Be clear but in a style that is simple and easy to read and understand.
+Don't use big tables on your pages. This slows down the presentation of the the page. Separate in several small tables if necessary.
+Verify the presentation of your text on various browser (Netscape Navigator and Microsoft Internet Explorer, Opera, Safari for example), at various resolutions. A Web page that is beautiful at a 1024 X 768 pixels resolution can be difficult to read in 640 X 480.
+Verify for spelling and your grammar of your Web page before publishing it to the general public. There is nothing more awkward for the image of your site than to find errors. In passing, if you find any on this site, please inform me of it; after having little a little laugh about my warning.
+Verify your links. It's very frustrating for an user to find a link of a nonexistent page. The Web is dynamic! The page that existed even yesterday can be gone today. There are software that "validate" the links of the pages of a site. Look from the list of the freeware sites under " validators ".
+Do not use specialized instructions. Some instructions work fine with a browser but not with others. For example, Word offers to insert flashing or rolling text. Although this option is interesting, it does not work with Netscape Navigator. There are also additional modules such as Flash, Shockwave and many others to put some animation on your site.
+Be attentive to the background of the page. It should be rather clear to give a good contrast and allow to the reader to read the text. Never write text in white! The reader will not be able to print of the white text on white paper.
+Before we begin creating your own Web pages, go to see what the other persons have done. You will certainly find some good ideas for your own pages. Whether it's the presentation style, cool links or images, you'll find something interesting. Analyze what they've done and how they did it. You can also look their HTML code to see how they realized an effect that you like. Unfortunately, you'll also find some Web pages with some elements that need be avoided at all costs. I hope only that this page gives you enough references to make the difference.
+Your site should not have more than 4 levels in depth. It means that the main page is for the first level. The links of this page bring you to the pages of the second level. The links of these pages bring you to the pages of the third level... don't make difficult for the users to find the data that they need.
+Plan the structure of your site and how you will divide the contents on several pages before starting creating your pages.
+Don't forget to add your e-mail on every Web pages. The readers of the page can then contact you to comment or to inform you about a problem. It's one of the most forgotten element by new Web designers.
+If you receive a message. Try to contact the person as soon as possible with the necessary information or reply. Contact them even if it's only to say that you don't have the information they requested.
+The main page of your site should always be called index.html. Otherwise, the server will show your readers a list of all the files, Web pages, images and the other files that are in your public folder.
+The name of the Web pages of your site should represent its contents. For example, a page containing the list of the products of the company could indeed be called products.htm. The name of Web pages should never have capital letters, spaces or characters having accents (à, é, è, î...).
+A good site uses several ways to help the readers to find the contents that interest them. He can have a page that contains the plan of the site; that is the structure of the pages of the site. This page is called a " sitemap ". Make this page as available as possible to the readers. Another way is by using a form connected with a database containing the subjects covered with the site. You can also put at the bottom of the page the subjects related to that covered on the page. A search tool for your Web is also a good idea.
+Here are some advice to take advantage of images on your Web pages.
The GIF image format limits you to a maximum of 256 colors. But, you can also have an image of this format that uses only a palette of colors of 16 or 8 colors. It's even possible to have a palette of only 2 colors: black and the white. This reduces greatly the size of the image that contains the same data.
Let's take the example of the image and the image . Both seem identical and they are. However, the first one uses a palette of 256 colors, for a size of 848 bytes whereas the second image, with a palette of 16 colors, has a size of 111 bytes. Despite that difference, no data of the image is lost. Smaller images allows to accelerate the transfer of a Web page to the reader's screen. Imagine what effect it could have with a Web page that contains several images that are bigger than those at the beginning of the paragraph. Several image editor such as Photoshop, Paint Shop Pro and many others, allow you to reduce the palette of colors for an image.
Two other HTML instructions are interesting for images are the possibility "to reserve" a space for the image. The most important element of a Web page is still the text. The images are, or should be, only a complement to text. They should not explain the history but to help understand the message. The options HEIGHT and WIDTH that can be added to the < IMG > instruction limits the space that the image will take on the screen. With these information in the HTML code, the browser doesn't need to read immediately the image to get this data. It can reserve the necessary space to show the image and continue placing the rest of the text. It can return after to read and show the images. These options accelerates seeing the text on the screen.
You go to find on the World Wide Web the images that you would like to save or same resources on your site. Here are the instructions to save these images on a floppy disk or on a computer.
*Place the cursor over the images that interests you.
*Press the right mouse button.
*Select the option Save the image or Save images as.
*Select the drive (floppy disk 3 ½, hard drive) as well as the name of the file.
*Press the Save button.
Be careful about the copyrights! You can not use just any image. Certain corporate logos are protected by copyrights or are registered trademarks. You can not use them without the permission of the corporation. Otherwise, these corporations could have legal appeals against you! They have a legal obligation to protect their copyrights. It's possible that these allow you to use an image under some conditions. Be very sure that you are allowed to use an image. Otherwise, don't take the risks: don't use them.
For more details of the copyrights, go to the following page that gives you a complete list of site having of the complete data about the subject.
Http://concours2000.educationquebec.qc.ca/sign etdroit.htm
Promote your site
You spent a lot of time to create and to develop your Web site. Having published it, it's now time to promote it to the users who could take advantage of it. There is always a " word of mouth" technique. But this will not bring a lot of traffic to your site quickly. There are however the other possible techniques that are mentioned in this part.
For a commercial site or for an organization, it would be interesting to reserve a name on the World Wide Web such as www.microsoft.com or www.mit.edu. Although not compulsory, this gives a more professional look to your site. There are minor costs to reserve an address. Above all, it's necessary to find an address that relates well with your company (usually, the name of the company) and that is not already used by another person or company.
Another way of promoting your site is to show the address of your Web page (or URL for Uniform Resource Locator) on your business card, your promotional material and even in your document business headers. You can also place it automatically in a message footer of your E-mail. Several E-mail software allow you to compose a small text that's added to the end of your messages. This option varies from one software to another.
One of the most effective ways for this to make known is to add the address of its site to research sites such as Altavista, Google and Yahoo. Each has criteria to estimate your site. Most use the first 25 words of the page to describe your site. Others look for hidden for META > commands for data about the keywords and a description of your Web page. Some of these options will be described a little later in this section of the site. {Altavista}
Instead of sending individual queries to be included in each search sites, there is a site called Submit-It! It sends a query to more than 400 research sites. However, you must pay for this service. There are other tools for inclusion of Web page that are very interesting and free. Some search sites asks you to enter the data directly from their predetermined categories.
From time to time, verify that your references are still available on the search sites. Try several times by using the keywords that you used to describe your site. Sites remove the references that are not used. It's then necessary to enter second time the references of its site.
Another way to increase the traffic on your site is to exchange "banners", animated promotional images, with the other sites. You have probably seen it already at the beginning of some Web pages. You make the promotion of their sites and they make the promotion of yours. {One}
You can also exchange links with the other sites that have additional or complimentary data to your clientele that you want to join.
Place tools on your pages to help your readers to promote your site. This is to incite them increase the viewership of your site. One way is to put a " tell a friend " link to inform it that there is something interesting for others on this site. It's of the kind " word of mouth ". But, it's you as designer, that provoke the communication.
Transfer to a public site
Having elaborated your Web page, you want that the other persons are capable of seeing your composition any time. So, you must make it available on the World Wide Web. For those university students that have an account on the Merlin server, it's possible to reserve a public directory (or folder) who is legible by all. For those that reach the Internet from home, you use almost certainly find a personal Web space provider on the Internet. Generally, these supply you an E-mail address of and a possibility to "publish" your Web pages. You can also to ask for technical aid from your supplier. The procedure that follows explains how to publish a Web page for the students that have an account on the Merlin server. The procedure should be the same independently of the access provider in the Internet.
The procedure contains two stages: the creation of the public directory and the transfer of files (Web pages, images and the others) in the public directory. Later, your Web pages, images and the others are accessible by your site on the World Wide Web.
For the creation of the public directory for UQÀM students:
*Open your Merlin account.
*From the menu, select the option 9: shell Unix.
*Enter the following command: publication-c and press the Enter key.
See the creation of a public directory on the page http://www.er.uqam.ca. A public folder will be created for you. You will then be able to place content in that folder that will be available to all.
For the students of the university who follow the MET1300 course, the procedure to transfer your Web page as well as the images is in the course codex.
For the others, it's necessary to use a FTP software (File Transfer Protocol) to transfer your pages to the directory that your Internet service provider (ISP) probably reserved you some space. Contact your provider for more information on this point. What is the available space? What is the maximum size of the files? Is there any service to present audio or video files? Before transferring, you need three vital informations: the server name or address, your account number and your password. Your provider's technical sevice should provide you with these informations. To learn more how FTP software work, go to the FTP page on this site.
If your provider doesn't offer free Web space, you can find some site on the Internet that can provide this service for "free". We all know that there is no such thing as a free lunch or a free Web site. Some promotional material will appear on top of your Web page or on the side. You'll have to pay a "Web farm" is you want to place your content with only the promotional material that you wish your readers to view.
References
Here is a list of sites being able to give you more information about creating Web pages. Some of these pages have references to the other Web pages on the same subject. Good reading!
http://www.projectcool.com
http://www.ncsa.uiuc.edu/General/internet/WWW A of beginer guide to HTML
http://htmlhelp.com of Web group Design ( WDG)
http://www.utoronto.ca/webdocs/HTMLdocs/NewHTM L / htmlindex.htm
http://www.hwg.org Writer's The HTML guild
http://www.htmlgoodies.com HTML Goodies
View in depth of all the possible subjects about crating Web pages.
Http://concours2000.educationquebec.qc.ca/qual ite20.htm List of criteria that the participants of the competition of crossed histories should respect. They apply also for the conception of your Web pages.
No comments:
Post a Comment