How To Learn HTML for SEO
This class is designed to teach beginners the basics of HTML for SEO. It’s important to understand that everything taught in this class is based on SEO best practices. Utilizing these best practices are merely tactics. To get the best use of these tactics they should be applied within the context of a SEO strategy that includes content development, and link building, as well as optimized HTML. This course will be updated on a semi-regular basis when changes to best practices occur. If you have any questions about this class or want to learn more about SEO from Joe, contact him today.
Chapter 2: HTML/CSS Styles
Chapter 3: Title Tags
This is HTML for SEO Chapter 3: Title Tags. So, in this chapter, we will discuss what exactly is a title tag, why is it important for SEO, and then we’ll review some tips for optimizing a title tag. What exactly is a title tag? Well, the title tag is an HTML element that holds the title in the document and it’s one of the strongest ranking factors for SEO as far as HTML tags are concerned. So, let’s actually take a look at this and look at some examples. Let’s pull up the HTML document that we’ve been working on in this course and, as you can see right here on line 5, we have the title tag. And if we take a look at this page within our web browser here, we can see this is the page. Up here it says “page title.” If we were to edit this and put in something random. It’s lunchtime here, so I’m feeling hot dogs. So, if we put something random in the title tag here, as you see when we reload it, it comes up right here. So, the title tag displays in the browser in the tab section. And then it also is what is used to display in the search results for the title of each search snippet. For example, this query is for the search term “pizza bagel” and we see we have a lot of different, looks like, recipes for pizza bagels. Each one has a title within the SERP. Each one of these titles are taken from the individual page’s title tag. In some cases, Google will replace the title within its search results pages with a title that is more appropriate, that they think is more appropriate, but probably eight to nine times out of ten they utilize the text that’s found within the title tag on the page itself. And so, that’s why it’s so important. So, how do you optimize for the title tags, right? How do we optimize for this tag? Well, first off, we’re going to want to use relevant natural language. This is important, I think, because a lot of people think about the title tag and the content that should go inside the title tag. They oftentimes will just throw a bunch of keywords in the title tag and that actually does not work. Which brings us to our next point: you do not want to over use target terms. So, a lot of times an SEO or someone will try to just jam in a bunch of terms that they want the page to rank for within the title tag, and that can actually cause problems because Google may consider this what they call “keyword stuffing.” They may find it over optimized. So, you should not over use your target terms with a title tag. A big thing with title tags is do not duplicate. This is something that the search engines have always paid attention to. They do not want to see pages on your site that have duplicated title tags. And this is because this is a very quick and easy way for the search engines to identify duplicated content on the site. And so, as a way to mitigate the risk of content being labeled duplicate, you should really not have duplicate title tags. So, it’s very important that every page in your site have a unique title tag. Generally speaking, it’s a good idea to keep your title tags between 30 and 65 characters. This is because – you know, we looked at the search results pages a little earlier for the term “pizza bagel” – if you go past 65 characters, there’s just not a lot of room within the search snippet. And then if you go under 30 you’re probably not putting enough content in the title tag. So, between 30 and 65 characters is the sweet spot. You’re going to want to optimize for click- through rates. What does this mean? Click-through rate is the percentage of people that click on the search result that have searched for that query. So, we’ll look at that in a second. Then, you’re going to want to standardize across the entire site. Basically, this just means is to develop a format for the title tags or a formula for how title tags should work. Before we go any further, though, I want to just touch base on the click-through rate issue here. I want to talk a little more about that. Basically, I mentioned that you really want to try to optimize for click-through rate, and what that means is that you want to try to pick a title for your page that is going to inspire someone to click after they reach the search results. This is important for lots of reasons, but the most obvious is that–Let’s say that you are trying to rank for the term “pizza bagel.” Well, you might get lucky and do a really good job with your SEO and, as a result, rank number one for that term. However, if you’re not that lucky or if you still have a lot of work do for your SEO, you might rank lower on the page. For example, this “Kids-Only Pepperoni Pizza Bagels” from Kraft Recipes. Now, if your title tag is written in a way that inspires people to click on the link, then it doesn’t matter so much if you are all the way down at the six or seven position on the page because you might be getting just as many clicks as, say, someone up here at the second or third result. So, you know, it’s very important to focus on increasing your click-through rates by including a title tag that is relevant and that also inspires clicks. There are some good examples on this page already. As you can see, “How To Make Pizza Bagels.” There’s another how-to right here. How-to right here. How-to content generally gets a good click-through rate. Another common thing we found down here is “Best 25 Pizza Bagel Recipes.” Again, that gets a high click-through rate because you’re showing a large body of content. “25 Different Recipes” right there. “Easy Mini Bagel Recipes.” Easy is a term that usually gets a high click-through rate. Kids-only, that’s kind of different so it might get a good click-through rate. Another one is to include if you have a very popular brand name with your within your industry, it might be to make sure you include that in the title. So, Betty Crocker is probably going to get a lot of click-through rates because of their brand name. Really focus on developing title tags that have high click-through rates. Another thing I want to touch base on is the length. I mentioned in this that you should keep it between 30 and 65 You can’t assume that every user is going characters. Just to point out that, as you see, many of these towards the click “P,” and then read the content top are actually shorter. This one right here from Bagel Bites says, happens. So, if you really want to focus “Cheese and Pepperoni.” That’s the only thing it’s in the title tag. kind of a surefire best bet way to get “Luke’s Pizza Bagel Recipe.” You don’t need to make a very, you know, long title tag. to want to make sure that you’re not You know, keeping it within a manageable kind of length in that the This is probably the biggest entire title can be shown within the search results. There’s no, CSS for SEO. Let’s take a look at some you know, there’s no cutoff here in the title tag. That’s optimize it further. One thing you can important. So, focus on length and click-through rate. Those are very documents to make loading faster. important. And then, also I mentioned to standardize across the entire site. What WordPress website, for example, will have does that mean? That basically just means that I want you to develop a standard site, but then maybe included a bunch of formula and here’s some examples of that. These are some examples of some individual CSS document. It would be standardized title tag formats. A very popular one is the “page title” right to one document so that the server here with we call this a pipe, a page title, and the brand name. The product user only has to make one request name, if this is a product page you use a product name, and then maybe the product Minimize using CSS to hide important category, a pipe, and then the brand name right here. you don’t want to hide content that’s If this is a blog post title, or a blog post, you do a blog post title right content that has key words included in here, then the category that the blog post falls in, and then the brand name. needs to be visible for the user and the The reason that this is kind of helpful and beneficial is that this will page. Do not use CSS to trick users or help the search engines sort of identify a kind of a structure and Basically, in the past folks would architecture to your content because it will know that, okay, this product like links or special content. So, in the here is found in this category. It will apply semantic relevance to, not paragraphs of keyword-rich paragraphs only the product name, but also the product category as well, if you include sections of content, and then use both of these with the title tags. The same is applied for the blog post title. it on the page, you couldn’t see the You know, just to mention what I said earlier in the video, you do not but it had a lot of keywords meshed into want to duplicate terms. For example, let’s say the product name is “pizza That’s a violation. They will they will bagel” right here. If the category is bagel or pizza, but you should probably content specifically for ranking. The leave that out all together. So, don’t duplicate language within the same Some people like to put, what we call, title. And then try to always adhere to some sort of format like so. That is other sections of the site and hide it about it. with CSS. You really should not do that Up next is Chapter 4: Meta Robots Tags. See you then! In fact, you should really only hide things with CSS if you have a very
Chapter 4: Meta Robots Tags
HTML for SEO. This is Chapter 4: Meta Robots Tags. So, in this chapter, we will be discussing what exactly is the meta robots tags, why is this important for SEO, and then we’ll discuss some tips for optimizing the meta robots tag. So, basically, the meta robots tag is essentially just an easy way to give direction to the search engine crawlers. When a search engine visits your site, it will attempt to crawl or scan every page on the site unless we tell it not to. And so this tag basically tells the search engine crawler what we would like them to do while they’re on a given page, whichever page this tag is located on. So, we’ll give–In this video, I’m going to show you some examples of how to control the search engines utilizing this tag. This tag can get you in a lot of trouble if you don’t use it correctly because it does tell the search engines which pages should not be included in the search results. Let’s take a look at this real quick here. There are two main sections of this tag that you need to be focused on. There is a first section here in our example where we mention “index” right here. This will control whether or not the page is included within the search engines or not. And in this next section after “index” is “follow.” And this will control whether the search engines follow the links found on that page and also whether they apply the full value of those links on to the rest of the site, or the pages that the links link to. So, basically it’s actually really easy to use. So, if we decided that we did want a page included within the search results, then we would just include the index perimeter. In fact, we probably don’t even need to include a tag at all to tell the engines to index a page. But if we were going to, we would use just “index” because that tells the engines, “Hey, go ahead and index this page. Include it in your search results along with the rest of site.” If we, however, decided that we did not want to include the page within the search results, then we would apply a “noindex” instead. So, “do not include in search results” that would equal “noindex” right here, and that would be applied right here in this section here. If we wanted the search engines to follow all of the links found on the page, and then also apply the full value and equity that those links represent, then we would include the “follow” attribute right here within the robots meta tag. However, if we for some reason did not want the search engines to follow the links on that page, or we don’t want those links to provide value, a good example: maybe you might have some sponsored content on a page and some of that content may include links, so to adhere with Google’s guidelines, you should include a “nofollow” here within the meta robots tag. Before I go any further, I want to show you–You know, we’ve gone through the four different options available for this tag. Let’s go ahead and show you what the tag looks like in the wild. So, here is our example again of our HTML page. I’ve included the robots meta tag up here in the head section of the document. As you can see, it says “index, follow”. For example, if we wanted to make sure the search engines do not include this page within the search results, we would just put a “noindex” here. Change that from “index” to “noindex”. And when the search engines see this, they will not include this page within the results, but they will follow the links on the page because it still says “follow”. If we wanted to stop that, if we wanted to put “nofollow” right here, then this directive would tell search engines to no longer include it within the search results and to no longer follow the links found on the page. I’ve included some examples of each one of these here. For example, if we wanted to include a page within the search results, then we would want to include this first one here which is “meta name=”robots” content=”index, follow”. However, if we did not want to include the page within the search results but we do want to follow the links, then we would include a “noindex” tag along with a “follow” directive for the links. There are maybe some cases where we want to include a page in the search results, but we do not want the search results engines to follow the links on that page. Like I mentioned before, this can be because of sponsored content; different reasons. Either way, you want to go with “index, nofollow”. And then, there may be some cases where we want to not include the page within the search results and then also we do not want Google to follow the links found on the page. And when that is the case, then we will want to put a “noindex, nofollow”. An important point to mention – I’ve seen this a lot – in some cases, a webmaster will want to remove a page that’s already existing and they will attempt to block the page from being crawled within robots.txt file. This is sort of unrelated to this, but again this is the most – what we’re looking at right here in the robots meta tag – this is the best way to be de-index a page or to remove an existing page from the search results. I hope that this chapter has provided some guidance for the for the meta robot tag and I’m looking forward to talking with you in Chapter 5 about the Meta Description Tags. Talk to you then.
Chapter 5: Meta Description Tags
This is HTML for SEO Chapter 5: Meta Description Tags. In this chapter, we will discuss what exactly is the meta description tag, why is it important for SEO, then we’ll talk about some tips for optimizing the meta description tag. So, the meta description tag is a HTML tag that provides a brief description about the page. And as you can see, it’s very basic: meta name=description, and the content is a brief description about the page that the tag is found on. I want to go ahead and show you some examples of this, though, before we go any further. Here is an example of the tag within the page that we’ve been working on within this course. On line 8, you can see the tag, its meta description, and then the content. This is a brief description of the content of this page. I like to keep my meta description tag near the meta robots tag because it’s easy to identify, but it always needs to be within the head section of the document. Within the search results, the meta description appears underneath the page URL. For example, back to the search result “pizza bagel,” on the second result we see cheese and pepperoni from Bagel Bites.com. And then underneath that it says, “a bite-sized pizza classic.” This is coming either directly from the meta description tag or from the page itself. And that’s important to mention is that most of the times Google and other search engines will utilize the meta description tag to fill in this content right here in the results page. However, in some cases, they may pull content directly from the page itself. Which is why if you want to utilize the meta description tag to put content here, it’s important to utilize your target keyword at least once within the description, and that should help get the meta description present on a search results page. So, how do you optimize this? Well, we just mentioned including the right keywords within the content. That’s one good thing. But also you’re going to want to maintain content between 70 and 156 characters for the description tag itself. Use engaging content to increase your click-through rate. So, we talked earlier about the title tag and we talked about how to board to increase click-through rate using the title tag. It’s just as equally as important to do that with the meta description tag, so you should utilize this area to provide some persuasive copy for people to click the search result and to view your page. It’s very important that you do not duplicate the content within the meta description tag. This means it’s important that each page on your site have a completely unique meta description tag and this is important because we believe that Google likely looks for duplicate meta description tags as a way to identify duplicate content of a site. So, it’s very important that you use very unique content within your meta description tag. And last, but not least, make sure you do not use quotation marks. Quotation marks can break the description tag. It can often confuse the crawler and think that, well, the tag is ended a lot sooner than it has. So, make sure you do not include quotation marks in the meta description tag. That is it for this chapter. Next chapter is Chapter 6 and we’ll be talking about canonical tags, and I will see you then.
Chapter 6: Canonical Tags
HTML for SEO Chapter 6: Canonical Tags. In this chapter, we will discuss what exactly is a canonical tag, why is it important for SEO, and tips for optimizing the canonical tag. So, what exactly is the canonical tag? Well, the canonical tag tells the search engines which version of the URL that the page is to be displayed is the correct canonical URL. Now, I’m sure you’re wondering, “What exactly is a canonical URL?” That’s a very good question. So, the issue of canonical URLs and canonical tags is very important and it solves a very big problem for SEO. So, let’s get started and take a look at what this means. As we see, each one of these URLs listed on this page is for the same exact page. We can see that each URL varies a little different – a little bit different format or different variation of the same URL. Even though we can see that this is the same exact page for each one of these URLs, a search engine might not be able to tell the difference between these these URLs. And so, what the canonical tag does is it tells search engines which version of the URL we would like to choose to be our canonical version of the URL. And the reason that’s important is because it combines all of the inbound renting factors and all the other aspects of SEO from all these different URL variations. It combines them into one single entity. So, therefore, if a bunch of links are pointing to this version here at the bottom right here and we’ve chosen that this version of the top is going to be our canonical URL, then all of the links pointing to this point at the bottom will be applied to the one at the top. And the same is applied for all of the other different variations found on the page. Now, let me show you how this works. A lot of people might ask themselves, “Well, why can’t we just forward the different variations? Why can’t we just pick one canonical URL and then just use the server redirects, or other types of redirects, to redirect back to that one version?” And the reason is because it is impossible to anticipate all of the different variations of the same URL. For example, this variation right here: example.com/pizzabagel and then there’s a perimeter at the end called “source=twitter.” A lot of social media websites and other third party platforms, sometimes content management platforms, will add their own tracking perimeters at the end of a URL. And so, this is just one example of how any perimeter or any additional string of text can be added to the end of the URL. And so, to anticipate that the canonical tag is used to strip away anything that’s included at the end of a URL that should not be there. For example, this URL: example.com/pizzabagel/source=twitter. For this URL here, this tag would be placed in the head section. And by doing so it tells the search engines: Hey, ignore this tracking perimeter at the end here and only apply any links or any inbound signals to this URL up at the top. Only apply those to the canonical version of the URL here. Let’s take a look real quick at where this tag is applied. As you can see, we place it here in the head section of the document. I like to place mine near the meta tags just so it’s easy to quickly find. Let’s go ahead and take a look at some tips for optimizing this tag further. Some things to think about is that obviously you only want to include the canonical version of the URL. So, choose which version of a URL you want to be the canonical version and apply it in there. Do not pull the full GET request. So, before when I showed the different variables at the end of the URL, different tracking codes, etc. that whole process is called a GET request. It’s part of the HTTP protocol. You should just not include the full GET request. Which basically just means only include the URL that you want to be indexed without any perimeters attached to it. Use absolute URLs and not relative. So, a relative URL is essentially a place or a location on the internet that is relative to your own. For example, if we are on a page like we saw before about pizza bagels– Then if we’re on this pizza bagel page here and we want to link to another page, say something else, then we don’t need to include the domain section of the URL. And if we don’t include it, then that’s called a relative URL. It’s important, though, when we’re using canonical tags to use absolute URLs which means the entire URL itself, not just what happens after the domain name. And then, furthermore, you’re going to want to include the correct protocol which is the HTTP. If it’s a secure URL, then it would be HTTPS. And you’re going to want to include whether or not it’s a www or a non-www. Again, it’s very important that the URL found within the canonical tag is the canonical version of the URL. So, all of these tips here are tips to make sure that that happens. That is it for Chapter 6. Up next is Chapter 7 where we will talk about heading tags. Thanks so much.
Chapter 7: Heading Tags
HTML for SEO Chapter Seven: Heading Tags. So, in this chapter we will discuss a heading tags. We’ll talk about exactly what heading tags are, why are they important for SEO, and we’ll talk about some tips for optimizing heading tags. So, what exactly are heading tags? Well, heading tags are HTML elements that contain the main headings on the page. So, a lot of times this will mean a blog post title or a headline. Let me show you some examples, though, real quick. Going back to the page that we’ve been working on for this course, I’ve included the h1 tag which we had at the beginning of the course, the h2 tag, and h3 tag. So, this is basically how the hierarchy of heading tags work. I think they can go over to h6. But this is how they’re created in the code. And then they look like this. They look like this right here. So, this is what the headings look like. As you can see, this is an h1 heading, an h2 heading, an h3 heading. And as you can see, the h1 is bigger, the h2 was a bit smaller, and the h3 is below that. So, a good way to think of this is this is headline number 1. This is a sub headline. So, maybe a section of this first one. And then the h3 is even smaller than h2, and it might be a subsection of the h2 section. And so, a good way to think of this is that heading tags can fall within a hanging hierarchy where h1 is the top of main heading and then everything below it are subheadings or subsection headings. If we were to take a look at an actual example–So, for example this is my website, HallAnalysis.com. This is a blog post on our blog and, as you can see, “Google Is Testing Autoplay Videos In Search Results.” This is a heading tag right here, so that’s h1 of for this tag right here. Let’s take a look at some tips to optimizing these tags. Obviously, you’re going to want to use relevant terms. So, Google does look at heading tags for semantic content. Historically, they’ve always kind of viewed the h1 tag as being more authoritative, but again you only want to use these relevant terms within the heading tag in order to make sure that those terms are communicated correctly. You want to use– Try to use no more than one of each per page unless there is a logical reason to do this. So, what I mean by this is that, you know, if you’re using it on a blog post, then there should really only be one h1 tag that should be the blog post title. If you are viewing a series of blog posts, like on a blog post archive page, then you can repeat the heading tag that makes logical sense because there’s more than one headline on the page. However, if there’s only one headline, then you need to only utilize one heading tag or subheadings or subsection tags. Do not use as a design element or logo holder. I see this a lot. So, a lot of times I’ll see a web designer will put a h1 tag in the heading, or the head section of the page, to hold the logo of a site. This is not a good idea. This can confuse the search engines because the search engines will identify that h1 tag and then look for content within it and not see content, see an image, and not fully understand the content of the h1 tag. So, try not to include a logo inside the h1 tag. Include only text. Generally speaking, you’re going to want to use over 70 characters. It’s generally thought that a heading tag under 70 characters doesn’t contain enough content to provide value, so try to go over 70 characters. And you’re going to want to follow the logical page hierarchy. So, you noticed before how I showed you that an h1 tag should be the main heading of the page, and then h2 and h3 and h4 – those are all smaller headings that can go underneath the subsequent heading that came before it, so treat your heading tags like a hierarchy and use them in a hierarchical order to make sure that everything is being displayed correctly. Otherwise, the engines might get confused with how you’re utilizing the heading tag. Up next, we will be talking about the Rel Next and Rel Prev tags in Chapter 8. I look forward to talking with you then.
Chapter 8: Rel Next/Prev Tags
Code for http://example.com/page/3/
Chapter 9: Structured Markup
Chapter 10: Links
Okay! This is HTML for SEO. Chapter 10: Links. In this chapter, we are going to discuss what are links and how do they work; why are they important for SEO; and then some tips for optimizing links. When we talk about links, links are talked a lot about in SEO. For this video, for this chapter, and for this course, we’re only talking about the HTML that makes links, and that is because the topic of links in general is very large. It’s a very big issue within SEO, but we’re just going to talk about the HTML that surrounds links. We’ll talk a little bit in this chapter about why links are important, but mostly we’re just going to be talking about how to optimize the HTML that makes a link. As you can see, I have an example link written out here in HTML and I’ve broken each section of the link tag into color-coded areas which are the three most important areas of the link tag for SEO. And we’re going to talk about each one of these areas in this video. But before we do that, I would like to just spend a minute to talk about the significance of links in general but for SEO. Like I said, this topic is very big, very complex, and so to fully understand the impact that links have in SEO, you really should do much more research outside of the context of this course. But just for this chapter, we’re going to talk about how links work and what and why they’re important in a very brief way. It’s important to remember that links are considered one of the top three ranking factors. Google has gone on record and said that links are somewhere within the top three ranking factors. It’s my belief that it’s likely within the top two actually. I really think links have a overwhelming significance for SEO, and it’s been like that since the very beginning. Anchor text provides semantic relevance. What that means is–and we’ll talk more about anchor text in a little bit in this chapter but–essentially when a search engine is trying to decide which keywords and terms a page should be ranked for, they may pull out some of the terms and keywords that are used in anchor texts that point towards the page in question. And then finally, links help the search engines and their crawlers discover new content. When content is linked together, the crawlers are much more able to find it and make that content more discoverable, as we call it, to the search engines. I’ve put together a little diagram here on this slide to kind of illustrate how links and how Google specifically may judge links. This is a very basic overview of Google’s original backlink algorithm, and it’s still the basis for how they understand links to this day. I’m going to give you a very quick overview of how this algorithm works. It’s important to remember that, realistically speaking, Google’s backlink algorithms are very, very complex and this is just a very basic overview of how link equity works and how Google typically analyzes links on a very broad level. Basically, we can start off by assuming that every page on the internet has a value of 1, or some inherent value. They may use a different grading system or they might have a different way of calculating the value of a page, but the premise is that, in the beginning, all pages are created equal and they are starting off with a value of 1. And for our demonstration purposes, we’ll just use integers for these values. As you can see, these pages out here they are all valued at 1, and then each link that comes off of these pages carries the same value the page has. As you can see, this page has a value of 3 because the initial value was 1 and then there were two links pointing at it, both from value of 1 pages, and as a result the resulting value for this page would be 3. Now, this page then has two outbound links on it as you can see, and because there are two outbound links on this page the value for each is split so the value for each of these links is going to be 1.5. So, therefore, this link right here carries 1.5 because this page already had a value of 1. The value is now 2.5 because 1.5 from this page that says 3 down to a value of 1 makes 2.5. Again, this link here is another 1.5 and it points to our center page here which has a value of 6 because many pages link to it. So, this is 1.5 and then this would be the 2.5. That would be 3.5 plus another half a page because this is has two links on a value of one, so that’ll be 0.5. So, that would be around 3 or 4, and then another two that’ll be 5 or 6, and then one more would be 6. So, the resulting value is 6 because of all of these inbound links pointing at it. A good way to just understand how this works is basically to understand the full value of the page divided by the number of outbound links on that page, and that’s a good way to understand how, what we call, link equity flows from page to page. This is a good example of how Google likely judges backlinks on the internet, and in pages that have the higher value are the ones they’re gonna rank higher. For example, in this corpus here, this page number 6 would rank higher than the rest because it has more link equity pointing to it. This one right here has a link equity of 3 would probably be next. Then 2.5 and then 2 and then all the 1’s below that. You can see now how links can play a very important role within SEO because they do provide authority and trust throughout the internet through this type of ranking algorithm. That’s basically the main significance for links within SEO. But today, in this chapter we will just be discussing how to optimize the HTML for these types of links. Like I said before, I broke down the link example into three sections. The first section we’re going to take a look at is the robot directive and this is the the part of the link that allows you to declare whether or not you want the link to be followed or no followed. And what does that mean? Essentially, what we want to know here is we want to know if we want a link to be considered within this algorithm that it needs to be followed. If for some reason we do not want a link to be considered in this algorithm, then we’ll apply the “nofollow” tag. Let me show you how that works. As you can see here, we have the beginning of the link rel relationship “follow”. Now this first directive here where it says “follow”, this is actually the default setting, so if you do not place any robot directive here for a relationship, then it will automatically be followed. So, this is not really needed at all. I just put it here as an example. If you, by chance, did not want the link to play a part in the algorithm that we just looked at, then you would apply the “nofollow” relationship tag down here. And that tells the search engine that, “Hey, listen, we want you to ignore this link and not utilize it within your ranking algorithm.” Now, you might be asking, “Well, why would we do that? What’s the point of no following a link?” Well, the point of no following a link is that, for example, Google does not allow within their quality guidelines for links that have been generated because of some sort of financial gain. That’s called buying links. And so, Google really urges you if you are somehow giving away a link in exchange for money– it could be through the use of an advertisement, it can be a sponsorship, it could be lots of different ways that you might end up giving a link to someone in exchange of some sort of money or monetary value–if that does occur, you need to use the “nofollow” robot attribute. And that just tells the engine, “Hey, listen this link is paid for and you should not allow this into your ranking algorithm.” This is sort of an issue of debate, but I will say if you do not include the “nofollow” relationship tag on links that you acquire money for you, you are violating Google’s guidelines and you likely will be penalized. That’s a very big penalty, so be careful if that happens. Otherwise, you likely won’t need to use the “nofollow” tag on links very often. Sometimes, I guess you might use it to control the way that the search engine crawls the site and that’s an option, but otherwise you should probably stay away from no following links unless you have a very specific reason, and that reason is likely that you sold a link or that the link is part of an advertisement, or that you’ve acquired some sort of monetary value as a result of giving that link away. And if that’s the case, it really does need to be “nofollow”. So, that’s basically the robot directive. Let’s take next a look at the target URL. The target URL is essentially the actual URL that the link goes to, and it’s found here in the middle of our link example. It starts off by the href attribute, and this just basically stands for hypertext referral. This is going to be the full– You want to put the full absolute URL path here within the h refer attribute. And the reason is because in the sort– This is actually a a difference in opinion among many SEOs. This is somewhat a controversial topic, but the question often arises should we use the full URL path within the target URL or should we use what’s called a relative URL. So, this first example is an absolute URL path because it shows the entire URL and, in many cases, we call this a canonical URL here. But again, if you are linking to a page on your same domain, then you can use a relative URL like so. A relative URL is simply just a URL path as its relationship to the root of the domain, the beginning of domain, and this works. This is fine. However, in my opinion, it does not give the search engine crawler enough direction in order to follow the absolute URL path. And the reason this is important is because occasionally the crawler may access the site from a version of the URL that is not the canonical version. So, for example, it might access the site where there is a “www.” here or it might access the site on a secure HTTPS URL, and that’s fine except if there are no redirections in place or if there are issues with the URL handling, then usually a relative URL will cause problems for the crawler because the crawler will end up crawling pages that were never intended to be crawled. It’s kind of smart to use an absolute URL path that follows the canonical version of the URL. We discussed canonical versions of URLs in a chapter prior in this same course. So, if you need a refresher, go back and watch the chapter on canonical tags, and that talks about what a canonical URL is. But again, it’s important to use the absolute canonical URL path for the target URL within links. The next aspect of a link that needs to be optimized is the anchor text, and the anchor text is essentially just the words that you see on the page that are linked to. And we’re going to take a look at an example of this actually right now. If I go ahead and copy this part of the link right here just like so and then we’re going to open up our HTML page that we’ve been messing with in this in this course. I put some dummy text in here just as an example to show you what this looks like. But let’s pretend that we want to put a link here in the text and we want to put it right here where it says “good text”. So, we’re going to paste that link that we just copied. Paste it right here. I’m going to go ahead and put the end tag here just like so. And now we have a link tag in a paragraph. Let’s go ahead and save this now and take a look at what it looks like. Refresh the page. And we can see now that there’s a link where it says “good text.” The words “good text” are the anchor text for this link. Right here, it says anchor text just like so, and when it is all said and done it looks like this. And so “good text” is our anchor text that we used right here and this is important because the search engines utilize whichever words we have found in a text like so in the anchor text. This is called anchor text. They utilize these terms to apply semantic relevance which is why the words that you utilize as the anchor text is very important. Because, say, for example, you would like to rank for the words “tennis shoes,” then if you use tennis shoes here in the anchor text in many of the links, then Google will start to apply the term tennis shoes to this page for ranking purposes. However, it’s important that the anchor text you utilize does follow natural language and that you don’t overuse anchor text in excessive format because you can be penalized for doing that. Let’s take a look at the example again. You can see that the anchor text is embedded right beside the text of a document which is why it needs to be really just natural language, and you really shouldn’t try to emphasize too many keywords inside the anchor text because it will sound kind of nutty and crazy. So, essentially that is the three most important aspects of optimizing links. Some final tips for optimizing these links: You should really only use the “nofollow” robot directive for very specific reasons. Use absolute URL paths for target URLs. Again, that means to use the entire URL, not just the relative portion of it. Use the entire canonical URL for the target URLs, and then use natural anchor tags that fits within the context of the document to provide for semantic relevance. Those are the three top tips I have for links and up next is Chapter 11: Images.
Chapter 11: Images
This is HTML for SEO and this is Chapter 11: Image Tags. In this chapter, we are going to discuss the basics of image search; we’re going to talk about what are image tags and how do they work; why are they important for SEO; and some tips for optimizing image tags. To get started, it’s important to understand that SEO for images is a little bit different than typical web pages. And so to take a look at how it’s different, I want to look at what an image search results page looks like. When we talk about image SEO, we’re talking about the image search section. The typical web when we do a search on Google–say for example tennis shoes–it pulls up these results here, but if we click on images it pulls up a list of images, and these images are taken from web pages that are optimized for the term “tennis shoes.” However, the HTML used to display these images on each one of their pages can also be optimized and utilized for ranking high in these types of search results. And so that’s what we’re going to talk about today, is how to optimize the HTML for images for them to perform well within this type of image search results pages. Let’s get started here. Basically, there are four specific sections to optimizing the image tag. First, you want to optimize the file name. We’ll talk about what that means in a minute. Then, you’re gonna want to optimize the URL, optimize the alt text–we’ll talk about what alt text is in a moment–and then afterwards you’re going to want to optimize all the content surrounding the image itself. To get our hands dirty, let’s take a look at some sample code here. We just talked about on the previous slide those four sections, and I’ve gone ahead and written out a image tag and HTML here and I’ve split up this tag into the four sections that are important to optimize images and color coded them. Let’s start off with URL right here. Essentially, for image SEO, it’s important that your images stay on your same domain name. For example, if your website is example.com and you are trying to rank a image of a beach ball, then you’re going to want to keep that image file on your own website. In some cases, you might use a content delivery network to host your images–and I’ll show you how you can utilize that as well–but ultimately you want to keep the image on a URL that’s on your domain. And then, if you’re able to optimize the URL by including maybe some keywords that are related to the image that’s fine as well, but it’s not as important as just keeping it on the same domain as your website. The second section of optimizing the image tag is, of course, the image file name. For example, if you are able to give your image file a semantically relevant name– For example, if the image is of an image of a beach ball, then we want to name the file of the image “beach ball” and you want to stick to the same SEO best practices that you use for URLs. Make sure that the image file name is lowercase, that there are no spaces, instead you’re using hyphens, and that you don’t go overboard with the file name of the image. Try to make it semantically relevant of what the image is without adding too much text here. The third section for optimizing image tags is the alt text, and alt text stands for alternative text and it is historically used for users that have vision impairments or are unable to use a visual based web browser. The alt text provides an alternative description for the image within the HTML so that when a piece of software called a screen reader– which is an accessible piece of software– when it scans the pages, it can read what is ever in the alt text which is why whatever you place inside the alt text attribute right here should be semantically relevant to the image itself. This is important for SEO because search engines tend to use the words found within this alt text attribute to place semantic relevance on the image itself. But again, you want to optimize this. You want to make sure that your alt text is suitable for human beings to read and describes the image clearly using semantic language so that the search engines can pick up keywords found in the alt text and apply it to the rankings for this specific image file. The last section in optimizing images for image search is to include semantic relevant content within surrounding content. For example, if we want this image to rank for the query beach ball, then the paragraph found right after the image says, “Beach balls are a great toy for kids ages 4-15 at the beach.” Now as you see beach balls is located right here in the beginning of the paragraph which means that on the page it should be very close to the actual beach ball image. If you are able to include descriptive text or content near the image tag on the page, it will greatly and significantly help apply semantic relevance to that image. Let’s take a look at some tips for optimizing these image tags. Again, you’re going to want to use alt text. We just went over that. This is alternative text. You’re going to do this specifically for screen readers so that people with vision impairments can be able to hear the description of whatever the image is. But then you’re also going to want to optimize this alt text for search engines and allowing the search engines to get semantic value and keywords out of the image tag. You’re going to want to make sure to include any text in the image in the alt text. For example, some images may actually have text written on the image itself and, of course, the search engines can’t read that text, so you’ll need to provide some alt text on the image tag so that the search engines can read the text that’s on the actual image itself. That’s very important otherwise any text that are found in an image will not communicate over to the search engines. If you’re using a content delivery network, you’re going to want to make sure that you mask the URLs with a sub-domain. Earlier I mentioned that one of the first elements to optimizing the image tag is to use your own domain name in the URL. That’s very important. Some people, however, use what’s called a content delivery network which means that they may be forced to put their images on a network that is not related to example.com. If that’s the case, you may want to set up what’s called a sub- domain for your content delivery network. And essentially what that is is that allows you to mask the external URL that’s holding the image and to apply a sub-domain such as CDN–that’s typical– content delivery network, and let this domain name mask your content delivery network URLs so the engines assume that the image file is located on your server. If you have trouble setting up your own custom sub-domain for your content delivery network, I advise you talk to the folks that run your content delivery network and they can help you set up your own domain name like this or sub- domain name like this. The last tip is to optimize the surrounding content. This means including similar keywords or descriptions about the image within paragraph content, around the image, or near the image as well apply more semantic relevance to the image as it is shown within the search results. Well, that is the last part of this video course and I really appreciate it if you’ve been following along up until this point back and back, then this is of course the last chapter. However, you can always review this course as you see fit whenever you like and just look back to the chapters in the past. Thanks so much and I hope to talk to you soon. Bye-bye!