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.
Classy, Clowny or Crude? How your           sites typography affects your brand                   Davin Kluttz – ExtensisS...
Classy, Clowny or     Crude?Branding & the New Web      Typography    Davin Kluttz     Product Line Manager Extensis, a Ce...
About Me• 18+ years in design/advertising   – Print, publishing, web and video   – Digital media and technology• Software ...
About You?
Agenda: • Branding & Typography • About Web Fonts • Classy • Clowny • Crude
Branding& Typography
What’s in a Brand?• Carefully crafted• Consistent across media• Typography is a critical part
Typography  Serves Branding
What if?• Typography failure can be  comical• Comic Sans Project – http://comicsansproject.tumblr.com/
But those are logos…
Web Fonts
From the dawn of  the internet, web        design   was shackled toa few common fonts:
Comic Sans       Impact    Arial Black   Arial / Helvetica      Trebuchet      VerdanaCourier/Courier New  Times (New) Rom...
[pic of 1920s car here]
[pic of 1920s car here]
New World Order: real fonts  • Replace various hacks &    stopgaps  • From web server  • Download to viewer’s browser  • R...
3 benefits of ―real‖ Web         Fonts•   Creative choice•   Branding consistency•   Not images•   Standards / Not hacks
How Web Fonts are used• @font-face CSS tag > font-  family  @font-face {    font-family: MyCustomFont;    src: url("http:/...
Challenges of using Web         Fonts• Most licenses don’t include web• Many delivery formats required  – (SVG)  – TTF  – ...
Two ways to integrate Web         Fonts • Self-hosting • Web font service
Self-hosting +/-• Pros  – No outside service dependencies  – Complete control  – Usually one-time licensing fees• Cons  – ...
Benefits of web font       services• Easiest way to use web fonts• Keeps it legal• Handles browser font  requirements• Fon...
Dangers of Web Fonts• More options ≠ always better• Legal usage (e.g. Santorum)
Using Web   Fonts
using web fonts:     Classy
using web fonts:    Clowny
using web fonts:     Crude
How Do I Stay Classy?• Learn best practices  – Resources page for web typography    best practices (webinar recordings,   ...
How Do I Stay Classy?• Experiment/test  – FontFuse  – FontDropper  – Web Font Plug-in
Thank You
Resources:  http://webink.comhttp://blog.webink.comhttp://webink.com/type-        resources
After the Cloudrush: Proven low           risk steps to evolve your website                Simon Abrahams – Rackspace     ...
Improving Online Customer           Experience and Sales with Live Chat                Susanne Balter - Netop Business    ...
How Cloud Technology Helped                  Vodafone Improve Their                 Client/Agency Interactions            ...
Discover how leading organisations are  using IBMs Coremetrics Digital Marketing    Optimisation Suite to capitalise on th...
Nicole PennSenior SaaS Consultant - IBMWeb analytics in the growing digital ageTechnology for Marketing & Advertising28 Fe...
2006       © 2009 IBM Corporation
2012       © 2009 IBM Corporation
© 2009 IBM Corporation
IBM CoremetricsWEB ANALYTICS                  © 2009 IBM Corporation
IBM Coremetrics Digital Marketing Optimisation Suite                                                © 2009 IBM Corporation
Web Analytics inSOCIAL MEDIA                   © 2009 IBM Corporation
•What are the top performing Social Media sites?  Industry    •How do these sites perform seasonally?              • How d...
Data from IBM Coremetrics Benchmark – UK Retail Vertical January 2012                                                     ...
Data from IBM Coremetrics Benchmark – UK Retail Vertical January 2012                                                     ...
What our retail customers are doing?               555,792               video views                                 © 200...
What our travel customers are doing?                                 © 2009 IBM Corporation
Web Analytics inMOBILE                   © 2009 IBM Corporation
•What are the top performing mobile devices?  Industry    •How does mobile performance compare to              tablet?Meas...
Mobile Device Conversion Comparison        iPhone         3.63%                                                           ...
What our retail customers are doing?                                 © 2009 IBM Corporation
Web Analytics inMULTICHANNEL                   © 2009 IBM Corporation
Catalogue                                                           Click &             In Store                          ...
How do we perform  multichannel    analysis?                    © 2009 IBM Corporation
What our retail customers are doing?                                 © 2009 IBM Corporation
Web Analytics inPERSONALISATION                   © 2009 IBM Corporation
What our retail customers are doing?                   Targeted, Relevant                      Email Boosts               ...
EMMSmartCookies   EMM Smart Cookies Group                                       © 2009 IBM Corporation
Don’t forget to visit the IBM stand         D18 (by the bar!)                                      © 2009 IBM Corporation
What Does This DAM Thing Do?           Find, locate, archive and access files                   regardless of location    ...
What does thisDAM thing do?             Davin Kluttz     Sr. Product Manager,                 Extensis
Why am I here?18+ years in design/advertising    Print, publishing, web and video    Digital media and technologySoftwar...
Why are you here?Was “DAM” a typo?    Digital Asset ManagementWhat is this not?    Not a product demo    Chance to lear...
What is an “asset”Digital Assets, not Financial AssetsWhen is a file an asset?    Purchased or licensed    It’s critical...
5 Concepts of DAM   (Because I like lists.)
#1 - SearchDon’t be “old fashioned”    Isolated searches    Folder-based searches    FilenamesCentralised search    On...
#2 - MetadataA simple definition:    Metadata is data about your data.    Keywords or “tags”Metadata can be specific   ...
#3 - PreviewQuiz: What must you have, in order to view…    100 photos from a Nikon professional camera?    An InDesign d...
#4 - SharingSharing is vital     Reduce turnaround time (less email, etc.)     Let others contribute metadataThe DAM its...
#5 - DerivativesWe’re the “experts”    The right tools and access to files    Bottleneck    Time better spentInterrupti...
Thank you.www.damlearningcenter.comwww.extensis.com/portfolio
Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand
Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand
Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand
Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand
Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand
Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand
Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand
Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand
Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand
Upcoming SlideShare
Loading in …5
×

Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand

907 views

Published on

Published in: Technology, Art & Photos
  • Be the first to comment

  • Be the first to like this

Content Management & Web Analytics Theatre; Classy, clowny or crude? How your site's typography affects your brand

  1. 1. Classy, Clowny or Crude? How your sites typography affects your brand Davin Kluttz – ExtensisSponsored by: Organised by:
  2. 2. Classy, Clowny or Crude?Branding & the New Web Typography Davin Kluttz Product Line Manager Extensis, a Celartem company
  3. 3. About Me• 18+ years in design/advertising – Print, publishing, web and video – Digital media and technology• Software solutions – Mission: Tame ―digital chaos‖ – Individuals & workgroups – Preserving creativity (and sanity)
  4. 4. About You?
  5. 5. Agenda: • Branding & Typography • About Web Fonts • Classy • Clowny • Crude
  6. 6. Branding& Typography
  7. 7. What’s in a Brand?• Carefully crafted• Consistent across media• Typography is a critical part
  8. 8. Typography Serves Branding
  9. 9. What if?• Typography failure can be comical• Comic Sans Project – http://comicsansproject.tumblr.com/
  10. 10. But those are logos…
  11. 11. Web Fonts
  12. 12. From the dawn of the internet, web design was shackled toa few common fonts:
  13. 13. Comic Sans Impact Arial Black Arial / Helvetica Trebuchet VerdanaCourier/Courier New Times (New) Roman Georgia
  14. 14. [pic of 1920s car here]
  15. 15. [pic of 1920s car here]
  16. 16. New World Order: real fonts • Replace various hacks & stopgaps • From web server • Download to viewer’s browser • Regular font files (+ wrapper)
  17. 17. 3 benefits of ―real‖ Web Fonts• Creative choice• Branding consistency• Not images• Standards / Not hacks
  18. 18. How Web Fonts are used• @font-face CSS tag > font- family @font-face { font-family: MyCustomFont; src: url("http://fnt.webink.com/?drawer=FCDD59A0-EEB1-47EF- A527-63FC9C275EEA&font=D1617946-FD8A-ABCE-E54E- 048179EE95A8"); font-weight: normal; font-style: normal; font-variant:normal; }• Called w/font-family in CSS/HTML .body {
  19. 19. Challenges of using Web Fonts• Most licenses don’t include web• Many delivery formats required – (SVG) – TTF – OTF – EOT – WOFF-TTF – WOFF-OTF
  20. 20. Two ways to integrate Web Fonts • Self-hosting • Web font service
  21. 21. Self-hosting +/-• Pros – No outside service dependencies – Complete control – Usually one-time licensing fees• Cons – Licensing issues for self-conversion – Serving multiple formats to browsers – Keeping up with browser changes
  22. 22. Benefits of web font services• Easiest way to use web fonts• Keeps it legal• Handles browser font requirements• Fonts served by cloud-based service• Easier integration
  23. 23. Dangers of Web Fonts• More options ≠ always better• Legal usage (e.g. Santorum)
  24. 24. Using Web Fonts
  25. 25. using web fonts: Classy
  26. 26. using web fonts: Clowny
  27. 27. using web fonts: Crude
  28. 28. How Do I Stay Classy?• Learn best practices – Resources page for web typography best practices (webinar recordings, links)
  29. 29. How Do I Stay Classy?• Experiment/test – FontFuse – FontDropper – Web Font Plug-in
  30. 30. Thank You
  31. 31. Resources: http://webink.comhttp://blog.webink.comhttp://webink.com/type- resources
  32. 32. After the Cloudrush: Proven low risk steps to evolve your website Simon Abrahams – Rackspace HostingSponsored by: Organised by:
  33. 33. Improving Online Customer Experience and Sales with Live Chat Susanne Balter - Netop Business SolutionsSponsored by: Organised by:
  34. 34. How Cloud Technology Helped Vodafone Improve Their Client/Agency Interactions Josh Gilbertson - SkyDoxSponsored by: Organised by:
  35. 35. Discover how leading organisations are using IBMs Coremetrics Digital Marketing Optimisation Suite to capitalise on the opportunity presented by the growing digital age Nicole Penn – IBMSponsored by: Organised by:
  36. 36. Nicole PennSenior SaaS Consultant - IBMWeb analytics in the growing digital ageTechnology for Marketing & Advertising28 February 2012 - London © 2009 IBM Corporation
  37. 37. 2006 © 2009 IBM Corporation
  38. 38. 2012 © 2009 IBM Corporation
  39. 39. © 2009 IBM Corporation
  40. 40. IBM CoremetricsWEB ANALYTICS © 2009 IBM Corporation
  41. 41. IBM Coremetrics Digital Marketing Optimisation Suite © 2009 IBM Corporation
  42. 42. Web Analytics inSOCIAL MEDIA © 2009 IBM Corporation
  43. 43. •What are the top performing Social Media sites? Industry •How do these sites perform seasonally? • How do we fit our social media strategy into our Strategy web analytics strategy? • What KPI’s should we be looking at?Measurement • How do we track our Social Media activities? • Who are our Social Media visitors? Behaviour • How does their behaviour on our site differ? © 2009 IBM Corporation
  44. 44. Data from IBM Coremetrics Benchmark – UK Retail Vertical January 2012 © 2009 IBM Corporation
  45. 45. Data from IBM Coremetrics Benchmark – UK Retail Vertical January 2012 © 2009 IBM Corporation
  46. 46. What our retail customers are doing? 555,792 video views © 2009 IBM Corporation
  47. 47. What our travel customers are doing? © 2009 IBM Corporation
  48. 48. Web Analytics inMOBILE © 2009 IBM Corporation
  49. 49. •What are the top performing mobile devices? Industry •How does mobile performance compare to tablet?Measurement • How do we track our new mobile site? • How does behaviour differ across Behaviour mobile, app, tablet and main site? © 2009 IBM Corporation
  50. 50. Mobile Device Conversion Comparison iPhone 3.63% Android 4.03% iPad5.14%Data from IBM Coremetrics Benchmark – UK Retail Vertical January 2012 © 2009 IBM Corporation
  51. 51. What our retail customers are doing? © 2009 IBM Corporation
  52. 52. Web Analytics inMULTICHANNEL © 2009 IBM Corporation
  53. 53. Catalogue Click & In Store Collect Text &Website Reserve Retail Multichannels Social Tablet Media Mobile Mobile Application © 2009 IBM Corporation
  54. 54. How do we perform multichannel analysis? © 2009 IBM Corporation
  55. 55. What our retail customers are doing? © 2009 IBM Corporation
  56. 56. Web Analytics inPERSONALISATION © 2009 IBM Corporation
  57. 57. What our retail customers are doing? Targeted, Relevant Email Boosts Revenue by 2500%―Instead of trying to second-guess our customers, we can present them with offersthat we know will interest them.‖ —Director of Ecommerce L’OCCITANE EN PROVENCE © 2009 IBM Corporation
  58. 58. EMMSmartCookies EMM Smart Cookies Group © 2009 IBM Corporation
  59. 59. Don’t forget to visit the IBM stand D18 (by the bar!) © 2009 IBM Corporation
  60. 60. What Does This DAM Thing Do? Find, locate, archive and access files regardless of location Davin Kluttz – ExtensisSponsored by: Organised by:
  61. 61. What does thisDAM thing do? Davin Kluttz Sr. Product Manager, Extensis
  62. 62. Why am I here?18+ years in design/advertising  Print, publishing, web and video  Digital media and technologySoftware solutions  Mission: Tame “digital chaos”  Individuals & workgroups  Preserving creativity (and sanity)
  63. 63. Why are you here?Was “DAM” a typo?  Digital Asset ManagementWhat is this not?  Not a product demo  Chance to learn  Ask questions
  64. 64. What is an “asset”Digital Assets, not Financial AssetsWhen is a file an asset?  Purchased or licensed  It’s critical.  Re-create or re-purchase, if it cannot be found.  (Lost time, money)It’s only an asset if you can find it!  So, let’s “manage” these. Make sense?
  65. 65. 5 Concepts of DAM (Because I like lists.)
  66. 66. #1 - SearchDon’t be “old fashioned”  Isolated searches  Folder-based searches  FilenamesCentralised search  One place to find everything  Including archives  Metadata
  67. 67. #2 - MetadataA simple definition:  Metadata is data about your data.  Keywords or “tags”Metadata can be specific  Author or Photographer Name  License Expiration  Project IDDAM systems read/embed metadata
  68. 68. #3 - PreviewQuiz: What must you have, in order to view…  100 photos from a Nikon professional camera?  An InDesign document?  A Keynote presentation?DAM can preview anything.  No costly applications to install  Make (and note) decisions
  69. 69. #4 - SharingSharing is vital  Reduce turnaround time (less email, etc.)  Let others contribute metadataThe DAM itself is shared:  Who needs access?  What do they need to access?  How do they access?DAM can provide various ways to share.
  70. 70. #5 - DerivativesWe’re the “experts”  The right tools and access to files  Bottleneck  Time better spentInterruptions? DAM helps:  Single “master” file  Avoid duplicates: less storage, less chaos  Self-service, faster turnaround  Better communication
  71. 71. Thank you.www.damlearningcenter.comwww.extensis.com/portfolio

×