Week 2

Week 2—Linking Your Pages

Learning Objectives

  • To learn to create a new web page and link it to your homepage
  • To start thinking about effective layout and typography
  • To learn to create various links

Notes
Paths and File Organization— A file’s path describes where a file is located within a website’s folder structure. You need to understand paths in order to organize and relocate files. When you build a website, even a small one, you can easily end up with hundreds of files. If you put all of your web files in one folder, without creating and using any sub-directories, you will end up with hundreds of files in just one place. If you know paths, you can effectively use subdirectories; put all images in an images folder, for example. File names are important. You should be able to recognize the contents of a file from its name tomorrow, a week, even a year from now. Think carefully. You can always rename files, but then you have to find and change every link to that renamed file.

Links—Links can be classified into two broad categories: internal/local links and external links. Internal links are those that link to your own files/pages. For example, if you have a file named “readings.html,” from your homepage, you can link directly to the file with the following code: <a href=“readings.html”>. The external links often refer to links to external websites. For example, if you want to include a link to CNN’s website, your code will look like this: <a href=“http://www.cnn.com>. In other words, for external links, you need to specify the complete path/url while for local links, you only need to specify the file name (and its folder name if it’s in a different folder).

These link methods apply to regular html editors, as you have learned from W3school tutorials. For WordPress in sites.gsu.edu, however, the way to create links is slightly different (see my instructions below). 

Assignments 

  1. Go to W3school’s HTML tutorial and go through the following sections:
    HTML Attributes
    HTML Headings
    HTML Paragraphs
    HTML Colors
    HTML Links
    HTML Lists
  2. Build a separate web page and name it “Reading Responses” in the title field. For instructions on how to create a new page, go back to my instructions for Day 1. For instructions on how to format this reading response page, go to my Projects page and follow the link to “Reading Responses.”
  3. Link your reading response page to your homepage. 
    1. On your homepage, highlight “Reading Responses.” In Text mode, click the “Link” button in the top horizontal menu (If you’re in the Visual mode, click on the chain link icon in the menu on top and then click on the options icon in the small pop-up window). You’ll now see a big pop-up window.
    2. From the pop-up window, simply select the correct file (at this point, if you haven’t created other files, your Reading Response should be the only file name there). Once the file is selected, a correct link path would automatically populate the URL field above.
    3. Click on “Add Link” located at the bottom right of the pop-up window. Now your link is created.
  4. Start reading Web Style Guide to get ready for your first reading response next week. 
  5. Continue thinking about what you plan to do for your final project.
  6. Go to Projects page and follow the link to the Tagline Analysis assignment. Read my instructions on this assignment and get started on it.