Due

Obtain: Supplies, space on Geocities, e-mail account 
Publish: Index 

Meeting Place

We will meet this week in Dial 149.  Please bring two diskettes. 

Optional Workshop

For extra help learning to publish a Web page, please attend a workshop I will give on Wednesday, January 10, in Dial 149.  Bring two diskettes.

January 8-12, 2001

Welcome to ENG 371: English Grammar.  I'm looking forward to a fun and productive semester.  Since we will be creating online portfolios, we will begin this week with an introduction to the Internet and Web design.  On Monday, you will learn about the Internet's structure, as well as some basic graphic principles and will begin to design your own Web page. 

Before you come to class on Friday, please read the syllabus and the information below.  In particular, make sure that you can define each of the terms and are ready to meet the objectives.  During class, I will test your knowledge by having you publish your page with no help from me or your classmates.  Thus, you should make sure you understand the material covered in the reading below and in class so that you will be prepared.  If you would like some additional help before Friday's class, please attend my optional workshop from 10 to 11:30 a.m. on Wednesday, January 10, in Dial 149.  I will repeat this workshop on the following Wednesday for those unable to attend this week.

 

Objectives

By the time you finish this you unit, you should: 
  • understand directories, files, links, and other aspects of Internet structure;
  • have an e-mail account and know how to send and read messages;
  • have reserved space on the Geocities server;
  • know the meanings of the terms below.

Terms

  • browser
  • e-mail
  • file name
  • directory
  • Internet
  • Internet Service Provider (ISP)
  • link
  • server
  • title
  • Uniform Resource Locator (URL)
  • World Wide Web
  • World Wide Web page

Resources

The following Internet and print sources can help you with the concepts covered in this unit: 
  • Be Your Best: Computers offers an introduction to computers.
  • Netscape allows you to download its browser and Web-authoring software for free.
  • TechEncyclopedia provides definitions of more than 14,000 computer terms, including "search engine" and "portal."
  • UCIS, UNCP's computer office, can help you set up and use your e-mail account and obtain Internet access in your residence hall.
Updated January 6, 2001 
© Mark Canada, 2001 
mark.canada@uncp.edu

Internet Structure

Most Americans probably have heard of the Internet, but fewer actually know what it is and how it works.  In this unit, you will learn about the Internet's structure and begin to set up your own World Wide Web site.  While some of the concepts covered in this unit may seem foreign and perhaps even a little intimidating, stick with them until you understand them.  Once they become second-nature, as they will as you study and practice them, the rest of your semester--and indeed the rest of your life--will be much simpler. 

The Internet is an international network of computers connected by wires such as telephone lines. Schools, businesses, government offices, and many homes use the Internet to communicate with one another.  You have access to the Internet when you work in one of this university's computer labs.  You also may have access at home or in your residence hall.  If not, you can obtain access once you have three things.  First, you need a computer and a modem, a device that allows you to connect your computer with the Internet.  Many new computers have built-in modems.  Second, you need a browser, a piece of software that allows you to view information on the Internet.  Many new computers also come with a browser, usually Internet Explorer.  You also can download another popular browser, Netscape Navigator, from the Internet for free.  Finally, you need to subscribe to an Internet Service Provider, or ISP, such as America Online or Carolina Online. 

One popular component of the Internet is electronic mail, or e-mail, which people at separate locations can use to send messages to one another  In general, each of these people has an e-mail address, which usually looks something like this: mark.canada@uncp.edu. The first part of the address (.mark.canada) specifies the individual user, and the rest of the address refers to the server (uncp.edu), which is a computer that can store a lot of information. Many universities, such as the University of North Carolina at Pembroke, have servers, as do large corporations and Internet providers such as Carolina Online. When you send a message to someone on e-mail, your message goes through that person's server, where that person then can retrieve it. You should already have a UNCP e-mail account and address, which looks something like this: mac001@uncp.edu.  If you do not, call University Computing at 521-6260.  You also can obtain a free e-mail account from one of various Internet companies, such as Yahoo! and Excite

In addition to allowing people to send e-mail messages to one another, the Internet also allows organizations and individuals to post information about themselves so that others can see it.   For example, many companies post pictures and descriptions on World Wide Web sites.  In fact, you can set up your own World Wide Web site by reserving space on a server.  To understand how this process works, imagine that you wanted to store some articles you have written at a library so that people could come and read them.  First, you would need to obtain permission from the librarians, who would assign you a folder where they would store your articles.  Whenever you finished a new article, you would put a name on it and send it to the librarians, who would then place it in your folder.  When people wanted to read one of these articles, they would need to know the address of the library, the name of your folder, and the name of the specific article they want to read.  When they supplied this information, the librarian would give them the article they want. 

The World Wide Web works the same way.  First you need to identify an Internet company (librarian) and ask permission to save Web pages (articles) on its server (library).  The company (librarian) then assigns you a directory (folder) where it will store your Web pages (articles).  As you create each Web page (article), you give it a filename (name) and publish it on the server (send it to the library).  When people want to read your Web page (article), they need your Web address, sometimes called a Uniform Resource Locator, or URL.  The URL consists of the domain name of the server (address of the library), name of your directory (name of your folder), and the filename of the particular Web page (name of article).  The standard format for a URL looks like this: www.geocities.com/markcanada_uncp/index.html, in which each component stands for something different: 
 

  • www (World Wide Web)
  • geocities (name of institution that controls the server)
  • com (type of institution): "edu" for education, "com" for commercial, "org" for organization, and "gov" for government.
  • markcanada_uncp (directory)
  • index.html (filename): The filename usually ends in "htm" or "html"; it should have no more than eight characters and contain no capital letters, spaces, or punctuation marks.
The exercises in this unit and Web Design will take you step by step through the process of creating and publishing a Web page. 

Exercises

  1. Set up an e-mail account: If you do not already have an e-mail account, set one up by going through UCIS or a company such as Excite.
  2. Send me an e-mail message: Open your e-mail account and send me a message with the following statement: "I have read the syllabus for this course, and I understand that not following the instructions there may result in a poor grade for this course."  Make sure that your name appears at the bottom of the message. 
  3. Reserve Web Space on the Geocities Server: To reserve space where you can post your Web page, visit www.geocities.com.  If you already have a Yahoo! account, sign in and click on "Build Your Web Site!"  Complete the form that appears and click on "Submit."  If you do not have a Yahoo! account, follow the steps below. 
      1. Click on "Build Your Web Site!" 
      2. Click on "Sign me up!" 
      3. In the space labeled "Yahoo ID," type your name, underscore, and "uncp."  Example: markcanada_uncp 
      4. Type a password in the spaces provided.  Complete the rest of the form and click on "Submit this form." 
      5. If you receive a message saying that the Yahoo ID is taken, change the number and try again. 
      6. Complete the next form that appears.  Click on "Submit."
      7. Record the information about your user ID and URL in your notebook. 
 

Objectives

By the time you finish this you unit, you should: 
  • know how to use basic graphic principles to create an attractive and effective Web page;
  • be able to use Netscape Composer to create a Web page with headings, tables, colors, and links;
  • be able to publish a page on the Web;
  • know the meanings of the terms below.

Terms

  • bullet
  • display text
  • focal point 
  • link
  • point 
  • sans serif 
  • serif 
  • template 
  • typeface 
  • typography
  • Web-authoring software

Resources

The following Internet and print sources can help you with the concepts covered in this unit: 
  • Be Your Best: Internet Structure explains how to reserve space on the Geocities servier.
  • Netscape allows you to download its browser and Web-authoring software for free.
  • TechEncyclopedia provides definitions of more than 14,000 computer terms, including "search engine" and "portal."
Updated January 6, 2001 
© Mark Canada, 2001 
mark.canada@uncp.edu

Web Design

Anyone connected to the World Wide Web can not only read material on it, but publish his or her own Web pages.  While some people who write for the Web prefer to use a special code called hypertext markup language, or html, beginners probably will appreciate the ease of Web-authoring software, a product that makes what they write easily readable on the Web.  One such product is Netscape Composer, which you can download for free from the Netscape Web site (www.netscape.com).  As you will see when you do one of the exercises described below, creating a Web page is about as easy to creating a word-processing document and actually involves some of the same princples. 

Just as people with good ideas do not always know how to express them effectively, many people who publish material in print and on the Web do not make effective use of graphic and navigational elements.  In other words, their pages are hard to read and hard to use.  You can set yourself apart from the crowd if you learn a few basic principles of graphic design, particularly Web design. 

  • Focal points, such as relatively large photographs or headings give viewers' eyes someplace to go on a page.  In general, try to put one focal point at the top of each Web page.  If the focal point is a photograph of a person, make the person look toward the middle of the page, thus attracting the viewers' eyes to the heart of your material and not off the screen. 
  • Color, when used effectively, can make a page more appealing and can attract attention to particular elements.  Used carelessly, color can make a page hard to read.  Avoid overusing color and and make sure your text has adequate contrast with the background.  In other words, if the background is dark, use a light typeface on top of it.
  • Typography--in other words, the appearance of letters on a page or screen--has a significant impact on how viewers process information.  Indeed, experienced designers know how to manipulate typefaces--whole sets of letters, a through z, along with punctuation marks, designed to be used together in printing a body of text--to organize information, to convey different messages, or simply to appeal to the eye. Thus, while the letter "s" always has the same linguistic value, a designer may decide to print that "s"--along with the rest of the alphabet--in a particularly typeface, such as Times or Arial, because of the way that typeface makes the letters look on the page.  Most typefaces belong to one of two families.  One family has what are called serifs: tiny extra lines that appear on the corners of letters. A holdover from the days when scribes wrote out manuscripts, serifs facilitate reading by guiding the eye from letter to letter. Some of the most popular typefaces--including Times New Roman, Bembo, and Garamond--are serif fonts.  Serif fonts tend to work well for long stretches of text, such as the body of an essay.  Because of their history, they also have a traditional feel.  The second class of typefaces is called "sans serif"--Latin for "without serifs"--because these typefaces lack the extra lines on the corners of letters.  Sans serif typefaces, such as Arial and Helvetica, make for good display text, such as headings.  They have a more modern feel than serif typefaces.  Type comes in various sizes, generally measured in a unit called a point, which is roughly equivalent to 1/72nd of an inch.  Appropriate type sizes for body text range from 10 to 12 points.  Display text may be of various sizes, but usually is about 18 to 72 points. 
  • Similarity suggests connections.  In other words, if you have three roughly equal sections of you Web page, use the same typeface, size, and color for the heading of each section.
  • Bullets, graphic symbols used in front of items in a list, can help viewers to find and to process information.
  • Links--words or pictures that viewers can click to go somewhere else on the page or somewhere else on the Web--can help people navigate your Web site.  Your home page, or index, should contain a list of links to the other components of your site.
  • Templates are patterns that you can use to create several pages with the same basic design.  Some Web-authoring software products, including Netscape Composer, come with templates.  You also can make one of your own pages a template simply by making copies of it and changing the content in each copy while retaining the format.

Exercises

  1. Build a Web Page: The following instructions will take you through the steps of building a Web page in Netscape Composer:
    1. While you are still in Netscape Navigator, click on "Communicator" and then on "Composer." 
    2. Type some words--such as your name--at the top of the page and highlight them.  Using the icons in the toolbar at the top of the screen, experiment with changing the size, style, color, and placement of these words. 
    3. Before you go any further, you should save your page. Insert a diskette into the narrow slot on the computer, click on "File," and click on "Save As." When the dialog box appears, make sure that the computer is set for the "a" drive and type a name that contains no more than eight characters and contains no capital letters, no spaces, and no punctuation marks.  If you are creating the index page for your Web site, use "index.html" for the filename.  Click "OK." In the dialogue box that appears, type the full name of your Web page.  This time, you may use more than eight characters, as well as capital letters and spaces.  Click "OK." As you go through the following steps, remember to click every few minutes on the "Save" icon in the toolbar at the top of the screen. 
    4. To create a link to another site, toggle to Netscape Navigator by clicking on the icon that looks like a ship's wheel at the bottom of the screen. Using a search engine or a portal, locate a relevant, credible Web site on your topic. While you are looking at this site, click on the URL, or Web address, in the white box at the top. The URL should turn blue. Hold down the "Control" key and press the "c" key on the keyboard. Now toggle back to Netscape Composer by clicking on the icon that looks like a pen and blue triangle at the bottom of the screen. On your Web page, type the title of the site to which you are going to create a link. Highlight this title and click on "Link" at the top of the screen. In the dialogue box that appears, you will see your cursor blinking in a white box. Hold down the "Control" key and press the "v" key on your keyboard. You should see the URL you cut from Netscape Navigator appear in the white box. Click "OK." 
    5. To create a link to your e-mail address, type the address on your page and highlight it.  Click on "Link" in the toolbar at the top of the screen.  In the box that appears, type "mailto:" followed by your e-mail address--for example, I would type "mailto:mark.canada@uncp.edu"--and click "OK." 
    6. To make sure your link works, click on "Preview" at the top of the screen. Now place your arrow over the link so that the arrow turns into a pointing hand. Click. You now should see the site to which you created this link. To return to the Composer function so that you can work on you site some more, click on the Netscape Composer icon at the bottom of the screen. 
    7. To place a photograph you have taken with an ordinary camera on your Web page, you first need to scan the photo.  Here are directions for scanning a photograph in the UNCP Writing Center, courtesy of Writing Center Director Dean Hinnen: 
      1. Place photo in upper right-hand corner of scanner (next to green arrow), face-down. 
      2. Double-click on the PaintShop Pro icon. 
      3. Click on File. 
      4. Move arrow to Import, then to TWAIN, then to Acquire. 
      5. Click on Acquire. DeskScan program will activate and scanner will "preview" the image. 
      6. Click on Final. Scanner will make its "final" scan. 
      7. Click on the X in the upper right-hand corner of the DeskScan box to close DeskScan. 
      8. Edit image in Paint Shop Pro (optional). 
      9. Click on File. 
      10. Click on Save or Save As. 
      11. Change the file type to JPEG (.jpg extension). 
      12. Rename the file (optional, the default name is Image1.jpg). 
      13. Click on Save to save file. 
      14. Close PaintShop Pro. 
    8. To place your photo on you page, open the page in Netscape Composer, place your cursor where you want the image to appear, and click on "Image" in the toolbar at the top of the screen.  In the dialog box that appears, click on "Choose File..." and then find the photo you want.  Click "OK."  The image will appear on your page.  To adjust the size, place your cursor on the bottom-right-hand corner, click, and drag. 
    9. To alter other features of your page, such as the title and background color, click on "Format" at the top of the screen and then on "Page Colors and Properties." 
  1. Create a Web Page for All American: If you are taking a composition, literature, or linguistics course with me, one of your assignments is to write an article on American literature, history, or culture and submit it for possible publication on a Web site called All American.  For the sake of consistency, you must use a particular format.  The instructions below will help you conform to this format:
    1. Visit the sample page and study its appearance. Whenever you are unsure how your page should look, use this sample page as a model. 
    2. To create a red box at the top, click on "Table" in the toolbar at the top of the screen. In the dialogue box that appears, change the number of columns to 1, the border line width to 0, the cell spacing to 2, and the cell spacing to 4. Click on the gray box next to the word "Color"; in the pop-up menu that appears, click on the bright red box in the second column, third row. Click on "OK." 
    3. To create the white area and narrow blue box, place your cursor below the red box and press "Enter." Now click on "Table." This time, leave the number of columns at 2, but still change the border line width to 0, the cell spacing to 2, and the cell spacing to 4.  Click "OK." You should see two boxes; each of these boxes is a cell. Click in the cell on the left so that the cursor is blinking there. Place your arrow over this cell and click with the right mouse button. In the pop-up menu that appears, click on "Table Properties." In the dialogue box that appears, make sure that the tab labeled "Cell" is highlighted. Change the cell width to 30 percent. Click on the gray box next to "Color" and choose the lightest shade of blue, which appears in the first row, second-to-last column. Click "OK." Now you should see a a narrow blue box on the left and a wide white box on the right. 

    4. To fill in these boxes with text, simply click inside them and type. In the red box, type the name of the time period you are covering in your Web page: "Colonial America, 1607-1783" or "Antebellum and Civil War America, 1784-1865" or "Postbellum America, 1866-1913" or "Modern America, 1914-present." To change the color of this text to white, highlight it and click on the arrow on the right of the small black box in the toolbar next to the bold "A." In the pop-up menu that appears, click on the white box. While the text is still highlighted, click on the icon at the far right of the lowest toolbar at the top of the screen. In the pop-up menu that appears, click on the icon in the center. To fill the white box with text, click inside this box and type the information below, pressing "Enter" after each item. (You may want to type the words in brackets for now and then later, after you have done some of your research, highlight each line and type the appropriate information.) After you have typed the words, highlight the first line and click on the arrow to the right of the word "Normal" at the far left of the lowest toolbar at the top of the screen; click on "Heading 1." Referring to the labels in red below, change the size of each line of text. If the label is in italics, change the text to italics by highlighting it and clicking on the italic "A" in the toolbar. If the label is in bold, change the text to italics by highlighting it and clicking on the bold "A" in the toolbar. 
[Subject] Heading 1 
By [Your Name] Normal 
Student, University of North Carolina at Pembroke Normal 
[Essay] Normal 
Exercise Heading 1 
[Exercise]
    1. To fill in the blue box with text, left click somewhere inside the box. Type the information below, again referring the labels in red for details on format. To create a bulleted list, highlight the items you want to be bulleted and click on the eighth icon from the left in the lowest toolbar at the top of the screen. Again, see one of the sample pages for help. 
    All American Normal 
    Terms Heading 3 
    [list of terms] Normal in bulleted list 
    Resources Heading 3 
    [list of resources] 
    Updated [today's date] Normal 
    After you have input all of the information above, highlight all of the words in the left box and change it to Arial typeface.  Highlight "All American" and click on the "Link" icon.  In the space provided, type the following URL:
    http://www.uncp.edu/home/canada/work/allam/allam.htm
  1. Publish a Web Page on Geocities: The instructions below will take you through the steps of publishing your Web page on the Geocities server.  Before you attempt to follow these instructions, you should have reserved space on the Geocities server.
    1. Open your Web page--for example, your online resume or literature portfolio--in Netscape Composer.  When you are ready to post it on the Web, click on "Publish" in the toolbar at the top of the screen. 
    2. Fill in the blanks with the requested information and click OK.  In the following example, I have used my user name (markcanada_uncp); you should plug in your user name instead: 
      1. Page title: Mark Canada's literature portfolio (or resume) 
      2. HTML Filename: lit.html (or resume.html) 
      3. HTML or FTP location to publish to: ftp://ftp.geocities.com/markcanada_uncp
      4. User name: markcanada_uncp 
      5. Password 
    3. You may receive a message that begins: "Could not post the file /C|/windows . . ."  Click "OK." 
    4. Return to Netscape Navigator and click on "Reload."  Type in the URL for your Web page and press return.  You should see the personal page you created.  Once you have posted your resume or literature portfolio, you should be able to click on the link you created and go directly to it.  If the link fails, check the address.  You may have made a mistake when typing the URL for the link.