Practical Roadmap to
High Performance
Websites
Razvan Neagu
MARKET
BUILD
CREATE
PLAN
ANALYZE
Failing to plan is
planning to fail.
Alan Lakein
Practical Roadmap to High Performance We...
PLAN 5 Aspects
Practical Roadmap to High Performance Websites – ISV Con 2013 3
1
Strategy
2
Scope
3
Structure
4
Skeleton
5...
PLAN 5 Aspects
Practical Roadmap to High Performance Websites – ISV Con 2013 4
1
Strategy
2
Scope
3
Structure
4
Skeleton
5...
Practical Roadmap to High Performance Websites – ISV Con 2013 5
PLAN 1. Strategy
•Identify existing conditions
•Define dat...
Practical Roadmap to High Performance Websites – ISV Con 2013 6
PLAN 1. Strategy: Buying Flow
Lead
ATTRACT NURTURE CLOSE D...
Practical Roadmap to High Performance Websites – ISV Con 2013 7
PLAN 1. Strategy: Personas
PAIN POINTS
MESSAGES
TOPICS & C...
Practical Roadmap to High Performance Websites – ISV Con 2013 8
PLAN 1. Strategy: Priority Pyramid
CONTENT
USABILITY
SEO
S...
PLAN 5 Aspects
Practical Roadmap to High Performance Websites – ISV Con 2013 9
1
Strategy
2
Scope
3
Structure
4
Skeleton
5...
PLAN 2. Scope
Practical Roadmap to High Performance Websites – ISV Con 2013 10
• CMS
• Forms (contact, quote)
• Newsletter...
PLAN 5 Aspects
Practical Roadmap to High Performance Websites – ISV Con 2013 11
1
Strategy
2
Scope
3
Structure
4
Skeleton
...
PLAN 3. Structure: Sitemap
Practical Roadmap to High Performance Websites – ISV Con 2013 12
NESTED LIST
•Identify all page...
PLAN 3. Structure: Persona Driven
Practical Roadmap to High Performance Websites – ISV Con 2013 13
Stranger
Visitor
Lead
C...
PLAN 5 Aspects
Practical Roadmap to High Performance Websites – ISV Con 2013 14
1
Strategy
2
Scope
3
Structure
4
Skeleton
...
PLAN 4. Skeleton: Page Structure
Practical Roadmap to High Performance Websites – ISV Con 2013 15
PAGE TYPES
•Home
•Conten...
PLAN 5 Aspects
Practical Roadmap to High Performance Websites – ISV Con 2013 16
1
Strategy
2
Scope
3
Structure
4
Skeleton
...
PLAN 5. Surface: UI Library
Practical Roadmap to High Performance Websites – ISV Con 2013 17
Practical Roadmap to High Performance Websites – ISV Con 2013 18
MARKET
BUILD
CREATE
PLAN
ANALYZE
An essential aspect
of creativity is not
being afraid to fail.
Edwin Land
Practical Roadm...
CREATE Page Template
Practical Roadmap to High Performance Websites – ISV Con 2013 20
•Title: URL, long, short
•Keyword (o...
CREATE Write Copy
Practical Roadmap to High Performance Websites – ISV Con 2013 21
•Bottoms-up
•Heading structure (helps u...
Five Most Persuasive Words in English
Practical Roadmap to High Performance Websites – ISV Con 2013 22
CREATE Persuasive C...
CREATE Layout & Design
Practical Roadmap to High Performance Websites – ISV Con 2013 23
•Prioritize goals
•Guide attention...
CREATE F-Shaped Reading Pattern
Practical Roadmap to High Performance Websites – ISV Con 2013 24
MARKET
BUILD
CREATE
PLAN
ANALYZE
Build a better
mousetrap and the
world will beat a
path to your door.
Ralph Waldo Emerson...
•CMS: WordPress.org
•Webhost: WP Engine vs. Hostgator
•Setup (install, tweaks, plugins, theme)
•Content production
•Design...
BUILD WordPress: Plugins
Practical Roadmap to High Performance Websites – ISV Con 2013 27
FIND & EVALUATE
•wordpress.org/p...
BUILD WordPress: Great Plugins
Practical Roadmap to High Performance Websites – ISV Con 2013 28
EXTEND
• Gravity Forms
• C...
MARKET
BUILD
CREATE
PLAN
ANALYZE
Marketing is too
important to be
left to the
marketing
department.
David Packard
Practica...
MARKET Trend
Practical Roadmap to High Performance Websites – ISV Con 2013 30
vs
Practical Roadmap to High Performance Websites – ISV Con 2013 31
Blogging
Social media
SEO
Video
Email blasts to
approved ...
MARKET Traffic
Practical Roadmap to High Performance Websites – ISV Con 2013 32
Content
Influencers
Syndication
Search
Pai...
MARKET Segment
Practical Roadmap to High Performance Websites – ISV Con 2013 33
• Categories
• Headlines
• Information
• C...
MARKET Challenge
Practical Roadmap to High Performance Websites – ISV Con 2013 34
Content Marketing Institute
2013 B2B Sma...
MARKET Top Funnel Content Ideas
Practical Roadmap to High Performance Websites – ISV Con 2013 35
SWEETSPOT Engage Your
Org...
• Video
• RSS Feeds
• News Sites
• Blogs
• Trade Pubs
• Twitter
• Journals
• Infographics (visual.ly)
• Competitor content...
MARKET Content Creation Rules
RULES
Of Content
Marketing
❶Non promotional
❷Relevant to reader
❸Closes a gap
❹Well-written
...
MARKET Micro Conversion Funnel
Practical Roadmap to High Performance Websites – ISV Con 2013 38
STRANGERS
VISITORS
LEADS
Q...
• Ebooks and whitepapers
• Contests and promotions
• Product Purchases
• Email newsletter subscription
• Free trial
• Cont...
MARKET CTA Above Fold: 5 Elements
Practical Roadmap to High Performance Websites – ISV Con 2013 40
Compelling and Descript...
MARKET 7 Principles of Conversion
DESIGN
1. Encapsulation
2. Contrast & color
3. Directional cues
4. White space
PSYCHOLOG...
Logo
ATTENTION GRABBING HEADLINE
FEATURES & BENEFITS DETAILS
TEASER HEADLINE
GOES HERE
This is only placeholder text
used ...
MARKET
Logo
ATTENTION GRABBING HEADLINE
Identify Major Benefit
This is only placeholder text used
as a filler. This is onl...
MARKET Continuous Content Strategy
Practical Roadmap to High Performance Websites – ISV Con 2013 44
Tweet
Tweet
Tweet
Idea...
MARKET Editorial Calendar
 Website page Blog post  White paper  Product review
 Company news  Email campaign  Socia...
MARKET
BUILD
CREATE
PLAN
ANALYZE
Get the habit of
analysis; it will in
time enable
synthesis to
become your habit
of mind....
Analyze Keys to ROI
Practical Roadmap to High Performance Websites – ISV Con 2013 47
UniqueVisitors
Newvs.RepeatVisitors
T...
Contact
komotion.com/contact-us
Resources
komotion.com
Razvan (Raz) Neagu
Upcoming SlideShare
Loading in …5
×

Practical Roadmap to High Performance Websites

642 views

Published on

Learn the most important things to do when building or revising a website. Step-by step through each of the five phases: planning, content creation, building, marketing and analyzing. Presented at ISV Con 2013 in Reno, NV.

Published in: Business, Technology, Design
  • Be the first to comment

Practical Roadmap to High Performance Websites

  1. 1. Practical Roadmap to High Performance Websites Razvan Neagu
  2. 2. MARKET BUILD CREATE PLAN ANALYZE Failing to plan is planning to fail. Alan Lakein Practical Roadmap to High Performance Websites – ISV Con 2013 2
  3. 3. PLAN 5 Aspects Practical Roadmap to High Performance Websites – ISV Con 2013 3 1 Strategy 2 Scope 3 Structure 4 Skeleton 5 Surface
  4. 4. PLAN 5 Aspects Practical Roadmap to High Performance Websites – ISV Con 2013 4 1 Strategy 2 Scope 3 Structure 4 Skeleton 5 Surface
  5. 5. Practical Roadmap to High Performance Websites – ISV Con 2013 5 PLAN 1. Strategy •Identify existing conditions •Define data-driven goals •Define brand & unique value proposition •Define buyer persona •Identify top competitive keywords •Analyze competition •Inventory your assets (most… pages) •Resources (team, roles, budget, timeline) •Getting it up *and* ongoing production
  6. 6. Practical Roadmap to High Performance Websites – ISV Con 2013 6 PLAN 1. Strategy: Buying Flow Lead ATTRACT NURTURE CLOSE DELIGHT Customer AdvocateVisitorStranger Content about prospect’s interests Match prospect need with company interest The right offer at the right time Drive satisfaction and brand advocacy 1 2 3 4
  7. 7. Practical Roadmap to High Performance Websites – ISV Con 2013 7 PLAN 1. Strategy: Personas PAIN POINTS MESSAGES TOPICS & CONTENT PIECES FEATURES & BENEFITS NAME AGE JOB EXPERIENCE INTERESTS M/F GOALS & ASPIRATIONS
  8. 8. Practical Roadmap to High Performance Websites – ISV Con 2013 8 PLAN 1. Strategy: Priority Pyramid CONTENT USABILITY SEO SOCIAL PPC
  9. 9. PLAN 5 Aspects Practical Roadmap to High Performance Websites – ISV Con 2013 9 1 Strategy 2 Scope 3 Structure 4 Skeleton 5 Surface
  10. 10. PLAN 2. Scope Practical Roadmap to High Performance Websites – ISV Con 2013 10 • CMS • Forms (contact, quote) • Newsletter subscription • Ecommerce, donations • Blog, comments, reviews • Ads • Photo albums • Member only area • Paid membership • …more… • Download center • Events calendar • Polls • Discussion forum • Video • Social media integration • Multi-lingual • Helpdesk • Knowledge base • …more…
  11. 11. PLAN 5 Aspects Practical Roadmap to High Performance Websites – ISV Con 2013 11 1 Strategy 2 Scope 3 Structure 4 Skeleton 5 Surface
  12. 12. PLAN 3. Structure: Sitemap Practical Roadmap to High Performance Websites – ISV Con 2013 12 NESTED LIST •Identify all pages •Identify page title •Identify parent •Identify menus TIPS •Allow sub-pages •Color code, icons DRIVERS •Personas •Tasks •Keywords APPROACH •Top-down •Flatter hierarchy
  13. 13. PLAN 3. Structure: Persona Driven Practical Roadmap to High Performance Websites – ISV Con 2013 13 Stranger Visitor Lead Customer Buying Stage Advocate Issues & Topics
  14. 14. PLAN 5 Aspects Practical Roadmap to High Performance Websites – ISV Con 2013 14 1 Strategy 2 Scope 3 Structure 4 Skeleton 5 Surface
  15. 15. PLAN 4. Skeleton: Page Structure Practical Roadmap to High Performance Websites – ISV Con 2013 15 PAGE TYPES •Home •Content •Parent •Landing •Lead generator •Conversion •… SEND
  16. 16. PLAN 5 Aspects Practical Roadmap to High Performance Websites – ISV Con 2013 16 1 Strategy 2 Scope 3 Structure 4 Skeleton 5 Surface
  17. 17. PLAN 5. Surface: UI Library Practical Roadmap to High Performance Websites – ISV Con 2013 17
  18. 18. Practical Roadmap to High Performance Websites – ISV Con 2013 18
  19. 19. MARKET BUILD CREATE PLAN ANALYZE An essential aspect of creativity is not being afraid to fail. Edwin Land Practical Roadmap to High Performance Websites – ISV Con 2013 19
  20. 20. CREATE Page Template Practical Roadmap to High Performance Websites – ISV Con 2013 20 •Title: URL, long, short •Keyword (one search keyword per page) •Purpose (page goal, editorial directive) •Description (meta, parent) •Media (images, video, etc.) •Interactive elements •Links •Guided next step
  21. 21. CREATE Write Copy Practical Roadmap to High Performance Websites – ISV Con 2013 21 •Bottoms-up •Heading structure (helps user and SEO) •Keep it short (break/group in 3-5) •Promote quick scan (lists, formatting) •Start with the take-away •Goal: fast and easy comprehension •Test “cognitive throughput” 1, 5, 20, 60 seconds and 5 minutes
  22. 22. Five Most Persuasive Words in English Practical Roadmap to High Performance Websites – ISV Con 2013 22 CREATE Persuasive Copywriting
  23. 23. CREATE Layout & Design Practical Roadmap to High Performance Websites – ISV Con 2013 23 •Prioritize goals •Guide attention • Encapsulation • Contrast & color • Directional cues • White space Wikipedia Wallpaperswide.com
  24. 24. CREATE F-Shaped Reading Pattern Practical Roadmap to High Performance Websites – ISV Con 2013 24
  25. 25. MARKET BUILD CREATE PLAN ANALYZE Build a better mousetrap and the world will beat a path to your door. Ralph Waldo Emerson Practical Roadmap to High Performance Websites – ISV Con 2013 25
  26. 26. •CMS: WordPress.org •Webhost: WP Engine vs. Hostgator •Setup (install, tweaks, plugins, theme) •Content production •Design library (involve a designer) •Maintenance BUILD Tools & Services Practical Roadmap to High Performance Websites – ISV Con 2013 26 WordPress powers more than 17% of the web
  27. 27. BUILD WordPress: Plugins Practical Roadmap to High Performance Websites – ISV Con 2013 27 FIND & EVALUATE •wordpress.org/plugins/ (not from dashboard) •Stats – Last update – Ratings distribution – Download pattern •Support •Screenshots •Test on staging site
  28. 28. BUILD WordPress: Great Plugins Practical Roadmap to High Performance Websites – ISV Con 2013 28 EXTEND • Gravity Forms • Configure SMTP • NextGen Gallery • JW Player 6 Plugin for WP • Hana Code Insert • Custom Google Search OPTIMIZE • CMS Tree Page View • Enable Media Replace • Regenerate Thumbnails IMPROVE •W3 Total Cache •Cleaner Gallery •Broken Link Checker •Redirection PROTECT •BackupBuddy •All In One WP Security •Sucuri Security – SiteCheck •WordPress File Monitor Plus •Akismet
  29. 29. MARKET BUILD CREATE PLAN ANALYZE Marketing is too important to be left to the marketing department. David Packard Practical Roadmap to High Performance Websites – ISV Con 2013 29
  30. 30. MARKET Trend Practical Roadmap to High Performance Websites – ISV Con 2013 30 vs
  31. 31. Practical Roadmap to High Performance Websites – ISV Con 2013 31 Blogging Social media SEO Video Email blasts to approved lists Consumer-driven, timely, content rich, solutions based Broadcast and print ads Cold calling Telemarketing Tradeshows Email blasts to purchased lists vs Market-driven, disruptive, hard sell, product based
  32. 32. MARKET Traffic Practical Roadmap to High Performance Websites – ISV Con 2013 32 Content Influencers Syndication Search Paid • Identify • Relationship • Goal: Backlink • Monitor • Keywords • Optimize • Editorial calendars • Guest blogger • Content aggregators • SEM • Facebook ads • Sponsored Tweets
  33. 33. MARKET Segment Practical Roadmap to High Performance Websites – ISV Con 2013 33 • Categories • Headlines • Information • Calls to action • Concerns • Questions Stranger Visitor Lead Customer Advocate Topics Issues Frank DevinSarah
  34. 34. MARKET Challenge Practical Roadmap to High Performance Websites – ISV Con 2013 34 Content Marketing Institute 2013 B2B Small Business Content Marketing Trends – N. America 64% 54%
  35. 35. MARKET Top Funnel Content Ideas Practical Roadmap to High Performance Websites – ISV Con 2013 35 SWEETSPOT Engage Your Organization Social Listening Buyer Interviews SEO Keywords Sales Requests Personal Interests CUSTOMERBRAND Unique Expertise & Value Interests & Needs SHIFT
  36. 36. • Video • RSS Feeds • News Sites • Blogs • Trade Pubs • Twitter • Journals • Infographics (visual.ly) • Competitor content • News feeds (NY Times) • Archives (PubMed) • Google Alerts (+RSS feed) • Google News • Crowdsourcing • Newsletters • Forums • PR Team MARKET Content Curation Sources Practical Roadmap to High Performance Websites – ISV Con 2013 36
  37. 37. MARKET Content Creation Rules RULES Of Content Marketing ❶Non promotional ❷Relevant to reader ❸Closes a gap ❹Well-written ❺Relevant to your brand ❻Gives proof ❼Converts Practical Roadmap to High Performance Websites – ISV Con 2013 37
  38. 38. MARKET Micro Conversion Funnel Practical Roadmap to High Performance Websites – ISV Con 2013 38 STRANGERS VISITORS LEADS QUALIFIED LEADS • Downloads • Newsletters • Continuity programs • Interesting content • Syndicated content • Social media content • Valuable downloads • Valuable services • Promos • Demos • Other… • Share-worthy content • Unexpected nicetiesCUSTOMERS DELIGHT CLOSE QUALIFY ENGAGE ATTRACT GET TRAFFIC GET EMAIL GET FORM GET SALE GET ADVOCATE AUTOMATE
  39. 39. • Ebooks and whitepapers • Contests and promotions • Product Purchases • Email newsletter subscription • Free trial • Contact us • Consultation • Demonstration Practical Roadmap to High Performance Websites – ISV Con 2013 39 MARKET Create Compelling Offers
  40. 40. MARKET CTA Above Fold: 5 Elements Practical Roadmap to High Performance Websites – ISV Con 2013 40 Compelling and Descriptive Headline Complementary supporting sub-header A brief statement to explain core benefits of the core product or service you offer. • List speeds understanding • Bullet list item two • Bullet list item three Page Fold CTA describing what you will get      Supporting statement More content can be used below the fold for additional supporting info.
  41. 41. MARKET 7 Principles of Conversion DESIGN 1. Encapsulation 2. Contrast & color 3. Directional cues 4. White space PSYCHOLOGY 5. Urgency & scarcity 6. Try before you buy 7. Social proof Practical Roadmap to High Performance Websites – ISV Con 2013 41 Hubspot
  42. 42. Logo ATTENTION GRABBING HEADLINE FEATURES & BENEFITS DETAILS TEASER HEADLINE GOES HERE This is only placeholder text used as a filler. This is only placeholder text used as a filler. This is only placeholder text used as a filler. This is only placeholder text used as a filler. This is only placeholder text used as a filler. This is only… Benefit one This is only placeholder text used as a filler. This is only placeholder text used as a filler. This is only… Benefit three This is only placeholder text used as a filler. This is only placeholder text used as a filler. This is only… Benefit two This is only placeholder text used as a filler. This is only placeholder text used as a filler. This is only… Benefit four Call us now: 1 (800) 123-4567 Copyright © Company Name Do This Now!Describe what they get And why they would want it… A I D A A Attention I Interest D Desire A Action MARKET Landing Page Longer page with CTA below the fold and using AIDA.
  43. 43. MARKET Logo ATTENTION GRABBING HEADLINE Identify Major Benefit This is only placeholder text used as a filler. This is only placeholder text used as a filler. This is only placeholder text used as a filler. • This is only placeholder • Text used as a filler • This is a sample item This is only placeholder text used as a filler. This is only placeholder text used as a filler. This is only… About Us Call us now: 1 (800) 123-4567 Copyright © Company Name This is only placeholder text used as a filler. This is only… This is only placeholder text used as a filler. This is only… REQUEST A DEMO Interested in Our Product? Describe the purpose of this form and reason to send now. Phone: Interest: Disclaimer goes here. Privacy policy assurance, etc. Name: * Email: * As seen in: What Our Product Does How Great We Are This is only placeholder text used as a filler Landing Page Lead generator to capture and qualify visitors.
  44. 44. MARKET Continuous Content Strategy Practical Roadmap to High Performance Websites – ISV Con 2013 44 Tweet Tweet Tweet Idea Blog Post Website Pages White Paper Work- book Webinar Ebook Blog Post Microsite Info- graphic QR Code Brochure Blog Post Blog Post Website Pages Social Social Social Social Social Social Social Social Social Social Social Social
  45. 45. MARKET Editorial Calendar  Website page Blog post  White paper  Product review  Company news  Email campaign  Social Media  Tools  Sales communication  Research  Printed materials  Video Pers 1 Pers 2 Pers 3 1 Attract D1 P1 A1 2 Convert D2 P2 A2 3 Close D3 P3 A3 4 Delight D4 P4 A4 How For Facebook Post Patient OA Microsite YouTube Email Blog Post Website Page Support Portal Webinar Wher e  D1, D2 Hip Bracing MON TUE WED THU FRI SAT SUN 30 31 1 2 32928 6 7 8 9 1054 13 14 15 16 171211 20 21 22 23 241918 27 28 29 30 12625 4 5 6 7 832  D1 How Brace Work  D2 OA HCPCS Code  D2 Brace Application  D2 Warranty Offer  D2 Virtual Tour  D3 Brace Promotion  P1 Have Knee Pain?  D1, D2 Case Study  D2 Total Knee Study  D2 Medicare Change  D3 Request A Demo  D3 Find a Local Rep  D4 Study Download  P1 Knee Pain Causes  P1, P2 Animation  P2 Doctor Lookup  P2 Join our Forum  P3 Promo Code  P1,A1 Knee Anatomy  P1,A1 Knee Pain Poll  P1,A1 Care Options  P2,A2 Post A Photo  A3 Football Promo  A4 Win A Signed Ball  P2 Neil Tucci Profile D4 Brace Features  D1, D2 OA Bracing  P2 OA Animation  P2 About Knee Brace  P2 Testimonial  P3 Download Aid  P3 Find A Doctor  P3 Gel Pak Promo D1 Bracing Study  D2 Neil Tucci Profile  D2 Doctor Quote  D2 Compare-Matrix  D3 Email Sign up  D3 Webinar Sign up  P1,A1 Favorite Team  P1,A1 Sprain , Strain  P2,A2Treatments  P2,A2 Cold Therapy  P3,A3 Gel Pak Promo  P2 OA Animation  D2 OA Application  P4 Photo of Month SHOW How: Type of media content For: Persona & buying stage Where: Distribution channel Who: Person responsible What: Topic title
  46. 46. MARKET BUILD CREATE PLAN ANALYZE Get the habit of analysis; it will in time enable synthesis to become your habit of mind. Frank Lloyd Wright Practical Roadmap to High Performance Websites – ISV Con 2013 46
  47. 47. Analyze Keys to ROI Practical Roadmap to High Performance Websites – ISV Con 2013 47 UniqueVisitors Newvs.RepeatVisitors TrafficSources ReferringWebsites PopularPages BounceRates CTAPerformance KeywordPerformance SearchRankings InboundLinks CostPerClick Click-ThroughRate TrafficfromSearch ReferralSources BlogSubscribers AudienceSize&Growth Engagement Subscribers Click-ThroughRate Sharing&Forwarding TRAFFIC SEO PPC BLG SOC L. EMAIL 1. Traffic to Leads 2.Leads to Customers 3. Cost per Lead 4. Cost per Customer
  48. 48. Contact komotion.com/contact-us Resources komotion.com Razvan (Raz) Neagu

×