Web Design


Published on

Published in: Business, Technology
1 Like
  • Be the first to comment

No Downloads
Total views
On SlideShare
From Embeds
Number of Embeds
Embeds 0
No embeds

No notes for slide

Web Design

  1. 1. Web Design <ul><li>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. </li></ul><ul><ul><li>(This obviously isn’t always the case; Sometimes the site has compelling enough content that users are willing to overlook the design.) </li></ul></ul><ul><li>It’s about presenting online journalism effectively; The challenge for newspapers is displaying a huge amount of content on the home page. </li></ul>
  2. 2. What you really need to know <ul><li>Most newspaper and television websites are designed by non-journalists. </li></ul><ul><li>Media companies usually hire outside firms to design the sites. </li></ul><ul><li>You may have some say in color and fonts, but little say in the overall look. </li></ul><ul><li>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. </li></ul>
  3. 3. Principles of Web Design <ul><li>Unity </li></ul><ul><ul><li>All design elements, such as text, graphics, color, etc., should work together – be coherent. </li></ul></ul><ul><ul><li>Use consistent fonts and colors </li></ul></ul><ul><ul><li>Keep a structured grid design </li></ul></ul><ul><ul><li>Avoid “floating” elements </li></ul></ul><ul><ul><li>Alignment </li></ul></ul><ul><ul><li>Example: WashingtonPost.com </li></ul></ul>
  4. 4. Principles of Web Design <ul><li>Contrast </li></ul><ul><ul><li>Elements should be distinguishable from each other; Do different elements look the same? (Remember that readers scan pages.) </li></ul></ul><ul><ul><li>Use different colors, varying text sizes, pictures and other visual elements. </li></ul></ul><ul><ul><li>Achieving both unity and contrast is a challenge but is a mark of good design. </li></ul></ul><ul><ul><li>Example: ESPN.com </li></ul></ul>
  5. 5. Principles of Web Design <ul><li>Hierarchy </li></ul><ul><ul><li>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. </li></ul></ul><ul><ul><li>Example: Courant.com </li></ul></ul>
  6. 6. Principles of Web Design <ul><li>Consistency </li></ul><ul><ul><li>Same design elements are used throughout the site – colors, fonts, etc. </li></ul></ul><ul><ul><li>Create identity and good for branding </li></ul></ul><ul><ul><li>Blog templates demonstrate this </li></ul></ul><ul><ul><li>Example: Journal Sentinel </li></ul></ul>
  7. 7. Common trends of newspaper websites <ul><li>Color schemes </li></ul><ul><ul><li>Dark text on white backgrounds are common because it’s easier to read. </li></ul></ul><ul><ul><li>Blue is common for headlines. </li></ul></ul><ul><ul><li>Red is used sparingly used. </li></ul></ul><ul><li>Navigation </li></ul><ul><ul><li>Top vs. Side </li></ul></ul><ul><ul><li>Examples: Courant.com vs. NewsTimes.com </li></ul></ul>
  8. 8. Common trends <ul><li>Grid-based layouts </li></ul><ul><ul><li>Most popular choice because it’s an effective way to manage and organize large amounts of content. </li></ul></ul><ul><ul><li>Best example: New York Times </li></ul></ul><ul><ul><li>Another example: The Onion </li></ul></ul><ul><ul><li>Most grid layouts resemble a newspaper’s print product with a masthead at the top. </li></ul></ul>
  9. 9. Usability <ul><li>Usability is what makes or brakes a website. </li></ul><ul><ul><li>It’s about logical presentation AND how the site and its pages connect with the user. </li></ul></ul><ul><ul><li>According to Foust, usability is about answering two questions for the user: </li></ul></ul><ul><ul><ul><li>Where am I? (Use nameplates on each page) </li></ul></ul></ul><ul><ul><ul><li>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.) </li></ul></ul></ul><ul><li>How a Usability Expert Gets His News </li></ul>
  10. 10. Top 10 Best Newspaper Websites <ul><li>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.) </li></ul>