#BADWEBSITE<br />Current Trends in Website Mistakes<br />Netroots Nation 2011<br />
Preamble: Getting To Know Us<br />Today we’re going to talk about what’s considered “bad practices” in website design and ...
Preamble: Who We Are<br />Christopher Doorley<br />President of Velocity Strategies<br />VelocityStrategies.com<br />@Velo...
Preamble: Who We Are<br />Julie Blitzer<br />User Experience Lead at Advomatic<br />Advomatic.com<br />@Advomatic<br />@zu...
Preamble: Who We Are<br />Ryan Ozimek<br />CEO of PICnet<br />PICnet.net<br />@PICnet<br />@cozimek<br />
Part 1: Planning<br />Good planning equals good execution<br />Set clear, realistic goals<br />Set, keep and meet your mil...
Part 1: Planning<br />Too many cooks in the kitchen<br />It’s a cliché for a reason: decision making needs to be streamlin...
Part 2: The Interface<br />Function<br />No need to re-invent the wheel, best practices are exactly that: best practices<b...
Part 2: The Interface<br />Design<br />Design shouldn’t get in the way of the goals set for the site<br />Fancy isn’t alwa...
The Daily Beast<br />
Herman Cain<br />
El Rio Grande Resturant<br />
Razorfish<br />
Part 3: The Content<br />Content has to be more than just a block of copy<br />Large blocks of text work much better on pa...
Readability, readability, ReAdAbILiTY<br />Pay attention to font size<br />Screen sizes vary greatly from the iPhone to HD...
Contrast Examples<br />
Grantland<br />
Abercrombie & Fitch<br />
Abercrombie & Fitch NEW!!<br />
Claremont McKenna College<br />
R/GA<br />
Questions?<br />UP TOP!<br />
Upcoming SlideShare
Loading in …5
×

#BadWebsite

644 views

Published on

Current Trends in Website Mistakes. From Netroots Nation 2011 in Minneapolis, this is the slideshow that accompanied the panel discussion about common website design and development mistakes. The audience at Netroots Nation was online political activists.

Published in: Technology, Design
1 Comment
1 Like
Statistics
Notes
No Downloads
Views
Total views
644
On SlideShare
0
From Embeds
0
Number of Embeds
4
Actions
Shares
0
Downloads
6
Comments
1
Likes
1
Embeds 0
No embeds

No notes for slide
  • http://www.thedailybeast.com/
  • http://www.hermancain.com/
  • http://www.arkrestaurants.com/elrio_grande.html
  • http://www.razorfish.com/
  • http://trace.wisc.edu/contrast-ratio-examples/index.htm
  • http://www.grantland.com/
  • http://www.grantland.com/
  • http://www.abercrombie.com/webapp/wcs/stores/servlet/CategoryDisplay?catalogId=10901&amp;storeId=10051&amp;langId=-1&amp;topCategoryId=12202&amp;categoryId=12351&amp;parentCategoryId=12351
  • http://cmc.edu/prospectives/
  • http://www.rga.com/
  • #BadWebsite

    1. 1. #BADWEBSITE<br />Current Trends in Website Mistakes<br />Netroots Nation 2011<br />
    2. 2. Preamble: Getting To Know Us<br />Today we’re going to talk about what’s considered “bad practices” in website design and development.<br />A panel in four parts<br />Part 1: Planning<br />Part 2: The Interface<br />Part 3: The Content<br />Part 4: The Rule Breakers<br />Bonus: Questiontime<br />
    3. 3. Preamble: Who We Are<br />Christopher Doorley<br />President of Velocity Strategies<br />VelocityStrategies.com<br />@VelocityStrat<br />@Doorley<br />
    4. 4. Preamble: Who We Are<br />Julie Blitzer<br />User Experience Lead at Advomatic<br />Advomatic.com<br />@Advomatic<br />@zuhli<br />
    5. 5. Preamble: Who We Are<br />Ryan Ozimek<br />CEO of PICnet<br />PICnet.net<br />@PICnet<br />@cozimek<br />
    6. 6. Part 1: Planning<br />Good planning equals good execution<br />Set clear, realistic goals<br />Set, keep and meet your milestones<br />Focus on the outcome, not the tools<br />You don’t need all the bells and whistles<br />Understand your options:<br />Time / Cost / Quality<br />You can only have two<br />
    7. 7. Part 1: Planning<br />Too many cooks in the kitchen<br />It’s a cliché for a reason: decision making needs to be streamlined and responsive<br />Too many decision makers slows the process<br />Stay involved in the process.<br />Listen to the people you hire<br />Trust the people you hire<br />
    8. 8. Part 2: The Interface<br />Function<br />No need to re-invent the wheel, best practices are exactly that: best practices<br />User shouldn’t have to fight your website, let them navigate your site simply and easily<br />Not everything needs to go on the front page<br />Tell the user where they are, how they got there, and how they leave<br />
    9. 9. Part 2: The Interface<br />Design<br />Design shouldn’t get in the way of the goals set for the site<br />Fancy isn’t always the best solution, simple and straight forward can be very effective (see?)<br />Consider the implications of your design, big designs = big upkeep<br />
    10. 10. The Daily Beast<br />
    11. 11. Herman Cain<br />
    12. 12. El Rio Grande Resturant<br />
    13. 13. Razorfish<br />
    14. 14. Part 3: The Content<br />Content has to be more than just a block of copy<br />Large blocks of text work much better on paper than they do on the screen<br />Proper use of headers and line breaks<br />A clean style sheet works magic<br />Help users quickly identify which content is significant<br />Don’t over use bold, it’s as bad as writing in all caps<br />
    15. 15. Readability, readability, ReAdAbILiTY<br />Pay attention to font size<br />Screen sizes vary greatly from the iPhone to HDTVs<br />Whitespace: let your text breath and it will be easier to read and understand<br />Contrast and Colors: make it readable first, pretty second<br />Part 3: The Content<br />
    16. 16. Contrast Examples<br />
    17. 17. Grantland<br />
    18. 18. Abercrombie & Fitch<br />
    19. 19. Abercrombie & Fitch NEW!!<br />
    20. 20. Claremont McKenna College<br />
    21. 21. R/GA<br />
    22. 22. Questions?<br />UP TOP!<br />

    ×