Assignment 1

This week we settle in and learn about HTML editors.

Preparation:

Text: No reading required, but you may want to review topics that you had trouble with in the A class.

CD:: View lesson 1 (optional)

For Credit:

1. Establish your account on the student server - 5 points

   Most students have done this already, so all you have to do is send me an email with the subject "CIS50.11B" that contains your username in the body. I will use this information to set up our Class Gallery and to help troubleshoot any problems you have during the class.

   For any students who do not have a student account, the name of the server to which we will be uploading our web sites is "student.santarosa.edu". You must upload the pages that you will be creating in this class to this server. In order to establish your account, go to http://student.santarosa.edu, click on the "Application for Student Account" link, and follow the instructions. Your account should be automatically established immediately upon completion of the application.

   Your Web Site address will be: http://student.santarosa.edu/~YOURUSERNAME/
   Note there is no "WWW" in the URL. I strongly suggest bookmarking your site once it is set up.

   Tip: The most common problem students have with this task is entering their birthdate incorrectly. Please note carefully that the system requires you to enter your birthdate in an order that is probably not the most intuitive: year first, then month, then day.

   Note on Usernames and Passwords:
   1. You will be told what your username is when your account is created. Normally your username is your first initial and last name, lower case, up to a total of eight characters. If you have a common last name, you may get a slightly different username. For example: tfleming
   2. Your password is the first letter of your first name, capitalized, then the first letter of your last name, lower case, and the last five digits of your Social Security number. For example: Tf#####
   3. These are your student server username and password. You will use them when logging in to the student server. Also I require that you use this username (your student server username) in the "Name" field when posting messages on the message board.

   When your account has been established, send me an email with the subject "CIS50.11B". In the body of the email simply type your account username.

2. Introduce yourself - 5 points

   Click on the "Message Board" link at the top of the page and enter the password, which is "html". Then click on the line that says "Introductions". Make sure you find the topic with this title that was authored by me. You will see my message and any others that have been posted in response. At the end of the postings (they may go on to more than one page) you will find a box ready for you to post your own review. You can talk about your work, your computer experience, why you are interested in learning HTML and CSS -- whatever you would like your classmates to know about you. In the "Name" field the first word MUST be your student server username; after that you can type your real name to make it more personal. Contributions of just a few words will not receive credit.

   Do not post any new topics on the message board. New topics that are created by students will be deleted.

3. Find and review an HTML Editor - 10 points

   When you began learning HTML, you were asked to use a text editor to write your web pages because you needed to become familiar with the code and begin to understand how HTML and CSS syntax works. Now that you have at least eight weeks of experience under your belt, you can begin using a tool that you may decide makes your life a lot easier.

   1. Definition of HTML Editor: This is a software application that uses menu items and tools bars to place HTML code into a text document. Most HTML editors display the code in one view and the resulting webpage in another view. In addition, most HTML editors have a feature (sometimes a separate plug-in) that will help you write CSS. See the Links page for a list of HTML editors.
      
      
   2. HTML Editors are NOT the same as WYSIWYG editors, which create web pages while hiding the HTML code from you. You are not allowed to use a WYSIWYG editor, since the purpose of this class is to learn how to use HTML and CSS code. The more you see the code the more you learn. Examples of WYSIWYG editors are FrontPage, Dreamweaver, PageMill, etc. If you not sure if your editor is WYSIWYG, please email me.
      
      
   3. Benefits of HTML Editors: These tools can save you time and make you more accurate and efficient. Using an HTML editor reduces typing errors in your code. You no longer have to type angle brackets or remember to include the ending tag of a pair. I predict that you will get many more green bars from the validator on your first try! Many editors also have powerful find and replace features, which saves time and ensures that you catch every instance of the text you want to change.
      
      
   4. There are many editors on the market - some freeware, some shareware, some full commercial products. See the Links page for some links or use your favorite search engine to find some and download one that looks good to you. Make sure you feel comfortable with the source before you download anything! A virus-scrambled hard drive is not the best way to start your day.
      
      
   5. After you have downloaded the software, you need to install it, then start playing around with it. Many of them have tutorials or other help devices that will speed up the process of learning how to use it. Most students are really happy to have software that makes it easier to develop code, but you may decide to stick with a basic text editor -- the choice is yours.
      
      
   6. When you are familiar with your HTML editor, and have been able to create a short web page or two, write up a review of the software. Click on the "Message Board" link at the top of the page and enter the password, which is "html". Click on the line that says "HTML Editor Reviews". Make sure you find the topic with this title that was authored by me. You will see my message and any others that have been posted in response. At the end of the postings (they may go on to more than one page) you will find a box ready for you to post your own review. In the "Name" field the first word MUST be your student server username; after that you can type your real name to make it more personal. Contributions of just a few words will not receive credit.

      Do not post any new topics on the message board. New topics that are created by students will be deleted.

4. Download required ftp/ssh software
   
   Again, most students will have completed this task already, so the following information is only for those students who have not.
   
   You'll need to download two applications onto your computer in order to be able to accomplish two important tasks: (1) you'll need an "ssh" application so that you'll be able to configure your account on the student server so that it can serve as your website, and (2) you'll need "ftp" software so that you'll be able to move your webpages from your local computer over to the student server. Note that task 1 will only need to be performed once at the beginning of the class, whereas task 2 will be done each time you want to make a change to your website.
   
   Don't worry if it seems like we're getting ahead of ourselves here. For this week I just want you to get these applications on your computer so that you'll be all ready to roll next week.
   
   Windows Users:Both of these applications will be downloaded to your computer in a single download. To perform the download, click on https://cf.wm.edu/it/software/public/ssh/sshsecureshellclient-3.2.9.exe. If you are asked whether to open or save the file, choose "save", and choose a location to save the file (probably your desktop). After this, double click on the icon that was downloaded to install the two applications. (The icon will be labeled "SSHSecureShellClient-3.2.9".) This will take you to an installation wizard that will guide you through the process of installing the 2 applications. Unless you have a specific reason to do otherwise, you should just click on the "next" or "yes" button at each step. When the wizard finishes, you will see 2 new icons, one labelled "SSH Secure Shell Client" and one labeled "SSH Secure File Transfer". You're done.
   
   Mac Users:You do not need to download an ssh application because you can use the application named "Terminal" that is already on your computer (more about this in lesson 2). For ftp we will be using an application named "Fugu". To download this application, go to http://rsug.itd.umich.edu/software/fugu/download.html, and then click on the link "Fugu-1.2.0-English.dmg". If you are asked whether to open or save the file, choose "save". After this, you may have to double click on the icon that was downloaded, or it may open automatically, depending on how your computer is configured. In either case, you'll have to select "agree", and then the icon for Fugu will appear on your desktop. You should probably move it to your Applications folder, and also to your dock.
   
   Note: if you already have FTP software that you use and are comfortable with, you may use that software instead. However, note that the student server accepts only secure connections. If you aren't sure if your FTP software is secure, you should download the recommended software. Also, if you use your own software I won't be able to support you if something goes wrong.

Your Website Project:

Your web site: Start thinking about a theme that you can develop for your website project. Some students may want to continue the site they were working on in the first eight weeks, but I normally recommend starting from scratch. When you start fresh, you can develop your site more intelligently than you were able to in the first eight weeks -- because you are so much smarter now than you were then!