Your SlideShare is downloading. ×
0
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Defining strategies from the value of website
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

Defining strategies from the value of website

231

Published on

Defining Strategies From The Value of Website Design …

Defining Strategies From The Value of Website Design

Published in: Technology, Business
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
231
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. By Chitpong WuttananDefining StrategiesFrom The Value of Website Design
  • 2. What your websitedelivering value to customers??
  • 3. And, How can websitereturn value to my corporate??
  • 4. How many customers??
  • 5. Worldwide Internet User2.4Billion
  • 6. Worldwide Internet User (Penetration)
  • 7. Worldwide Smartphone UserImage By New Relic.Image By New Relic.
  • 8. Thailand Internet and Smartphone Face
  • 9. Global : Computer and Mobile share of timeahead of TVImage By InMobi
  • 10. Global : Mobile device usage is throughout the dayImage By InMobi
  • 11. Thailand : Computer and Mobile share of timeahead of TVImage By InMobi-- -
  • 12. Thailand : Mobile device usage is throughout the dayImage By InMobi
  • 13. Thailand : Mobile directly influencing decision makingImage By InMobi
  • 14. Now, Everything can do onMobile Phone and Internet
  • 15. What’s value of Website DesignBranding ( )Usability/Lead Generation ()Accessibility ()
  • 16. Branding ( )
  • 17. Branding ( )A corporate website should communicate the brand’s main value proposition.The logo, color scheme, and language should all be consistent with othermarketing collateral.
  • 18. Branding ( )Apple is a great example of consistent branding that matches the philosophy ofthe company.
  • 19. Branding : 5 Tips for brand building with web design1.Color ( )Color isn’t just aesthetics —it stimulates various emotions and carries with itsubconscious associations to various things and characteristics.Positioning Magazine(
  • 20. Branding : 5 Tips for brand building with web design2.Character/Personality ( )Infusing your brand with a little personality can help you define what it stands for.King Power Brand Character• Leading• Inspiring ( )• Charming ( )• Tempting ( )
  • 21. Branding : 5 Tips for brand building with web design3.Emotion ( )It’s what feelings and emotions do you want people to experience when they visityour site?VDOBackground
  • 22. Branding : 5 Tips for brand building with web design4.Size and position of the logo ( )It’s what feelings and emotions do you want people to experience when they visityour site?
  • 23. Branding : 5 Tips for brand building with web design4.Size and position of the logo ( )
  • 24. Branding : 5 Tips for brand building with web design5.Value proposition ( )Visitor take the first few seconds to orient themselves. Is this the right site? Doesthis look interesting? What is this all about? To answer these questions youshould provide a clear and concise value proposition to your visitor.Facebook, Google,
  • 25. Branding : 5 Tips for brand building with web design5.Value proposition ( )
  • 26. Usability ( )
  • 27. Usability ( )Usability is an assessment of how easy a website is to navigate and use. Usabilityis hugely important and needs to be kept in mind in website designHuman
  • 28. Usability ( )(Human) Usability means user-centered design. Both the design anddevelopment process are focussed around the prospective userHeat map
  • 29. Usability ( )(Human) Usability and Heat Map can using http://Google.com/analytics
  • 30. Usability : 5 Key Principles Of Good Website Usability1.Availability and Accessibility ( )Let’s start with a basic, yet central aspect of usability: the availability andaccessibility of your site.• Server uptime ( )• Broken links• Mobile responsivenessAmazon.com1. DesktopMobile2. Amazon.com 2Montools
  • 31. Usability : 5 Key Principles Of Good Website Usability2.Clearity ( )Visitors come to your site with certain goals in mind. It is your job to help themreach these goals as quickly as possible.- Simplicity - Familiarity- Consistency - Guidance- Direct feedback - Good information architectureApple.com
  • 32. Usability : 5 Key Principles Of Good Website Usability3.Learnability ( )Key to intuitive design is to make use of what people already know, or createsomething new that is easy to learn.Microsoft.comMetro UI
  • 33. Usability : 5 Key Principles Of Good Website Usability4.Credibility ( )Even if people find the content they are looking for, if they don’t trust you, thatcontent is worthless. It is important that people know you are a real companywith real people.Loreal.com
  • 34. Usability : 5 Key Principles Of Good Website Usability5.Relevancy ( )It is not enough that your website is clear, your content must also be relevant.Again, it is essential that you know your users and why they visit your site.Nike.com
  • 35. Lead Generation ( )
  • 36. Lead Generation ( )Is the generation of consumer interest or inquiry into products or services of abusiness , is an important function of any website, though it is commonly an afterthought in the design process./Marketing Phase System/Design and Sale Phase
  • 37. Lead Generation ( )Content is King!1. Headlines to attract readers2. Use Number3. Repeat Keyword4. Photo is a thousand words (or Infographic)5. BenefitOther..
  • 38. Lead Generation ( )Information graphics or infographics are graphic visual representationsof information, data or knowledge intended to present complex informationquickly and clearly.InfographicBloomberg
  • 39. Lead Generation ( )Information graphics for sharing informationInfographicStarbucks
  • 40. Lead Generation ( )A/B Testing, Lets say that you want to test two different versions of somethingon your home page. Which is most likely to result in a customer making apurchase
  • 41. Lead Generation ( )A/B Testing Process
  • 42. Lead Generation ( )A/B Testing for Major potential for improvementOLDNew62.0% ImprovementGoal of the Page: Visitorrequests a test drive.How: AddedSEO, conversionbuttons, and largerpictures. revise topic
  • 43. Lead Generation ( )A/B Testing for Conversion rates directly impact revenueA/B TestingMALL.CZ
  • 44. Lead Generation ( )A/B Testing for Conversion rates directly impact revenueA/B TestingMALL.CZ1
  • 45. Lead Generation ( )A/B Testing for Conversion rates directly impact revenueA/B TestingMALL.CZ2
  • 46. Lead Generation ( )A/B Testing for Conversion rates directly impact revenueVariation 1 Variation 2Variation 2 was the WinnerIt resulted in a straight 9.46% increase in sales96% chance to beat originalZero spent on advertising
  • 47. Accessibility ( )
  • 48. Accessibility ( )Technology changes at a rapid pace, the biggest trend over the last few years ismobile computing. Today people access the Internet from a wide variety ofdevices: smart phones, computers, tablet
  • 49. Accessibility ( )Sample website design for all device
  • 50. Accessibility ( )Sample website design for all device
  • 51. Accessibility ( )Sample website design for all device
  • 52. Is Your Website Turning AwayVisitors on Mobile Devices?
  • 53. Accessibility ( )Responsive web design: Is a flexible, liquid layout that adapts to fit various screensizes, resolutions and devices. It allows websites to automatically change layoutsaccording to the visitor’s screen resolution.One Website, All Devices
  • 54. Accessibility ( )Responsive web design: Once loaded, re-size your browser window (drag thecorners so it becomes larger or smaller) and you will notice the content adjustsitself accordingly.
  • 55. Accessibility ( )Mobile Application or Mobile Optimized Website (Responsive Web Design)?
  • 56. Accessibility ( )Mobile Application or Mobile Optimized Website (Responsive Web Design)?Responsive web designPro:1. Minimal resources required ()2. Accessible to all Device3. Cost effective4. Seamless syncing with your websiteCon:1. Limited functionality FunctionGPS,2. Customer satisfaction ()Mobile ApplicationPro:1. User experience (GPS, )2. Compatibility (Browser, )3. Loyalty ( )4. Off-line usage ( )5. Development resources ()Con:1. Adoption and usage ( )2. Developing market ()3. Ongoing costs for multi device ()4. Loss of control (cloud, app market)
  • 57. Accessibility ( )Robot or Search Engine Robot Usability are programs that traverse the Webautomatically. It’s can make your website up to top rank on search engine such asGoogle.com, called is “Search Engine Optimization”SEOSearch Engine
  • 58. Accessibility ( )Search Engine Optimization Process
  • 59. Accessibility ( )Web accessibility refers to the inclusive practice of making websites usable bypeople of all abilities and disabilities. When sites are correctlydesigned, developed and edited, all users can have equal access to informationand functionality.Visual Impairments Auditory ImpairmentsMobility Impairments Cognitive Impairments
  • 60. Accessibility ( )Visual Impairments• Listening to text-to-speech synthesis of the content• Reading text using refreshable braille (small dots that areraised and lowered to display characters that are read byscanning over the raised dots using the fingertips)• Enlarging or reducing text size and images• Customizing settings for fonts, colors, and spacing• Listening to audio descriptions of video in multimedia
  • 61. Accessibility ( )Auditory Impairments• Transcripts and captions of audio content, including audio-only content and audio tracks in multimedia• Media players that display captions and provide options toadjust the text size and colors of captions• Options to stop, pause, or adjust the volume of audio content(independently of the system volume)• High-quality foreground audio that is clearly distinguishablefrom any background noise
  • 62. Accessibility ( )Mobility Impairments• Ergonomic or specially designed keyboard or mouse• Head pointer, mouth stick, and other aids to help typing• On-screen keyboard with trackball, joystick, and switches tooperate it• Voice recognition, eye tracking, and other approaches forhands-free interaction
  • 63. Accessibility ( )Cognitive Impairments• Clearly structured content that facilitates overview andorientation• Consistent labeling of forms, buttons, and other content parts• Predictable link targets, functionality, and overall behavior• Different ways of navigating websites, such as through ahierarchical menu or search option• Options to suppress blinking, flickering, flashing, or otherwisedistracting content• Simpler text that is supplemented by images, graphs, andother illustrations
  • 64. Are you ready to Change??
  • 65. Dont follow a trend.Follow your heart.
  • 66. EndChitpong Wuttanan @ifew Chitpong Few WuttananChitpong@gmail.comContact: Chitpong Wuttanan
  • 67. Reference URL• http://advicemedia.com/what-value-of-web-design/• http://conversionxl.com/how-responsive-design-boosts-mobile-conversions/#• http://samyarn.com/2012/mobile-app-mobile-site-responsive-design/• http://www.foraker.com/choosing-between-responsive-web-design-and-a-separate-mobile-site-to-improve-mobile-visitors%E2%80%99-experience/• http://www.thaiwebaccessibility.com/• http://www.stanford.edu/group/accessibility/cgi-bin/presentations/Intro_web_accessibility/• http://visualwebsiteoptimizer.com/split-testing-blog/larger-product-images-increase-conversion-rate/• http://www.smashingmagazine.com/2010/06/24/the-ultimate-guide-to-a-b-testing/• http://uxinth.blogspot.com/2012/08/ux-by-a-b-testing.html• http://adwordstool-how-to.blogspot.com/2012/10/9-headlines.html• http://seo-web.aun-thai.co.th/press/seo-blog-seo-usability• http://www.etda.or.th/etda_website/mains/display/1537• http://www.pawoot.com/node/244/• http://blog.crazyegg.com/2013/03/26/principles-website-usability/• http://www.thaidesignwebsite.com/website-usability-%E0%B8%84%E0%B8%B7%E0%B8%AD%E0%B8%AD%E0%B8%B0%E0%B9%84%E0%B8%A3/• http://www.24framework.com/%E0%B8%AA%E0%B8%A3%E0%B9%89%E0%B8%B2%E0%B8%87%E0%B9%81%E0%B8%9A%E0%B8%A3%E0%B8%99%E0%B8%94%E0%B9%8C%E0%B8%9C%E0%B9%88%E0%B8%B2%E0%B8%99%E0%B8%81%E0%B8%B2%E0%B8%A3%E0%B8%AD%E0%B8%AD%E0%B8%81%E0%B9%81.html• http://www.visionefx.net/articles/deconstruct-rebuild-your-website.htm• http://searchengineland.com/4-areas-to-ab-test-for-e-commerce-websites-90559• http://ecommerce.about.com/od/eCommerce-Basics/a/The-ABCs-Of-AB-Testing.htm• http://www.getelastic.com/best-practice-gone-bad-4-shocking-ab-tests/• http://www.bigcommerce.com/ecommerce-blog/10-a-b-tests/

×