Should notification messages be embedded in html or separate using jQuery?

Question

I was originally thinking I could make a notification bar using jQuery. The downside is if someone has javascript disabled, they would never see the message. The upside is that the messages wouldn't be crawled, which could potentially lead to misleading or outdated information when the messages are removed.

Are there other benefits or disadvantages of embedding the notification messages in html vs using a pure jQuery approach?

I realize that only ~1% of users actually have javascript disabled, but I'd like to consider as many users as possible. Just curious what others might have done.

Answer 1

The four most used notifications are "error", "warning", "success" or "info". (usually colored red, yellow, green and blue)

For "error" and "success" we take for granted that the user has started a process on the page before the notification triggered. Thus we can also assume that this notification will never be crawled, no matter how you've implemented it.

The other two: "warning" and "info" on the other hand could trigger if someone has started a process, and you want to hold their hand a bit before the final step. (before something irreversible happens).

If your site has a crawlable page halfway through a process where you would like to add a notification, chances are you'd actually want the notification to be crawled, as it should "always" be relevant to the rest of the content on that page. However the notification text would then rather be placed next to the button or the active interface control where it would be relevant. (i.e: rather as help text, than a notification).

So, in conclusion: If you have very special needs where these notifications need to be hard coded into the html because you want them to be crawled, just add them to the html.

If the events that trigger your notifications only happen to users (not serps) just add them to the html, as they will never be crawled anyways.

If your application uses AJAX or other JavaScript to add interactivity already, just add it with jQuery. Chances are you'll be wanting to add more js-goodness to your scripts later anyways.

Answer 2

I'd put it in which ever one is going to be easier for you.

I wouldn't sweat the bots if you decide HTML is easier. There are ways to mask sections of your page if that is a concern as referenced here: https://stackoverflow.com/questions/8821256/how-to-tell-google-bot-to-skip-part-of-html