Creating and editing an html file, web page (Macintosh)

  1. Logon to your UNIX account.

    Logging onto your UNIX account (Macintosh).

    You log into your UNIX account each time you want to work on your web pages for the web page assignment.

  2. Double click the public_html directory to go into the public_html directory.

    This step places you in the main directory (public_html) that contains all of your web page files and directories.

  3. For this particular tutorial, you will create the About me web page. For lack of a better name, let's make aboutme.html the filename for this web page. In the Cyberduck window, click the Action drop-down arrow and select New File.... Type the name

    aboutme.html

    in the Create new file textbox. Then, click the Create button. The file aboutme.html should display in the Cyberduck window. Click (to select) the file aboutme.html. Then, click Edit. A window pops up allowing you to create and edit the aboutme.html file created in your public_html directory.

    A web site consists of one or more web pages. Each web page is stored as an html file. An html file has a filename with an html extension.

  4. Type into the aboutme.html file window the text found in the box below. Replace the words Type a paragraph here that describes something about you with a paragraph here that describes something about you. The text inside the box is the only text you are entering into the file aboutme.html, for now. Later on, you can edit this file to add additional text and html code as you see fit.

    
    <HTML>
    
    <HEAD>
    
    <TITLE>About Me.</TITLE>
    
    </HEAD>
    
    <BODY>
    
    <P>Type a paragraph here that describes something about 
    you.</P>
    
    </BODY>
    
    </HTML>
    
    

  5. Click File and then Save, or press Command + S, to save the file aboutme.html. Leave the aboutme.html file window open. You may need to edit the file later to correct any possible errors.

  6. Click (to select) the aboutme.html file in the Cyberduck window. Click the Action drop-down arrow to select info. Click Permissions to display the info for the aboutme.html file. Make sure that the Permissions info for your aboutme.html file match the Permissions info of the aboutme.html file in the image below. Close the Permissions window.

    This sets the proper permissions for the html file, to make it visible on the Internet. You only set these permissions once, when the file is initially created.

  7. Now, you will add a hyperlink to the About me web page in your index.html file. Click (to select) the index.html file in the Cyberduck window. Then, click Edit to open the index.html file window. Type in the following html code and text someplace between the <BODY> and </BODY> html tags in your index.html file, probably someplace below your name.

    <P><A HREF="aboutme.html">This is all about me!</A></P>

  8. Click File and then Save, or press Command + S, to save the file index.html. Leave the index.html file window open. You may need to edit the file later to correct any possible errors.

  9. Run your web browser to view your web pages.

    The web address of your main web page has the following format:

    http://cs12.cs.qc.cuny.edu/~"your UNIX account username"

    For example, if your UNIX account username is dojo5678, your web address is:

    http://cs12.cs.qc.cuny.edu/~dojo5678

  10. On your main web page, click on the link This is all about me! to view your About Me web page.

  11. If you encounter any errors with the About Me web page or the About Me hyperlink in the index.html file, double check the contents of the aboutme.html file window and the index.html file window. Make any corrections as necessary, save the files, reload your website, and try viewing the About Me web page again.

    Otherwise, close the aboutme.html and index.html file windows. Click the Disconnect button of the Cyberduck program window to logout out of your UNIX account and quit TextWrangler and Cyberduck if you are not going to continue working on your web page assignment.

Note: Executing the steps in this tutorial doesn't guarantee that you will have a working web page and working hyperlink to that web page. Remember, a typo at any step or text entered could produce an error that will prevent the web page or hyperlink from working.