Is Your Website's Text Really an Image?

Some web designers don't know how to code a website, so they create the website text as images, with dire consequences.

Most websites are designed using some form of html, css, and other types of web design code. Text (the wording on the website) must be included in the code as actual text. Sometimes, however, what looks like text is not text at all, but an "image" or "picture" of text.

Why would a web designer use images instead of text? Because they do not know html or css coding! They may be more familiar with other programs like image editors, graphic arts, desktop publishing or presentation programs, so they build the entire website in that application.

Why does it matter whether website text is an image or real text?

Text should actually be "text" rather than an image, for two reasons:

1. Using an image instead of actual text is bad for search engine optimization (SEO), because search engines cannot read text inside an image. If someone searches for text that appears in the image, your website will never appear in the search results. A website image can only be found in search results by its file name or alt tag (which is very short), but not the text depicted in the image.
2. If you need to make changes to text, you just change the text! You cannot change text inside an image unless you have the original file that the image was created with as well as the program that created it. So if the image was created in Photoshop, you would need the original Photoshop file as well as the Photoshop application to change the text. Seems like a lot of unnecessary work!

How do I know if the text on my website is text or an image?

Sometimes you can tell just by looking at the text. If it looks blurry or "bitmappy" or "ghosty" around the edges, it's probably an image.

If you can highlight the text the way you would in a program such as Microsoft Word, then it's text. To highlight the text, left-click the mouse button before the first letter of a word (make sure the word is not a link) and then drag the mouse down or to the right. The background of the text should turn a different color (usually blue). If the text is an image, dragging the mouse across the text may either move the block of text, show a black circle with a line through it, highlight the entire block of text at one time (rather than the individual letters or words), or do nothing (text will not be highlighted).

On a desktop or laptop, you can right-click the mouse button over highlighted text. Depending on your browser, the context menu (white box) that appears when you right-click the mouse button will show different options when you right-click on an image than if you right-clicked on text. Right-clicking on an image will show some options such as "View Image", "Copy Image", "Save Image", etc. (or it may call it a Picture instead of an Image). These image options will not appear when you right-click on text, although you may still see the option "View Background Image".

On your phone, if you select text, you often have the option of copying it. But if you select an image, you'll have an option of saving the image.

In the two samples below, the first one is text and the second one is an image. Use the methods described above to see the difference:

© T. Brooks Web Design, LLC. All rights reserved.

Do not copy content from this page without attribution to T. Brooks Web Design and link back to this page.