Assignment #3: Introduction to HTML - Index Page

• This assignment will demonstrate:
  • Making an HTML page, using the Basic Document Structure as given in the class handout.
  • Using <p>...</p> tags to separate paragraphs of text from each other.
  • Using FTP or the hosting service's File Manager to upload your index page to the Web server that you got last week.
  
  
• Create a new file in your text editor.
  1. Add the Basic Document Structure HTML page that is in the class handout, to your new file.
     You can copy and paste the HTML5 Template from the "Resources" page if you wish.
  2. Save the file as index.html.
  
  
• Your index.html file will eventually become the initial page for a mini Web site.
  
  
• For now, put three <div> tags into the <section> tag that is already in the page.
  You should add these div tags under the <h3> tag that is at the top of the section.
  
  
• Now add a paragraph tag (<p>) to each <div> tag, and put some text into each paragraph. The text that you put in these paragraphs can be a brief description of the site that you will eventually build for this class, or it can be Greeking text, or even nonsense text, as long as it is not illegal, offensive, or defamatory in nature.
  
  
• Make sure that you close each of the <div> and <p> tags!
  
  
• You will make your mini Web site in subsequent assignments during the rest of the semester. Don't worry about that just yet, though.
  
  
• Validate your index.html page with the W3C's Validator page. I will also be validating your page, so this validation will be part of your grade.
  
  
• Upload your index.html file to your Freehostia (or other hosting service) Web site (which you got for the previous assignment). You can use the site's File Manager if it has one. Here are some important hints regarding Freehostia's File Manager:
  
  
  • When you log in to your Freehostia account, you will see a panel with the heading "Manage your sites / databases".
    
    
  • Click the "File Manager" icon/link.
    
    
  • This next step is MOST IMPORTANT, and failure to do this next step is the main reason that students fail to properly upload their pages: You must double-click the URL of your site in the "File Manager" display. This double-click is necessary because Freehostia has the capability of hosting up to five different web sites on one account, and you need to be in the proper/desired web site before you upload your files.
    
    You can check to make sure you are in the correct folder, by looking at the "Path:" information in the File Manager. It should show something like /www/giraffesaretall.xyz (or whatever your site's URL is, following the /www/).
    
    
  • After you have navigated to the correct site URL (see the above item), you will click on the big blue button that says "UPLOAD NEW FILE(S)".
    
    
  • Now click on the small white button that says "Add Files".
    
    
  • Locate and select the file(s) that you want to upload (which should be only index.html for this assignment) and then click "Open" (in most browsers).
    
    
  • Finally, click the large blue "Upload" button.
  
  
• You can see your page on the Web server by selecting the "Student Sites" link on the class site and then clicking your name in the bulleted list. Make sure you refresh/reload your page with F5 (or Ctrl+R) to see the new version of your page!
  
  You can also type your site's URL into the address bar of your browser!
  
  
• When you are all done with this assignment, make sure you back up your pages to multiple locations, such as
  • Dropbox
  • A jump drive
  • An external hard drive
  • iCloud
  • iDrive online
  • etc.