How To: Design A Web Page

You may find this Web Style Guide helpful in thinking through the design of your pages. Also, here is a site with some helpful hints on good and bad web design practices. Including:

Text

Background does not interrupt the text

Text is big enough to read, but not too big

The hierarchy of information is perfectly clear

Columns of text are narrower than in a book to make reading easier on the screen

 

Navigation

Navigation buttons and bars are easy to understand and use

Navigation is consistent throughout web site

Navigation buttons and bars provide the visitor with a clue as to where they are, what page of the site they are currently on

Frames, if used, are not obtrusive

A large site has an index or site map

 

Links

Link colors coordinate with page colors

Links are underlined so they are instantly clear to the visitor

 

Graphics

Buttons are not big and dorky

Every graphic has an alt label

Every graphic link has a matching text link

Graphics and backgrounds use browser-safe colors

Animated graphics turn off by themselves

 

General Design

Pages download quickly

First page and home page fit into 800 x 600 pixel space

All of the other pages have the immediate visual impact within 800 x 600 pixels

Good use of graphic elements (photos, subheads, pull quotes) to break up large areas of text

Every web page in the site looks like it belongs to the same site; there are repetitive elements that carry throughout the pages

How To: Create A Web Page

Here is some information from our ASU Webmaster on how to publish web pages using your student email account.

Dreamweaver is available on ASU lab computers and will do everything you need and more. If you've used Dreamweaver in the past you may certainly continue using it for this class. However, if you are new to web page authoring, I recommend using Contribute. This program is Dreamweaver-Lite and is less dizzying to use than Dreamweaver.

Contribute can be found on ASU lab computers under the COEducation list of applications.

Open Contribute and do this:

1. Click the "Website Connection" link in the middle of the window.
2. Click "Continue" on the welcome screen. 
3. Connect to: Website
   URL of Website: http://www.appstate.edu/~yourusername
   Click "Continue"
4. Connect to web server: Secure FTP (SFTP)
   Name of SFTP server: www.appstate.edu
   SFTP user name: yourusername
   SFTP password: yourpassword
   Click "Continue"
5. Type your name and email. Click "Continue"
6. Role assigned to: Administrator
   Click "Continue"
7. Click "Finish"

You are now ready to start creating, editing, and publishing web pages on the ASU server. If you get a permission denied message, or a 404 not found message, don't panic. This just means you haven't created any pages on your site yet.

1. Click the "New" button at the top left.
2. Select "Blank Web Page"
   Page title: "w00t"
   Click "OK"
3. Type w00t on your blank page. (Play with font sizes and colors if you like).
4. Click the "Publish" button at the top left of the window.
5. Click yes on the warning box asking if you want to publish it without any links.
6. Filename: w00t.html
   Click "Publish"
7. Now open FireFox and browse this web page: www.appstate.edu/~yourusername/w00t.html
   

Congratulations! You have now published your own web page and you are now live on teh interwebs. w00t!

The next time you open Contribute, you may need to go through the set up procedure again. Also, the next time you use Contribute, the button at the top left may say "Connect." Click it. You can navigate around your site until you reach a page you want to work on, then click "Edit Page." Or you can always click on "New" to create a new page on your site. You can have as many pages as you like. Just make sure each page has a unique filename that uses only letters and numbers without any spaces or special characters.

For more information on using Contribute, here is an online tutorial.

Now you just need to practice. For next class, your homework is to create and publish the ugliest web page possible. For inspiration, you can visit the World's Worst Website. Here's an ugly page by a previous student. I think you can do worse though. Appall us.

Post a link on your class blog to your Ugly Website.

Express Yourself

Go read and comment on at least three of your classmates' blog essays. Try to spread around the comments. If someone already has four or five comments, go look for another essay with fewer. Try to make your comments specific, with an eye towards giving feedback that will help when the author sits down to revise his or her essay. If you like something, tell them what you like about it. If you don't like something, tell them why and try to make specific suggestions on ways to improve it.

Remember, the goal for any piece of writing is to be interesting and informative. There are many ways to accomplish this goal. There are even more ways to miss the mark. Not everything well written says things that are important, and not everything that's important is well written and engaging. Every piece of writing can be improved. Your job is to help that happen. Put time and thought into the feedback you leave. 

Read back over the writing advice I posted for you. Think about what the essays you are reading are trying to say. Do they have a point? How well do they succeed at making that point?

Every piece of writing must have a plan, a purpose, and a central point. Before you begin to write, therefore, you should take time to work out the argument of your paper as well as the arrangement of its several parts. You should, in other words, think hard in order to avoid merely collecting sentences that add up to an aimless ramble in the vicinity of an ill-defined idea.

Any piece of writing that begins with “Webster’s Dictionary defines …” or “In this tormented age in which we have the misfortune to live …” is likely to be so boring that the reader will never finish it.

Here are a couple of examples to help get you started thinking about writing. Take a look at these two opening sentences:

Example 1: In my younger years, I was a computer serial killer. 

Example 2: The Internet is defined by the Merriam-Webster dictionary as “an electronic communications network that connects computer networks and organizational computer facilities around the world”. 

Which one makes you want to read further? Which one helps "provoke interest, focus your reader’s attention, and not induce sleep?"

Finally, leave some feedback for yourself. After reading and commenting on your classmates' essays, what ways do you see to change and improve your own writing. Leave a comment for yourself on your own essay.

You should post all of your comments by midnight, Sunday 9/19.

Extra Office Hours

If you need help with the first writing assignment, I will be holding extra office hours Monday 9/13 from 9:00-11:00 am in the Wired Scholar Coffee shop in Belk Library. Feel free to drop by.

A Letter From Our Provost

By the end of the semester, we will talking a great deal about the legal issues surrounding copyright and the Internet. In meantime, here's a small taste of how these difficulties are currently making themselves felt. This is an email from the Provost circulated today to all ASU faculty.

Colleagues,

This communication addresses recent misinformation and miscommunication regarding the Red Lambda-Integrity software implementation.  The federal Higher Education Opportunity Act of 2008 outlines what universities must do with regards to combating inappropriate peer-to-peer (p2p) use and potential copyright infringement.  Information Technology Services (ITS) and other campus units have been openly working on a response to these requirements over the last two years.  Appropriate passages of the federal legislation appear at the end of this message.

Universities are required to take the three-pronged approach to stay in compliance with this legislation which took effect in July 2010:

(1)    Increase our educational efforts with regards to the Digital Millennium Copyright Act and copyright issues
(2)    Use a variety of technology deterrents to prevent copyright infringement
(3)    Suggest legal alternatives

ITS has been doing due diligence to address this legislation in all three areas.  During 2008-2009, it conducted a software demonstration project and communicated extensively with campus constituencies, including visits to the Faculty Senate, Deans’ Council, Arts & Sciences Council, Student Development, and members of Student Government Association.  It then implemented the Red Lambda software this summer in order to have the technological deterrent in place as required by statute.

The Red Lambda-Integrity software was selected as it only looks for known peer-to-peer (p2p) applications like Limewire and Bit Torrent.  While there are some legitimate uses for p2p software, these applications are widely used for downloading and sharing music and other media files which are potentially in violation of copyright.  This software is not engineered to look at file contents, and Information Technology Services does NOT look at file contents being transmitted.  This software has only been used as an educational opportunity to inform our user population of the potential problems with p2p use and copyright issues.

It is important to understand that copyright infringement through illegal downloading can result in substantial fines for individuals.  By deterring illegitimate use of p2p software, the University is not only fulfilling its legal obligations, but it is also helping individuals cease questionable activities before such activities result in potentially costly legal action against them.

Furthermore, the reference to Title IV in the legislation implicates the University's eligibility to receive federal financial aid for its students.  Loss of federal financial eligibility would be extremely detrimental to our students, parents and the entire institution. 

Because concerns have arisen, and because questionable p2p use is overwhelmingly a student computing issue (99%), ITS turned off the Red Lambda software for the faculty/staff computing side of the network on September 3, 2010.  It is important to understand what “turning off” Red Lambda means.  Red Lambda is NOT a piece of software that resides in individual computers.  Red Lambda has NOT been installed on individual computers.  It operates by scanning specified ranges of IP addresses.  So, turning off Red Lambda for faculty and staff means that IP addresses for faculty/staff computers have been removed from the “list” of IP addresses that Red Lambda is instructed to scan.

Excerpt from the Federal Register:

“The final regulations require an institution, as a condition of participation in a Title IV, HEA program, to agree that it has developed and implemented plans to effectively combat the unauthorized distribution of copyrighted material by users of the institution’s network without unduly interfering with the educational and research use of the network.

An institution’s plan must include:

• The use of one or more technology-based deterrents
• Mechanisms for educating and informing its community about appropriate versus inappropriate use of copyrighted material
• Procedures for handling unauthorized distribution of copyrighted material, including disciplinary procedures
• Procedures for periodically reviewing the effectiveness of the plan   

The final regulations make clear that no particular technology measures are favored or required for inclusion in an institution’s plans, and each institution retains the authority to determine what its particular plans for compliance will be, including those that prohibit content monitoring.  The final regulations require an institution, in consultation with the chief technology officer or other designated officer of the institution, to the extent practicable, offer legal alternatives to illegal downloading or otherwise acquiring copyrighted material, as determined by the institution. The final regulations also require that institutions
(1) periodically review the legal alternatives for downloading or otherwise acquiring copyrighted material and (2) make the results of the review available to their students through a Web site and/or other means.”

Source:  Federal Register, pp 55925-55926

Blog Highlights

Here are a few links from last week's blog homework that caught my eye. Check them out. And feel free to add links to other noteworthy blog posts either here as a comment or as a post on your own blogs.

Via Nick:



Infuriating Yosef via Dantz:

Via Stephen:

Extra Office Hours

I'll be in my office on Friday morning (9/10) from 9:00-11:00 for some extra office hours. Feel free to stop by if have any questions about the writing assignment.

Tweak Your Blog

By midnight Sunday 9/12, make the following small additions and changes to your class blog:

1. If you haven't already, delete the "Followers" gadget from the sidebar of your blog. Most of us aren't going to have a significant number of followers, so why waste good page space on it.

2. Add a "Link List" gadget to your sidebar with a link back to the Class Blogs section of our online syllabus. the url is:

http://www.appstate.edu/~stanovskydj/internet.html#resources

and your link should look like this:

Class Blogs

Virtual Fire

A cozy roaring fire?

How To: Write

Even in this digital age, the venerable Elements of Style (1918) by William Strunk is still your friend. When in doubt, defer to Strunk's judgments on style. It will improve your writing. 

Below are some writing tips from a writer’s guide prepared by members of the English faculty at St. Lawrence University. Please work hard at avoiding these common pitfalls. Again, it will improve your writing: 

Too many students think of a writing assignment as something to “get out of the way” rather than an opportunity to express their consecutive thoughts about a subject assigned or chosen. They may spend hours assembling material and more hours filling up pages; and, having worked hard, they are understandably disappointed when they learn that their efforts have earned at best a mediocre grade and the comment “So What!”

Every piece of writing must have a plan, a purpose, and a central point. Before you begin to write, therefore, you should take time to work out the argument of your paper as well as the arrangement of its several parts. You should, in other words, think hard in order to avoid merely collecting sentences that add up to an aimless ramble in the vicinity of an ill-defined idea.

In expository or persuasive writing (of the sort most often required) you should be able to state the main idea of your paper in one or two sentences, called the thesis statement. Here are four effective examples, some of them from published essays.

“The distinctive traits associated with the American people today stem at least partly from the frontier experience of our ancestors.” — Ray Allen Billington

The short-sighted self-satisfaction of the Houyhnhnms, Gulliver’s misguided reactions to the noble Captain Pedro de Mendez, and Gulliver’s own unacknowledged pride at the end of his voyages – all suggest that Swift does not share his main character’s admiration of the community of horses.

“The battle between the tarantula spider and its arch-enemy, the digger wasp of the genus Pepsis, is a classic example of what looks like intelligence pitted against instinct – a strange situation in which the victim, though fully able to defend itself, submits unwittingly to its own destruction.” — Alexander Petrunkevitch

“Although peasant societies share many similarities, it is possible to assign such societies to one of three categories based on political and economic variables.” — Hamilton College Guide

 Although it is always best to write with a thesis clearly in mind, specific statements of this sort need not always appear verbatim your paper. Indeed in some cases they probably should not, since they can be rather mechanical, an extreme version being, “In this paper I am going to discuss three reasons why General Lee failed at Gettysburg.” A thesis statement, however, will help you to focus your attention on a particular topic, to avoid mere summary, and to clarify the overall organization of your essay. In the samples above, the first writer will probably identify a few uniquely American character traits caused by out frontier experience. The second suggests a division of reasons showing the extent to which Gulliver is an unreliable narrator in Book IV of Gulliver’s Travels. The third will probably illustrate and define modes of intelligent and instinctive animal behavior. And the fourth will classify three similar though different cultures.

Some writers are heavy-handed in organizing their thoughts. They begin by explicitly stating what they are going to say, they then say it (with illustrations along the way), and they conclude by briefly summarizing what they have just said – with a bang on the desk for emphasis. Such writing may have an organization of a sort, with everything laid out – embalmed – in the introduction, but it is often uninteresting to read, anti-climactic, and dull. A better organizational scheme often involves a question that is subsequently answered, or a problem followed by possible solutions and a resolution by the end.

Two suggestions: (1) With your thesis in mind, write the body of your paper first; then go back to the beginning and compose one or two paragraphs that will provoke interest, focus your reader’s attention, and not induce sleep. Any piece of writing that begins with “Webster’s Dictionary defines …” or “In this tormented age in which we have the misfortune to live …” is likely to be so boring that the reader will never finish it. (2) Save the best until last and try to make your conclusion actually conclusive without overstating your case. Some papers merely stop, all fagged out at 2 in the morning; at the other extreme are those ending with “Obviously …” or “Thus it can clearly be seen …” – expressions that often raise doubts in the reader’s mind. Think rather of ending with a final, vivid illustration of your thesis, an example that brings together the several threads of your argument; or restate (do not repeat) your thesis; or while being careful not to introduce completely new material, give your thesis a slightly broader application.

Finally, here are a few gentle reminders on writing mechanics:

1. Avoid mispelling.

2. Also using sentence fragments. And incomplete sentences.

3. A preposition is not a good word to end a sentence with.

4. Try not to unnecessarily split infinitives.

5. One of the mistakes that is frequently made are verb and subject disagreement in number.

6. And do not begin sentences with a conjunction.

7. Don't use contractions in formal writing.

8. Avoid run-on sentences punctuate sentences properly break them up.

9. Use the write word, not just the won your computer says is rite.

Blog Homework

By midnight Wednesday, 9/8 post any one of the following to your blog:

1. Write a brief post about something related to the Bush or Hawthorne reading.

2. Write a brief post about something related to the Bruce Sterling reading.

3. Write a brief post about something from Hobbes' Internet Timeline.

4. Post a link for us to a recent news story dealing with the Internet. Include a brief quote or explanation for us.

5. Embed a video in a blog post. Find a video on youtube, hulu or some other site that you think might be relevant to the class and embed it in a blog post so that it will play on your blog. Write us a brief description to help explain the relevance of the video.

6. Create and post an original image macro for us (like lolcats or Joseph Ducreux). You can use a picture of your own, or some already well know internet image. There are many sites that can help you create an image macro such as meme generator, big huge labs, or roflbot.

7. Write a possible prompt for a future blog homework assignment. That is, what do you think might make an interesting topic for an Internet Studies blog post?