On-page SEO is a term used to describe all of the elements that live within the code of your website that have an impact on how your content ranks in search engines.
The good news about on-page SEO is that we have total control over these elements. The bad news is that there really isn’t a magic bullet for optimizing on-page SEO. It requires research and execution that is totally brand-dependent, meaning that what might work for some may not work for you. There are, however, some principles that every website should follow when optimizing on-page elements. That’s what we’re going to talk about today.
On any given page, there are countless factors that influence how that page ranks on a search engine. Today, we’re going to look at the HTML components like title tags, header tags, meta tags and image attributes, page URLs, what page design has to say about SEO, a linking strategy that will boost your page’s visibility and a brief discussion of where to put keywords in your copy.
Let’s start with a look at your website’s HTML. “HTML” stands for “Hypertext Markup Language”; it’s the code that tells a web browser how to render your website for a visitor and is the standard language for creating websites. Developers use HTML to build websites through the use of HTML elements, or “tags”, snippets of code that represent a structural component on a webpage, like a headline, a paragraph, images or a hyperlink.
Because HTML is the standard structural language for all websites, search engines rely on certain HTML tags to assign relevance to any given webpage. A search engine, like Google for instance, assumes that every page contains the same baseline HTML elements, so their crawlers look directly for these elements when indexing a webpage and attempting to decode the content on the page. What this means is that every page has the same rules to follow, ensuring an even playing field for all web content. So it’s important that your website’s HTML is following the rules and appealing to search engines as best as possible.
The HTML tags that we’re doing to look at today are the title tags, header tags, meta tags and image attributes, as these are the primary HTML elements that search engines look for and consider when attributing meaning and value to your content.
First, the title tag. Your title tag is located in the header section of your page’s HTML and is used to specify the title of your page. Title tags are important for several reasons, mainly because they help search engines understand what the page is all about. The title tag is visible in three key areas; the web browser, the search engine results pages and as shared content on social networks.
Writing a good title is not rocket science, but there a few guidelines that can help.
- Title length – Keep your titles between 50 and 60 characters. Google will display up to 600 pixels in the headline, but since characters can vary in width, there’s no exact character limit.
- Keyword concentration – While there is no penalty built into Google’s algorithm for long titles, you can run into trouble if you start stuffing your title full of keywords in a way that creates a bad user experience, such as: Buy Flowers, Best Flowers, Cheap Flowers, Flowers for Sale. Avoid titles that are just a list of keywords or use the same keyword over and over in different ways. Search engines are smart enough to know when you’re just stuffing keywords and search engine users are wising up to these practices as well.
- Unique titles – Unique titles help search engines understand that your content is unique and valuable, and also drive higher click-through rates. On the scale of hundreds or thousands of pages, it may seem impossible to craft a unique title for every page, but modern CMS and code-based templates should allow you to at least create data-driven, unique titles for almost every important page of your site. For example, if you have thousands of product pages with a database of product names and categories, you could use that data to easily generate titles like: [Product Name] – [Product Category] | [Brand Name]. Absolutely avoid default titles, like “Home” or “New Page” — these titles may cause Google to think that you have duplicate content across your site (or even across other sites on the web). In addition, these titles almost always reduce click-through rates. Ask yourself: how likely are you to click on a page called “Untitled” or “Product Page”?
- Prioritize keywords – Two important facts about keyword prioritization in titles. First, keywords closest to the beginning of your title tag may have more of an impact on the page’s search rankings. Second, search engine users may only scan the first two words of a page’s title when deciding if they’re going to click or not. Try to write titles where the most unique aspect of the page (e.g. the product name) appears first. You want to avoid titles like: Brand Name | Major Product Category – Minor Product Category – Name of Product. All this does is front-load repetitive keywords and bury the unique details of your page. This formula could also result in the search engine cutting off the end of the title tag, where you inadvertently placed the most unique information.
- Brand leverage – If you have a strong, well-known brand, then adding it to your titles may help boost click-through rates. It is recommended to place your brand at the end of the title, but there are cases (such as your home page or about page) where you may want to be more brand-focused. As mentioned earlier, Google may also append your brand automatically to your display titles, so be mindful of how your search results are currently displayed.
- Audience analysis – While title tags are very important to SEO, remember that your first job is to attract clicks from well-targeted visitors who are likely to find your content valuable. It’s vital to think about the entire user experience when you’re creating your title tags, in addition to optimization and keyword usage. The title tag is a new visitor’s first interaction with your brand when they find it in a search result — it should convey the most positive and accurate message possible.
Let’s move on to header tags. Header tags look like this in your HTML and are sometimes simply referred to as “H” and then a number denoting its level, like “H1”, “H2”, “H3”, etc. Header tags, unlike the title tag or meta tags, are seen directly within the body of your page. Think of header tags like section or chapter markers. By using header tags effectively throughout your copy, you’re providing crawlers an easy-to-follow outline of the content of your page. Header tags are ordered by level of importance and start at 1 and can sometimes go all the way to 5, although it’s best to stick to H1-H3. Here are some more tips for using header tags effectively:
- Wrap the page’s title in a H1 tag and place it towards top of your page’s body section. Then, you can use H2 and H3 tags to organize your copy into subsections and chapters, if need be.
- Your H1 should include the keywords that your page is targeting.
- Try to stick with one H1 tag. If your page has multiple main sections that all require attention, maybe consider breaking it up into multiple pages, or use one H1 tag and multiple H2 tags for the sections.
Another very important HTML element are the meta tags. While the title tag is technically considered a meta tag, it doesn’t contain the word “meta” in its taxonomy and is usually not located with the rest of the meta tags. There are a lot of different meta tags, but only a few of them are relevant to SEO; content type, description and viewport. These tags should be on every page, no exception.
We’ll start with meta content type, which declares your character set for the page. Leaving this out could impact how your page renders in the browser. Make sure that every page on your website has a content type meta tag Here are a few common examples:
If your pages are missing this tag, consult your web developer or an IT specialist to implement the content type tag.
The description is another important meta tag, but its use is slightly complicated. By itself, it really has no impact on page ranking and is only used to describe the page’s content to search engine users. However, the meta description does significantly affect a page’s click-through rate, which does have an impact on how the page ranks. Therefore, don’t write your meta descriptions for crawlers, write them for clickers. The best way to look at meta descriptions is as ad copy used to sell the page to search engine users. As a general rule, keep your descriptions to 160 characters or less. Another reason why the meta description is important is because many social networks will use a page’s meta description in a generated link preview. That’s why it’s important to have a meta description. If you don’t craft your own meta description, most search engines and social networks will generate their own by pulling copy form the first paragraph on the page. That might not always be a bad thing, as long as your first paragraph does a good job at selling the content of the page.
The last meta tag that we need to include is the viewport tag, which tells the browser how to manipulate the page’s dimensions and scaling. This is critical for mobile responsive websites, which rely on the viewport tag to establish a baseline device width by which the page’s content will be placed within. Without this tag, mobile responsive pages will have a much harder time rendering, and Google and other search engines will penalize your page. Make sure every page has the meta viewport tag. More often than not, using this basic viewport tag will get the job done.
As far as on-page elements are concerned, images are often overlooked when it comes to SEO. After all, how can a crawler index something that doesn’t Include any text? That’s where image attributes come into play. Image attributes are the HTML elements included within an image tag that describe the context of the image and relate it to the content on the page. Also important is the image itself, because an image that is much larger in file size than it has to be can drag your page load speed down, which we know can have negative effects on our SEO.
Here are a few considerations for using images:
- Choose the right image for your page. Remember that Google and other search engines want to find and return content that is the most relevant to the search query. Images, if used and optimized properly, can add additional context and keyword concentration to your pages. Generally speaking, every page should have an image, and that image should be directly related to the context of the page.
- (File) size matters. Please make sure that you’re not embedding an image into your page that is 3,000 pixels wide when you only need 500 pixels to fill up the space. Even if you set the image to display at 500 pixels wide, the file still has to load at its original resolution. So try to upload your images only as large as you’re going to need it on your website. Many content management systems, like WordPress, include features that automatically optimize your images to make them smaller in file size and resolution. You can also accomplish this manually in Photoshop or other graphics editing programs.
- Name your images with a purpose. Remember that search engine crawlers can’t view your images, per se, but they can read them based on the information that you provide. When a crawler indexes an image, the first thing it reads is the filename. If you’ve got an image of a Mother’s Day arrangement with red roses and pink lilies that’s saved as “Image1.jpg”, how is a crawler going to be able to tell what that image is about? Instead, opt for something like “mothers-day-red-rose-pink-lily.jpg”, which includes the most important keyword, “Mother’s Day”, at the beginning of the filename and additional descriptive keywords, “red rose” and “pink lily”, baked in to add context that crawlers will use to better understand the image’s content.
- Don’t ignore the alt text. An image’s alt text is what is displayed when an internet browser has images turned off, or when the page is loaded into a screen reader. The alt text is a great opportunity to provide crawlers with more information about what exactly your image is. Using our last example of a Mother’s Day arrangement, an effective alt text for this image would be something like, “Mother’s Day flower arrangement of red roses and pink lilies in a transparent glass vase”. An easy to remember strategy is to write alt text as if you’re describing an image to someone with a visual impairment. There’s no need to stuff the alt text with keywords, so long as the image you use is appropriate and relevant within the context of the page.
- Mind your Ds & Cs. Descriptions and captions, while not always used, are components made available by certain content management systems, like WordPress specifically. They don’t have a real impact on your SEO, but they do offer additional value and user experience. Research shows that image captions are read 300% more than the copy on the page. Think about that for a minute! Image descriptions and captions can be a great way to add additional context and information for your users, keeping them on your page longer and raising the page’s authority for the keywords that delivered them to your page.
Another important on-page SEO element is the URL, which is, more often than not, the first thing seen by a crawler and used to identify the purpose of a page. Talk about needing to make a good first impression. Moreover, having a simple and consistent URL structure will go a long way for helping crawlers and site visitors to easily navigate your website. Want to write a good, SEO-friendly URL? Follow these steps:
- Use your keywords. Each page has a purpose. Identify what the main purpose is and include it in your URL, specifically towards the front. Your page for the Mother’s Day rose and lily arrangement should look something like this: domain.com/mothers-day-red-rose-pink-lily-arrangement.
- Use a consistent structure. Even though every page has its own unique URL, chances are that your website’s structure will dictate how your URLs are written. For example, your product pages are more than likely nested within a product sub-category, which might live in a main products category, that sits directly below your domain. Using our Mother’s Day arrangement example, you might get a URL that looks like this: domain.com/products/holidays/mothers-day/mothers-day-red-rose-pink-lily-arrangement. Not a bad URL, as it takes advantage of the “Mother’s Day” keyword and flows logically from domain to product level. Just make sure that all of your URLs follow a similar syntax. You don’t want your yellow sympathy rose URL to be something like: domain.com/yellow-sympathy-roses. Not only does that not follow the same structure, it places the most important keyword, “sympathy”, further back in the URL. Instead, opt for this: domain.com/products/occasions/sympathy/sympathy-yellow-rose-arrangement. This URL follows the same structure and uses the correct keywords in the right order.
- Avoid keyword stuffing and garbage words. A good rule of thumb is to write a URL that communicates the purpose of the page to users and crawlers without them having to actually visit the page. You don’t need to use your keywords four or five times in a URL. Once or twice, max, will do just fine. Also, words like “and” or “the” are unnecessary. For example, the URL for our Mother’s Day rose and lily arrangement shouldn’t read something this: domain.com/flowers/mothers-day-flowers/mothers-day-rose-arrangements/mothers-day-red-rose-and-pink-lily-arrangement. Yikes. Better to go with the more simple and logical: domain.com/products/holidays/mothers-day/mothers-day-red-rose-pink-lily-arrangement, or simply: domain.com/mothers-day-red-rose-pink-lily-arrangement, if you’d rather have a shorter URL. Remember, if you opt for the shorter URL, make sure all of your URLs follow the same format.
- Avoid automation. Depending on which content management system you use, your page URLs could be automatically generated as something like this: domain.com/product/?id=1234. While a search engine crawler can still access the page and index its content, the URL isn’t offering any help. If at all possible, try to set up your content management system to create URLs based on the title of the page, or edit them manually yourself to reflect the practices that we’ve discussed here.
DESIGN FOR SEO
Did you know that the physical design of your page can also have an impact on how well it ranks with search engines? In fact, if your website isn’t up to snuff visually, search engines might ignore it altogether. In 2015, Google announced that it would be penalizing websites that are not mobile responsive, meaning that if your website did not visually adapt to smaller screens like smartphones and tablets, it would fall out of favor with Google. Please make sure that your website is responsive. It could mean the difference to being found on Google or not. Also, if you can find a need for visual content on your pages, don’t pass up the opportunity. Search engines are a lot like humans in that they appreciate and value visual content like photos, GIFs, charts, infographics and video. Not only do they provide additional content opportunities that crawlers can use to better understand the content of your page, they can keep visitors on your page longer, reducing the bounce rate and improving the user experience signals that search engines take into account when ranking your page.
If you aren’t linking out to relevant content on other domains, you could be missing out on a huge opportunity. Linking out can provide additional context to your page’s content that crawlers can use to better understand your page. Industry professionals suggest that 2-4 outbound links per 1,000 words is generally a good place to start. Link wisely, though, as linking out to a page that doesn’t reflect well upon your domain won’t do anything for your SEO. Plus, the domains you link to will appreciate the boost and could even return the favor.
Don’t forget about internal links either! By linking to your own pages, you get more eyes on older content and can improve the contextual understanding of your page’s content from a crawler’s point of view. Try being your own best advocate and link to 2-5 of your own pages on each new page that you write.
Finally, we have to mention keyword usage. Obviously, you want to use the keywords that you’re targeting in one way or another within all of the on-page elements that we’ve discussed. However, there is a right and wrong way to do this.
- Try to stick to one main keyword per page. This makes deciding which keyword to put where much easier. For instance, we know you want to put your main keyword at the beginning of your page title and URL, and should also include it at least once within the first paragraph.
- Most important keywords first. You probably have more than one keyword that you want to rank for, but make sure you order them accordingly.
- Drop your main keyword within the first 100 words. This not only helps search engines understand what your page is all about, it helps reinforce to your users that they clicked on the right page.
Now that you have a better understanding of the on-page elements that influence how your pages rank, you can start optimizing your content to reflect these best practices. A great place to start is by taking a snapshot of your website’s content by completing a SEO site audit and then going through your content and making the necessary changes that we outlined today. If you haven’t watched our site audit video, please do so! As always, if you have any ideas for future tech videos, send them on in to firstname.lastname@example.org. This is Max Duchaine for the Society of American Florists. Thank you so much for tuning in. I’ll see you next time.