Introduction
For this assignment, you are to log into your laboratory account, set up a Dreamweaver site for your projects in the course, and construct two simple web pages.
The Assignment
-
Log into your account in the laboratory
See the TREE Lab Information web page to learn how to log into and use the account that we have set up for you to use in this course. When you have logged in successfully (and changed your password, as required), download the zip file containing the template file to use as a starting point for web pages in this course. Unzip the contents of the file (a single file named template.xhtml) into your My Documents\My Website directory.
To make sure your “roaming profile” is working correctly, log out of your account, and then log in again using a different computer in the lab from the one you just used. Be sure you see template.xhtml in your My Documents\My Website directory. If you do, it means your profile was successfully copied from the first computer to Maple and from there over to the second computer.
If you want to work from off campus, you should consult Working From Off Campus at this point.
-
Use Dreamweaver to set up a site for your course assignments.
The Dreamweaver Setup web page tells you how to complete this step of the assignment; it is the same process we went over in class.
-
Create a Home Page for your site and start a Blog.
Edit the code for the index.xhtml file your created from template.xhtml when you set up your Dreamweaver site in the previous step. Change the title and h1 elements to give a name for your site. Pretend this is a real site (albeit one that you are making up) when you pick the name; try to make it something more interesting than, “My Web Site”.
Make sure Dreamweaver is showing your site in the File panel on the right (the folder icons must be green, not yellow). Right click on the root of your site and use the context menu that drops down to create a new folder. Click twice on the new folder name (if necessary) and change the name to Blog. Duplicate template.xhtml, and drag it into the Blog directory, then change its name to index.xhtml. Edit the index.xhtml file in the My Website so it has a paragraph containing a link (an a tag) that will take the user to the index.xhtml file in the Blog directory. Test that you can view your home page and that clicking on the link displays the index page in the Blog directory.
Edit the title and h1 elements of the Blog’s index page to give them meaningful names. To do this you have to decide what kind of blog you will be developing for the next several assignments. Here are some possibilities:
- Pick a theme you are interested in (school, politics, movies, sports, cooking, a hobby, etc) and develop your own blog where you will write about things related to your theme.
- Pretend you are a company executive, a band, a movie star, a politician, an athlete, etc. and create your own blog for consumption by your public, customers, fans, etc.
- Pretend you are a web developer and you have been hired to design and develop a blog for a client who falls into one of the previous categories.
At this point, all you have to do is pick a title for your Blog (preferably an interesting one—this is supposed to be fun!) and fill in the title and h1 elements of the blog’s index page. Put a link back to your site’s home page in paragraph with the links to the XHTML and CSS validators that are part of the template file that you used to create the index page.
Test that the web site and blog pages both display properly and that the links between them work correctly.
-
Create a List of Blog Entries
Use the various text-related elements described in Chapter 2 of the textbook to create a list of at least three dummy blog entries. Think about what types of tags to use for the various parts of each entry, such as the title, the date, the content, a list of tags, etc. and mark up your entries appropriately. Use real (made up) text for headings, tags, the dates, etc.) but use dummy Lorem Ipsum text for the content.
The critical part of this assignment is that you must include no presentational elements or attributes for your blog entries. They must be easy to read, but very plain, for now. You will start working on presentation in the next assignment, where you will start working with CSS.
-
Validate Your Code
Be sure you have all “green circles” in Firefox for both your site and blog home pages. Then have Dreamweaver do a link check on your whole site, and use the “Put” icon to copy your site to the remote server (actually, C:\htdocs on the computer you are working on). View the web site’s home page using your computer’s host name in the URL (not “localhost”), and click on the XHTML link at the bottom of the page to be sure the W3C Validator gives it a big green “congratuations” bar. Repeat this check for the blog’s index page too.
Do not try clcking the CSS links at the bottom of each page: there should be no CSS code to validate at this point.
Submit The Assignment
Because I will check your assignment by copying it from Maple to Babbage, all you have to do to submit the assignment is to send me an email saying you have finished it. Send your email to me by midnight on the due date (September 18). My email address is:
Christopher.VickeryATqc.cuny.eduThe Subject Line of your email must say CS-081 Assignment 2, exactly like that, in order to avoid my spam filters.
Be sure to sign your email so I know who sent it!