|
Due: |
Wednesday June 28 |
|
Evaluation: |
15 points |
|
Email: |
A message informing TA of completion of page |
There are rules governing how students may use their EDEN account. While you can and should use your account for academic purposes as you will be doing with this assignment, you must never use this account to try to make money or run a business. It is important that you understand the proper manner in which you should use your Rutgers computing privileges. Read the Acceptable Use Policy and related documents if you have not done so recently. Violation of this policy will result in permanent loss of your account along with other possible repercussions.
Purpose:
Create your own webpage about your product and make it accessible to the world.
To complete this assignment:
Certain parts of this assignment can be tricky if you do not do things in the right order. You can end up with parts, or all, of your webpage not working. Thus, over the last several years we have accumulated very specific advice on how to do various tasks and have made this information available on the HINTS PAGE linked here. To ensure that your work goes as smoothly as possible, and that you do not run into problems that cause you hours of extra work, you will want to read the hints carefully BEFORE doing any work. Then have them nearby to refer to as you work through various aspects of the assignment.
As you should realize, you have an account on a machine at Hill Center called eden.rutgers.edu. Up to this point in the course, there has been little reason to get on to Eden directly since you do all your work on Macintosh microcomputers within the labs. When you log on to the Macs in the labs, they check your NetID (username) and password with Eden to make sure you are who you say you are - but you are not getting on Eden directly by this method. However, the Macintoshes you are using cannot make web pages available to the world. To do this, you need to place these web pages on a machine available to the world, and Eden is such a machine. Eden.rutgers.edu acts as a web server. If you place web pages into a directory called public_html on Eden, they become available to anyone accessing the Web. Thus, you need an easy way to create web pages on the Mac but save them directly on to this space on Eden. There is a way to do this but first you need to make sure public_html exists on Eden. The directions in this section will allow you to get on Eden and run a command to create your public_html folder.
The steps to create your public_html space are quite easy but they involve using a few features you may not have used before. First of all, you need to use a communication application called Telnet. Actually, you will be using a secure version of this software called SSH. This software allows you to attach to a remote computer and use it as if you were directly logged on to it. In our case, you need to use Eden - which is the remote computer -to do this preparation. You will be sitting at a Macintosh in the lab - which is the local computer - as you attempt to do this. SSH will connect you to Eden from that Mac.
Second, since you will be getting on Eden directly, you need to know how to use the Eden operating system, which is UNIX. It has a command-line user interface consisting of numerous commands. There are whole books written about UNIX and we will not go into it here. You only use two or three commands once you get there - so hopefully you will not get into trouble. To make life easier for users of Eden, new accounts are not normally set up to use UNIX directly. Rather, a menu system has been added to show you a list of possible commands on the screen. New users will find most commands needed off those "menus." Some of you may have used Eden before and decided to abandon using the menus and now use UNIX directly thru a prompt.
There are two sets of directions below. If you normally use Eden menus, follow the first set of commands. If you don't use menus, follow the second set of instructions. If you're not sure, follow the first set of instructions.
[Items II through V are meant to be informational. You will not begin working on your own page until you understand all that is explained in these sections. However, as this info is being discussed, it may help you to attempt some things on the computer. ]
Ok, that first step was a little involved. But most of the important information has now been explained. Just a few more things to know about.
The best way to do this assignment is to save your work on your USB flash drive (thumb drive) and then when necessary transfer your files up to your public_html folder on the Eden server so the rest of the world can view your webpage.
A wise thing to do is to create a special folder on your flash drive (disk) - something with a name like MyWebWork. Then you can use this for all files you create for this assignment - including all images and webpages. You would make sure that when you use SAVE AS, you place them here.
Info on how to make folders and/or SAVE on to a disk or into a folder is on the HINTS page.
If you understand what has been discussed above, then you realize that you need to save your web files so that they are accessible to the world and you do this by locating them in your public_html space on Eden.
On the Internet, people use a software protocol called FTP to transfer files from one computer to another. At Rutgers we have upgraded to a more secure version of this called SFTP ("secure FTP"). On the Macs, the piece of software that can do SFTP is called FUGU. You will see it on the Dock.
You will be using FUGU to transfer your webpages - and all related files such as the images - to your public_html space on Eden. The HINTS page has plenty of info on this and the TAs will be showing exactly how to do this in recitation. So refer to that info for precise details.
Besides getting your files to your Eden public_html, you also need to make them readable to the world. This is done by setting their "permissions" (otherwise known as "protections"). FUGU has a command to set permissions, In short, you will be setting the protections of each file you place in your public_html (using the Info command info FUGU) so the rest of the world can READ your pages. You must do this for each webpage and image you place in your public_html.
Once you have your webpage on Eden and the protections set right, you (and the rest of the world) can view them. See below how to do this. If your webpage needs more work, you will have to edit the local copy you have in your own USB flash drive folder. You of course will save your changes there. After that, this no longer will match what is in your public_html on Eden. (The copy on your flash drive will be newer/better right?) So you will have to use FUGU again to transfer the newer version up to your public_html again. (And probably reset the permissions.) The HINTS page has plenty of info on this too.
In Section V we will will talk about the software used to create the webpage and what is expected to be shown in that page in order to complete the assignment. We are not ready to do that yet - so read on. For now, realize that you will be using a webpage editor (some call it "webpage publishing") software package called Mozilla Composer. As you design your page, Composer will not always display the page exactly as it will appear to people who are accessing it through the Web.
You may want to know what the page really looks like. You can look at it through a Web Browser - such as the one you already know, Safari. To do this, you need to know what address - or URL - to specify when you are using the browser. Part of the URL is your NetID (username) because the page is in your space. Using the following URL as an model, you will type in your Eden NetID (username) where you see ~jt
If Jt did this assignment and gave the proper name for the page (110.html - which we said everyone has to be use for this assignment), the URL given to Safari will look like this:
For this assignment your page must be called 110.html. However, if you were to create another page on your own with a different name, you would supply the whole name - whatever you called it. You should attach the extension .html to any web page you create. Notice the tilde ("~") before the username. This is an essential part of your URL -- don't forget it! This is how you tell a UNIX machine that you are specifying a NetID (username). Again, to see your own page, don't put "jt" but instead put your own NetID.
You can look at your webpage at any time by opening up Safari and supplying the address (URL) of the page. Even if your page is not complete, looking at it may help you to make design decisions. You will see the latest version you last transferred to Eden (explain in section II above.) To be clear, you may have added things to your file using Mozilla Composer and see them in your editing window, but if you have not moved this info to your public_html space on Eden yet, you will not see the updated page in Safari when you give the URL to the browser.
Ok, now here is something to look out for. As you go back and forth from designing your page using Composer to looking at it using Safari, it can occasionally become confusing. Although they are two different applications they are showing the same page of information - maybe different versions. If you are not paying attention you may think you are using one tool when you are actually using the other. There are two ways to approach this situation.
One manner in which to handle this is to always quit Composer before you use Safari to view the page. You will also want to quit Safari before you go back to editing the page using Composer. Constantly loading and quitting the two programs may become tiresome - but there may be little need to keep doing this. As long as you do not plan to view your page many times, this approach should be fine.
There is also another option. You can simultaneously run both applications - Safari and Composer - on the Mac you are using. Simply load both software packages and keep them both running at the same time. However, this can be even more confusing. You may see windows from both programs on the screen at the same time, each showing your page in some manner or another. Unless you are very comfortable with running multiple applications on a Mac at the same time, this method is not recommended. You need to know how to switch back and forth between the two applications (use the Dock on the bottom of the screen) and easily be able to tell which is currently running (the second menu on the top should be the name of the running application) It may help to know how to Hide applications that are loaded.
What you need to know is that you may be switching back and forth between the editor (Mozilla Composer) used to create your page and the browser (Safari) used to view your page. Try not to get confused if you are moving between the two packages.
As you develop and view your webpage, you should do this process in whatever manner you feel comfortable with.
To create a web page, you want to use the program called Mozilla
Composer. You can get this software for free to use on your computer.
The latest version is called SeaMonkey and is available for download
at: www.mozilla.org/projects/seamonkey/
If you do choose to do this work on your own computer, you will have
to figure out many things on your own. People setup their machines in
many different ways and therefore we will have little advice for how
things may work on your own computer. Details for transferring your
webpage to Eden will be quite different from home. (One option is
to use SeaMonkey to design the page at home. Then go to the labs and
use Fugu to get your work up to your Eden public_html folder.)
Therefore, you might be better off just doing this assignment in the Rutgers labs. This software is available on the Macintoshes in the labs in their Applications folder. (Open up the Macintosh HD icon in the upper right, then navigate to Applications, next open Mozilla by double-clicking it.)
When you try to open it, it may ask you to pick a "Profile." If so, click the Create Profile button. When it walks you through the steps, click the next (->) button, then click Finish. This will create a profile called Default User. Finally, select this choice in the list and click the Start Mozilla blue button.
Once you have the software open, it creates a browser window. You do not want to browse, so close this window. (Red button upper left.) Then to get to do webpage design, go to the Composer command under the Windows menu.
The first thing you should do is use the Save command off the File menu. When you save a new page for the first time, a dialog box will come up asking you for a title for the webpage. This will be the name that appears on the Title Bar when the page is viewed in a browser. You can type in whatever name you feel is appropriate.
After you entered a title, a SAVE AS dialog box will appear showing a default name based on the title you have selected. Be careful at this point and enter the proper information into this dialog box. You will likely have to change the default shown. Remember, you want to save the main page you work on for this assignment with a name of 110.html. Also, you want to make sure you place this in the folder you created on your USB flash drive into which you intend to file your work for this assignment. (See above and the HINTS page for info on saving.)
Note: any other files you want to make available on the web - including images you may want to include in your pages - must be in this folder, before you actually try to link or include them in your own webpage.
You should save your page often as you work on it. When you are ready to place it on the web use FUGU to get it there. Make sure to set the permissions appropriately.
Composer is fairly easy to use. It is similar in nature to the word processing component of Microsoft Word.
You should easily see how to change styles, justification and text size. If you are diligent, making headings, adding a table, inserting a horizontal line and creating a bullet or numeric list should not take you long to figure out. (Hint: check all the menu commands and the icons on the toolbar.) Can you change the default color used for regular text, link text and the background of the page? How about changing the way items in a list are numbered, for example to Roman Numerals? (See the Number Style menu on the List Properties dialog box.)
To become familiar with Mozilla Composer, experiment with the various features and menu commands and see what they do. As usual, create and play around with an unimportant file and learn as much as you can before working on the real file for the real assignment. Hints to this assignment that explain how to do certain activities are available. If you get lost, come back to this webpage (using a browser like Safari or IE) and access the clues by clicking this link to the hints page. The answer is not there and you still need a hint? (As mentioned above, you should have read the hints before starting the assignment.) Send email to your TA or jt@rutgers.edu - but remember, first check the HINTS page to see whether your question has already been answered.
Two items you must include in your webpage are a picture and links to other documents. Can you do these?
For this assignment, create a web page called 110.html which is placed in your public_html space. This webpage will discuss the product you selected to purchase and why. You should have a number of different sections - of your own choice - within the webpage. This assignment is fairly free form in that most of the information you supply and the format you use is up to you. You will want to show as many features of Composer that you can demonstrate in a sensible way. That is, the page should demonstrate various features but also achieve a professional look - so don't overdo it. You have to use certain features and incorporate the sections listed in the table below. The TAs will look for these items in order to give you all the points. Note - you need to include links to other webpages on your page and you need to include a picture. The subject of your web page is your chosen product - the one you intend to buy. You may want to show some pictures of it and explain why you want to buy it. You will want to break your page into different subjects. But the topics you chose to talk about are up to you.
To make an interesting page you may want to insert some pictures you found while searching the web. In any browser you can save an image. Make sure you save it into your folder on your own disk. (The HINTS page has a lot of info on how to save images and how to insert them into your webpage. Read this carefully or you will be frustrated.) You can use any legitimate picture you find on the Web or draw your own. (If you use a picture you found elsewhere, please list the source of the picture in your webpage - as it is not proper to use other folk's information without giving proper credit.) The key thing is that the image must be in your folder before you insert or link it into your page or it will not be viewable when your document is visited through a browser. It is best to use an image that is in a standard format such as GIF or JPEG. You must insert the image properly, so understand the info in the hints page.
To get full credit for this assignment, your web page must have the following:
Feature |
|
|---|---|
|
large heading |
the name of the product you chose including the exact model, type etc..... i.e. "The Epson QLM Color Printer" |
|
boldface |
your name and email address |
|
center justify |
appropriate title(s) for the different sections of your page; i.e., Why I Picked This Bicycle or Similar Printers |
|
horizontal rule |
between sections of your page |
|
bullet list |
itemizing a number of reasons why you liked the product |
|
background |
some reasonable color in the background |
|
table |
a list of at least three sites selling your product and the cost listed at those sites |
|
insert link |
to at least four other webpages containing relevant or related info about your product |
|
insert image |
a suitable, legitimate image of your choice, maybe of the actual product |
|
italics |
section titles and also a disclaimer stating "This is a class project for Intro To Computers at Rutgers" |
|
numbered list |
short paragraphs listing similar products, their cost and a simple reason why you decided not to go with each of those selections. Each paragraph should be automatically numbered with a different Roman Numeral |
|
textcolors |
use a different color for some of the text in your document |
When you think your webpage is perfect, log into a DIFFERENT computer. DO NOT ATTACH YOUR USB FLASH DRIVE TO THIS NEW COMPUTER. Instead, immediately go into a browser (Safari?) and visit your webpage by supplying its URL. If you can see it on another computer it is probably right. (Sometimes it looks like it is working on the first computer but it will only work for you and no one else. Usually this is because it is accessing your flash drive, not your Eden account. This test on the second computer is to look for this problem.) To earn the points awarded for this assignment, email your TA when your webpage is finished. In your email message, include the statement the webpage assignment is ready for evaluation and give the complete location (URL) of your webpage. The TA will know your NetID (username) from your email, and the fact that the page is called 110.html. From this, it will be easy to find your page on Eden. If the TA finds it, they will grade it and you will receive a message within a few days telling you how many points you earned. If you do not get this confirmation, something has gone wrong and you should contact your TA in person.