Post-quiz review
The numbers below refer to question numbers from the quiz and are accompanied by suggested review material from this web site or the course reading material.
- What HTML tag defines the parameters for an entire web page? The body tag is one of the few HTML tags that we need to know. We talked in class about Dreamweaver's Modify > Page Properties dialog box as a shortcut to setting up the <body> tag parameters for an entire web page. Also, we see this in the tag selector at the bottom of Dreamweaver's page view (this appears in all views: code, split, and design):
- When considering the concept of content+structure+presentation, it's important to realize that sites need to be built with content first, then add structure, then add presentation. Great presentations fail when there is no underlying content and structure.
» Check out this page from our course web site for more info.
- Designing "above the fold" is a safe bet for starting out and generally no one will challenge your designs for sticking to that rule. But, now that you understand that rule, you can start to contemplate when you might want to break it. Paddy Donnelly does a great job illustrating the value of tucking "the prize" on your page below the fold, as detailed on Life Below 600px. Proceed at your own risk!
- From the second reading, this statement is true. "Links should be clearly identified. If you do not want to underline them or make them blue, make sure they are visually different from surrounding content."
» Complete source.
- Review first reading, "Fact of life #1: We don’t read pages. We scan them... We’re thinking 'great literature' (or at least 'product brochure'), while the user’s reality is much closer to 'billboard going by at 60 miles an hour."
» Complete source.
- You've just designed a site the one shown in the top left corner. Your client doesn't like the white space around the page content and wants it to look like the one shown in the bottom right corner. What would you do to fix the page to the client's liking?
This is working on the idea that you always need to take control over the default settings, which appear as blank boxes in Dreamweaver's Properties tool bar.
Here's an exemplary answer: "In order to fix this issue, you would have to override the default settings that give a little bit of margin around the page. You would have to manually set the margin as 0 instead of leaving it blank (since blank in this case does not represent zero). Padding is the inner space of an element, and margin is the outer space of an element, and this white space is outside of the webpage's content. "
-
- Review file naming and management conventions, "Web page file names use the .html extension (for compatibility with UD's UNIX web server). A home page, i.e., the default page for a web directory, is named index.html on UD's UNIX web server." For example, the home page for this course is index.html. The file name appears after the final slash in the path name; everything preceding the final slash indicates the server name or a web directory name.
» Check out this page for more info.
- As we found in our class exercises, three situations may prevent images from appearing correctly online (you need only describe one to answer this question):
missing images files,
incorrect permissions, and images placed outside your web folder.
Since image files are not embedded within the HTML file, they are only linked to it, then the image files must be transferred separately and their relative location and their file name must remain the same as specified in the web page. Previewing the local file in your web browser may be misleading since files stored on your computer may be available for you to preview but they might not be available (uploaded) for others to view on your web page.
- From the first reading, "When we’re designing pages, we tend to assume that users will scan the page, consider all of the available options, and choose the best one. In reality, though, most of the time we don’t choose the best option—we choose the first reasonable option, a strategy known as satisficing."
» Complete source.
Here's a model answer:
"According to Krug, "satisfice" is used to describe most people's actions when browsing links on a web page. Instead of reading through all of the links on a given page and determining the best possible option, Krug's usability tests prove that we in fact choose the first option that seems likely to answer our question. He uses the example that a person looking for software may overlook the 'Software' link on a site and will instead click on the 'Cheap deals' link. Krug attributes this behavior to the fact that (unlike firemen) the penalty for choosing the wrong option is not high enough for us to spend the extra time to consider all of our link options."
- Dreamweaver site definitions have two primary categories and these correspond to the reason we always start our web site work by activating a Dreamweaver site definition: Local Info and Remote Info. Your Local Info may be different on different computers (or if you change from a memory stick to a hard drive); your remote info should be the same on whatever computer you are working on for that particular web site project.
- From the proximity web page on the course web site site: "A Gestalt principle of organization holding that (other things being equal) objects or events that are near to one another (in space or time) are perceived as belonging together as a unit."
» Check out this page for more info.
- From class discussion, document title appears in all of the following contexts except one (in other words, which one of these statements is false):
- True: The document title appears as the default name if a user saves a bookmark (or saves a favorite)
- True: The document title appears in the browser window title bar.
- False: The document title is not the same as the file name. You set the document title in the title box in Dreamweaver; you set the file name when you save the file (and name it something like webpage.html) in Dreamweaver.
- The document title appears as the linked text in search results.
- The document title appears as the default name when e-mailing a web page.
- Here's an exemplary answer about the avoidance of horizontal scrolling:
"We should emulate this design decision because web surfers are used to a certain standard. When users know what to expect on a website, their user experience on your site goes up, and they will spend more time on it. Because there are so many related websites on the Internet, practicing good usability (such as giving your site visitors a structure they are familiar with) is key. If your site's navigation or structure is unclear or unintuitive, users (and perhaps potential clients) will leave your site.."
In short, eliminating horizontal scrolling meets users expectations, which should be first and foremost before imposing any design ideas upon them. But, just like with "above the fold", now that you understand the rule, you can start to contemplate when you might want to break it. One successful exception to this rule is this site for Gucci.
Review the second reading, "Do the squint test and if your titles are not easily identifiable, take another look at your text hierarchy. Your titles should be strong." The Wired example shown here is from the course web site. Here's another example from a German site for Volkswagen where the structure can be easily discerned even if the language is not known. Structure conveys meaning and hierarchy.
» Complete source.
- Give one *specific* example of a default setting that you would choose to override with HTML properties or a CSS description. The next step in taking charge of CSS is to use one single external CSS file to describe the properites you want to impose across your entire project for this course. After that, you can develop your own library of styles that you choose from for different web projects.
- Describe four design characteristics of your web site, in terms of the web design language we have been developing in class and through the course web site.
In your answer, indicate whether or not your consider that design characteristic to be a strength or weakness of the site design and add sufficient detail to support your answer.
Most answers were clearly descriptive of the site being reviewed (and most reviews were very positive). One element that was lacking from most answers was a consideration of who the site was for, what was the target audience, what was the purpose of the site (what was it selling?), and how did the design decisions reflect the needs of the client and the goals for the site.
