Breaking Instincts: common web design bad habits

1,869 views
1,790 views

Published on

Published in: Design, Business, Technology
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,869
On SlideShare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
79
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Breaking Instincts: common web design bad habits

  1. 1. 2009
  2. 2. Breaking Instincts Common bad habits and how to fight them Rico Sta. Cruz ricostacruz.com 2009
  3. 3. Rico Sta. Cruz Web designer, creative director, Internet marketer, web standards advocate, and all around ninja of all things web Creative Director for US Auto Parts Philippines, a local subsidiary of a US company with a diverse network of e-commerce sites. My personal blog is at ambiescent.com, and my online portfolio is available at ricostacruz.com. 2009
  4. 4. I got up incredibly early today just for you guys. And you guys are awesome for coming in this early! 2009
  5. 5. 2009
  6. 6. Designers 2009
  7. 7. Like all people 2009
  8. 8. are inclined to do things a certain way. 2009
  9. 9. 2009
  10. 10. 2009
  11. 11. inclination 2009
  12. 12. We are all inclined to do certain things by instinct 2009
  13. 13. instinct • an innate, typically fixed pattern of behavior in animals in response to certain stimuli : birds have an instinct to build nests • a natural or intuitive way of acting or thinking : they retain their old authoritarian instincts. 2009
  14. 14. Designers 2009
  15. 15. Like all people 2009
  16. 16. Have: • an innate, typically fixed pattern of behavior in animals in response to certain stimuli : birds have an instinct to build nests • a natural or intuitive way of acting or thinking : they retain their old authoritarian instincts. 2009
  17. 17. instinct = natural tendency 2009
  18. 18. natural tendency is often due to convenience 2009
  19. 19. convenience 2009
  20. 20. convenience is not healthy. 2009
  21. 21. convenience is lazy. 2009
  22. 22. convenience is an opportunity to do better. 2009
  23. 23. 2009
  24. 24. 2009
  25. 25. 2009
  26. 26. THEN LO AND BEHOLD FOLKS Guess what unthinkable atrocity happened next 2009
  27. 27. 2009
  28. 28. Eh? What could you be so upset about, young lad? Naturally, pasting follows after copying. 2009
  29. 29. 2009
  30. 30. Egads! 2009
  31. 31. 2009
  32. 32. SCREW LEMONADE. 2009
  33. 33. You are meant for better things than lemonade. 2009
  34. 34. 2009
  35. 35. 2009
  36. 36. Lets try this. 2009
  37. 37. Challenge: Redesign an online news site to be clearer, easier-to-read, and steered clear of pitfalls that our instincts dictate us to fall through. 2009
  38. 38. Bring it on! 2009
  39. 39. Challenge: Redesign an online news site to be clearer, easier-to-read, and steered clear of pitfalls that our instincts dictate us to fall through. 2009
  40. 40. Challenge: Redesign an online news site to be clearer, easier-to-read, and steered clear of pitfalls that our instincts dictate us to fall through. 2009
  41. 41. Navigation 2009
  42. 42. Three levels of categories? 2009
  43. 43. THINK 2009
  44. 44. Going against our instincts, we don’t need to make our navigation mirror the sitemap structure, do we? 2009
  45. 45. We can try to: show it all (without hiding in hidden popups) lay it out in a way that it’s not overwhelming 2009
  46. 46. 2009
  47. 47. 1 2 3 2009
  48. 48. Moving forward, let’s add the header. We need: » Search bar » Date today » Login/subscribe 2009
  49. 49. Common search bars: Common “login” links: 2009
  50. 50. Going with the status quo just for the convenience? 2009
  51. 51. 2009
  52. 52. THINK 2009
  53. 53. Common search bars: Common “login” links: 2009
  54. 54. THINK 2009
  55. 55. Searching is not an auxiliary function anymore. On content sites, it’s often a primary mode of navigation. 2009
  56. 56. That’s more like it. 2009
  57. 57. Have personalized content? No need to hide your sign in links. 2009
  58. 58. Now we’re talkin’ business. 2009
  59. 59. Why don’t we better simulate a newspaper look? Most papers have news snippets above the heading. 2009
  60. 60. We’re on a roll, yo! 2009
  61. 61. Advertisements 2009
  62. 62. 2009
  63. 63. ? 2009
  64. 64. Aha! Why don’t we bundle all the ads together so the readers will easily figure out what to ignore! About 2 hours ago from web Iv_nevr_heard_of_clickthru_rates Marketing Manager 2009
  65. 65. Lets try it this way: Intersperse advertisements with content. 2009
  66. 66. First on the header, the nav bar, and the right sidebar. (Let’s tackle the content later.) 2009
  67. 67. Articles 2009
  68. 68. Yarr, It’s a news site! Of course I’ll make a headline news item first! About 2 hours ago from web captain_obvious 2009
  69. 69. Awesome work, capitan! 2009
  70. 70. Intermission: The pair rule 2009
  71. 71. Ever notice how the text in these slides are always like this? 2009
  72. 72. Something dominant 2009
  73. 73. 2009
  74. 74. Something dominant paired with something recessive 2009
  75. 75. 2009
  76. 76. 2009
  77. 77. Something dominant paired with something recessive = sweet 2009
  78. 78. 2009
  79. 79. Okay, back to work. 2009
  80. 80. Again, the headline. 2009
  81. 81. We have a headline. Great! Then what? 2009
  82. 82. 2009
  83. 83. 2009
  84. 84. Sure, If you’re making a blog theme. 2009
  85. 85. Fact: blobs of monotonous content are boring. 2009
  86. 86. 2009
  87. 87. 2009
  88. 88. 2009
  89. 89. 2009
  90. 90. To the rescue! 2009
  91. 91. 2009
  92. 92. Primary Secondary Tertiary and so on 2009
  93. 93. 2009
  94. 94. 2009
  95. 95. 2009
  96. 96. AND I JUST Saved the day! 2009
  97. 97. Primary 2009
  98. 98. Secondary Tertiary 2009
  99. 99. Swell. (From this) 2009
  100. 100. More articles 2009
  101. 101. Headline: 4 killed when Vietnam war-era bomb explodes Category: Headlines Time published: 8.07p Headline: Amid bombings, martial law fears, CIA chief arriving Category: Business Time published: 7:27p Headline: Jackson children take center stage in LA Category: Entertainment Time published: 7:05p Headline: RP moves to resume communist rebel talks Category: Headlines Time published: 7:00p ... 2009
  102. 102. Our instinct may drive us to do the most straightforward approach: 2009
  103. 103. Excelitis ex·cel·i·tis, NOUN the inane human tendency to lay things out in a table format 2009
  104. 104. Exhibit A 2009
  105. 105. Exhibit B 2009
  106. 106. Exhibit C 2009
  107. 107. THE HORROR, MAKE IT STOP 2009
  108. 108. Sacrébleu! 2009
  109. 109. THINK 2009
  110. 110. Some columns aren’t always necessary. (Here, deadlines and tags are only shown when the items have them) 2009
  111. 111. Or there may be more logical ways to group the data. 2009
  112. 112. Where were we? 2009
  113. 113. Our instinct may drive us to do the most straightforward approach: 2009
  114. 114. Okay, perhaps: 2009
  115. 115. Okay, perhaps: 2009
  116. 116. Better. 2009
  117. 117. Lists 2009
  118. 118. Some examples. 2009
  119. 119. 2009
  120. 120. Unimaginative 2009
  121. 121. Well thought-of 2009
  122. 122. Unspectacular 2009
  123. 123. Consider instead: 2009
  124. 124. 2009
  125. 125. 2009
  126. 126. 2009
  127. 127. Recap 2009
  128. 128. Intuition but you should may tell you to consider Relayouting 2009
  129. 129. Intuition but you should may tell you to consider mimic Group data more Excel intelligently 2009
  130. 130. Intuition but you should may tell you to consider be having blog-like hierarchy 2009
  131. 131. Intuition but you should may tell you to consider list things listing things down down better 2009
  132. 132. 2009
  133. 133. Thank you 2009

×