--- title: "Inbound Marketing Website Design: Apple Icons & Meta Viewport" description: Mobile-optimized website design for HubSpot. Let me show you how to add Apple Icons and a Meta Viewport tag. image: https://www.inboundteam.com/hs-fs/file-13221924-png/images/mobile-website-optimization-s.png --- [![Inbound Marketing Team Atlanta Georgia](http://www.inboundteam.com/hs-fs/hubfs/images/Inbound-Team-inverse.png?width=300&name=Inbound-Team-inverse.png "Inbound Marketing Team Atlanta Georgia")](http://www.inboundteam.com) - [Inbound Marketing](http://www.inboundteam.com/inbound-marketing-packages) - [Learn](http://www.inboundteam.com/definitive-guide-inbound-marketing) - [Resources](http://www.inboundteam.com/resources) - [About](http://www.inboundteam.com/about) - [Blog](http://www.inboundteam.com/blog) # Inbound & Digital Marketing Blog ## [Inbound Marketing Website Design: Apple Icons & Meta Viewport](http://www.inboundteam.com/blog/bid/51237/Mobile-Optimized-Website-Design-Apple-Icons-Meta-Viewport) December 30, 2011, [Clarke Bishop](http://www.inboundteam.com/blog/author/clarke-bishop) - [Tweet](https://twitter.com/share) When I was [explaining HubSpot's new Marketing Grader](http://www.inboundteam.com/blog/bid/50984/Inbound-Marketing-What-To-Do-Next), I mentioned gaining 2 points by adding Apple Icons and a Meta Viewport tag. Let me show you how. ![Mobile Website Optimization s](https://www.inboundteam.com/hs-fs/file-13221924-png/images/mobile-website-optimization-s.png) ## How to Create an Apple Icon for HubSpot An Apple icon is a 57 x 57 pixel graphic that can show up on an iPhone or other iOS device. You can think of this as a giant favicon. What you need to do is: - Create the **57 x 57 graphic** and upload it to your HubSpot images folder. The graphic can be anything you want, but it's usually a version of your logo. Here's ours: ![Inbound Team Apple Icon](https://www.inboundteam.com/hs-fs/file-13221734-png/images/inbound-team-apple.png) - In HubSpot, go to **Settings -\> Website Settings** and find your **Header HTML** box. Whatever you put in this box will show up on all your website pages. - Add code that looks like: **\** Of course, you'll have to adjust the link to point to your Apple icon. In my case, I put this new code right under my favicon link:  \ - Scroll down and **Save Changes**. Now, if one of your site visitors creates a quick link on their iPhone, they'll see your new, branded icon. ## How to Setup a Meta Viewport Tag in HubSpot The Meta Viewport tells the iPhone how to show your page. All you have to do is add one more tag under your Apple icon link:  - If you aren't already there, go to **Settings -\> Website Settings** and find your **Header HTML** box. - Right under your Apple icon link, add: **\** - Scroll down and **Save Changes**. Depending on your situation, there are a lot of geeky ways you can adjust the Meta Viewport tag to control how your pages display: - [https://developer.mozilla.org/en/Mobile/Viewport\_meta\_tag](https://developer.mozilla.org/en/Mobile/Viewport_meta_tag) - [http://developer.apple.com/library/IOs/#documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html](http://developer.apple.com/library/IOs/#documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html) ## How to Enable Mobile Website Optimization in HubSpot I've assumed that you already enabled Mobile Website Optimization. If not, it's easy: - In HubSpot, go to **Settings -\> Website Settings** and find the **Mobile Theme Optimization** section. - Click to select **Enable Mobile Optimization.** - If you want to know how it will look, click the **Preview the mobile theme ...** link. - Scroll down and **Save Changes**. ## Takeaway It's quick and easy to add Apple Icons and a Meta Viewport tag. And, it get's you two points on your Marketing Grader! If you have trouble, you're always welcome to ***leave your questions in a comment below***. Of course, some Inbound Marketers would rather have help with technical items. If that's you, call **800.609.9669** and we'll set this up for you. ![Clarke Bishop](https://app.hubspot.com/settings/avatar/30c5817509b3ae466d34dff08a3e72e8) [Clarke Bishop](http://www.inboundteam.com/blog/author/clarke-bishop) More Leads ♦ More Sales ♦ More Visibility ♦ More Fun ♦ Marketing & Sales Results Find me on: [Facebook](https://www.facebook.com/InboundTeam) [LinkedIn](https://www.linkedin.com/in/clarkebishop) [Twitter](https://twitter.com/InboundTeam) [Inbound Team](http://www.inboundteam.com/) is **Georgia's Digital Marketing Agency** specializing in helping businesses grow through inbound and digital marketing. [Inbound Marketing Services](http://www.inboundteam.com/inbound-marketing-packages) are available for companies that want more leads and want to accelerate their growth. Topics: [Small Business Marketing](http://www.inboundteam.com/blog/topic/small-business-marketing), [Inbound Marketing](http://www.inboundteam.com/blog/topic/inbound-marketing), [Social Media](http://www.inboundteam.com/blog/topic/social-media) [![CEO's 2016 Guide to Marketing](https://no-cache.hubspot.com/cta/default/13372/fe8f46da-c409-43ac-bf27-63e2247d9eff.png)](https://cta-redirect.hubspot.com/cta/redirect/13372/fe8f46da-c409-43ac-bf27-63e2247d9eff) ### Posts by topic - [Inbound Marketing (143)](http://www.inboundteam.com/blog/topic/inbound-marketing) - [Lead Generation (66)](http://www.inboundteam.com/blog/topic/lead-generation) - [Blogging (35)](http://www.inboundteam.com/blog/topic/blogging) - [SEO (32)](http://www.inboundteam.com/blog/topic/seo) - [Content Marketing (31)](http://www.inboundteam.com/blog/topic/content-marketing) - [Sales & CRM (27)](http://www.inboundteam.com/blog/topic/sales-crm) - [Social Media (26)](http://www.inboundteam.com/blog/topic/social-media) - [Small Business Marketing (22)](http://www.inboundteam.com/blog/topic/small-business-marketing) - [Conversion (18)](http://www.inboundteam.com/blog/topic/conversion) - [Marketing Automation (18)](http://www.inboundteam.com/blog/topic/marketing-automation) - [Infusionsoft (16)](http://www.inboundteam.com/blog/topic/infusionsoft) - [eCommerce (6)](http://www.inboundteam.com/blog/topic/ecommerce) - [HubSpot Tips (3)](http://www.inboundteam.com/blog/topic/hubspot-tips) - [Pay-Per-Click (1)](http://www.inboundteam.com/blog/topic/pay-per-click) ### Subscribe to Updates ### Recent Posts - - - - - - (800) 609-9669 Inbound Team 1425 Market Boulevard, Suite 530-85 Roswell, GA 30076 US ### Services - [Inbound Marketing](http://www.inboundteam.com/inbound-out-marketing) - [Digital Strategy](http://www.inboundteam.com/inbound-out-marketing-strategy) - [Social Selling](http://www.inboundteam.com/social-selling) - [Coaching](http://www.inboundteam.com/coaching) ### Resources - [Inbound Marketing: Lead Investment Calculator](http://www.inboundteam.com/lead-investment-calculator) - [Inbound Marketing: The Definitive Guide](http://www.inboundteam.com/definitive-guide-inbound-marketing) - [LinkedIn Lead Generation Quiz](http://linkedquiz.inboundteam.com/) - [LinkedIn Profile Review](http://www.inboundteam.com/linkedin-review) ### About - [Home](http://www.inboundteam.com/) - [About](http://www.inboundteam.com/about) - [Contact](http://www.inboundteam.com/contact) - [Privacy](http://www.inboundteam.com/privacy) - [Terms](http://www.inboundteam.com/terms) © 2011 - 2015 Inbound Team, LLC. All Rights Reserved.