10

Click here to load reader

Web Design

Embed Size (px)

Citation preview

Page 1: Web Design

Web Design

Do you judge a book by its cover? Some web users judge a site by its “look.” If the page is not seen as worthwhile, the user will leave and may not come back.

(This obviously isn’t always the case; Sometimes the site has compelling enough content that users are willing to overlook the design.)

It’s about presenting online journalism effectively; The challenge for newspapers is displaying a huge amount of content on the home page.

Page 2: Web Design

What you really need to know

Most newspaper and television websites are designed by non-journalists.

Media companies usually hire outside firms to design the sites.

You may have some say in color and fonts, but little say in the overall look.

Readers likely will NOT flock to a well-designed site if it has poor content, but they likely will visit a poorly designed site IF it has good content.

Page 3: Web Design

Principles of Web Design

Unity All design elements, such as text, graphics, color, etc.,

should work together – be coherent. Use consistent fonts and colors Keep a structured grid design Avoid “floating” elements Alignment Example: WashingtonPost.com

Page 4: Web Design

Principles of Web Design

Contrast Elements should be distinguishable from each other;

Do different elements look the same? (Remember that readers scan pages.)

Use different colors, varying text sizes, pictures and other visual elements.

Achieving both unity and contrast is a challenge but is a mark of good design.

Example: ESPN.com

Page 5: Web Design

Principles of Web Design

Hierarchy Most important elements should stand out – don’t

bury. Use a visual – photo, graphic, video – to help achieve this. And you can play with font size and/or colors.

Example: Courant.com

Page 6: Web Design

Principles of Web Design

Consistency Same design elements are used throughout the site –

colors, fonts, etc. Create identity and good for branding Blog templates demonstrate this Example: Journal Sentinel

Page 7: Web Design

Common trends of newspaper websites

Color schemes Dark text on white backgrounds are common because

it’s easier to read. Blue is common for headlines. Red is used sparingly used.

Navigation Top vs. Side Examples: Courant.com vs. NewsTimes.com

Page 8: Web Design

Common trends

Grid-based layouts Most popular choice because it’s an effective way to

manage and organize large amounts of content. Best example: New York Times Another example: The Onion Most grid layouts resemble a newspaper’s print

product with a masthead at the top.

Page 9: Web Design

Usability

Usability is what makes or brakes a website. It’s about logical presentation AND how the site and

its pages connect with the user. According to Foust, usability is about answering two

questions for the user: Where am I? (Use nameplates on each page) Where can I go? (Offering links to other parts of the site;

offering links so the user can always get back to the home page.)

How a Usability Expert Gets His News

Page 10: Web Design

Top 10 Best Newspaper Websites

theBivingsreport (The Bivings Report (TBR) is a source of news, insight, research and analysis on the web-based communications industry. TBR content is posted, created and managed by internet strategists, media/communications analysts, web developers, designers and programmers, all of whom are employees of The Bivings Group.)