BackgroundSearch Engines use a number of criteria to decide what a given web page is all about. These criteria, which can be different from Search Engine to Search Engine, and which may even change over time, all aim at deciding how "relevant" a page is to a given user's search. The Search Engine wants to return results most relevant to a user's search.
While particulars may change over time, there are some criteria which remain constant. One of these is where keywords are located on page. Typically words that are located closer to beginning of a page are considered more important than words that occur further down page. This stands to reason: think of a newspaper article, where headline and first paragraph usually have more "meat" than rest of story.
Another measure of relevance is "keyword density". This is roughly ratio of keywords on a page to total number of words on a page. Having a higher ratio of keywords to total words will make a page more relevant for a search on those keywords.
When a Search Engine sends its robot out to look at your page, you want to make sure that it finds important information near top of web page, and that page has a high keyword density. Sometimes there are complications, even when you have a lot of keyword-rich text early in visible portion of your page. Two of these complications, extensive JavaScript code and extensive Cascading Style Sheet code, can be easily remedied.
JavaScript problem
Large amounts of JavaScript code can get in way. Typically largest amount of JavaScript code in a web page is found in HEAD section. This is usually where variables and functions are defined, and so forth.
Unfortunately, having a large amount of JavaScript code in a page can be detrimental to a page's ranking in Search Engines.
Since Search Engines tend to pay more attention to text at beginning of a web page than they do to text further from beginning, it stands to reason that if you have several dozen lines of JavaScript code at top of page, your real content is going to be further from beginning of page. Further down page means less important to Search Engine.
Keyword density is also important. Here again, if you have several hundred words of JavaScript code in a page, keyword density—the ratio of your keywords to all words in whole page, both text and code—is going to be much lower. That means that some Search Engines will decide that your page is less relevant.
JavaScript solution
So how do you maintain JavaScript functionality, but make your page as Search Engine-friendly as possible? You put JavaScript code into a separate file, and link it back to web page.
The original page, "mypage.html", may look something like this.
My Title< itle> ...body of page...
Example 1—mypage.html with JavaScript code
We replace JavaScript code with an instruction for browser to go and grab code from a separate file. The new page will look like this.
My Title< itle> ...body of page...
Example 2—mypage.html with JavaScript code offloaded
Note addition of "src" attribute to SCRIPT tag. The value assigned to that attribute is name of external file that contains JavaScript code. Typically, these external files will be given filename extension ".js" to indicate that they contain JavaScript code. Note also that there are both tags here, even though there is nothing between those tags.