The Anatomy of an Optimized Webpage

THE ANATOMY OF AN OPTIMIZED WEB PAGE An optimized page can increase the likelihood of: Earned traffic from Higher rankings in Google and Bing social platforms (Twitter, Facebook, Google+, LinkedIn, Pinterest) 8+ Building a brand and drawing in repeat Links and shares visitors URL 2 Meta Description Tag http://www.example.com/category-keyword/primary-keyword.html Web Images Videos Maps News Shopping Gmail more v Search This is an example of a web page title www.mywebsite.com Here is an example of what a snippet looks like in Google's SERPS. The content that appears here is usually taken from the Meta Description tag if relevant. 1 URL Meta Description Tag Describes a site or page to HTML attributes that provide a brief explanation of the page visitors and search engines Identifies the file structure Often used to display a preview of a web page on search engine results pages of a given website Includes primary keyword phrases Draws a reader to a web page Use hyphens to separate words for readability Suggested length: 100-150 characters * Do not use underscores, Double quotes will cut off the description spaces, or other characters to separate words * If necessary, use single Too many hyphens may make the URL appear spammy quotes instead Title Tag http://www.example.com/category-keyword/primary-keyword.html Web Videos Maps News Shopping Gmail Images more v Search This is how your Title Tag appears in search engines www.mywebsite.com This is your page description. Descriptions will get cut off after roughly 55 characters... 3 Title Tag Technically called title elements Should be an accurate and concise description of the content of a web page Defines the title of a web page Often used on search engine results pages to display preview snippets for a web page Appears in browsers, search engine results pages, and external websites The closer the keyword is to the start of the title tag, the better it is for your ranking Place important keywords close to the beginning of the title tag Consider using title tools to see how a web page's title would appear in Google's search results before launching the web page If the title is too long, search engines will cut it off and add an ellipsis at the end A Though it is not a rule, try to stick below 512 pixels wide * Suggested length: 55 characters Header Tag 6 Article Copy 6 Visual Assets + + http://www.example.com This is the H1 heading tag being used on a title Here is an example of an accompanying article. It uses related and relevant terms and phrases throughout. 4 Header Tag Includes up to six levels, H1 Heading level 1 to H6 Heading level 2 The H1 tag is the major heading of a web page Heading level 3 Briefly describes the topic of Heading level 4 the section it introduces Heading level 5 Use H1 once per page Heading level 6 Avoid skipping heading levels Start with H1, then move down sequentially 6 Visual Assets 6 Article Copy Visual elements provide an opportunity to show up in an image search result Content should be comprehensive, useful, and relevant The following image-related items are all important Employ related terms and phrases throughout for optimization: the article A Filename + Helps search engines identify what the image Avoid overuse of keyword stuffing is about Highlight keyword phrases * Surrounding text + The text around an image may either be a caption or the article copy that follows the image with bold or italic fonts where necessary + An image is often used to supplement the text around it Compress images, files, and code to improve Alt attribute + Alt text is provided for an page loading speed image in case it cannot be displayed, and for the visually impaired 7 Embed Code Social Share Widgets 8. +- e http://www.example.com Embed this infographic Copy the code below and paste it onto your website. <div style="clear:both"> <a href="http://blog.surepayroll.com/"> <img src="http://blog.surepayroll.com/wp-content/uploads/ image.png" border="0" /></a></div> Share this 8+ in Su Embed Code Social Share Widgets Makes it easier to share Include share buttons on the visual assets top and bottom of the page: Can build links back to * Facebook your domain Twitter Google+ Do not stuff keyword-rich links into your embed code LinkedIn StumbleUpon Open Graph Meta Tags http://www.facebook.com Kickstart Your Kickstarter Campaign! D http://blog.surepayroll.com/running-a-kick-butt-kickstarter-campaign/ O How to Run a Kick-Butt Kickstarter Campaign To run a successful Kickstarter campaign, follow these tried and true tips and guidelines for your startup campaign. BLOG.SUREPAYROLL.COM 9 Open Graph Meta Tags og:description - brief description of the web page Allow control over og:type - category or type what content shows up when a web page is shared on most social media platforms of content og:image - URL of an image to represent the web page og:title - title of the page og:url - link to the web page or content og:site_name - name of the web page 10 Twitter Cards 10 Twitter Cards Allow control over what content shows up when a page is shared on Twitter SurePayroll Use a Twitter Summary Card @SurePayroll with a large image Everything you need to Tags are similar to open graph tags know about Twitter cards & traffic trib.al/XIJKKAD O twitter:card - similar to og:type, describes the type of content you are sharing twitter:url - URL to How to Drive Twitter © Traffic in Four Easy Steps represent the page With the advent of Twitter cards, individuals and brands can add. twitter:title - title of the page or content - SurePayroll aSurePayroll twitter:description - brief description of the page twitter:image - sets the image to go with the tweet Ranking factors change and evolve, but by focusing on these KEY ELEMENTS, your page will likely rank higher, bring in more traffic, and earn more links and shares. Brought to you by In partnership with dev.twitter.com developer.mozilla.org SURE PAYROLL moz.com osearchconsulting.com A Paychex® Company quicksprout.com GHERGICH&Co. -0... .. :----.............. ----------------