Website Design Best Practices
How to Increase Conversion and Drive Revenue:
- design conventions that are proven to drive conversion
- technologies you can use to better engage website visitors
- tools to measure and quantify performance
Enhancing and Restoring Safety & Quality Cultures - Dave Litwiller - May 2024...
Afri-Tech 2011 Website Design Best-Practices
1. Christopher Harmon
Principal
theBATstudio
chris@thebatstudio.com
linkedIn: h=p://www.linkedin.com/in/cjharmon
twi=er: cjharmon
Website Design Best Practices
How to Increase Conversion and Drive Revenue:
• design conventions that are proven to drive conversion
• technologies you can use to better engage website visitors
• tools to measure and quantify performance
AFRI-TECH SUMMIT 2011 | 1
2. Brand, Art & Technology
Strategy, design and interactive consulting that realizes
tangible business value.
• US-Based
®
• 80/20 US vs International
Clientele
• Recognized as a top-agency
by B2B Magazine
• 10+ of top 20 SaaS Companies
• Virtual Organization
AFRI-TECH SUMMIT 2011 | 2
5. Website Design Best Practices > Agenda
• Design conventions that drive conversion
> Focus on Usability
• Technologies you can use to better engage website visitors
> CRM / MAS / Identification / Targeting
• Tools to measure and quantify performance
> Site metrics vs Behavioral Metrics
AFRI-TECH SUMMIT 2011 | 5
7. “
The broad goal of usability should be to:
• Present the information to the user in a clear and
concise way.
• To give the correct choices to the users, in a very
obvious way.
• To remove any ambiguity regarding the consequences
of an action e.g. clicking on delete/remove/purchase.
• Put the most important thing in the right place on a
web page or a web application
Source: Wikipedia
AFRI-TECH SUMMIT 2011 | 7
40. Eloqua
•Second Gen
Segmentation
•Multi-Dimensional
•Use of banner for top
level activity-based
segmentation
•Use of a simple, clear
and easy
segmentation nav
module
•Extends throughout
website experience
AFRI-TECH SUMMIT 2011 | 22
41. Eloqua
•Second Gen
Segmentation
•Multi-Dimensional
•Use of banner for top
level activity-based
segmentation
•Use of a simple, clear
and easy
segmentation nav
module
•Extends throughout
website experience
AFRI-TECH SUMMIT 2011 | 22
42. Eloqua
•Second Gen
Segmentation
•Multi-Dimensional
•Use of banner for top
level activity-based
segmentation
•Use of a simple, clear
and easy
segmentation nav
module
•Extends throughout
website experience
AFRI-TECH SUMMIT 2011 | 22
44. Clear Information Hierarchy
• Prioritize Messaging
➡ Create a Messaging Funnel
• Develop Sitemap & Wireframes
➡ Validate Against Personas
• Translate into Visual Designs
➡ Validate
• Monitor and Test
NOTE: there is no ONE right way.
AFRI-TECH SUMMIT 2011 | 24
45. Basecamp
1.Who are we and what
do we do?
2.Notice the seal of
customer approval!
3.Now that you’re ready
– go ahead and
click on our CTA
4.Not ready yet? Check
out these clients
and get additional
immediate insight
into what we do…
AFRI-TECH SUMMIT 2011 | 25
46. Basecamp
1.Who are we and what
do we do?
2.Notice the seal of
customer approval!
3.Now that you’re ready
– go ahead and
click on our CTA
4.Not ready yet? Check
out these clients
and get additional
immediate insight
into what we do…
AFRI-TECH SUMMIT 2011 | 25
47. Basecamp
1.Who are we and what
do we do?
2.Notice the seal of
customer approval!
3.Now that you’re ready
– go ahead and
click on our CTA
4.Not ready yet? Check
out these clients
and get additional
immediate insight
into what we do…
AFRI-TECH SUMMIT 2011 | 25
48. Basecamp
1.Who are we and what
do we do?
2.Notice the seal of
customer approval!
3.Now that you’re ready
– go ahead and
click on our CTA
4.Not ready yet? Check
out these clients
and get additional
immediate insight
into what we do…
AFRI-TECH SUMMIT 2011 | 25
49. Basecamp
1.Who are we and what
do we do?
2.Notice the seal of
customer approval!
3.Now that you’re ready
– go ahead and
click on our CTA
4.Not ready yet? Check
out these clients
and get additional
immediate insight
into what we do…
AFRI-TECH SUMMIT 2011 | 25
51. Content is King
• Inventory Content Assets
• Map Assets against Segmentation
• Map Assets against Information Hierarchy
• Prioritize
• Monitor
AFRI-TECH SUMMIT 2011 | 27
52. Eloqua
1.Present easily
digestible pieces of
content, ideally
utilizing headers,
sub-heads,
bulleted-lists and
call-outs
2.Present alternative
forms of content
such as video,
information
graphics, etc
3.Provide easy access
to contextually
related experiences
AFRI-TECH SUMMIT 2011 | 28
53. Eloqua
1.Present easily
digestible pieces of
content, ideally
utilizing headers,
sub-heads,
bulleted-lists and
call-outs
2.Present alternative
forms of content
such as video,
information
graphics, etc
3.Provide easy access
to contextually
related experiences
AFRI-TECH SUMMIT 2011 | 28
54. Eloqua
1.Present easily
digestible pieces of
content, ideally
utilizing headers,
sub-heads,
bulleted-lists and
call-outs
2.Present alternative
forms of content
such as video,
information
graphics, etc
3.Provide easy access
to contextually
related experiences
AFRI-TECH SUMMIT 2011 | 28
55. Eloqua
1.Present easily
digestible pieces of
content, ideally
utilizing headers,
sub-heads,
bulleted-lists and
call-outs
2.Present alternative
forms of content
such as video,
information
graphics, etc
3.Provide easy access
to contextually
related experiences
AFRI-TECH SUMMIT 2011 | 28
58. Marketing Automation Solutions
Marketo
1.Create Email
Campaigns and
Programs
2.Capture Leads
3.Use Lead Scoring
4.Use Lead Nurturing
5.Analyze Results
AFRI-TECH SUMMIT 2011 | 31
59. Real-Time Identification
Demandbase
1.Sense IP Address
2.Match against
proprietary
database
3.Use custom fields
Text
4.Customize experience
AFRI-TECH SUMMIT 2011 | 32
60. Real-Time Identification
Demandbase
1.Sense IP Address
2.Match against
proprietary
database
3.Use custom fields
Text
4.Customize experience
AFRI-TECH SUMMIT 2011 | 32
61. Real-Time Identification
Demandbase
1.Sense IP Address
2.Match against
proprietary
database
3.Use custom fields
Text
4.Customize experience
AFRI-TECH SUMMIT 2011 | 32
62. Real-Time Identification
Demandbase
1.Sense IP Address
2.Match against
proprietary
database
3.Use custom fields
Text
4.Customize experience
AFRI-TECH SUMMIT 2011 | 32
63. Real-Time Identification
Demandbase
1.Sense IP Address
2.Match against
proprietary
database
3.Use custom fields
Text
4.Customize experience
AFRI-TECH SUMMIT 2011 | 32
64. Content Targeting & Testing
Adobe Test &
Target
1.Select Content Areas
for Testing
2.Use A/B or multi-
variate testing on
text, images, offers
or even design
3.Automatically
optimize
4.whichtestwon.com/
AFRI-TECH SUMMIT 2011 | 33
66. Lead Scoring / Conversion Analysis
Marketo
1.Differentiate leads
based on
meaningful data
2.Automatically deliver
leads to different
parts of the funnel
based on that data
3.Creates an
objectives-based
model for tracking
leads, prospects
and opportunities
AFRI-TECH SUMMIT 2011 | 35
68. Heat Mapping
Crazy Egg
1.Real-Click technology
2.Presents a variety of
heatmap options
3.Use data to validate
or identify usability
issues
AFRI-TECH SUMMIT 2011 | 37
69. Reputation Analytics
Post Rank
1.Track key social
media content the
same way search
engines do
2.Develop insights into
which types of
content deliver
more influence
3.Focus resources and
assets around
content that
converts
AFRI-TECH SUMMIT 2011 | 38
71. • Always put the user first
• Use technology to improve the experience
➡ Not as a crutch
➡ Not for the cool factor
• Set clear objective and measure performance
➡ But don’t lose sight of the user
AFRI-TECH SUMMIT 2011 | 40
72. Christopher Harmon
Principal
theBATstudio
chris@thebatstudio.com
linkedIn: h=p://www.linkedin.com/in/cjharmon
twi=er: cjharmon
Website Design Best Practices
How to Increase Conversion and Drive Revenue:
• design conventions that are proven to drive conversion
• technologies you can use to better engage website visitors
• tools to measure and quantify performance
AFRI-TECH SUMMIT 2011 | 41
Notas del editor
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
\n
What is the first read? The second read? Do you know what Revenue Cycle Analytics are?\n
What is the first read? The second read? Do you know what Revenue Cycle Analytics are?\n
What is the first read? The second read? Do you know what Revenue Cycle Analytics are?\n
What is the first read? The second read? Do you know what Revenue Cycle Analytics are?\n
What is the first read? The second read? Do you know what Revenue Cycle Analytics are?\n
What do they want you to do on this website?\n
Which button should you press?\n
Which button should you press?\n
Which button should you press?\n
Which button should you press?\n
Which button should you press?\n
Out of the 9 graphics supported Calls-to-Action, which is the most important?\n
Out of the 9 graphics supported Calls-to-Action, which is the most important?\n
Out of the 9 graphics supported Calls-to-Action, which is the most important?\n
Out of the 9 graphics supported Calls-to-Action, which is the most important?\n
Out of the 9 graphics supported Calls-to-Action, which is the most important?\n
Can anyone here find what there looking for on a menu like this? It’s kind of like going to a restaurant and trying to decide what to eat...\n
This is the FIFTH banner... with each banner rotating every 8 seconds... That’s 40 seconds before you see this... What is your average time per visit? per page?\n
This is the FIFTH banner... with each banner rotating every 8 seconds... That’s 40 seconds before you see this... What is your average time per visit? per page?\n
This is the FIFTH banner... with each banner rotating every 8 seconds... That’s 40 seconds before you see this... What is your average time per visit? per page?\n
where do you learn about Oracle On Demand - the topic this page is supposed to support?\n
whose eyes are glazing over?\n
where doe the real content start?\n
What do they want you to do - specific to this page?\n