General Computing Tips::Internet and Communication::WWW::
Creating a Homepage Sandra Polifroni

Making a webpage

A short description of How to Waste Time in a Way that Makes it Look Like You're Working.

  1. In the beginning....

    And the new webpage creator said "Let there be a public_html directory". And s/he created it by typing

    mkdir public_html 
          

    in her/his home directory, and the new webpage creator saw that this was good. And s/he typed at the prompt

    chmod 711 public_html
          

    Once you've got the directory made, create a file called welcome.html in the public_html directory and set the permissions to 644. If you don't know how to write HTML (the wondrous ``language of webpages -- i.e. the markup language in which web pages are written) or don't know where to start, don't fret, SOCS has its own webpage template available on the web at http://www.cs.mcgill.ca/students/template.html.

    However, since there are literally millions of web pages out there, you can browse the web looking for a page format you more or less like and take a look at its source. From there, you can make the modifications you want.

  2. Rolling your own

    WARNING: You may want to wait to read this section once you are more familiar with HTML. Reading it prior to that may or may not cause confusion.

    Once you've got the welcome.html file and gotten started with a template, you might want to put in your own custom elements. I suggest you use your favourite text editor (emacs, vi, pico, etc) to modify the HTML. The HTML generated by WYSIWYG editors (such as Netscape Composer or Microsoft FrontPage) is very ugly and not for the faint of heart. Plus, you get much more control over the appearance of your web page when you write the HTML yourself.

    You can pillage from other people's websites, or you can look at an HTML guide. My favourite is The Sevloid Guide to HTML. The format is nice and the text is detailed and easy-to-understand. For links to HTML guides, you can goto Transmit Media's HTML/Design Links, which has links to beginner's and advanced HTML guides, including the guide put out by the NCSA.

    While you're at it, you may want to choose nifty colours for your text, links and background. A good place to look for background colours is Hype's Colour Specifier. It provides the names and numbers of the various colours, and the full-screen viewing lets you get a feel for the colours. The Colour Selector Page can take a lot of the guesswork out of getting the colours for your web page right by letting you chose your colours, then showing you the finished product.

    As for background textures and the like, if you don't want to make them yourself using something lame like xpaint, or something hefty like Photoshop, you may want to grab one from an archive. Now, make sure that the stuff you grab is free and make sure you credit your sources. A happy place to go is Ender Design's Realm Graphics.

    This list is not exhaustive, it's just a list of my preferences. If you want more links, see SOCS's web design links.

  3. Advice

    Contrary to popular belief, a web page is not a forum for showing your friends how clever you are. Remember, some people may actually want to extract useful information from your page. In the off chance that they do, you probably don't want to saddle them with a long download time or a messy page. In other words, huge, moving gifs, messy Java applets and millions of frames are probably not a good idea. However, this is not about abstention; it's about moderation. Two frames is OK. Three frames is pushing it. Four frames is downright obscene. And remember, when your page is lynx-friendly, it's usually done in good form.

    Now, you might be thinking to yourself, ``Self, i'm too lazy to put up Java applets, moving gifs and frames, so i must be safe from bad style.'' Heck no! Bad style is insidious. It covers everything from a poorly formatted table to an ugly background with hard to read text-font. And it covers orphaned pages. When you're creating your web page, check that the background does not over-power your text. Unless you're creating a Shrine to The Psychedelic 60s or an Ode to The Garish 70s, try staying away from too many contrasting colours in your background.

    Orphaned pages are a different story. Orphaned pages fall into the bad organization category. Bad organization can annoy the humble visitor to your page and cause them to put a hex on you. You don't want this. Bad organization is characterized by the following:

    1. Orphaned pages:

      Multiple-page websites where the pages are in no way connected to one another. Orphaned pages do not refer back to `home' nor to the referencing page. So the visitor is left having to use the `back' button to, well, go back.

    2. Heavy layers:

      I call these heavy layers, but heck, i don't know, maybe they're called something else. Anyways, heavy layers is what happens when you have more than 5 layers to your web site. So the visitor keeps on going from link to link to link, trying to find what they need. The visitor may get annoyed and just forget about it at some point. You don't want that to happen.

    3. No date of update:

      Though this isn't that important, it might be in the case where someone wants to read your resume. If there isn't any date of last update at the bottom of the page, no one will know if you turned 20 "last weekend" last weekend or "last weekend" last weekend in July 1996. It's small and inconsequential, but it can be important.

    For an example of bad webstyle, see the McGill University website. It looks (ed.: arguably) lovely, but it's rotten style. For a purposely badly thought-out webpage, check out Bud Uggly Design.

    A one-stop HTML/web/style site is located at Links for Webmasters. This place has links from everything from style guides to Perl tools. It's a good place to bookmark.

  4. Stepping on Toes

    Though it's rare, complaints have been known to come in from people who feel they've been misrepresented on other's webpages. Some just complain. Some call it slander and threaten to sue. Some people also don't particularly like it when others use their images/backgrounds/clip-art without their permission. And some people really get irked when you steal their webpage (go figure!). So how can you prevent this from happening?

    The first thing you should do is read the McGill University Web Policy site (which i'm not sure is still up-to-date since it's dated 1996 and i couldn't find it by searching the McGill Website -- see, a case where last update counts!) The URL for that is http://www.mcgill.ca/Web_Pol.htm. I'd summarize it, but since i'm not sure how accurate it is, i won't bother. Yes, there are many grey areas in it, and a few areas of contention (ask a SOCS veteran for the details of how a simple interpretation error turned into a quasi-revolt).

    Second, you should read the fine print at the bottom of any page that seems to be giving away images/backgrounds/clip-art. Sometimes, there are interesting copyright statements and/or conditions of use at the bottom of these pages. READ THEM. Even though you might think that, hey, what are the chances that these guys will find your inconsequential little page and pick on you, it might happen. Don't say i didn't warn you!

    Last, use your better judgment. It's OK to copy the style of someone's webpage when you're thinking of creating your own webpage, but it's another altogether if you reproduce their page. Ditto for slanderous material. Try not to say anything nasty, (un)founded, (un)justified or otherwise on your web page. Not only can it land you into heaps of trouble, but think of how you would feel if you found the statement "<insert your name here> is a nose-picker on your mortal enemy's homepage. You want to inform the world about who you are, not alienate a segment of the population. (Oh, by the way, in case this wasn't implicitly clear, racist, sexist, homophobic, etc remarks are also things you may not want to express to the universe at large via your webpage.)

  5. The Webslave

    If you have been browsing the School's website, you may have noticed a line at the bottom of the pages asking you to send questions and comments to "The Webslave". Now, who is this elusive Webslave? The Webslave is a grad student, not a puppet of the administration, nor a well-paid bureaucrat. The Webslave works for the Webmaster, helping him/her maintain the School's website.

    The Webslave basically takes care of the maintenance of the website: updating information, verifying links, etc. The Webslave doesn't take care of anything except the maintenance of the webpage. That said, anything that DOES NOT involve the format or content of the School's website should be directed to the appropriate individuals. So if say you're having problems with your CGI script, the Webslave is not the person to email. If the server is down, don't tell the Webslave; chances are the Webslave already sent a scathing email to help@cs.mcgill.ca asking them what in the world is going on (i.e. the Webslave is just as helpless and clueless in this respect as you are). And if Netscape gives you a `network is unreachable' error, or a 403 Forbidden error, this has nothing to do with the Webslave.

    HOWEVER if you follow a link on the School's website, and you get a 404 Not Found error, then you should let the Webslave know: this is a question of maintenance. If something is amiss on the website (bad spelling, bad grammar, dead link), you don't like the format of the website, or you feel that the information on the website is lacking in some way (inaccurate, vague) let the Webslave know. Complaining to your pals or posting to socs.flame/socs.misc is not going to change anything (the Webslave, like many students, won't always have time to read the newsgroups). Of course, an email that says `the webpage sucks' is not helpful either. If you don't have constructive criticism, don't bother writing in.

    Finally, if you have any questions regarding McGill's web policy, it is best that you contact the Webslave before you start a palace revolt and begin plotting the untimely demise of the university. Remember, civil disobedience is a last resort.