- From: Al Gilman <Alfred.S.Gilman@IEEE.org>
- Date: Mon, 25 Oct 2004 12:59:34 -0400
- To: wai-xtech@w3.org
>Please, for each guinea pig page, give > >a) a link to the page in question, and >b) your analysis of how this page breaks down into parts > >The nominal asking is for people to do at least two pages. > >Please post your contributions before midnight UTC Sunday 24 October. > >Al In the November-December issue of _interactions_, the ACM SIGCHI journal on human-computer interaction, Kathy E. Gill has done a comparative review of the georgebush.com and johnkerry.com political campaign websites. I am sorry, the contents of this issue are not on the ACM site yet. The following is my structural description of the home pages for these two sites, with a few points drawn from Kathy Gill's expert analysis. ** Bush site structure Site: http://www.georgewbush.com/ The cut tree for the top page is non-standard in that the first cut is to separate a right-hand visually 'outboard' panel from the more or less classic-page structure to its left. Topics addressed in this outboard right-most panel include - affinity groups (African Americans [for George W Bush] etc.) - ads for disaster relief (contributes to the 'we are in an emergency' feel) - 'volunteer of the day' bio for high-touch feeling - 'quick vote' invites people to indicate opinions on current issues (but watch out if you do, the site gets in your face to do what they want if you do this). So first divide your canvas into a narrow region against the left margin from top to bottom, and a wide region against the left margin from top to bottom. The second cut is horizontal, but it's not what I would expect. Again we find an 'outboard' or periperal hanger-on to the main structure. There is a cut within the left-hand larger region left from the first cut which pares off just a narrow region at the top of the window frame for tasks. There are links to tasks known as "Blog, Party, Action Center, Vote Early, W stuff." And then there is an inline task to give your email address and subscribe to campaign bulletins by email. The latter looks like and is placed like the search function on a normal page. After peeling off those two 'outboard' panes, the rest of the Bush home page looks like a currently-classic design. There is a horizontal cut separating a top section providing site identification with a picture of the candidate doing something attractive. Then there is a vertical cut separating off a pane at the left margin for text links From a content region to its right. Note, however, that these two cuts are blurred in the perception as if there is a frame with top and left panes joined and the rest (the content zone) wrapped by this two-margin frame. This is strongly hinted by the absence of any visible line between the top and left panes. The corner is even rounded a bit by the 'tab' shape of the left-most tab selector which is what nestles into the inside corner where the top and left bars meet. Inside the navbar there is a topic tree in the visual presentation. This is all done with presentation effects, not structural code. The Bush site uses an embedded table to structure the contents of the navbar visually but misses the chance to show the internal block structure with TBODY blocks and TH cells. The content region has a horizontal cut through it that splits off a tabs area at the top from a variable section below that. The tabs present the top of a topical breakdown of what the Bush campaign views as the issues in the race. In the region under the tabs on the home page there is a vertical cut between two almost equal width columns. The left-most of these two columns is slightly wider and news-oriented. It starts off with a 'latest pictures' section followed by a 'latest headlines' section of links to news stories. These are made into strongly identified pictorial rectangles. The right-most of these two columns contains a collection of feature thumbnails. These features alternate between information-orientation and action-orientation, with an action-oriented block leading off. There is a search tool but it is relegated to the foot of the left navigation bar. Kathy Gill points out that this graphical block structure is preserved throughout the site, even down to task-oriented panes such as the form to sign up for something. End of Bush site structural analysis. ** Kerry site structure Site: http://www.johnkerry.com/ This page design has a less-innovative structure. More in line with what visitors would carry with them as expectations, according to Gill. The first cut is a horizontal cut across the full width of the window. This separates a header block from a three-column region below. Inside the head block there is a vertical cut between page identification on the left and tasks on the right. Again there is a signup task and a collection of site-entry tasks. Again the search tool has been pushed off the top line to the foot of the left nav bar. But here the signup task is above the others, which are presented in 'tab' graphics. So this represents a horizontal cut separating the right-hand part of the head block into over an under sub-regions. Moving down to the region left over below the head of the page: Here there are a classic three columns with a narrow column of text links summarizing the site map on the left, a larger column in the middle and a middle-sized column filled with feature thumbnails on the right. The right-hand features bar is again a mix of action and information with action leading off. But the blocks are not rigidly rotated between action and information, just a grab bag containing both. The main pane left in the middle of all this is headed by a topic paragraph for the campaign. It talks to reasons why there should be a change of administration in Washington. This is static stuff, not appealing to the Internet lust for something new all the time, the way the Bush site does with its 'latest' segments in this position. Inside the left navigation bar there is an option group structure presented visually that is not reflected in the markup. The options are all just separated with line-break <BR> elements and the group-introducing labels are just body text, not given an structural role with OPTGROUP or dt, dd options in a dl list structure. Also, the whole navbar is one DIV with class 'navcontainer'. That class is OK, but there is a missed opportunity to present the segmentation of the nav bar in a hierarchical xhtml2:nl approximation in HTML. Kathy Gill points out that in task-oriented pages such as signup forms, the structure is simplified so that there are only head, leftNav, and main panes to content with. This is rational in that when you are on some middle step of a multi-page task sequence you are less likely to want to bop off to a random feature on the site. That is different from the broad range of activity predilections of all visitors arriving at the home page. End of Kerry site structure analysis. ** A few remarks on tone: There is a consistent difference between the Bush and Kerry sites in the sense that the Bush site is more oriented to pictures and action by visitors and the Kerry site is more oriented to words and allowing visitors to inform themselves. The Kerry site does a better job of providing a single topic tree for the whole site and the Bush site does a better job with getting you to what you want to do quickly exploiting the (assumed up-to-date) screen size to give may entry paths in parallel. In part this reflects the relative positioning of the candidates. George Bush has to present his case as "we need a firm hand on the tiller in these troubled times" because he is the incumbent and one of the strong motivations favoring his candidacy is a reluctance to "change horses in the middle of the stream." And conversely John Kerry has to ask voters to reflect on the last four years and get them to question whether this is really what they want for another four years. So the differing posture or tone of the sites is a rational reflection of the situation that the campaigns find themselves in through the exigencies of current history. Al
Received on Monday, 25 October 2004 17:00:11 UTC