The most important factor for determining your page rank in the search engine results pages (SERPs) is based on your HTML code. Let me say that again: your HTML code is the most important factor in your page’s rank, credibility, and potential to be searchable. With the right HTML code, your rank will soar. Following are examples of codes for HTML best practices that must be practiced for good SERPs.
As far as HTML is concerned, the most important factor in SEO is the title of your page. The page title is the heading at the top of the browser window when people view a page, and it’s defined by the title element, or title tag, in the HTML of a page.
You probably don’t spend much time staring at the top of your browser window, so how could a page’s title matter so much? Page titles are crucial in SEO because they’re the biggest text in the SERPs.
Adding page titles to HTML code
You insert page titles into HTML in a title element within the head element, or head tag as shown below:
Here’s what a page title looks like in the context of a simple HTML page:
This is the body of the page.
Links in HTML are fairly simple. You create them using the ‘a’ (which stands for anchor) tag. A link must contain at least one attribute, href, which represents the location of the link, or where the link is directed. Inside the opening and closing anchor tags, you can place the link text, or the text the site visitor clicks to activate the link.
Here’s what a link to www.google.com looks like in HTML code:
Understanding the link voting system
When spiders are crawling your pages, links on your pages act as votes for the pages to which they’re linked. This voting process connects a URL with keywords. For example, the following link tells spiders that http://www.amazon.com is a site that has something to do with the phrase “buy dvds” because of the link text:
Links to your site are great, especially if the text used in the links from other sites includes keywords you want associated with your site.
Heading tags have six levels, starting with heading 1 (the h1 element, which is the largest) and ending with heading 6 (the h6 element, which is the smallest). Search engines put considerable weight on page headings that contain keywords, especially bigger headings such as ‘h1’ and ‘h2’. Smaller headings don’t have the same search value, but all headings can still provide a great way to group the information on your pages.
Creating heading elements
Adding a heading to an HTML file is pretty simple. You can add headings anywhere within the body element. Here’s what a heading 1 element looks like in HTML code:
Here’s a heading 1 heading
Emphasized text, or text within ‘i’ (italic) or ’em’ tags, gives a little boost as well if you wrap keywords in them. Both ‘i’ and ’em’ text carry the same weight in SEO. You don’t need to overuse these for SEO purposes (or overuse any HTML tags, for that matter), but they can help nonetheless.
Creating emphasized elements
Like ‘b’ and ‘strong’ elements, ‘i’ and ’em’ elements are easy to use. Simply wrap the text you want to emphasize in the proper opening and closing tags.
Here’s an example of using the ‘i’ tag in HTML:
This text is what? Italic
Here’s an example of the ’em’ tag:
This text is emphasized
Include information about the images you place on your pages to improve SEO as well as accessibility on your site. The big secret in image SEO is the use of the alt attribute. The alt attribute, besides associating keywords with an image for SEO purposes, tells the browser what text to display (or read) if an image is not viewable.
NOTE: The alt text should contain keywords that are relevant to the image to be useful for SEO.
Images and the alt attribute in HTML
Images are fairly simple to use in HTML code, and they can be useful tools for SEO as well. You can connect keywords to images through filenames and the alt attribute. Simply use the tag and set the value of the src attribute to the path of the image file. Here’s an example of an image element in HTML, displaying a file called dog.jpg:
Here’s what an image reference with a connected keyword via the alt attribute looks like in HTML code:
Metadata includes information about a web page, including its description and associated keywords. Early in the days of the Web, metadata was all the rage, and it was the most important part of SEO for a page. Today, metadata has somewhat lost its flair—especially keyword metadata. Even so, it’s best to include metadata on your pages, especially in the page description.
Using keyword metadata
Keyword metadata is a list of keywords to associate with your web page. Again, this is not the SEO powerhouse it used to be, but it can help a little. If you need keywords, you can use the keywords you’re already using in your site for SEO purposes.
NOTE: Google does not use meta keywords, but other popular search engines, such as Yahoo!, still claim to utilize them.
Keywords in HTML code
Adding metadata keywords to your HTML code, like just about everything else in HTML, is pretty straightforward. Simply insert atag inside thetag, use keywords as the value for the title attribute. Comma-separate your keywords in the content attribute. Here’s an example of keyword metadata in atag:
Currently, search engines may see https://focusdesigner.com (no www) and https://www.focusdesigner.com as two different sites. Because of that, your rankings could be split in half. To capture all the rankings and maintain them in one site, you can use some server-side code to direct all visits to display either the www (recommended) URL of your site or the non-www URL. The process varies a little depending on which server you’re using.