Basic SEO for Web Developers Part 3

  • 1. Important Social Metadata

    • Sample Meta Tag Template: "Article"

    • Place this data between the <head> tags of your website

      <!-- Open Graph data -->
      <head prefix="og: fb: article:">
      <meta property="og:title" content="Your Title Here" />
      <meta property="og:type" content="article" />
      <meta property="og:url" content="" />
      <meta property="og:image" content="" />
      <meta property="og:description" content="Your Description Here" />
      <meta property="og:site_name" content="Your Site Name, i.e. Moz" />
      <meta property="fb:app_id" content="Your FB_APP_ID" />
      <!-- Twitter Card data -->
      <meta name="twitter:card" content="summary">
      <meta name="twitter:site" content="Your @publisher_handle">
      <meta name="twitter:title" content="Your Page Title">
      <meta name="twitter:description" content="Your Page description less than 200 characters">
      <meta name="twitter:creator" content="Your @author_handle">
      <!-- Twitter Summary card images must be at least 120x120px -->
      <meta name="twitter:image" content="">
    • Social Metadata Best Practices
      i. Default to Open Graph

      • Facebook
      • Twitter
      • Google+
      • LinkedIn
      • Pinterest

      ii. Optimal Image Sizing

      • Choose large images over small
      • Twitter
        • Minimum 120 x 120px
        • No larger than 1MB
      • Facebook
        • Minimum 200 x 200px
        • Over 1200 x 630px recommended

    2. Rich Snippets and Structured Data

    • Enhance search results and help machines to understand your content
    • Common Vocabularies
    • Popular Formats
      • Microdata
      • RDFa
      • JSON-LD
    • Breadcrumbs
      <ol itemscope itemtype="">
          <li itemprop="itemListElement" itemscope itemtype="">
              <a itemprop="item" href="">
                  <span itemprop="name">Widgets</span>
              <meta itemprop="position" content="1" />
         ›<li itemprop="itemListElement" itemscope itemtype="">
              <a itemprop="item" href=""> 
                 <span itemprop="name">Large Widgets</span>
              <meta itemprop="position" content="2" />
    • Reviews
      <div itemscope itemtype="">
          <div itemprop="itemReviewed" itemscope itemtype="">
              <span itemprop="name">The Art of SEO</span>
          <span itemprop="reviewRating" itemscope itemtype="">
              <span itemprop="ratingValue">5</span>
          stars -  <b>"<span itemprop="name">A good read.</span>" </b>
          <span itemprop="author">Roger Mozbot</span>
          <span itemprop="reviewBody">The Art of SEO is a good book.</span>
    • Common Structured Data Uses
      • Events
      • Business Information
      • People
      • Mobile Apps
      • Recipes
      • Media Content
      • Contact Data
      • Email Markup

  • Linux Help

  • Node.js

    Thanks @dev_lak 😍

  • Web Development

    thanks @dev_lak

Log in to reply