Text in Images vs. Alt tags
-
Hi on my homepage i h ave multiple images They have the appropriate alt text for each image, but the text which the image displays is not written into the page and styled using CSS rather than placing text within an image.
Is this a issue worth correcting, or is it sufficient to have just alt text for each image.
Any major pros from having putting the text in the image into the CMS using appropriate CSS styling to achieve the same effect.
-
Don't take chances. Put any text that you want search engines to see out there where visitors will see it - in text.
-
I strongly prefer all text to be displayed as HTML text rather then embedded in images.
PROS:
-
text can be changed very quickly as needed. This is helpful for translations, keyword changes, etc. Changes of images may require a designer and developer whereas a text change can often be done by a site owner.
-
any time an image is updated, you either have to update the site's code or deal with caching issues where some users will see the old image
-
search engines can always read the text and there is a 100% confidence what is being read by the crawler is also being viewed by users
CONS:
- If you desire a very specific font or styling, it could be altered by various browsers at times. This can easily be avoided by either choosing from one of the many popular fonts or using CSS3 to make the font available to the viewer
Tests have been performed to show currently Google evaluates alt text and html text equally. I strongly believe at some point this will change. Google strongly desires to align their evaluations with the user experience. Alt text is very commonly manipulated whereas text can be trusted to a much higher degree.
-
-
Great question. Yes, it would be much better to put the text on the page via the CMS with CSS to achieve the same look as you have right now. The reason is that a SE spider cannot crawl text that is embedded in an image. All the spider will "see" is that it is an image containing whatever is described by your "alt" attributes. If you want search engines to be able to "read" that content, I would recommend going the route of making it actual text styled in conjunction with the image you want via CSS as you propose.
Hope that helps!
Dana
Got a burning SEO question?
Subscribe to Moz Pro to gain full access to Q&A, answer questions, and ask your own.
Browse Questions
Explore more categories
-
Moz Tools
Chat with the community about the Moz tools.
-
SEO Tactics
Discuss the SEO process with fellow marketers
-
Community
Discuss industry events, jobs, and news!
-
Digital Marketing
Chat about tactics outside of SEO
-
Research & Trends
Dive into research and trends in the search industry.
-
Support
Connect on product support and feature requests.
Related Questions
-
How to deal with 100s of Wordpress media link pages, containing images, but zero content
I have a Wordpress website with well over 1000 posts. I had a SEO audit done and it was highlighted that every post had clickable images. If you click the image a new webpage opens containing nothing but the image. I was told these image pages with zero content are very bad for SEO and that I should get them removed. I have contacted several Wordpress specialists on People Per Hour. I have basically been offered two solutions. 1 - redirect all these image pages to a 404, so they are not found by Google 2 - redirect each image page to the main post page the image is from. What's my best option here? Is there a better option? I don't care if these pages remain, providing they are not crawled by Google and classified as spam etc. All suggestions greatly received!
Web Design | | xpers0 -
Responsive image plugins and seo / crawlability
Note : For the background of this question please read the preface below. Ive been researching responsive image options the main issue i can see with them is that they are not semantic html so bots may not index them correctly. For instance many of the responsive image plugins use data-src for an image rather than src. Does any one have any experience with this and if it impacts on SEO ? Does any one know of a client side responsive image soltion that uses a normal img tag with the image stored in the src and with the option to set an alt attribute ? **Preface : ** Ive got a site we are currently developing, the site has a large full width responsive image slider. To serve images that wont be pixilated we are making the width of the images 1800px wide (which should cover most screens, but isn't actually big enough if the site was viewed on a 27" imac) these 1800px wide images weight about 350kb - 500kb per image and our image slider has about 20 of them. As you can see this would be a problem for anyone with a connection slower than c.10 mbps. This is especially true for mobile devices that will be downloading an image 1800px wide although only require a much smaller one, this coupled with a 3g connection will make the site really slow.
Web Design | | Sam-P0 -
Wordpress Theme is blocking alt tags. Does anybody know of any special plugins?
We have a special wordpress theme for nataliecass.com. Unfortunately the theme is blocking all the alt tags (this is a photography website...alt tags are very important). Does anybody know of any special WP plugins for alt tags? Thanks
Web Design | | VanguardCommunications0 -
Google tag manager on blocked beta site - will it phone home to Google and cause site to get indexed?
We want to develop a beta site, in a directory with the robots.txt blocking bots. We want to include the Google Tag Manager tags and event layer tracking code on this beta site. My question is that by including the Google Tag Manager code, that phones home to Google, will it cause Google to index this beta site when we don't want it indexed?
Web Design | | CFSSEO0 -
Is it cloaking/hiding text if textual content is no longer accessible for mobile visitors on responsive webpages?
My company is implementing a responsive design for our website to better serve our mobile customers. However, when I reviewed the wireframes of the work our development company is doing, it became clear to me that, for many of our pages, large parts of the textual content on the page, and most of our sidebar links, would no longer be accessible to a visitor using a mobile device. The content will still be indexable, but hidden from users using media queries. There would be no access point for a user to view much of the content on the page that's making it rank. This is not my understanding of best practices around responsive design. My interpretation of Google's guidelines on responsive design is that all of the content is served to both users and search engines, but displayed in a more accessible way to a user depending on their mobile device. For example, Wikipedia pages have introductory content, but hide most of the detailed info in tabs. All of the information is still there and accessible to a user...but you don't have to scroll through as much to get to what you want. To me, what our development company is proposing fits the definition of cloaking and/or hiding text and links - we'd be making available different content to search engines than users, and it seems to me that there's considerable risk to their interpretation of responsive design. I'm wondering what other people in the Moz community think about this - and whether anyone out there has any experience to share about inaccessable content on responsive webpages, and the SEO impact of this. Thank you!
Web Design | | mmewdell0 -
Should we include our header logo in a sprite or leave it as a regular image?
We are combining the images in our header and footer into sprites. We noticed that when we include our header logo in the sprite, we lose the "alt" text associated with the header logo. Is this undesirable? Would it be better to leave the logo in our header as an image with "alt" text? Here's the link: http://www.ccisolutions.com
Web Design | | danatanseo0 -
SEO Friendly Image Swap Functionality Software
Anyone know of any software for this... I need a simple way to create SEO friendly Image Swap Functionality on multiple product pages of a static site. The idea is that customers can see different images within the product screen by clicking on thumbnails. For SEO purposes it is essential that: The rollover does not create a new URL when the product images are cycled The image needs to have an alt attribute (a different attribute set by the client for each product) As per: http://www.seomoz.org/blog/tips-and-musthaves-for-your-ecommerce-platform Thanks in advance. Justin
Web Design | | GrouchyKids0 -
Local SEO - Title Tag?
For www.bluedotlandscaping.com/fencing.htm in which we mostly only care about Greenvile and Spartanburg counties in SC. Is <title>Patio designs - Water features - Brick patio by Blue Dot Landscaping</title>
Web Design | | SCyardman
good... or or do you prefer... <title>Patio designs - Water features - Brick patio - Greenville, Spartanburg, Simpsonville</title> Thanks for your help, Rich0