Changing the page title using javascript

Don’t do this!!! There is absolutely no point in changing a page’s title by using Javascript.

Ok – the users might get some benefit because the title is now more appropriate.

The code, if you really need to do it is
[html][/html]

But here’s my thought process

  • Search Engines will only see the original title, not the revised title
  • Search Engines will therefore see either a generic or a spammy version of the title and the user gets the cleaned up version
  • If the title isn’t right in the first place can you be accused of cloaking?

Now, that’s a serious risk, cloaking, can you afford that allegation?

Simpler, I think, is to use the server side processes to set the title correctly before the page ever gets to the browser.

And I have to stop reading my server logs, but yes, people actually search Google for this information!

Categories

Recent Comments

Tags

Sarah King Written by:

This is my website.

20 Comments

  1. April 30, 2007

    Thanks a lot 4 the information…
    I’m a rookie in SEO stuff yet and I was thinking to use javascript 4 SEO, like changing my title tag.

    Uff! πŸ™‚

  2. February 20, 2008

    I have just found this useful for myself. BUT, not for any SEO purpose. I’m developing a Web 2.0 application, so it’s all just a single page that the SE’s never see, but I still wanted to change the document title so that users can see where they are and what they are doing. In this situation, this is a good idea. In any other “plain” HTML situation, I fully agree with you that it’s a very silly idea indeed. Thankfully, like most things, it does have it’s place somewhere.

  3. Serious Dilemma
    September 16, 2008

    It’s necessary when you’re opening a showModalDialog or showModelessDialog, and this dialog serves several purposes, so you need to change the title of the window through javascript since you’re sending the title through dialogArguments.

  4. developer x
    December 5, 2008

    I agree with the author about problems changing the page title after the fact and the effects on search engines and bookmarks, however.

    If you are developing a web application for use in-house and the title of the page is not available until after the –head- tags have been render by a scripting language, then this is gold.

    Use case: one team provides the application framework, another team controls display data.

  5. Know_all_situations
    December 29, 2008

    Use case: web page with frames. Changes page title to match frame body rather than header. Don’t care about search engines.

  6. Adrian
    February 8, 2009

    Why “Don’t do this”?

    My site is bilingual with clickable icons allowing the user to switch language. When the user changes the language, shouldn’t the title change?

  7. February 9, 2009

    When the user clicks on the alternate language they should be taken to a new page – that way your site will be indexed in the search engines for both versions.

  8. February 10, 2009

    I am using a CMS and by default the title is pulled from the first in the body. There are certain situations where there are tags between the ‘s, for example, This is a great title. Well, for me, I need to remove the italics tags, so a javascript that removes them and replaces the title with the non-tagged version is very useful. And since I didn’t know the syntax was document.title, this is very helpful.

    So thank you πŸ™‚

  9. February 10, 2009

    That’s great Lance but as a web designer I’d have thought you’d pick a CMS that gave you more control over your content.

    Your site, however, has lovely graphics!

  10. May 19, 2009

    Yes, SEO is important – but it’s not the be-all and end-all. You’ve got to start thinking broader, not just the CTR, but the on-page conversions.

    Amending page elements in real-time (such as the title) can be an excellent way of showing the user that they really are in the right place by coming to your pages. Conversions go UP, you make more money (or whatever)

    I have used this on a number of sites, and NO it’s not considered black-hat. A tiny bit grey perhaps, but ultimately I am not hiding anything or fooling the end user, so it’s not spam and it’s not cloaking.

    Here’s a very subtle example if your page is called “Alsations” (a type of dog also know as a german shepherd) and a user comes there, they may not immediately be aware they have got to the right page. but if you pick up that they came in on the search term “German Shepherd” and change page elements to reflect that, they will be more likely to stick and convert.

    I guarantee, if properly implmented this will help and conversions go up a great deal.

    Go on, give it a go. If anyone wants more information contact me on adam_s_phillips @hotmail.com

  11. Egbert_O_Foo
    May 4, 2011

    One more “edge case”, Sarah … and yes, you have made fine points.

    Using someone else’s antiquated, left-handed codebase and finding a freakin’ bug that would take days to understand and quash, perhaps?

    As an example, I coded up a nice “relevant title” module to add to a certain fairly well-known PHP package we use here at the shop. Come to find out that *somebody* in the past (no, no one on this board AFAICT) didn’t bother to write *their* module to match the package’s title logic … so his very important module currently has a tag that says (!MY_UBERCOOL_TITLE_MOD!) …

    I’m *very* willing to risk a little Javascript-induced greylisting on this page to fix *that*. πŸ˜€

  12. Nick
    July 1, 2011

    “Don’t do this!!!” is not correct. This is very relevant for pages with JSON such as GMail.

  13. Aaron
    July 3, 2011

    There are many reasons to use this, granted, many of these become obselete when you know server-side languages, and yes, there are some bad uses for this as well, however teaching isn’t about saying not to use something, it’s about showing how to properly use something and occasionally, giving caution when necessary. If you do not feel that teaching such a thing is necessary, then it is easy enough to omit it from lessons/tips.

  14. July 3, 2011

    You need to remember that this is an SEO focussed blog and this post is from 2005. The use of AJAX was in its infancy back then.

  15. Monalisha
    September 16, 2011

    After searching 2 hours i got this code and this helps me alot…Thanx…

  16. August 9, 2012

    This is of course very useful for modern web applications. Think of Single Page Applications (such as facebook, gmail, etc.) and how the title needs to be changed throughout the life of a page.

    You won’t get dinged by Google if you are using this for good (in the case of the SPA’s). If you do use it for cloaking, that’s when you’ll get in trouble. Someone does review your site before making these kinds of decisions.

    PS, the code on this page is way more elegant than the jQuery alternative:
    $(‘title’).text(‘The new title goes here.’);

  17. September 13, 2012

    Have to agree with Thomas here, this is absolutely neccessary for AJAX heavy web apps (which let’s face it, will soon become the norm). However, once the html5 push/pop/replaceState functions are supported in IE then this shouldn’t be an issue any more.

  18. September 14, 2012

    Look at the date lads. Back in 2005 AJAX was a fledgling technology. Today is mainstream.

  19. June 19, 2014

    @Girolamo Nellesca – anyone who takes tech advice from a 2005 post in 2014 will find it outdated and this post is no different.

    This is a blog and all posts have a clearly displayed timestamp. It doesn’t pretend to be a manual or handbook.

    You might find this post useful: https://www.itamer.com/google-searches-2012/814/
    In it I discuss adding the current year to searches so that you find the current best practice and avoid all the old stuff.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.