Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Search Engine Friendly Web Design: Designing For People Who Use Search Engines By Shari Thurow

1,405 views

Published on

From the SMX West Conference in San Jose, California, March 1-3, 2016. SESSION: Search Engine Friendly Web Design. PRESENTATION: Search Engine Friendly Web Design: Designing For People Who Use Search Engines - Given by Shari Thurow, @sharithurow - Omni Marketing Interactive, Founder and SEO Director. #SMX #12D

Published in: Marketing
  • HTML and CSS: Design and Build Websites --- http://amzn.to/1WAnIyE
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Learning Web Design: A Beginner's Guide to HTML, CSS, JavaScript, and Web Graphics --- http://amzn.to/1PkGxjj
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here
  • Web Design with HTML, CSS, JavaScript and jQuery Set --- http://amzn.to/22wqB79
       Reply 
    Are you sure you want to  Yes  No
    Your message goes here

Search Engine Friendly Web Design: Designing For People Who Use Search Engines By Shari Thurow

  1. 1. #SMX #12D @sharithurow Designing for People Who Use Search Engines SEARCH ENGINE FRIENDLY WEB DESIGN
  2. 2. #SMX #12D @sharithurow §  Founder  and  SEO  Director  at  Omni  Marketing  Interactive.   §  Author  of  Search  Engine  Visibility  and  co-­‐author  of  When  Search  Meets  Web  Usability.   §  Columnist  for  Marketing  Land  and  Search  Engine  Land.   §  SEO  professional  since  1995,  pioneering  search-­‐engine  friendly  website  design.   §  Web  designer/developer  since  1995.   §  Website  usability  and  UX  professional  since  2002.   §  Information  architect/scientist  since  1989.   Introductions:
  3. 3. #SMX #12D @sharithurow •  User  Experience  Professionals  Association  (UXPA)   Board  Member   Formerly  the  Usability  Professionals  Association   •  Information  Architecture  Institute  (IAI)   Board  Member  and  Advisory  Board   •  ASLIB  Journal  of  Information  Management   Editorial  Advisory  Board   •  Bing  Ads     Accredited  Professional  Advisory  Board  
  4. 4. #SMX #12D @sharithurow § SEO  and  User  Experience    (UX)   § What  is  Search  Engine  Friendly?   § SEO  Principles   § Universal  Rules  of  Web  Design   § Home  Pages   § Questions  &  Answers   Session Goals:
  5. 5. #SMX #12D @sharithurow If  you  check  out  some  of  the  sample  web  pages  used  in  this  presentation,   they  are  likely  to  look  different.     The  principles  &  guidelines  that  these  screenshots  illustrate  are  relevant   long  after  a  site  has  changed.        
  6. 6. #SMX #12D @sharithurow SEO AND USER EXPERIENCE (UX)
  7. 7. #SMX #12D @sharithurow UX  Hierarchy  of  Needs   @UXHow  on  Twitter    
  8. 8. #SMX #12D @sharithurow “The  first  law  of  e-­‐commerce  is  that  if  users  cannot  find  the  product,  they  cannot   buy  it  either.”   -­‐  Dr.  Jakob  Nielsen,  Usability  Guru  and  Author      http://www.nngroup.com/articles/usability-­‐101-­‐introduction-­‐to-­‐usability/  
  9. 9. #SMX #12D @sharithurow Findability  precedes  usability.     In  the  alphabet  and  on  the  Web.   You  can’t  use  what  you  can't  find.   -­‐  Peter  Morville,  Information  Architect      Author  of    Search  Patterns  &  Intertwingled  
  10. 10. #SMX #12D @sharithurow Peter Morville’s User Experience Honeycomb findable   desirable   useful   valuable   accessible   credible   usable   http://semanticstudios.com/user_experience_design/ findable  
  11. 11. #SMX #12D @sharithurow Browse:
  12. 12. #SMX #12D @sharithurow Search: SearchKeyword(s) Results (SERP)
  13. 13. #SMX #12D @sharithurow Ask:
  14. 14. #SMX #12D @sharithurow ALGORITHM  
  15. 15. #SMX #12D @sharithurow “…  A  good  way  to  solve  problems  is  to   start  with  the  big  picture…  [because  if  you   don’t  understand  the  big  picture]  you  may   solve  the  wrong  problem,  or  might  not   explore  other—possibly  better—answers.”  
  16. 16. #SMX #12D @sharithurow WHAT IS SEARCH-ENGINE FRIENDLY?
  17. 17. #SMX #12D @sharithurow
  18. 18. #SMX #12D @sharithurow
  19. 19. #SMX #12D @sharithurow
  20. 20. #SMX #12D @sharithurow
  21. 21. #SMX #12D @sharithurow
  22. 22. #SMX #12D @sharithurow Search engine friendly design is NOT… …optimizing  a  website  for  search  engines  only.   spam   technology-centered   design  
  23. 23. #SMX #12D @sharithurow SEARCH- ENGINE FRIENDLY DESIGN Search engine friendly design is … …optimizing  for  people  who  use  search  engines.   technology-centered   design   user-­‐centered    design  
  24. 24. #SMX #12D @sharithurow …a  user-­‐friendly  website  design  that  enables  websites   to  be  easily  found  via  the  crawler-­‐based  search  engines,   other  types  of  search  engines,  and  industry-­‐related   websites.     In  other  words,  it  is  a  website  that  is  made  for  users   (searchers)  but  also  accommodates  search  engines.   Search engine friendly design is: 1 2
  25. 25. #SMX #12D @sharithurow Importance of website design: § Primary:      End  users/site  visitors/searchers/target  audience     § Secondary:    Crawler-­‐based  search  engines/technologies            Niche  and  industry-­‐related  sites  
  26. 26. #SMX #12D @sharithurow To remember about SEO: § SEO  is  optimizing  for  people  who  use  search  engines.   § How  words  (copy),  graphic  images,  and  multimedia  files  are  labeled,   formatted,  and  placed  on  web  pages  communicates  the  content  that   you  feel  is  important  to  both  search  engines  and  to  site  visitors.  
  27. 27. #SMX #12D @sharithurow SEO PRINCIPLES
  28. 28. #SMX #12D @sharithurow All search engines: }  All  crawlers   1.  Index  text   2.  Follow  links   3.  Measure  popularity   4.  Accommodate  searcher  goals  &  behaviors  
  29. 29. #SMX #12D @sharithurow All search engines: }  Ranking  factors   1.  Index  text   2.  Follow  links   3.  Measure  popularity   4.  Accommodate  searcher  goals  &  behaviors  
  30. 30. #SMX #12D @sharithurow http://searchengineland.com/seotable   Periodic table of SEO factors:
  31. 31. #SMX #12D @sharithurow Let’s simplify this: Keywords,  Content,   &  Labels   Accessibility     &  Navigation   Searcher  Goals     &  Behaviors   Link  Development     &  Social  Signals  
  32. 32. #SMX #12D @sharithurow KEYWORDS, CONTENT, & LABELS SEO Principles
  33. 33. #SMX #12D @sharithurow What kind of text? § The  words  your  target  audience  is  typing  into  search  queries  are  called   keywords  or  query  words.     § Your  website  should  have  a  labeling  system  that  clearly  communicates   “aboutness”  to  both  humans  and  technology.    
  34. 34. #SMX #12D @sharithurow Inceptor’s Pyramid: When  searchers  arrive  on  a  website   from  a  commercial  web  search  engine,   such  as  Google,  they  usually  land  on  a   page  in  the  middle  of  the  site,  not  the   home  page.    
  35. 35. #SMX #12D @sharithurow Types of labels: § Content   § Navigation   § Document    
  36. 36. #SMX #12D @sharithurow
  37. 37. #SMX #12D @sharithurow
  38. 38. #SMX #12D @sharithurow
  39. 39. #SMX #12D @sharithurow
  40. 40. #SMX #12D @sharithurow An image’s file name is a label: http://www.mayoclinic.org/~/media/kcms/gbs/patient %20consumer/images/2013/11/15/17/37/ds00050_ %20my00164_im01229_mcdc7_cataracts2_jpg.png    
  41. 41. #SMX #12D @sharithurow URL (web address) guidelines: 1.  Short  but  descriptive.     2.  Use  natural  word  order.   3.  Use  hyphens  instead  of  underscores.   4.  All  lowercase.   5.  2  or  less  parameters  (ideally,  no-­‐parameter  URLs  are  best).   6.  No  “funky”  characters  in  URL  (?,  &,  %,  =,  etc.)   7.  No  trailing  forward  slashes  at  the  end  of  a  URL.   8.  Eliminate  or  minimize  stop  words.   9.  Proper  file  format.  
  42. 42. #SMX #12D @sharithurow Keywords  are  dead.  
  43. 43. #SMX #12D @sharithurow Primary text Secondary text §  Title  tags   §  Visible  <body>  copy   §  Text  at  the  top  of  a  web  page   §  In  and  around  hypertext  links   §  Domain  and  file  names     (accessibility  &  searcher  goals)   For text-based documents: §  Meta-­‐tag  content   §  Alternative  text   §  Domain  and  file  names  (descriptive)  
  44. 44. #SMX #12D @sharithurow To remember about keywords, labels, & copywriting: §  Make  sure  you  place  your  keywords  in  titles,  visible  body  text,  anchor  text,  meta   tags,  and  alternative  text.   §  Remember  to  focus  most  of  your  efforts  on  primary  text,  not  secondary  text.   §  Create  a  clear  and  consistent  labeling  system.     §  Place  your  keywords  prominently  on  your  pages.   §  Use  keywords  frequently  enough  on  your  pages  so  that  content  appears  focused,   but  don’t  overdo  it.       Hint:  Use  the  5-­‐Second  Usability  Test   https://articles.uie.com/five_second_test/  
  45. 45. #SMX #12D @sharithurow ACCESSIBILITY & NAVIGATION SEO Principles
  46. 46. #SMX #12D @sharithurow Peter Morville’s User Experience Honeycomb findable   desirable   useful   valuable   accessible   credible   usable   accessible   http://semanticstudios.com/user_experience_design/
  47. 47. #SMX #12D @sharithurow Accessibility: §  Human  users,  as  well  as  technology,  should   have  user-­‐friendly  access  to  your  website’s   content.   –  URL  structure   –  Website  navigation     §  Websites  should  be  accessible  to  people  with   disabilities  (more  than  10%  of  the  population).    
  48. 48. #SMX #12D @sharithurow Search engines follow links: §  Search  engine  follow  links  from  one  web  document  to  another.   §  How  your  web  documents  link  to  each  other  communicates  (to  both  humans  and   technology)  how  important  you  believe  your  content  is.     §  In  other  words,  site  navigation  matters!   §  Search  engines  and  searchers  look  at:   –  Information  architecture   –  Technical  architecture   –  Site  navigation  (global,  local,  contextual,  supplemental)   –  URL  structure  
  49. 49. #SMX #12D @sharithurow SEO jargon: Internal links = Site navigation
  50. 50. #SMX #12D @sharithurow “The  navigation  elements  of  your  website  provide  [both  humans  and  technology]  an   understanding  of  your  organization  and  give  them  a  sense  of  where  they  are  within   the  site  structure.”   Adapted  from  Wroblewski,  L.  (2002).  Site  Seeing:  A  Visual  Approach  to  Web  Usability.  New  York,  NY:   Hungry  Minds,  Inc.    
  51. 51. #SMX #12D @sharithurow Global Utilities Contextual Local Supplemental Where am I? Need help? What’s related to this content? What’snearby? Site map Types of website navigation:
  52. 52. #SMX #12D @sharithurow Purpose of site navigation: §  The  purpose  of  site  navigation  is  to  enable  task  completion  effectively  for   both  human  users  and  technology.   §  Answers  the  questions:   –  Where  am  I?  (orientation/placemaking)   –  Am  I  in  the  right  place?  (arrival)     –  Where  can  I  go?  (information  scent)   –  How  can  I  get  there?    
  53. 53. #SMX #12D @sharithurow Responsive design menus:
  54. 54. #SMX #12D @sharithurow Menus as global & local navigation:
  55. 55. #SMX #12D @sharithurow Hamburger menus:
  56. 56. #SMX #12D @sharithurow “Too  much  navigation,  and  our  audience  is  overwhelmed;  too  little,  and  they  are  lost.”   Wroblewski,  L.  (2002).  Site  Seeing:  A  Visual  Approach  to  Web  Usability.  New  York,  NY:  Hungry  Minds,  Inc.    
  57. 57. #SMX #12D @sharithurow Adapted  from  Brown,  D.  (2011).  Principles  of  Information  Architecture.  UIE  Virtual  Seminars  presentation.  Available  at:   https://aycl.uie.com/virtual_seminars/5_simple_principles_to_improve_your_information_architecture   Schwartz,  B.  (2005).  The  Paradox  of  Choice:  Why  More  is  Less.  New  York:  HarperCollins.   Principle of choices:
  58. 58. #SMX #12D @sharithurow
  59. 59. #SMX #12D @sharithurow Global navigation – fat footers: §  If  your  website  largely  consists  of   pages  with  short  content,  then  a   fat  footer  is  not  necessary.     §  If  your  website  largely  consists  of   pages  with  long  content,  then  a   fat  footer  is  highly  recommended.  
  60. 60. #SMX #12D @sharithurow Search Featured States Alabama Real Estate Alaska Real Estate Arizona Real Estate View More States Search Popular Metros Atlanta Homes for Sale Chicago Homes for Sale Dallas Homes for Sale View More Popular Metros Search Popular Cities Atlanta Homes for Sale Boston Homes for Sale Charlotte Homes for Sale View More Popular Cities Reasons why this is a footer don’t:
  61. 61. #SMX #12D @sharithurow Contextual navigation: §  Complement  the  existing  navigation  systems  by  adding  flexibility  and  increased  time   on  site.     §  When  used  excessively,  it  can  create  clutter  and  confusion.   §  Let’s  look  at  some  examples….  
  62. 62. #SMX #12D @sharithurow Sibling   Sibling   Contextual links example #1: Cousin   Cousin  
  63. 63. #SMX #12D @sharithurow Contextual links example #2:
  64. 64. #SMX #12D @sharithurow Contextual links example #3:
  65. 65. #SMX #12D @sharithurow Supplemental navigation: §  Site  map   §  Site  index   §  Guides   §  Site  search  
  66. 66. #SMX #12D @sharithurow
  67. 67. #SMX #12D @sharithurow Types of website navigation formats: §  Text  links   §  Navigation  buttons   §  Image  maps   §  Menus   –  Dropdown   –  Flyout   –  Expanding/collapsing   §  Flash   §  Sliders   §  Carousels   §  Parallax  
  68. 68. #SMX #12D @sharithurow If  a  site  navigation  scheme  is  not  search-­‐engine  friendly,  you   should  avoid  using  it  in  your  site  design.  
  69. 69. #SMX #12D @sharithurow
  70. 70. #SMX #12D @sharithurow Types of text-based navigation: §  Formal  navigation  (global  +  local)   §  Location-­‐based  breadcrumb  links   §  “Inline”  or  embedded  text  links   §  Site  map  or  site  index  (supplemental)  
  71. 71. #SMX #12D @sharithurow For  details,  please  read:   http://marketingland.com/breadcrumb-­‐links-­‐ good-­‐user-­‐experience-­‐yes-­‐97848     Parent   Child  
  72. 72. #SMX #12D @sharithurow Spool,  Jared.  (2006).  “Why  Good  Content  Must  Suck:  Designing  for  the  Scent  of  Information.”     Available  at:  https://www.uie.com/brainsparks/2006/09/26/webmaster-­‐jam-­‐presentation-­‐online/     Inline or embedded text links provide context and scent:
  73. 73. #SMX #12D @sharithurow Before:
  74. 74. #SMX #12D @sharithurow After:
  75. 75. #SMX #12D @sharithurow Don’t do this: Search  Engine  Optimization  is  an  important  part  of  any  search  engine  marketing  initiative.  Some  people  believe  that   submitting  the  site  to  search  engines  alone  is  sufficient  in  getting  top-­‐10  rankings.  This  is  not  true.  Search  engine   submission  only  announces  your  site's  existence  to  the  search  engines.  To  get  a  good  search  engine  ranking,  it  is   important  that  you  carry  out  title  tag  optimization,  meta  tags  optimization,  and  anchor  text  optimization  of  your   website  amongst  other  SEO  techniques.  You'll  need  to  optimize  the  visible  text  of  your  site  through  SEO  copywriting   after  extensive  keyword  phrase  search.  It  is  also  important  to  boost  your  Google  PageRank  in  order  to  get  a  good   website  ranking.  You  can  increase  PageRank  of  your  site  by  building  your  site's  link  popularity  through  a  link  building   campaign.  A  link  exchange  campaign  with  good  industry  relevant  sites  is  the  simplest  way  to  get  several  incoming  links   to  promotion.  Remember,  search  engine  positioning  is  a  powerful  media  for  your  website  promotion.  While  the  above   example  seems  like  overkill,  this  is  just  to  illustrate  how  you  can  accommodate  your  important  keyword  phrases  by   carefully  rewording  the  text  of  your  web  pages.  If  you  feel  that  the  standard  blue,  underlined  hyperlinks  appear  ugly  on   your  website,  then  you  can  reformat  its  HTML  markup  code  to  change  color  of  the  text  and  get  rid  of  the  underline   without  losing  the  power  of  the  anchor  texts.    
  76. 76. #SMX #12D @sharithurow To remember about accessibility & navigation: §  Always  use  at  least  two  forms  of  navigation  on  your  website:  one  for  your  site  visitors   (humans)  and  one  for  search  engines  (technology).   §  Know  when  and  how  to  use  text  links  effectively.   –  Type/format   –  Placement   –  Selection   §  Don’t  assume…test.   §  Try  to  make  the  URLs  to  your  most  popular  pages  as  human-­‐friendly  and  technology-­‐ friendly  as  possible.   §  Usability  counts!  
  77. 77. #SMX #12D @sharithurow LINK DEVELOPMENT & SOCIAL SIGNALS SEO Principles
  78. 78. #SMX #12D @sharithurow Peter Morville’s User Experience Honeycomb findable   desirable   useful   valuable   accessible   credible   usable   http://semanticstudios.com/user_experience_design/ useful  
  79. 79. #SMX #12D @sharithurow § Number  of  links   § Quality  of  links     § Number  of  times  people  click  on  links  to  your  site   § How  long  end  users  visit  your  site   § How  often  people  return  to  your  site   What is popularity? }  Link  popularity  
  80. 80. #SMX #12D @sharithurow § Signal  =  maybe   § Directive  =  absolutely   § One  goal  is  to  get  more  followers  /  build  an  audience  (qualitative)   § In  terms  of  SEO,  links  can  be  a  by-­‐product  of  great  social  campaigns   Social media optimization (SMO):
  81. 81. #SMX #12D @sharithurow § Substantial  and  unique  content  (is  content  linkworthy?)   § How  other  sites  are  linked  to  your  site  (anchor  text)   § Social  signals   § Website  usability   –  Organization  &  placement  of  content  assets   –  Clear  labels   –  Placement  to  support  task  completion   Factors that affect link development:
  82. 82. #SMX #12D @sharithurow §  Reference   §  FAQs,  Q&As   §  Coupons   §  Articles   §  Checklists   §  Fact  sheets   §  Guides     Types of digital content assets: §  Quizzes   §  Comparisons   §  White  papers   §  Tools   §  Infographics   §  Slideshows   §  Videos   §  Audio  files   §  Spreadsheets   §  Presentations     §  Links  &  resources   §  Humor  
  83. 83. #SMX #12D @sharithurow To remember about link development & SMO: §  Quality  trumps  quantity.   §  Link  development  =  directive.  Social  media  =  signal.   §  Your  website  should  contain  user-­‐friendly  digital  content  assets.   §  Learn  to  optimize  each  digital  asset!   –  Site  architecture  &  navigation   –  Labels   –  Link  prospecting  and  outreach   –  Social  sharing   §  Link  development  is  ongoing  (iterative).  
  84. 84. #SMX #12D @sharithurow SEARCHER GOALS & BEHAVIORS SEO Principles
  85. 85. #SMX #12D @sharithurow Remember – Go, Know, Do: §  Go  (Navigational)     Searchers  want  to  go  directly  to  a  website,  or  go  to  a   specific  page  on  a  website.   §  Know  (Informational)     Searchers  want  to  know  or  learn  more  about  a  topic.   §  Do  (Transactional)     Searchers  want  to  do  or  perform  some  web-­‐mediated   activity.  
  86. 86. #SMX #12D @sharithurow UNIVERSAL RULES OF WEB DESIGN
  87. 87. #SMX #12D @sharithurow 1.  Easy  to  read   2.  Easy  to  navigate   3.  Easy  to  find   4.  Consistency  and  clarity  in  layout,  design,  and  labeling   5.  Quick  to  download   5 Universal Rules of Website Design:
  88. 88. #SMX #12D @sharithurow §  Legible   §  Readable   §  Scannable   §  Understandable   §  Text  makes  sense  in  search  listings   1. Easy to read:
  89. 89. #SMX #12D @sharithurow §  Techniques  &  Relevancy  Factors   http://searchengineland.com/bing-­‐mobile-­‐ranking-­‐techniques-­‐relevancy-­‐ factors-­‐209418     §  Google  Quality  Guidelines   https://support.google.com/webmasters/answer/66353     Readability is a ranking factor!
  90. 90. #SMX #12D @sharithurow Google’s Mobile Friendly Test: https://www.google.com/webmasters/tools/mobile-­‐friendly/    
  91. 91. #SMX #12D @sharithurow §  Readers  with  limited  vision   §  Tiny  screens   §  Glare  and  poor  lighting   §  Low-­‐quality  monitors   Be aware of:
  92. 92. #SMX #12D @sharithurow Is this text easy to read? …to scan? Search  Engine  Optimization  is  an  important  part  of  any  search  engine  marketing  initiative.  Some  people  believe  that   submitting  the  site  to  search  engines  alone  is  sufficient  in  getting  top-­‐10  rankings.  This  is  not  true.  Search  engine   submission  only  announces  your  site's  existence  to  the  search  engines.  To  get  a  good  search  engine  ranking,  it  is   important  that  you  carry  out  title  tag  optimization,  meta  tags  optimization,  and  anchor  text  optimization  of  your   website  amongst  other  SEO  techniques.  You'll  need  to  optimize  the  visible  text  of  your  site  through  SEO  copywriting   after  extensive  keyword  phrase  search.  It  is  also  important  to  boost  your  Google  PageRank  in  order  to  get  a  good   website  ranking.  You  can  increase  PageRank  of  your  site  by  building  your  site's  link  popularity  through  a  link  building   campaign.  A  link  exchange  campaign  with  good  industry  relevant  sites  is  the  simplest  way  to  get  several  incoming  links   to  promotion.  Remember,  search  engine  positioning  is  a  powerful  media  for  your  website  promotion.  While  the  above   example  seems  like  overkill,  this  is  just  to  illustrate  how  you  can  accommodate  your  important  keyword  phrases  by   carefully  rewording  the  text  of  your  web  pages.  If  you  feel  that  the  standard  blue,  underlined  hyperlinks  appear  ugly  on   your  website,  then  you  can  reformat  its  HTML  markup  code  to  change  color  of  the  text  and  get  rid  of  the  underline   without  losing  the  power  of  the  anchor  texts.    
  93. 93. #SMX #12D @sharithurow How about this fat footer?
  94. 94. #SMX #12D @sharithurow §  Distinguishable   §  Scannable   §  Clickable/tappable   §  Predictable   §  Consistent   2. Easy to navigate:
  95. 95. #SMX #12D @sharithurow Google’s Mobile Friendly Test: https://www.google.com/webmasters/tools/mobile-­‐friendly/    
  96. 96. #SMX #12D @sharithurow “Small  children  like  minesweeping  (passing  the  mouse  around  the  screen  to  see  what's   hidden)…  
  97. 97. #SMX #12D @sharithurow “…but  teenagers  don’t  like  it…”  
  98. 98. #SMX #12D @sharithurow “…and  adults  hate  it.”                Jakob  Nielsen,  Principal   http://www.nngroup.com/articles/top-­‐10-­‐ia-­‐mistakes/  
  99. 99. #SMX #12D @sharithurow §  Before  users  arrive  (information  scent)   §  After  they  arrive  (orientation/placemaking)   3. Easy to find:
  100. 100. #SMX #12D @sharithurow 2 1
  101. 101. #SMX #12D @sharithurow 1 2
  102. 102. #SMX #12D @sharithurow Content  should  be  accessible  within  3  clicks  or  less  from  the   home  page.  
  103. 103. #SMX #12D @sharithurow If this rule were true: ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ Site  Map   Content  Content   ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ ___ Home   Site  Map   Content  
  104. 104. #SMX #12D @sharithurow §  Go  directly  to  the  relevant  page     §  Within  7-­‐8  clicks,  preferably  less,  as  long  as…   §  Please  see:   –  Testing  the  3-­‐Click  Rule   http://www.uie.com/articles/three_click_rule/     –  User  Experience  Myth  Or  Truth:  The  Three-­‐Click  (Or   Tap)  Rule   http://marketingland.com/user-­‐experience-­‐myth-­‐truth-­‐ three-­‐click-­‐tap-­‐rule-­‐104760     Easy to find after arriving:
  105. 105. #SMX #12D @sharithurow Before:   After:  
  106. 106. #SMX #12D @sharithurow “…well-­‐designed,  easy-­‐to-­‐use  navigation  is  important  in  establishing  credibility,   authority,  and  trust.”   Kalbach,  J.  (2007).  Designing  Web  Navigation.  O’Reilly.  
  107. 107. #SMX #12D @sharithurow §  Design/formatting   §  Layout   §  Labeling   4. Consistency & clarity:
  108. 108. #SMX #12D @sharithurow Peter Morville’s User Experience Honeycomb findable   desirable   useful   valuable   accessible   credible   usable   http://semanticstudios.com/user_experience_design/
  109. 109. #SMX #12D @sharithurow §  Actual  download  time  –  machine  speed   §  Perceived  download  time  –  human  speed   5. Quick to download:
  110. 110. #SMX #12D @sharithurow What Google measures:
  111. 111. #SMX #12D @sharithurow 1.  Easy  to  read   2.  Easy  to  navigate   3.  Easy  to  find   4.  Consistency  and  clarity  in  layout,  design,  and  labeling   5.  Quick  to  download   5 Universal Rules of Website Design To remember:
  112. 112. #SMX #12D @sharithurow HOME PAGE EXAMPLES
  113. 113. #SMX #12D @sharithurow §  Keyword-­‐focused  text  (when  possible)   §  At  least  one  spider-­‐friendly  navigation  scheme   §  Links  to  the  most  important  sections  on  your  site   §  Visible  link  to  a  site  map  or  site  index   §  Recommended  reading:   http://www.nngroup.com/articles/113-­‐design-­‐guidelines-­‐homepage-­‐usability/     Items that should appear on a home page:
  114. 114. #SMX #12D @sharithurow For searchers For search engines §  Easy  to  read   §  Easy  to  navigate   §  Easy  to  find   §  Consistent  and  clear  in  layout,  design,   and  labeling   §  Quick  to  download     In summary: §  Keywords  &  labels   §  Accessibility  &  navigation   §  High-­‐quality  link  development   §  Accommodate  searcher  goals  &   behaviors  
  115. 115. #SMX #12D @sharithurow Content is King. Context is the Kingdom.
  116. 116. #SMX #12D @sharithurow Recommended readings:
  117. 117. #SMX #12D @sharithurow Questions? Shari  Thurow,  Founder  and  SEO  Director   Omni  Marketing  Interactive   sthurow@search-­‐usability.com  
  118. 118. #SMX #12D @sharithurow SEE YOU AT THE NEXT #SMX THANK YOU!

×