Introduction
In class and in the textbook you have heard and seen some important guidelines to “best practices” in coding web pages: the use of a DOCTYPE to identify the version of (X)HTML used, use of XHTML to mark up the page’s content according to its meaning rather than its appearance, the use of CSS to manage appearance, and the importance of writing well-structured code so that it will be easy to change and extend in the future. For this assignment, you are to look at the code on several web sites and to evaluate how well it measures up. We’ll use my homepage, the department’s home page, the college’ home page, and the university’s home page as the working set for this assignment, but you are free to add others to the list if you would like to.
“But how,” I hear you ask, “do I look at a web site’s code?” The answer is quite simple: all web browsers have an option for looking at the web page being viewed. For example, if you are looking at a site by using Internet Explorer, you use the menu, and select the Source item. But we’ll be using the “web developer’s browser, ” Firefox, in this course — which gives us some better options. You can invoke the View Source option in by typing Control-U, but there are two free add-ons for Firefox that will help a lot; both are already installed in the computers in the lab, but if you want to install Firefox on your own computer, you can use the following links:
- The Firefox Browser (mozilla.org)
- The HTML Tidy Add-on
- The Firebug Add-on
All this software is free and (despite a confusing comment to the contrary on the TIDY web page) available for Windows, Linux, and OS X (Macintosh) systems. When Firefox re-starts after installing TIDY, you will be asked to pick from one of three modes: pick the right-hand one, (“serial”).
Accessing Your Lab Account
You may do this assignment either using either a computer in the lab or any other one. If you decide to use your lab account, here is basic information you need to do so:
You can log into any one of the computers in SB room A-205 or A-227 using your account name for this course, which consists of your last name followed by the digits “81” all as a single lower-case string. Use the password “81”; you will be required to change it to something secure the first time you log in.
The names of the computers are:
| A-205 | A-227 |
|---|---|
| birch | apple |
| cherry | fir |
| chestnut | juniper |
| elm | mimosa |
| ginkgo | peach |
| hemlock | pine |
| hickory | plum |
| spruce | |
| sycamore | |
| walnut |
Room 205 is an “open lab,” which means you can use the computers there any time you want. The secretaries in the CS Department Office (A-202) will open the lab for you if it is closed. Room 227 is a closed lab, so you will not be able to sit at the computers in that room to use them. However, all of the computers are accessible from the Internet. If you have access to a computer running Windows XP or Vista with a broadband connection, you can use Remote Desktop to log in. From the button, go to , to , to , and you will find it. When it asks you what computer you want to connect to, pick one of the names above and add the domain name “.cs.qc.edu” to the computer name. For example, you would log into ginkgo by entering ginkgo.cs.qc.edu.
If you are using a Macintosh, OS X comes with a Remote Desktop program you can use in the same way as the Windows version. Under preferences, be sure to set a screen size and resolution to match your computer’s screen. The default value is very low resolution, making it difficult to use.
There an open source version of Remote Desktop at www.rdesktop.org that might be useful if you are running Linux. But I have had no experience with it.
When you use Remote Desktop, select one of the computers in A-227 so that students who are on campus will be able to use the computers in A-205. Only one person can use a computer at a time, so if the computer you try is occupied, just try another one until you find one that is available.
The Assignment
Browse to the following four web sites and answer the questions below about each one:
- www.cuny.edu
- www.qc.cuny.edu
- www.cs.qc.cuny.edu
- babbage.cs.qc.cuny.edu (Note, there is no “www” in this URL.)
Remember, you are free to add other pages to this list, including more “interesting” ones from babbage!
Questions
- How many HTML validation errors are there?
If you are using Firefox/TIDY, you can just let your mouse hover over the icon in the right part of the status bar at the bottom of the browser to get the answer to this. Otherwise, browse to The W3C HTML Validator, and enter the URL there to find out.
- How many CSS validation errors are there?
For this, you will have to go to the W3C CSS Validator and enter the URL. My home page (like this one), has a link at the bottom that will do this for you.
- From what the textbook says, how serious is the missing DOCTYPE error on the department and college web sites? And how hard do you think it would be to fix this problem?
- Look at the source code for each web page and describe an instance where you see presentation is mixed in with the content markup of the page. Tell what you would do to fix the problem.
- Evaluate the use of class names (that is, the value of a tag’s class attribute) according to the guidelines given on page 19 of the textbook. Try to find one instance of a poor class name on each site, and suggest a better name.
Submit The Assignment
Write your name and your answers to the questions in an email message. I read email as text only, so there is no point in formatting your answers with special font effects, etc. Please paste your answers into the body of your message instead of sending an attachment.
Send your email to me by midnight of the due date using an email account that you use regularly. I will add that email address to a mailing list for the course. The mailing list will be used for occasional announcements during the semester. My email address is:
vickery at babbage.cs.qc.eduYou must use exactly this Subject line for your email to be sure I actually receive it: CS-081 Assignment 1. In fact, include the "CS-081" part in the subject line of all messages you send to me this semester.
If you do not receive an “OK, I’ll check it out” reply from me within a day or two of submitting the assignment, it means I did not receive it. But I will be sending that acknowledgement manually, so don’t resubmit the assignment until I have had a chance to reply to the first one.