Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd Logo
Upload

Welcome to Scribd!

  • 27 views

    Content Page Design Best Practices: Luke Wroblewski

    Uploaded by

    R
    Luke Wroblewski gave a presentation at the IASUMMIT in April 2008 about content page design best practices. He discussed how people have short attention spans online and only spend a few seconds on most pages. It is important to have a clear visual hierarchy over site hierarchy and keep pages short, concise and scannable. Related calls to action should be limited in number and thoughtfully presented so they are noticed. Building immediate credibility through design and leveraging context are also best practices.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd

    Content Page Design Best Practices: Luke Wroblewski

    Uploaded by

    R
    27 views40 pages
    Luke Wroblewski gave a presentation at the IASUMMIT in April 2008 about content page design best practices. He discussed how people have short attention spans online and only spend a few seconds on most pages. It is important to have a clear visual hierarchy over site hierarchy and keep pages short, concise and scannable. Related calls to action should be limited in number and thoughtfully presented so they are noticed. Building immediate credibility through design and leveraging context are also best practices.

    Original Title

    contentpages_lukew_04072008

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Luke Wroblewski gave a presentation at the IASUMMIT in April 2008 about content page design best practices. He discussed how people have short attention spans online and only spend a few seconds on most pages. It is important to have a clear visual hierarchy over site hierarchy and keep pages short, concise and scannable. Related calls to action should be limited in number and thoughtfully presented so they are noticed. Building immediate credibility through design and leveraging context are also best practices.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    27 views40 pages

    Content Page Design Best Practices: Luke Wroblewski

    Uploaded by

    R
    Luke Wroblewski gave a presentation at the IASUMMIT in April 2008 about content page design best practices. He discussed how people have short attention spans online and only spend a few seconds on most pages. It is important to have a clear visual hierarchy over site hierarchy and keep pages short, concise and scannable. Related calls to action should be limited in number and thoughtfully presented so they are noticed. Building immediate credibility through design and leveraging context are also best practices.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Download as PDF, TXT or read online from Scribd
    Download as pdf or txt
    of 40

    CONTENT PAGE DESIGN BEST PRACTICES

    LUKE WROBLEWSKI IASUMMIT, APRIL 2008

    Luke Wroblewski
    Yahoo! Inc. Senior Director, Product Ideation & Design LukeW Interface Designs Principal & Founder Product design & strategy services Author Site-Seeing: A Visual Approach to Web Usability (Wiley & Sons) Form Design Best Practices (Rosenfeld Media) Upcoming Functioning Form: Web applications, product strategy, & interface design articles Previously eBay Inc., Lead Designer University of Illinois, Instructor NCSA, Senior Designer http://www.lukew.com

    NCSA in 1995

    A few years later

    We optimize for this.

    Web content lives in this.

    Site Hierarchy

    Web Ecosystem

    Thanks to Tom Chi for the types!

    Site Hierarchy

    Web Ecosystem

    5%
    Your situation may vary.

    95%

    85%

    15%
    7

    Understanding this context

    Communication

    Communication

    10

    Communication

    11

    Communication

    12

    Display Surfaces
    13

    Display Surfaces
    14

    Content Creators

    15

    Content Creators

    16

    Content Aggregators

    17

    Content Aggregators

    18

    Content Aggregators

    19

    Search

    20

    10

    Search

    21

    People come from different contexts

    What happens when they arrive?


    22

    11

    23

    CONTEXT

    RELATED

    CONTENT

    24

    12

    CONTENT

    25

    Keep links & titles in synch

    26

    13

    27

    28

    14

    24% CONTENT 76% SITE OVERHEAD

    29

    Make content your focus

    30

    15

    Squidoo Eye-tracking study (by etre)

    31

    No Clear Hierarchy

    32

    16

    No Clear Hierarchy

    33

    Visual Hierarchy

    34

    17

    People dont stay long. Across 650,000 URIs tested 25% of all documents were displayed for less than 4 seconds and 52% of all visits were shorter than 10 seconds Peak value was located between 2 and 3 seconds

    Source: Clickstream Study Reveals Dynamic Web, Weboptimization.com

    35

    Keep it short.

    36

    18

    Short Attention Span Theater

    37

    Deliver on promises made (even if you dont make them)

    BEST PRACTICES

    Favor visual hierarchy over site hierarchy Short, concise, and scannable provides the option for further engagement

    38

    19

    RELATED

    39

    40

    20

    Spare us your site map

    41

    42

    21

    Access to everything. Always.

    43

    44

    22

    Access to what matters now.

    45

    46

    23

    47

    48

    24

    49

    50

    25

    51

    Related detours

    52

    26

    Related Actions

    53

    Related Content? No Problem.

    54

    27

    Decision Paralysis

    Decision Quality

    They choose whats most simple.

    When presented with too many options, people dont use difficult criteria to decide. They choose whats most simple.

    When faced with a higher number of options, less people end up making a choice

    55

    56

    28

    57

    People are great at tuning things out.

    Source: Nielsen/Norman Group images, USC Annenburg

    58

    29

    People are great at tuning things out.

    59

    Getting related calls to action noticed.

    60

    30

    Getting related calls to action noticed.

    61

    On search results pages Decreased viewing has big impact on clickthrough If viewing of a link falls from 80% to 60% The initial probability the link will be selected falls by over 50%

    If you dont see it, you wont click it.

    Source: EyeTools Google Checkout Addendum, SendTec, Inc.

    62

    31

    63

    64

    32

    65

    If you make good on content, related calls to action (CTAs) are welcome

    BEST PRACTICES

    Limit the number of choices people have to make Think through the presentation of related CTAs

    66

    33

    CONTEXT

    67

    68

    34

    Source: Stanford Guidelines for Web Credibility.

    Who you going to trust?

    We find that people quickly evaluate a site by visual design alone. Design your site so it looks professional (or is appropriate for your purpose)

    69

    70

    35

    Who you going to trust?

    71

    72

    36

    73

    74

    37

    75

    76

    38

    77

    Utilize the minimum amount necessary to set site context

    BEST PRACTICES

    Build immediate credibility through the presentation layer See if you can leverage the origin

    78

    39

    CONTENT

    RELATED

    CONTEXT
    79

    For more information


    Functioning Form
    www.lukew.com/ff/

    Web Form Design: Filling in the Blanks


    15% OFF! IAS08WFD

    Site-Seeing: A Visual Approach to Web Usability


    Wiley & Sons

    Drop me a note
    luke@lukew.com

    80

    40

    You might also like