ART 215 Web Design Blog - Rita Howe: May 2012

Critical Analysis of a Web Page:

Use 30 Art, Design, or Web Publishing terms to describe as analytical analysis as to the

effectiveness of this webpage. (www.mayo.com) Describe in a list format sentence describe how

the terms were used and be specific where the terms are used?

Universal Usability - a qualitative measure of the experience of using a tool and phenomenon that can be measured and quantified as a concrete mean to judge the website's design effectiveness. It is simply a matter of clicking on the global navigation tool to obtain the information implied.
Content Inventories - detailed listing of basic information about all of the contents that exists in the site. The information covers the basics of the products advertized.
Hierarchies – is a way to order information on website by using color, font, and content. The color of the navigation is white but when a link is selected it changes color to indicate what the user wants to read. The size of the font is used to differentiate areas of the web page content.
Site Structure - determines how well sites work in the broader context of the web. The underlying web pages read well on this website.
Semantic Content Markup – the purpose is to convey meaning and content structure. The website conveys meaning through its content.
Golden Triangle - this is an area of a web page beginning in the upper left corner, across the top of the page, and then back to the left side below the upper corner. This is the way the eye travels across the web page. This website uses the GT on most of it pages.
Social Media – these are entities that bring people together to share experiences on shared topics. This website uses Facebook to bring together people who like the product on this website.
Search Engines – tools to browse the internet for information. The keyword Mayo when searched on the internet does not bring up this website. The links and web pages do not appear to be formatted to optimize a search of the website. The word mayonnaise does bring up the website fairly high in the search.
Site Map – a web page that lists keywords and topics related to the product and that can be utilized by searches. This website has a site map.
Page Structure – makes sites uniform and predictable. This website uses page structure in numerous ways. Zoning is utilized in the layout.
Breadcrumbs – is navigation device that shows the user where in the website they are located. This website uses a small, two word breadcrumb navigation.
Search – in addition to external search engines some websites use searches that search only the website locally. This website does not have a search feature.
Home – this is the website first seen by the user. Standardization of web pages usually has a navigation containing the word home, logo, and a tag line that are linked to the home page. This website utilizes all three of these features.
Internal Web Pages – these are the web pages not considered the home page. These pages vary from the home page but generally follow the same layout and navigation. This website follows the home page quite closely with the exception of the middle content area.
Tag Line – a statement usually found on the home page that explains what you do and what you have to offer. The tag line for this website is “Real Tastes Better,” meaning the product is real and offers good taste.
Drop Down Menus – this feature works in tandem with the navigation menu whereby clicking on the topic a list appears by dropping down. This website does not utilize drop down menus.
Uniform Connectedness – refers to relations of elements that are defined by enclosing elements within other elements, regions, or discrete areas of the page. This website uses the header to enclose elements of content into regions on the web page. It is done with font, color, and layout.
Contrast – the layout of a website must be distinguished from a blob of information into a visually interesting presentation. This website creates a strong, consistent visual hierarchy in which important elements are emphasized and content is organized logically and predictably.
Page Framework – this is the fundamental framework in terms of horizontal and vertical dimensions. The framework of this website is fixed so that no matter what size the browser window is all of the information is formatted to fit the browser window.
Page Length – page length is determined by the relation between page and screen size; content of document, browsing the content online or in print, and bandwidth available. The page lengths on this website are relatively short so that most of the information is easily viewed on small screens and requires little bandwidth.
Page Headers – this is the area defined in the zone at the top of the page from left to right and about 1 to 2 inches high. This is where the identity is first seen as the page loads and is considered critical. The header on this web site always appears with the logo, tag line, and global navigation.
Page Footers – This is the area defined in the zone at the bottom of the page from left to right and can vary in height depending on how much information is included. This website footer provides copyright and company information as well as navigation since the global navigation is not likely to be viewable from the footer position.
The Fold – designing web pages to take maximum advantage of current screen size and bandwidth of the average web reader. This website carefully uses the fold line in presenting the essential information about the fold line throughout most of the web pages.
Typography – this is the print used on a web page. The typography of this website is consistent and provides a subtle effect in establishing coherence across the web pages.
Typefaces – this refers to font and can be established by the web designer or browser. The font on this website is consistently clear and legible bringing a harmonious fit between the verbal and visual flow of the content.
Typefaces – this refers to font and most use a serif face such as Times New Roman or Georgia for body text and sans serif face such as Verdana or Arial a a contrast for headlines. This website uses Verdana throughout the body text and headlines varying the size and capitalization to differentiate hierarchy of content.
Typeface Color – can be used to differentiate type but must be carefully selected as some color is used to indicate special functional meaning like being a hypertext link. This website uses white but changes color to dark yellow when selected, thus letting the user know where on the website the user is located.
Inverted Pyramid – method for presenting information where the most important information represented by the base of the pyramid, is presented first and least important (the tip) is presented last. The most important information of the website is given on the home page by giving the global navigation content in the body of the web page. The individual navigation topics then give the content on their own.
Keywords – are given throughout the content so that users can skim before settling into more detailed reading. This website uses rotating text with pictures to catch the eye of the user to drill down into the global navigation and body text.
Titles and Subtitles – editorial landmarks that when consistently applied assist the user in navigating through web pages. This website consistently uses the same title and subtitles of home, products, recipes, where to buy and promotions on each web page so that the user knows where they are at all times.

ART 215 Web Design Blog - Rita Howe

Wednesday, May 30, 2012

Web Tools/Content Management

Tuesday, May 29, 2012

Terms

Friday, May 4, 2012

Introduction/Syllabus/Principles of Design