Your SlideShare is downloading. ×
Mobilizing Your Brand - Responsive Web Design
Upcoming SlideShare
Loading in...5

Thanks for flagging this SlideShare!

Oops! An error has occurred.


Introducing the official SlideShare app

Stunning, full-screen experience for iPhone and Android

Text the download link to your phone

Standard text messaging rates apply

Mobilizing Your Brand - Responsive Web Design


Published on

Tuna Traffic's Saravanan Shanmugabaskaran and Mike Zielonka speak the Wisconsin Chapter of Society of Marketing Professional Services about Mobilizing your brand.

Tuna Traffic's Saravanan Shanmugabaskaran and Mike Zielonka speak the Wisconsin Chapter of Society of Marketing Professional Services about Mobilizing your brand.

  • Be the first to comment

  • Be the first to like this

No Downloads
Total Views
On Slideshare
From Embeds
Number of Embeds
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

No notes for slide
  • Health Care Public Relations & Marketing Society.
  • History – Team - etc
  • According to Google, around 60% of people are unlikely to return to a site that’s not mobile friendly. User engagement increases with a mobile-friendly design.
  • Allow interaction – halle’s website
  • Mike starts
  • Make your website accessible to people 24/7 - people are always on the go, and have the technology to surf the web. Make your company accesible via mobile phone or desktop and provide the information your users are looking for. Replicate your brand’s same design and feel weather on mobile or a desktopA poorly designed mobile website will not have full featureskeep your users on your mobile website on not on the competor’s siteSEO
  • it QuickMobile users are short on timePrioritize content on what you want people to seeUse your analytics to figure out what desktop users are looking atCompress images
  • Make accessible to all mobile devicesLandscape, portrait, Keep users in the same page when they change orientationGet rid of flash! Use HTML 5
  • By using technoology at their finger tips, let your customers get what they need
  • Transcript

    • 1. Mobilizing Your Brand Presented by: Mike Zielonka & Saravanan “Sud” Shanmugabaskaran SMPSTuna Traffic Copyright 2012
    • 2. Tuna Traffic Saravanan “Sud” Shanmugabaskaran Director of Client Solutions Mike Zielonka Director of Web StrategyTuna Traffic Copyright 2012
    • 3. Tuna Traffic We help our clients get found online and “on ground” Web & Graphic Design Search Engine Optimization Social Media Email Marketing We bend technology to meet your needsTuna Traffic Copyright 2012
    • 4. Mobilizing Your Brand Mobile Website Development Smartphone Apps Next Generation Social Media & WidgetsTuna Traffic Copyright 2012
    • 5. Is Your Site Ready? How does your company’s website look on a smartphone? According to Google, around 60% of people are unlikely to return to a site that’s not mobile friendly. User engagement increases with a mobile- friendly design.Tuna Traffic Copyright 2012
    • 6. Is Your Site Ready? HOW AM I SUPPOSE TO NAVIGATE ON THIS SMALL SCREEN?Tuna Traffic Copyright 2012
    • 7. Whole Lifestyle Nutrition IsTuna Traffic Copyright 2012
    • 8. Why Do I Need a Mobile Friendly Site? 1-in-7 Searches are mobile Mobile Searches have grown by 4x since 2010 By 2013, more people will use their smart phones to get online than PCsTuna Traffic Copyright 2012
    • 9. Build It and They Will Visit? They are already visiting! I just built a mobile site, people will Dude, we visit! were already visiting…Tuna Traffic Copyright 2012
    • 10. But There Are So Many Devices… Different devices: iPhone iPad Android Blackberry Windows Different screen sizes Do I need to build a separate site for each?Tuna Traffic Copyright 2012
    • 11. Mobile Website Development Users expect their mobile experience to be as good as their desktop experience Giving your visitors a “warm fuzzy” mobile experience will help your brand Have you been frustrated when a site is not mobile?Tuna Traffic Copyright 2012
    • 12. Interactions of Mobile Audiences What kind of interaction do we give our mobile visitors? Give them business information Let them browse & interact with data ecommerce, recipes, blogs, social media, etcTuna Traffic Copyright 2012
    • 13. What Problem Do You Want To Solve? Mobile vs Tablet vs Laptop UX may vary BUT the root problem you are solving stays the same If you are a baker…you want to sell more cupcakes no matter what device a visitor is using What problem do you want to solve? How can Mobile add to your marketing strategy?Tuna Traffic Copyright 2012
    • 14. 3 Types of Mobile Solutions Responsive Web Design (RWD)* Separate Mobile Site Native App *Tuna RecommendedTuna Traffic Copyright 2012
    • 15. Desktop SitesTuna Traffic Copyright 2012
    • 16. iPadTuna Traffic Copyright 2012
    • 17. iPadTuna Traffic Copyright 2012
    • 18. iPhoneTuna Traffic Copyright 2012
    • 19. Responsive Web Design What is Responsive Web Design (RWD)? A website designed to dynamically respond to the device screen it is being viewed onTuna Traffic Copyright 2012
    • 20. Fixing Our Problems With Responsive Web DesignTuna Traffic Copyright 2012
    • 21. Fixing Our Problems With Responsive Web Design #2Tuna Traffic Copyright 2012
    • 22. Fixing Our Problems With Responsive Web Design #2Tuna Traffic Copyright 2012
    • 23. RWD Advantages Advantages Your site responds to the device’s screen size no matter what width or height It is Google’s recommended method for mobile sites The majority of websites will greatly benefit from a RWD implementation (very complex sites such as eBay would have a near impossible mission to deliver a full responsive site)Tuna Traffic Copyright 2012
    • 24. RWD Disadvantages Disadvantages There are some scenarios where it can be more expensive than 2 sites Supporting older browsers can be troublesome Creating certain outcomes or elements for UX or UI can be complexTuna Traffic Copyright 2012
    • 25. RWD Best Practices Keep it Quick Simplify Navigation Mobile users are Use big navigation usually short on time buttons Don’t list everything Fasssst server Have search available Less is More White space is your friendTuna Traffic Copyright 2012
    • 26. RWD Best Practices Be Thumb-Friendly Design for Visibility People use their thumbs! Make it easy for Use large buttons customers to read People are already squinting their eyes!Tuna Traffic Copyright 2012
    • 27. RWD Best Practices Make it Accessible Make it Easy to Convert Your site should work Touch to call phone across all mobile numbers platforms and orientations Do NOT use Adobe FlashTuna Traffic Copyright 2012
    • 28. RWD Best Practices Make it Local Make it Seamless “find a store near you” If you have a login Easy maps integration portion of your desktop site, make the same accessible via mobile Maintain key features as much as you canTuna Traffic Copyright 2012
    • 29. RWD Best Practices Listen & Learn from your mobile data Use analytics to help you make better decisions on what to displayTuna Traffic Copyright 2012
    • 30. There’s an App for thatTuna Traffic Copyright 2012
    • 31. There’s An App For That Smart phones are here to stay… How can our businesses benefit from a smartphone app? Apps for customers & Apps for internal business customersTuna Traffic Copyright 2012
    • 32. Benefits To Our Business Connect with your on-the-go customers or employees by giving them convenience Make processes easier and streamlinedTuna Traffic Copyright 2012
    • 33. Benefits To Our Business Competitive Advantage Drive better customer service than your competitors Keep up with the Jones’ Strengthen your company’s brandTuna Traffic Copyright 2012
    • 34. Tuna Engineering Co Tuna Engineering Co – Customer Proofs Creates iPad App to streamline processes Notifies client via APP and email that proofs are complete Client uses iPad app to approve proofs, add notes and is able to “scribble” Everything is digital andTuna Traffic Copyright 2012
    • 35. Tuna Engineering Co Tuna Engineering Co - Service Client has issue with product Client logs in to firm’s app Makes service ticket, takes photo with iPad, comments on problem and submits to firm Firm’s field agent goes to client, pulls up service ticket on iPad and makes notes etc.Tuna Traffic Copyright 2012
    • 36. What Can We Do With Apps? Collect Payment List up-to-date pricing Have your customers for your customers reach support easily Give customers tips on Notify your customers your products/services with updates Get information from your customersTuna Traffic Copyright 2012
    • 37. But Apps are so expensive! How do they work? How can we build them? What drives the content?Tuna Traffic Copyright 2012
    • 38. Different Platforms Apple, Blackberry, Android, WindowsTuna Traffic Copyright 2012
    • 39. What is a Native App? Native App Made specifically for each mobile device Must be purchased and downloaded through an App Store or marketplace. Must meet requirements of smart phone’s operating system Analytic data can be collected from the user’s phone Can be costly – Average is $8,000 for a small appTuna Traffic Copyright 2012
    • 40. Examples of Native Apps Facebook Amazon Subway NFC checkout Pizza Hut City of ColumbusTuna Traffic Copyright 2012
    • 41. City of Columbus AppTuna Traffic Copyright 2012
    • 42. What is a Web App? Web App Internet enabled apps Think of it as a website built like an app. Accessed through the device’s mobile browser (ie: Safari) Lower cost May not be able to use all of the phone’s featuresTuna Traffic Copyright 2012
    • 43. What is a Web App?Tuna Traffic Copyright 2012
    • 44. Native vs Web AppTuna Traffic Copyright 2012
    • 45. Next Gen Social Media & Widgets Mobile Friendly Emails Social Media Management in one location Social Media Widgets = InteractionTuna Traffic Copyright 2012
    • 46. Mobile Friendly Emails Our clients use their phones to stay connected all the time Lets make sure they can read our Marketing emails!Tuna Traffic Copyright 2012
    • 47. Solutions for Mobile Email Marketing “If you’re having trouble viewing this email, click here” Add link to email content that will be hosted on your website (mobile friendly) Have your templates designed to scale down easily with % based dimensions as opposed to fixed dimensions. 100% vs 100px Use an email marketing toolTuna Traffic Copyright 2012
    • 48. Mobile Email Best Practices Keep your emails width Less than 600 Pixels Fonts need to be larger, content needs to be brief and precise Call to actions should be in the best real estate First sentence is SUPER important because that is what shows in the preview Avoid Tiny Nav Bars Use single columns Short subject linesTuna Traffic Copyright 2012
    • 49. Email Marketing Tools Email tools have Mobile TemplatesTuna Traffic Copyright 2012
    • 50. Our Favorite Email Tools Mail Chimp Constant ContactTuna Traffic Copyright 2012
    • 51. Social Media Management Facebook, Twitter, Pinterest, Google+ ….what?Tuna Traffic Copyright 2012
    • 52. How Do We Manage? How can we be smart about Social Media Management for business on mobile?Tuna Traffic Copyright 2012
    • 53. Social Media Dashboards A one stop shop for all your social media management Manage multiple social profiles Schedule updates/tweets/posts Track your brand mentions GREAT analytics & reportingTuna Traffic Copyright 2012
    • 54. Mobile Social Media DashboardsTuna Traffic Copyright 2012
    • 55. Social Media Dashboards Collaborate with your marketing team Interactions are captured in one place One login for all accounts!Tuna Traffic Copyright 2012
    • 56. Social Media Widgets = Interaction Social media is one of the best ways to drive interaction for your business How do we make it easy for our readers to share and comment?Tuna Traffic Copyright 2012
    • 57. Social Sharing WidgetsTuna Traffic Copyright 2012
    • 58. Social Sharing WidgetsTuna Traffic Copyright 2012
    • 59. Social Sharing Widgets Make it easy to Share, Tweet, etc Very easy way for us to get our content in front of thousands of peopleTuna Traffic Copyright 2012
    • 60. THANK YOU! @tunatraffic info@tunatraffic.comTuna Traffic Copyright 2012