metromemetics

New Media Design Midterm Study Guide

This study guide was written in the fall of 2000 for a journalism course taught by former UW-Oshkosh adjunct faculty member Matthew Stanton. Technology-based updates are listed in the footnotes. Textbook references are to Web Design in a Nutshell by Jennifer Niederst (Amazon | B&N.com) and Designing Web Usability: The Practice of Simplicity by Jakob Nielsen (Amazon | B&N.com).


INSTRUCTIONS: Write your name and student ID number on all exam pages. Keep your answers as brief as possible; there is no extra credit for long answers, and you will lose credit for leaving other answers blank. Triple-credit questions are listed first, followed by double credit questions and finally single credit questions. The total value of all these questions equals 15% of your final grade in this course.


TRIPLE CREDIT QUESTION

Briefly list three strengths of "old media" (printed newspapers, broadcast television, radio, etc.)

  • Most Americans know how to use it.
  • It's cheap or usually free.
  • It's been tried and tested for decades.
  • It's accessible almost anywhere.
  • It follows consistent design standards.

(class lecture)

Briefly list three weaknesses of "old media" (printed newspapers, broadcast television, radio, etc.)

  • High overhead requiring sizable capital investment.
  • Large groups of people producing and distributing content.
  • Print is relatively slow to respond to consumers.
  • Reliance on advertising or government support to fund operations (cost charged to consumer often does not cover production costs; for example, a typical newspaper's revenue is 85% advertising, 15% circulation).

(class lecture)

Briefly list three strengths of "new media" (Web sites, e-mail, CD-ROMs, etc.)

  • Rapid development time.
  • Immediacy.
  • Interactivity between user-to-suppliers and user-to-user.
  • Universal portability via the Internet.
  • Easy entry to mediums (look at Matt Drudge's one-man media frenzy during the Clinton sex scandals).
  • Low costs of distribution.
  • Unique targeting of content (personalization on both ends of the media exchange).

(class lecture)

Briefly list three weaknesses of "new media" (Web sites, e-mail, CD-ROMs, etc.)

  • Lack of standards (platforms, protocols, user equipment, local infrastructure).
  • The digital divide (it typically costs $1,500 a year to keep a household "wired" to the Internet).
  • Lack of trained gatekeepers managing information (leads to low credibility compared to print).
  • Lack of an experienced workforce (people still busy trying to figure out the "best way" to use the medium).

(class lecture)

What does Jakob Nielsen's HOMERUN acronym stand for?

  • High-quality content.
  • Often updated.
  • Minimal download time.
  • Ease of use.
  • Relevant to user's needs.
  • Unique to the online medium.
  • Net-centric corporate culture.

(class lecture; Nielsen 380-382)

DOUBLE CREDIT QUESTIONS

Generally speaking, which "new media" format gets used the most by Americans?

  • E-mail.

(class lecture)

List at least three commonly supported fonts which are relatively safe to set on Web pages.

  • Arial/Helvetica.
  • New Times Roman/Times.
  • Courier New/Courier.
  • Verdana.
  • Georgia.

(class lecture)

Give an example of how you would name the file for a HTML page you were about to post on the Web.

  • something.htm, something.html (no spaces allowed, no special characters).

(class lecture)

What resolution is used for Web images? (See footnote 1 about 96 dpi.)

  • 72 dpi (or 72 lpi, lines per inch).

(class lecture; Niederst, 35)

As a rough rule of thumb, how fast do images download for 28.8 dial-up modem users?

  • 2 kilobytes per second.

(class lecture)

NORMAL CREDIT QUESTIONS

Who invented the World Wide Web?

  • Tim Berners-Lee.

(class lecture)

When was the World Wide Web created?

  • 1990 (1989 also acceptable).

(class lecture)

What Web innovation did Wisconsin-native Marc Andreesen create?

  • Mosaic and Netscape Web browsers.

(class lecture)

The idea that increasing the number of transistors built on a piece of silicon allows new computers to double in power every 18 months is commonly known as...

  • Moore's Law.

(class lecture)

What is the minimum HTML markup needed for a valid Web page? (See footnote 2 about DTDs.)

  • <html><body>
    Something
    </body></html>

(class lecture)

List examples of HTML structure tags.

  • <html></html>,<title></title>,<head></head>,<body></body>

(class lecture)

List examples of HTML presentation tags. (See footnote 3 about XHTML and CSS.)

  • <font face="arial>,<font color="blue"></font>, <b></b>,<hr>

(class lecture)

What is the <tr> tag used for?

  • Creating HTML table rows.

(class lecture)

The <IFRAME> tag works in which Web browser(s)? (See footnote 4 about Web browsers.)

  • Microsoft Internet Explorer.

(class lecture; Niederst, 219)

What Web-friendly image format is best used for line-art logos?

  • GIF (or PNG)

(class lecture; Niederst, Chapter 14)

What is the trade-off for making files smaller using the GIF image format?

  • Limited number of colors used in the image (aka fixed color palette).

(class lecture; Niederst, Chapter 14)

What Web-friendly image format is best used for photographs?

  • JPEG

(class lecture; Niederst, Chapter 15)

What is the trade-off for making files smaller using the JPEG image format?

  • Loss of image quality, grainy or blurry, sometimes with pixel "artifacts" from compression.

(class lecture; Niederst, Chapter 15)

What is the difference between bitmap-based images and vector-based images?

  • Bitmapped images track pixels and are limited to their original resolution size. Vector images track lines and shapes and can scale proportionally, drawing in cleanly regardless of size.

(class lecture)

What is special about the so-called "Web-safe" colors?

  • The will usually stay more consistent across Web browsers regardless of the user's platform.

(class lecture)

What is anti-aliasing?

  • Alternating colored pixels along the edge of two areas of solid color, in effect blurring the edge to make it appear sharper in low-resolution.

(class lecture; Niederst, 270)

What is dithering?

  • Alternating colored pixels in low-resolution to simulate a different color; often used to alternate two Web-safe colors to create a non-Web-safe color - for example, pixels of red and white used to build pink.

(class lecture; Niederst, 279)

How long will the average American user wait for a Web page to load before giving up?

  • Between 5 to 8 seconds.

(class lecture; Nielsen, 43)

Which moves data faster, a T1 line or a dial-up modem connection?

  • T1 (50 times faster than dial-up)

(class lecture; Nielsen, 48)

What causes an off-color "halo" effect around partially transparent GIF images used on a Web page?

  • Image was designed to be used transparently over a different background color.

(class lecture; Niederst, 269)

What is information architecture?

  • Organizing content, especially organizing into classifications, and creating a labeling system for users to follow to search and retrieve such content.

(class lecture)

What is the importance of organizing content on a Web site?

  • Users have vast choices of where to get information online and they will use the faster and easiest source.

(class lecture)

Ideally, how many options should a user have at each point of decision? (See footnote 5 about this "seven choices" ideal.)

  • Seven plus or minus two; 5 to 9

(class lecture)

According to Nielsen, what is the best color to use for hypertext links? (Specifically, unvisited links, those which site visitors have not yet clicked on.)

  • Blue.

(class lecture, Nielsen, 68)

How do most commercial content/news Web sites generate gross revenue?

  • Advertising sales.

(class lecture)

As books are indexed in a library according to the Dewey Decimal system, how are documents on the Web indexed?

  • Search engines and metatags/titles.

(class lecture)

Name three formats commonly used for animation on the Web.

  • Animated GIFs, Shockwave/Flash, Quicktime. (Also acceptable: Shockwave/Director, Real streaming video, WindowsMedia video.)

(class lecture)

What is tweening?

  • Creating transition frames of animation between two keyframes or anchor images in an animation.

(class lecture)

What was the most common monitor size used by American computer users at the end of 2000? (The "common on laptops" size mentioned in the Web Design book.)

  • 800x600 pixels

(Niederst, 15; Nielsen, 28)

What does the ALT tag do in HTML image calls?

  • Provides alternative text seen before the image loads and/or when the user mouses over the image.

(Niederst, 25)

What three colors of light are used to project images in computer monitors?

  • Red, green and blue (RGB)

(class lecture; Niederst, 29)

In English, what color is defined by the hex code #FF0000?

  • Red.

(class lecture)

Give an example of a fixed width font.

  • Courier, New Courier, or Monoco

(Niederst, 42)

Give an example of a proportional width font.

  • Helvetica, Arial, Times, New Times Roman, Verdana or Georgia.

(Niederst, 42)

Name three personal computer operating systems.

  • DOS (MS-DOS); Windows 95/98/ME; Windows NT/2000; Unix/Linux; Macintosh.

(class lecture)

What sort of file is sunrise.wav?

  • Waveform, audio, or sound file.

(Niederst, 63; Niederst, 336)

What would the following line of HTML look like when viewed in a Web browser: <!-- <b>Hello there!</b> -->

  • Nothing - it would be commented out, hidden from view.

(Niederst, 73)

What is a FTP program used for?

  • File transfer protocol, moving files from a local computer to a remote computer, like when you post HTML documents from your PC to a Web server.

(class lecture; Niederst, 58)

Briefly describe how writing for print and writing for the Web differ.

  • Web content should be shorter, plainer, meant to be scanned, more concise, harder to read.

(Nielsen, 100)

List three good reasons to use animation on a Web page.

  • Show continuity in transitions (step A leads to step B).
  • Indicate dimensionality in transitions (show direction with movement).
  • Illustrate change over time.
  • Multiplex the display (show lots of information in a small space by hiding info until needed, like popups).
  • Enrich graphical representations (show, don't tell).
  • Visualize three-dimentional structures (rotate 2D point-of-view).
  • Attract attention ("Hey, that's cool!").

(Nielsen, 143)

What nation boasts the most Web users? (See footnote 6 about data's source.)

  • America.

(class lecture)

What are the benefits of personalizing content on a Web site to individual site visitors? (See footnote 7 about data's source.)

  • Increases page views 3- to 6-times.
  • Users stay on the site before leaving 3- to 5-time longer.
  • Makes sites easier for most users to use.
  • Draws them back to see "their" content.

(class lecture)

What do cookies do? (The Web version, not the snack food.)

  • Leave information on a Web user's hard drive/browser which can be read by scripts on a Web site when that user returns later on or goes to another site set to read the same sort of cookie information.

(class lecture)

What is an ad clickthough?

  • The rate at which viewers actually click on ad banners and go to the advertiser's site; expressed as a percentage of number of times the ad is served/viewed (impressions) versus number of times action occurs (clicking); from 1% to 3% is considered a good number.

(class lecture)

A file listed on a hard drive as 23,401 bytes in size is how big in terms of kilobytes?

  • 23.4 k

(class lecture)


Footnotes

These footnotes were written February 2004 by Stanton to explain changes in technology since fall of 2000.

1. Monitor displays with Microsoft Windows had not yet adopted 96 dpi screen resolution as a standard.    (^ back)

2. Popular Web browsers in 2000 generally did not follow the W3C requirement for reading document-type definitions.    (^ back)

3. Practical support for cascading stylesheets in 2000 was poor. Today such a course would focus on XHTML friendly and CSS based markup.    (^ back)

4. Microsoft Internet Explorer 5.5, Netscape Communicator 4.7, Opera 4.0 and AOL 6.0 were state-of-the-art around fall 2000; beta versions of Mozilla and Netscape 7.0 also were around.    (^ back)

5. The "ideal" of seven choises came from Information Architecture for the World Wide Web by Louis Rosenfeld and Peter Morville (Amazon | B&N.com).    (^ back)

6. According to mid-2000 traffic data reported in various industry press; the "World" Wide Web has since become more diverse.    (^ back)

7. According to MyWay.com, a company which - not coincidentally - sold user-customized Web portal services in 2000.    (^ back)