Portico di San Luca, a Beautiful and famous porch in Bologna, Italy.

You’re redoing your website, and the UI architect has added a nice sidebar to the page. Or the visual designer has created icons for each of the product categories. The design looks gorgeous. Why not go with that sidebar or those icons? Because introducing a recurring element means just that—it has to recur on every page (or on many of them). Before you commit to such a design element, make sure your content can support it.

Consistency in web design

You already know that consistency is important in web design, for a number of reasons. It helps usability by adding predictability. If every page on your website looks different, the user has to spend mental effort on every page deciphering it and understanding where to look for key information. Consistent, predictable layouts allow users to unconsciously segregate and ignore less important information and to instead focus on what is unique and different on each page—such as the call to action or the headline that you want them to notice.

So, when you introduce an element like a sidebar, an icon, or a structured section on a page, it’s likely not a one-off. If you use a sidebar, for instance, it will probably occur on all the pages of your website or at least on all the pages of a certain type. For example, in the new design for our own Resources Online website, we are adding a sidebar on all the pages that detail our services, along with another recurring element: the portfolio section.

Consistency in content management systems (CMSs)

If your web developer is using a CMS to build your website, such as WordPress, Joomla!, or Sitecore, consistency is assumed. The CMS requires that you create one or more templates, which are pages with a specific layout. Using templates, it’s easy for you and your team to add content to the website without having to ask a developer to help you. As with a Microsoft Word template, you can go to specific sections of the page and enter text and images, as required by the layout, using a WYSIWYG editor.

Using a CMS for your website can accelerate website development, enable marketers and content creators to do much of the work, and save on maintenance costs by letting you easily make global changes using tools similar to search-and-replace within documents. However, it only provides those benefits if you are using the CMS properly, by leveraging templates. If you frequently make exceptions by creating one-off pages with different designs, the CMS soon loses its power. That means you need to commit to using templates and consistent page layouts.

When recurring website elements fail

Problems occur when you introduce a repeating element on your website and that element doesn’t make sense for all or most pages. At Resources Online, we build websites but we also create and manage content. We’ve seen our share of poorly thought through sites with unwarranted recurring elements. They can make content development and site maintenance harder.

Say that your website design includes a sidebar on every page. For some pages, it’s easy to find relevant content for the sidebar. Perhaps it’s designed to hold related blog posts or related products. For other pages, though, the sidebar doesn’t make any sense. What blog posts or products are specifically relevant on your About page or your Contact Us page?

When a content element appears on pages and has to be filled, it can create headaches for content owners who are forced to shoehorn largely irrelevant information into the space—just to make sure it’s filled for consistency’s sake. The problem is bigger than that, though. By adding irrelevant or barely relevant content to the page, you add more useless noise that can pull the users’ focus from what you really want them to see and read. Recurring and irrelevant elements on a website can actually lower usability and conversions.

Maintenance issues occur with elements, like icons or designs, that require pictures in specific locations. Perhaps the designer created an icon for each product category. That’s nice, except that it means every time you create a new product category, you have to create a new icon to go with it. In large e-commerce sites, where product categories are introduced and changed frequently, this can make for a lot of extra work. Not to mention that it becomes difficult to create a unique and meaningful icon for every category.

Similarly, where layouts require a lot of images, you may well find it a stretch to come up with relevant pictures. Also, pictures tend to draw the eye. If they do that at the expense of text, without providing any real value or support for the content, they may be a complete waste of space on the site and a waste of the staff’s time spent finding images.

Content assessment and planning is the key

How do you avoid introducing unnecessary—or even detrimental—elements in your design? The most effective way to prevent the problem is to avoid separating the visual design from the content development. On any large website, especially ones that are updated frequently, content and visual design go hand in hand.

Conduct a thorough assessment of your content before designing the website. Then, as you begin the design process and start developing template pages, compare the design with your content assessment. Ask questions, like:

  • Do you have enough portfolio items to put on every service page?
  • Do you have enough products to adequately fill each product category page?
  • Where content is lacking, can you develop enough new content to fill the gap? Will you generate enough blog posts or be able to find enough relevant articles each week or month to support the sidebar?
  • How often will you add new categories or products, and what elements does the design require that you create for each one? Can your budget and staff support these requirements?

Asking these kinds of questions during the design process will help you determine your content production needs and can help ensure that the site is maintainable for a reasonable price. The best designers know this and will direct you accordingly. By keeping an eye out for recurring elements and evaluating the design with an eye toward your content and content plan, you can accurately predict maintenance costs, avoid the “What do I put here?” pitfall, and create a site that optimizes space on the page while drawing the users to the information you most want them to see.

Want your picture or those of your blog authors to show up in search results? You’ve probably seen search results with a picture next to them, like this:

Want your picture or those of your blog authors to show up in search results? You’ve probably seen search results with a picture next to them, like this:

Want your picture or those of your blog authors to show up in search results? You’ve probably seen search results with a picture next to them, like this:

Those results appear because the blog has set up rel author, linking the author’s Google+ profile with the blog. As we described in an earlier post, this is one of three ways to get in good with Google. Rel author provides benefits beyond just a pretty search result. Here’s how to set your blog up with rel author:

  1. Create individual user accounts for each author in WordPress.
  2. Have each author create a Google+ profile.
  3. Add the blog to the Google+ profile.
  4. Add the Google+ profile URL to the WordPress user account.
  5. Make sure authors sign in with their user accounts to publish blog posts.

Create user accounts in WordPress

WordPress user menuFor each author on your blog, create a separate WordPress user account. Sign in as an administrator, and then, in the left menu, click Users.  Add a new user, or edit an existing one. Enter the name, user name, and email for the writer, and set the permission level. After you create the account, you or the new user can fill in additional information for the WordPress profile.

Creating your Google+ profile

Rel author works with your Google+ profile. So, the first step is to create one if you don’t have one already. Each author for your blog needs to do this.

Google walks you through the process. Before you start, you need:

  • An email address (or you can create a gmail one as part of the process).
  • A user name. (Of course, all the common ones—and a lot of variations—are already in use. So, get creative.)
  • A picture of yourself. This is what will appear in the search results, so choose a good one.

When you’re ready to create your account, go to http://google.com and, in the upper-right corner, click +You.  (If you see a blue Sign In button Sign In Button in GPlus in the upper-right corner, click it. Then, click Add account.) Under the sign-in box, click Create an account.

Fill out the box to create your account. You may have to try a few user names to find one that is available. Agree to the terms, and then click Next step.

Google Plus Profile Dialog

On the next page, click Add a photo and upload a photograph. This is very important, because it is the photo that will appear in search and on your Google profile page.

Continue adding information to set up your profile, following the instructions that Google provides.

Add your blog to G+

After you set up your initial profile, you can return to it to add more information. Just go to Google.com. In the upper-right corner, you’ll see +[your name]. (You may need to sign in, by clicking the blue Sign in  button Sign In Button in GPlus.)

To go to Google+, click your name. Then, point to the Home button Home Button in Google Plus on the left.  A menu appears. Select Profile.

Home Menu in Google Plus

On the profile page, click About. Fill in as much information as you’d like to—making your profile more personal is better for search and content distribution.

On the profile page, scroll down to the Links box. Under Links, click Edit.

Link section in Google Plus

Under Contributor to, click Add custom link.

Add Blog Link in Google Plus

In the Label field, enter the name of your blog. In the URL field, enter the address of the blog.

This adds your blog to your Google+ profile. Now, you need to do the reverse and add your Google+ profile to your blog.

Add your G+ profile to the blog

To go to your profile page in Google+, in the left menu, select Profile. Check the URL in your browser. It will look like something like this: https://plus.google.com/u/0/103131876029074251407/posts. This URL is your profile ID. Write it down or otherwise make a copy of it. (If you are setting this up for another author, have them send you the URL.)

Sign in to WordPress and then, to go to your user profile, in the left menu, click Users and select your name. Scroll down to the Contact Info section. Under Google+, enter or paste the profile ID and then click Update User.

That’s it. You have now set up rel author. When an author publishes a post, Google will pick up the association between the user and their Google+ profile, and it will use the picture from their G+ page to populate search results. Google also tracks the author’s posts over time, associating them with certain topics and thus helping the individual to gain authority in the topic. You can aid the process by using schema.org tags to better identify the content, as discussed in our post, Three ways to get in good with Google. In the meantime, enjoy your new, personalized descriptions in search!

Magnifying glass search

Magnifying glass searchBeing found through search is the number one goal for most bloggers—after all, people have to find you before they can read you. Google remains the top search engine. So, how do you get in good with Google? Try adding these three tools that Google uses to track, rank, or present your posts in search results.

Rel author, rel publisher, and schema.org are three tools which Google has specifically mentioned that it is using. We definitely recommend that you implement rel author and rel publisher. They aren’t very hard to set up, and they don’t take much ongoing work. Schema.org is more complicated and does take ongoing work, so you’ll have to decide whether it’s worth the effort.

Google and other search engines regularly traverse your blog and content. The search algorithms combine that gathered knowledge with other information about your business and authors, and they use all of the information to rank and surface your posts. The better the picture that Google has of you and your content, the better it can highlight your content in relevant searches. Using these three tools helps Google to create a complete picture of you and to more enticingly present your  pages to users in search.

Rel author

Rel author is the tagging which ensures that your blog authors’ pictures appear next to search results, like this:

Rel Author in search results

These search results include a picture of the article’s author, because the post or article has the author’s biography associated with it. There’s general agreement that these personalized results get better click-through rates. So, rel author is probably worth doing for that reason alone. In addition, Google places greater emphasis on content from people it considers “authorities” on a topic. By associating your profile with the content you produce, you allow Google to assess and rank your authority on different topics, based on the content you produce over time about those topics.

Lastly, that authority ranking is a factor which Google uses to determine which articles appear in its new “in-depth article” search results.

In depth articles in search results

All indicators are that Google is committed to author authority and rel author. So, it’s a good SEO investment to make.

Rel author is relatively easy to set up:

  • Create individual user accounts for each author in WordPress.
  • Have each author create a Google+ (G+) profile.
  • Add the blog to the Google+ profile.
  • Add the Google+ profile URL to the WordPress user account.
  • Make sure authors sign in with their user accounts to publish blog posts.

Rel publisher

Whereas rel author associates an individual writer with an individual post, rel publisher associates a business profile with the business’s website, via the brand’s Google+ page. The biggest immediate benefit is that, if you have created a Google+ page for your business and you use rel publisher to associate the G+ page with your blog or website, Google pulls the logo for your business from the G+ page and displays it in relevant searches.

Rel publisher in search results

In addition to this benefit, the association tells Google that you are a brand so that it can treat your business properly in search. It also may help you obtain and properly attribute +1 votes, if you are using that feature. And it increases the chances that your Google+ business page will appear in search results (via Google Direct Connect), which can help you gain both visibility as a brand and more Google+ followers for your business. Lastly, it helps ensure that you are properly positioned if Google decides to make additional use of rel publisher in the future.

Rel publisher is also relatively easy to set up:

  • Have an individual in the company create a Google+ page for the business.
  • Add your business website as a link in the profile for the business page.
  • Link the website by adding a piece of html (provided by Google) to the home page of your website.

Schema.org tagging

Schema.org is a tagging system that tells Google (and other search engines) more about a piece of content. The tags provide information, such as what type of content this is (like a recipe, an event, or an article, among other types), when it was published, what specifically it covers, and more. When Google uses the information you supply via schema.org tags, it can provide richer descriptions of your content. For example, here’s a recipe result where the top item is a rich snippet and the bottom is the same recipe without the rich content:

Schemaorg rich snippets in search results

Again, the idea is that users are more likely to click the rich snippet—the result with a picture, a rating, and a concise summary of the recipe rating and time requirement.

The key reasons for using schema.org tagging include the opportunity to display as rich snippets in results and the fact that Google uses the information to help determine whether your content appears as an in-depth article. Unfortunately, Google is reducing the number of rich snippets in search results because, predictably, spammers have latched onto this technique and spammed rich snippets. Still, rich snippets will continue to appear, and presumably Google will improve its spam-filtering algorithms to weed spammers out.

As for in-depth articles, there’s plenty of competition to appear in these results and using schema.org tagging doesn’t guarantee that you’ll show up. On the other hand, not using the tagging almost assures that you won’t appear. Moreover, Google is likely to continue to leverage the schema.org information as it unveils new features and new updates to its algorithms. So, if you can make the investment, it may prove worthwhile.

What’s involved?

  • Familiarize yourself with the tags at http://schema.org/.
  • Either use one of the available plugins (such as All In One Schema.org Rich Snippets) or edit your WordPress templates to include some of the tags in the headers and other areas so that they apply by default to all posts (for instance, indicating by default that posts should be considered articles rather than recipes or events).
  • Tag the content in each individual post, for the key tags:
    • headline
    • alternativeHeadline
    • image (which will appear in any rich snippet, but must be crawlable and indexable)
    • description (which will appear in any rich snippet)
    • datePublished
    • articleBody

Getting in good with Google takes a little effort, but it can yield big rewards in traffic to your website or blog. If you’re interested in implementing any or all of these tools, watch our blog. In future posts, we’ll be documenting in detail how to implement each of them.