When displaying text and 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 that contain text, is two-fold:
- 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;
- 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;
Why is it important to use images on your website?
Using images on websites is crucial for several reasons. Firstly, images capture attention and engage visitors, making the content more appealing and reducing bounce rates. They break up text-heavy pages, making information easier to digest and retain. Images can also convey complex ideas quickly, transcending language barriers. Furthermore, relevant images improve SEO, as search engines favour content-rich sites, increasing visibility. High-quality, relevant images enhance the user experience, making a website look professional and trustworthy. They also aid in branding, helping to establish a visual identity and emotional connection with the audience.
Find out more on how to use images on websites here.
0 Comments