How to Read Your Website Source Code and Why It’s Important

How to Read Your Website Source Code and Why It’s Important

Underneath all the photographs, textual content, and calls to motion in your web site lies your webpage supply code.

Google and different search engines like google and yahoo “read” this code to decide the place your webpages ought to seem of their indexes for a given search question.

This is a fast information to present you the way to learn your personal web site supply code so as to be sure it’s Search engine marketing-friendly. I additionally will go over a couple of different conditions the place understanding how to view and look at the correct components of supply code will help with different advertising and marketing efforts.

How to View Source Code

The first step in checking your web site’s supply code is to view the precise code. Every net browser permits you to do that simply. Below are the keyboard instructions for viewing your webpage supply code for each PC and Mac.

PC

  • Firefox: CTRL + U (Meaning press the CTRL key in your keyboard and maintain it down. While holding down the CTRL key, press the “u” key.) Alternatively, you may go to the “Firefox” menu and then click on on “Web Developer,” and then “Page Source.”
  • Internet Explorer: CTRL + U. Or proper click on and choose “View Source.”
  • Chrome: CTRL + U. Or you may click on on the weird-looking key with three horizontal strains within the higher proper hand nook. Then click on on “Tools” and choose “View Source.”
  • Opera: CTRL + U. You can also proper click on on the webpage and choose “View Page Source.”

Mac

  • Safari: The keyboard shortcut is Option+Command+U. You can also right-click on the webpage and choose “Show Page Source.”
  • Firefox: You can right-click and choose “Page Source” or you may navigate to your “Tools” menu, choose “Web Developer,” and click on on “Page Source.” The keyboard shortcut is Command + U.
  • Chrome: Navigate to “View,” click on on “Developer,” and then “View Source.” You can also right-click and choose “View Page Source.” The keyboard shortcut is Option+Command+U.

Once you know the way to view the supply code, you want to know the way to seek for issues in it. Usually, the identical search capabilities you employ for regular net searching apply to looking out in your supply code. Commands like CTRL + F (for Find) will assist you to shortly scan your supply code for essential Search engine marketing components.

Source Code Title Tags

The title tag is the holy grail of on-page Search engine marketing. It’s crucial factor in your supply code. If you’re going to take one factor away from this text, concentrate to this:

You know these outcomes Google gives once you’re trying to find one thing?

All of these outcomes come from the title tags of the webpages they’re pointing to. If you don’t have title tags in your supply code, you may’t present up in Google (or in another search engine, for that matter). Believe it or not, I’ve really seen web sites with out title tags!

Now, let’s do a fast Google seek for the time period “Marketing Guides”:

source code - title tag

You can see that the primary result’s for the KISSmetrics weblog part on advertising and marketing guides. If we click on on that first outcome and view the web page supply code, we will see the title tag:

source code for title tag

The title tag is designated by the opening tag: <title>. It ends with the closing tag: </title>. The title tag is often close to the highest of your supply code within the <head> part.

You can see that the content material contained in the title tag matches what’s used within the headline of that first Google outcome.

Not solely are title tags required so as to be included in Google search outcomes, however Google identifies the essential key phrases in your title that they assume are related to customers’ searches.

If you desire a sure webpage to rank for a specific subject material, you’d higher be sure phrases that describe the subject material are within the title tag. To study extra about how key phrases and title tags are essential in your general web site structure, take a look at this publish.

There’s one final thing to keep in mind: each webpage in your web site ought to have a novel title tag. Never duplicate this content material.

If you could have a small web site, corresponding to 10 or 20 pages, it’s simple sufficient to evaluate every title tag for uniqueness. However, you probably have a bigger web site, you’ll need some assist. This is a straightforward four-step course of:

Step #1: Open Ubersuggest, Input Your URL, and Click Search

source code - ubersuggest step 1

Step #2: Click “Site Audit” within the Left Sidebar

source code - ubersuggest step 2

Step #3: Review Top Search engine marketing Issues

source code - top seo issues

After touchdown on the positioning audit overview, scroll down to the fourth part of outcomes (it’s the final one on the web page) to evaluate Top Search engine marketing Issues.

This is the place you’ll discover you probably have duplicate title tags or meta descriptions. If nothing is exhibiting right here, you’re within the clear. If you see duplicates, such because the 30 pages for my web site, dig deeper.

Step #4: Click on “Pages with Duplicate <title> Tags”

source code - duplicate title tags

You could discover a main subject, corresponding to a number of of your weblog posts sharing the identical title tag. You might also discover that it’s no large deal, such because the 26 pages in my report with the title “Blog Neil Patel’s Digital Marketing Blog.”

Upon clicking on the 26 pages immediate, you see:

source code - identifying issues

While the title is similar on 26 pages, it’s nothing greater than the pages of my weblog that home the content material. It’s not the precise weblog posts or major pages of my web site.

Meta Descriptions in Source Code

Another essential a part of your webpage’s head part is the meta description tag. This 160 character snippet is a free promoting copy that will get displayed beneath your title content material in the various search engines.

source code - meta data

I’ve seen tons of of internet sites that utterly ignore this tag. It’s very simple to discover in your supply code:

meta description source code

Check to be sure it’s on all your webpages. More importantly, verify to ensure you’re not duplicating it throughout a number of pages. Duplicating a meta description tag is just not a search engine penalty, but it surely’s a really large advertising and marketing mistake.

Lots of people gloss over the meta description, however you actually ought to put some thought into it as a result of it’s learn by search engine customers. Think about what copy would assist pull in additional guests and improve click-throughs.

H1 Headings in Source Code

H1 headings carry a bit on-page Search engine marketing weight, so it’s a good suggestion to verify your pages to ensure you are utilizing them correctly. For every web page in your web site, look over the supply code to see should you spot this tag:

h1 heading source code

You don’t need a couple of set of H1 tags showing on any given webpage. In different phrases, don’t strive to purposely increase your Search engine marketing by together with a number of H1s. If you over-optimize your web site, it would hurt you in the long term.

Use your H1s for what they’re meant for: the largest heading on the web page. On your house web page, this is likely to be your worth proposition.

Nofollows in Source Code

If you interact in hyperlink constructing, then checking your backlinks to see if they’re nofollowed is a should.

But earlier than I’m going additional, I’ve to discuss a bit about what “link juice” is.

In the world of Search engine marketing, getting one other web site to hyperlink to your web site is a superb achievement. That hyperlink is seen by search engines like google and yahoo as an endorsement. Search engines issue within the variety of hyperlinks that time to your web site when they’re rating your web site of their engines. “Link Juice” is a non-scientific time period for the so-called energy that the hyperlink gives your web site or webpage in query.

Nofollows are an attribute that may be coded right into a hyperlink to cease the hyperlink juice from flowing to a web site. This is a quite common factor you will note within the hyperlinks current within the remark part of blogs.

To discover out in case your backlinks are passing hyperlink juice, it’s best to verify to see if the hyperlinks have nofollow attributes inside them. If they do, then the hyperlink you labored so arduous to get isn’t doing a lot for you for the reason that nofollow attribute principally tells Google to ignore your webpage.

The Nofollow Attribute in source code

In the image above, rel=’exterior nofollow’ is within the anchor hyperlink. Even although an individual can click on by way of on the hyperlink, no hyperlink juice is being handed.

Some folks assume that Google really does rely some hyperlink juice from nofollows, however to be conservative in your backlink counting, it’s best to assume nothing is getting handed.

Alternatively, you might have considered trying to “page sculpt” a few of your personal webpages. Some SEOs imagine it’s a good suggestion to restrict what pages you ship your inside hyperlink juice to in order that extra essential webpages get nearly all of the positioning’s general hyperlink juice. You can do that by nofollowing a few of your inside web site hyperlinks. For instance, you may want to nofollow all the hyperlinks to your privateness coverage or different boring / uninteresting pages.

Google will inform you to ignore this follow, and I considerably agree. It’s type of a tedious, pointless activity, and your vitality is healthier spent on creating nice content material as an alternative.

Image Alt Tags in Source Code

Empty picture alt tags are quite common Search engine marketing boo-boos. Image alt tags describe what your photos are to robotic search engines like google and yahoo.

If you run an e-commerce web site, you positively need to be sure your alt tags are crammed out. A good suggestion is to be sure that the product model title and serial quantity are within the alt tag description.

image alt tag in source code

Above is a screenshot of a picture tag with the alt tag buried inside it.

Yoou shouldn’t use alt tags for ornamental photos. That may be seen as an over optimization and might earn you a penalty. Just ensure you have your alt tags crammed out for:

  • Images of Merchandise
  • Diagrams
  • Infographics
  • Your Website Logo
  • Screenshots
  • Photos of Team Members

Verify That Your Analytics Are Installed Properly

One final nice purpose for checking your supply code is to ensure you have Google Analytics put in on each webpage of your web site.

Checking could be very easy. For Google Analytics, simply view the supply code of your webpages and seek for the letters “UA.”

verifying google analytics in source code

If you discover an occasion the place the “UA” is adopted by a 7-digit quantity, then you could have confirmed that Google Analytics is put in on that one web page.

Also, maintain observe of what number of occasions “UA” exhibits up in your webpage. Sometimes, your analytics monitoring code shall be inserted greater than as soon as by accident, which is pointless. If that’s the case, it’s best to have your developer take away the additional cases.

Next, you want to verify the remaining webpages in your web site to see in case your analytics code has been inserted on each web page. If you don’t have your analytics monitoring code on each web page of your web site, you’re not getting a whole image of what’s taking place in your web site, which type of makes analytics ineffective.

This generally is a daunting activity you probably have an unlimited web site. It even may be not possible to verify manually.

I like to use xml-sitemaps.com to get a textual content file of all of the URLs my web site has inside it. This gives me with a list guidelines which helps to maintain observe of which URLs would possibly want some further consideration (like having analytics put in on them).

It’s additionally an excellent device for being alerted to duplicate content material points and different unusual issues that is likely to be lurking on an online server.

Even xml-sitemaps.com will provide you with solely 500 outcomes totally free. You might have to ask your developer to provide you with a URL stock so that you’ve got a whole map of your large web site.

Additionally, you might have considered trying them to create a script or program to carry out these checks for you so that you don’t have to do them manually.

Conclusion

Knowing how to learn primary supply code is essential for anybody constructing a web site. It helps you create Search engine marketing-friendly webpages and web sites, in addition to determine pre-existing Search engine marketing points that hurt your web site’s place within the SERPs.

If you’re having bother fixing Search engine marketing issues or need assist with Search engine marketing generally, our company will help.

Consulting with Neil Patel

See How My Agency Can Drive Massive Amounts of Traffic to Your Website

  • Search engine marketing – unlock large quantities of Search engine marketing site visitors. See actual outcomes.
  • Content Marketing – our staff creates epic content material that can get shared, get hyperlinks, and appeal to site visitors.
  • Paid Media – efficient paid methods with clear ROI.

Book a Call

      Pixillab
      Logo
      Enable registration in settings - general