Onpage optimization standards january 2012

Onsite Optimization Standards
Onpage Factors
● Adhere to HTML Standards
● Images
○ Non-content images should never reside within a <img> tag. Images that only aid
design/layout should be CSS backgrounds
○ All images within <img> tags must, without exception, contain an alt attribute to
concisely describe the image, using keywords when necessary.
○ All images must have a set width and height attribute to prevent browser reflow.
The height and width attributes must reflect the actual height and width of the
image.
○ Images must be optimized for page-speed
■ All images should be optimized for best page-speed. In photoshop use
File>Save for Web & Devices. JPG’s usually work at 61% compression.
■ Images with a limited amount of colors may be optimal as PNG-8 without
transparency. Within Save for web & devices, reduce the scope of Palette
while retaining the images original look.
● Links
○ Any and all links to mailto: or tel: in the href attribute should have a rel=”nofollow”
attribute
○ All links, without exception, should have a title attribute that concisely, within 66
characters, describes the destination page and is consistent with the destination
<title> tag
○ All phone numbers must be contained within a link using <a
href=”tel:+18008885555” title=”Call 1-800-888-5555” rel=”nofollow”>(800) 888-
5555</a> for mobile compatibility
○ All links, with a priority on internal links, must link to a 200 status code and never
to 404, 500, 301 status codes. 302 status codes may be linked to only when
linking to content areas that are not to be crawled such as an account
administration area.
○ Outbound links that link to non-reputable or potentially non-reputable websites, or
potentially temporary content must contain a rel=”nofollow” attribute.
● Headings
○ All headings, without exception, should reside as in-content items. Template
items that are repeated across several pages must not reside in a <h> tag.
○ Headings have a parent-child relationship. There is no H2 tag without an H1 tag
before it, likewise, there is no H3 tag without a prior H1 and H2 tag. H2 is a
subsection of the primary subject, h1, H3 is a subsection of H2.

○ Its possible for long-copy to contain multiple H1 tags. This content must be
separated from the other content by an <hr> tag to signify a thematic change in
content.
○ H1 must be consistent with the <title> tag
● Forms
○ All forms must contain <fieldset>, <legend> and <label>. The legend may be
hidden via CSS.
○ Form labels must contain a for attribute corresponding to it’s <input> counterpart
ID.
○ All input,select,textarea tags must contain a tabindex attribute beginning with 1 to
signify the order form elements will be selected when a user presses the TAB
key on their keyboard.
● Microformats
○ All microformats should be tested in and recognized by the Google Rich Snippets
Tool & the Pinterest rich snippet validator
http://developers.pinterest.com/rich_pins/validator/
○ Open Graph
■ All pages must contain:
● og:title
● og:type
● og:image
● og:url
● og:video (In every case as applicable)
● og:audio (In every case as applicable)
■ All open graph properties must conform to the open graph protocol
metadata standards and reside within the <head> tag.
○ Breadcrumbs
■ All pages, somes with the index as an exception, must contain shema.org
breadcrumb microformats.
■ The HTML used to create the breadcrumb microformats must be an
ordered list <ol>
● Example:
<ol itemprop="breadcrumb">
<li><a rel="home" href="index" title="title">Pinnacle Cart</a>
<span class="divider">»</span>
</li>
<li class="active"><strong><a href="#"
title="">Features</a></strong></li>
</ol>
■ Breadcrumbs must conform to schema.org standards
○ Products
■ All product pages must contain product with as many semantic attributes
as available with a priority on aggregateRatings, price, highPrice,

lowPrice, brand, Manufacturer, Model, logo, color, itemCondition, sku,
weight, width, height
■ Product Reviews
● AggregateRating
● Each review must contain the review schema attribute
■ Related Products
● Related products must contain the isRelatedTo schema attribute
for each related product.
■ Similar Products
● Similar products must contain the isRelatedTo schema attribute
for each similar product listed on the page.
● Navigation
○ A comprehensive, redundant navigation is critical
■ Header
■ Footer
■ Anchors
■ In-content
● Social Media
○ AddThis.com may be an ideal option depending on the client and is acceptable
under our standards.
○ Icons
■ We recommend adding social media icons in a prominent location in the
header site-wide.
■ Prioritize social media icons in this order: Facebook, Google+, Twitter,
Yelp if applicable
○ Integration
■ Use facebook comments rather than regular HTML comments
■ Include Facebooks “Like”, Pinterests’ “Pinit”, Twitters “Tweet” on product
pages.
○ Key pages
■ Social media integrations, calls to action, invitions to join us on our
networks should be prominent on both the Contact Us and About Us
pages at least.
● About Us
○ We want the best about us page of all time, inclusive of available images, video,
press, social media integrations and at least 3 paragraphs with 3 headings
■ Example
● Who are we?
● Our mission statement
● Our commitment
● Contact Us
○ Contact pages must be the best possible contact pages available.
■ Contact pages include:
● Address

● Phone number(s)
● Google Maps widget (if applicable)
● A brief paragraph tag explaining for inviting contact
● One or more clickable mailto: links without @ - Use the actual
email address and deal with the spam off-site.
● Frequently Asked Questions
○ Include as many questions & answers as possible. Use logical headings for both
the contents of questions and answers.
○ Cover even seemingly obvious questions & answers
○ Include shipping/product questions/answers that are even clearly answered on
other areas of the site.
○ Make the FAQ comprehensive
● Privacy & Terms
○ Real websites have privacy & terms.
○ Privacy policies are required by any website that collects data
● Sitemaps
○ XML
■ XML Sitemaps must be valid
● http://www.validome.org/google/
○ HTML
■ Include HTML sitemap using ordered/unordered lists
● New URLs
○ If the URL’s for existing content change, 301 redirects must be in place to
prevent 404 errors.
● www or non-www
○ While officially www/non-www urls are considered a matter of preference, we
prefer non-www urls because they do not force a 301 redirect from type-in urls as
most users do not begin web addresses with www.
● Title tags
○ Title tags must be under 66 characters, with primary keyword(s) in close
proximity to the very beginning of the tag content.
● Meta descriptions
○ Meta descriptions must be under 156 characters, contain relevant keyword(s)
and contain a call to action.

Onpage optimization standards january 2012

Recomendados

Recomendados

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Similar a Onpage optimization standards january 2012

Similar a Onpage optimization standards january 2012 (20)

Más de Bitsytask

Más de Bitsytask (20)

Onpage optimization standards january 2012