Display text over a background image, rather than making the text part of the image

If you are going to display images on your website (and why wouldn’t you?) then you should consider keeping the image, and the text that you want to place on the image, separate. Consider the following banner header that goes across the top of one of my [old] website pages…. The blue banner heading at […]
7 Sep, 2009

If you are going to display images on your website (and why wouldn’t you?) then you should consider keeping the image, and the text that you want to place on the image, separate. Consider the following banner header that goes across the top of one of my [old] website pages….

The blue banner heading at the top of the page is in fact just an image containing the 3 letters (D, M, and J) over a blue background. The text is then added dynamically when the page is loaded by the browser.

The reason for doing this, and for applying the same logic elsewhere on your website for images which contain text, is two-fold :

  1. The image will generally be a much smaller file size (a few kb) without the text, meaning that your web pages will load much faster for your readers. Although most people now use broadband connections, some don’t and will appreciate websites that load faster. Even broadband users may notice a difference;
  2. Search engines will be able to read the text that you place dynamically onto your images. This can have a great optimising effect. In the example above, the ‘COMPLETE WEBSITE SOLUTIONS….‘ text is actually a <h1> tag (meaning that search engines should consider it a very good guide to what the page is about), and the ‘Hosting, managing, optimising….‘ sub-heading is in fact a <h2> tag. I think this is a pretty cool way of incorporating these tags into your page without necessarily taking up valuable page space;

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *

You may also like…

Using WP-POLLS for my WordPress Polls and Surveys

Using WP-POLLS for my WordPress Polls and Surveys

Back in 2010 we started using the WP-POLLS plugin to add polls and surveys to one of our WordPress sites. 9 years on, is this still the best solution? Here’s our 2019 view on using polls and survey plugins in WordPress.

Do you deserve to get ranked on Google first page?

Do you deserve to get ranked on Google first page?

Everyone wants to get ranked on Google first page. That’s the challenge, but focus on what others are doing to achieve those hallowed ranks… and do it better, and you might stand a chance of ranking better.

Share This

Please share if you've liked reading this

Share this post with your friends! It really helps us, and lets us know which content visitors like best - so we can write more like that!