Search term highlighting
Posted on Monday, July 28th, 2008
This has been around for a while (Probably since the days when WEB 2.0 was still in fashion), but I’ve only seen it utilised on various forums and a few informational sites in the past. Even though most browsers’ "find" function is only a couple of keystrokes away (ctrl+F) I think this search-term highlighting thing is really great and makes it even easier for the user to read and navigate the content of your site!
It’s actually a very good idea and I am surprised at myself for not implementing it earlier on this blog. If you run a site with more than a couple of pages of content then you should definitely consider integrating this, especially if you run a blog. It’s one of those things that’s at the back of your mind, you’ve probably seen it utilised in the past and thought, "Oh, I’d better add that to my website to make it even more awesome…" - But, you never got around to adding it… Until now!
As far as I know, the best way to do this is with client-side scripting - we’re obviously talking about JavaScript here! There are tonnes of scripts available so I’m not going to bore you with my own jQuery rendition… But I am going to list some of the solutions available:
- jQuery script by Dossy - This is the one I’m using here - I thought it was the best one considering it’s tiny size and the fact it’s using jQuery.
- Here’s one by Dave Lemen - Seemed a bit lengthy but it has some advanced capabilities…
- A more recent attempt by Eric Wendelin - I like this one!
If you wanted to, you could write your own but there is no point in reinventing the wheel! If you don’t fancy any of the above scripts then head to Google and have fun! And don’t forget to post back here if you find an even better solution, be it Client or Server side.
This is not very advanced and it’s not exactly something to brag about, but it definitely enhances the user experience of your site!