Tuesday, March 23, 2010

Huffington Post

Graphic Design: They use the same blue-ish green color throughout the entire page. A cornflower blue color and sky blue are also used throughout the page. Light grey lines are used to differentiate between sections, like most other news sites. Move from homepage, the nav bar and big news bar changes colors for the section of the news you are in.

Information Design: 3 columns. The big news stories are at the very top, above the header and mirrors the navigation bar, below the header. The top story takes up all 3 columns, and the majority of the viewable page. The rest of the stories have to be scrolled down to (unlike most news sites).

Interface Design: Extremely large image appears with a very large headline for the top story. All the other stories fill in the 3 columns down the page. The most popular stories are highlighted with a blueish green colored box. The far left column has stories written by people outside of their staff.

Document Production: multiple external stylesheet, some for different browsers, mobile style sheet, some embedded style

Scripting & Programming: Javascript, RSS, widgets, podcasts

Multimedia: images, videos, comments, tweet about it, share on facebook, buttons to describe your reaction to a story, e-mail

Wednesday, March 10, 2010

USA Today

Graphic Design: The header is full of color, and each navigation tab is a different color. The rest of the color shows up farther down the page where the top stories from each section are located, and the sections letters of the name correspond to the tab color at the top of the page. Grey boxes point out the beginning of a new section, stands out because the background is white.

Information Design: 7 columns. Main stories are on the top, underneath the navigation bar, and they take up 5 columns. The most popular stories are also near the top, as well as the weather. Most news sites, I've noticed, have these things at the top.

Interface Design: When refreshing the page, nothing new happens. The largest image stays the same. The navigation bar is located at the top underneath the header. The top pics, mainly multimedia, changes every 30 seconds or so, but the viewer can also scroll through. There are 5 sections/images that change.

Document Production: several style sheets, some are for different internet browsers, some embedded style, mobile stylesheet

Scripting & Programming: RSS feeds, javascript, widgets, podcasts

Multimedia: videos, images, comments, recommend, voting, games

Monday, March 1, 2010

The Washington Times

Graphic Design: color dominates this page. Each section is separated by colors inside boxes with rounded edges. Blue and red seem to be the dominate colors, like other sites, with gray as a third complimentary color. The 'main attraction' is the largest box.

Information Design: 4 columns and the column on the far right of the screen consists of advertisements. Underneath the main section, the links to opinion articles and blogs are listed. Towards the bottom of the page, there are links to the top articles for each section of the page, like most news sites.

Interface Design: There are ads above the header. The header isn't anything special, just their papers name and ways to subscribe. Below that is the nav bar, like most sites. Large image floated to the left in the main section of the page. It is made like a cube and the reader has the ability to change the image or if the page is idol for a few seconds, the whole page goes black just to change the cube, not very efficient.

Document Production: mobile stylesheet, several external stylesheets, embedded style

Scripting & Programming: javascript, RSS, podcasts

Multimedia: images, 'question of the day' survey, video

Tuesday, February 23, 2010

New York Times

Graphic Design: bland colors: neutral, red, and lots of blue. Nothing really stands out on the page except for photos and ads. Each section is separated with lines, like most other news Web sites. Halfway down the page, there is a larger, noticeable double line, that breaks the page in half.

Information Design: the top has 5 columns, and the main story/teaser takes up the first 3 columns. After the double line, there is an image and link to the top story in each section of the paper. Below that, there are links to the top 3 stories in each section, as well as an area with the most popular stories.

Interface Design: The header is centered on the page with ads on either side, which change each time you refresh the page. There are links above the header, but the nav bar is vertical and floated to the left side of the page, almost missed it. When you open up a story, the nav bar moves to the top.

Document Production: RSS, severalexternal stylesheet, mobile page

Scripting & Programming: php, javascript

Mulitmedia: images all over the page, and there is a section dedicated to videos/mulitmedia.

Thursday, February 18, 2010

San Francisco Chronicle

Graphic Design: There are boxes separating each section, however, everything is so clustered together that it makes it more difficult for a reader to see what is most important. You can't tell what is an advertisement and what is not.

Information Design: four columns, with 3 stories across the first row underneath the nav bar. There are links to staff blogs, things to do in the area, most commented on/most read/most e-mailed, but no links to facebook or twitter. But at the bottom of the page there are the top stories for each section of the Web site.

Interface Design: The header is at the top with the weather forecast and adds inside of it. the nav bar is below the header and red, which makes it stand out because it is the boldest color on the page, besides ads. Links are not underlined.

Document Production: external stylesheets

Scripting & Programming: javascript, widgets

Multimedia: photos, videos but they are not shown any different than photos (difficult to tell)

Tuesday, February 9, 2010

Newsok.com

Graphic design: Each section, towards the bottom of the page, has a separate header and each one has its own color, allowing it to stand out from the rest. There are dotted lines to separate all sections of the homepage. In the navigation bar, the links to different sections with stories are black and if you are looking for a job, car or home, the blocks around them are red.

Information design: three columns, relatively same size. Towards the bottom of the page, the site breaks up to show the different sections and the current headlines on those pages. It also shows current and previous updates on Twitter and a link to their Facebook Page. Above the footer, there is a section where a viewer can upload their opinion, photos, videos or stories.

Interface design: the navigation bar is located under the header. Unlike most sites, the header has an ad above it as well as a box with links to sign up or log in to receive the member benefits. Also, within the header box, there is a link to the top viewed story and the date and temperature. There is a second navigation bar below the first with options that do not hold current stories. Not all of the links are a separate color from the text, and none of the links are underlined to stand out. There are no seek options with the video, but you can email, get the link or the code. The search option is below the navigation bars, above the story columns.

Document production: two CSS, style within the source also

Scripting & programming: Javascript, RSS feed compatible

Multimedia: box containing all multimedia in the center column, under top headlines. Videos on top and a photo gallery on the bottom. The photos do not circulate like a slideshow.