Replace Header Text With Image
-
I have a static website that I would like to retheme. I have the mockup, and its spliced. The website holds nice rankings right now, and I want to keep them in place. The one thing that will change with this new design is the header will no longer be text, but instead an image. Is there a way to ensure googlebot still sees the H1 tag header exactly how it is now but use an image for the header instead?
I dont want any blackhat tricks that will get me banned. Just wondering if there is a simple way to have googlebot see the header as text (not ALT img txt) so the site does not appear to have changed at all. (It hasnt, I only am changing the graphics and colors of background, and header image for better branding.
-
To achieve a balance between visual aesthetics and search engine interoperability, you could use a Javascript font renderer like cufon: http://cufon.shoqolate.com/generate/ - which will give you nice anti-aliasing.
Look at Google Fonts too - http://www.google.com/webfonts#ChoosePlace:select
I would redesign & work towards getting a H1 on there rather than working backwards
-
Egol is correct.
your redesign has a cost, the desision is yours, what is more important, the HI or the design, only you know that.
-
You just need to make sure that the search engines will see your site exactly as visitors would see it. Don't try and hide anything. And I agree, try and keep the H1 tag.
And to answer your original question, the search engines have come a long way in terms of sophistication, but they still do not do so well with interpreting graphics, cookies, or javascript. Just good 'ole text.
-
I can leave the H1 tag in, I just dont know where to put it. Its my header, and the website now is VERY ugly. Maybe I will just put the H1 in there above the image, and then use a negative margin. Is that allowed?
-
You are going to use different html mark-up for the image and the h1.
They are not equivalent.
If you use the image you can add alt text but that is not going to be the same as H1 - less effective in my opinion.
If you can't get H1 into your site any other way then loss of the H1 will be part of the cost of your redesign.
If this was my site I would not give up H1 for an artsy image.
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
-
A new client has image urls showing above their page rankings for the same key phrase.
New client website https://yorkshirefoodguide.co.uk/ has for some key phrase searches the URL for an image showing above or as well as the url for the landing page. I'd be happy for it to show in the image pack but I want to url to rank in the main serp. The site is in WordPress and I'm sure this is just a setting I need to manage. Can you help please?
Technical SEO | | Marketing_Optimist0 -
Google not Indexing images on CDN.
My URL is: https://bit.ly/2hWAApQ We have set up a CDN on our own domain: https://bit.ly/2KspW3C We have a main xml sitemap: https://bit.ly/2rd2jEb and https://bit.ly/2JMu7GB is one the sub sitemaps with images listed within. The image sitemap uses the CDN URLs. We verified the CDN subdomain in GWT. The robots.txt does not restrict any of the photos: https://bit.ly/2FAWJjk. Yet, GWT still reports none of our images on the CDN are indexed. I ve followed all the steps and still none of the images are being indexed. My problem seems similar to this ticket https://bit.ly/2FzUnBl but however different because we don't have a separate image sitemap but instead have listed image urls within the sitemaps itself. Can anyone help please? I will promptly respond to any queries. Thanks
Technical SEO | | TNZ
Deepinder0 -
Can the Hosting location of image files have a negative effect if 'off-site' such as on the devs own media server ?
Hi Can the Hosting location of image files have a negative effect if 'off-site' such as if they are on the developers own media server ? As opposed to on the actual websites server or file structure ? In the case i'm looking at the image files are hosted on a totally separate server (a media subdomain of the developers site server) from the subject sites dedicated server. Will engines still attribute the properties of files hosted in this manner to the main website (such as file name, alt attributes, etc etc) ? Or should they really be on the subject sites server own media folder ? Cheers Dan
Technical SEO | | Dan-Lawrence0 -
Jquery image - hidden text?
I'm working on a site that has a jquery image rotation. Wondering if how the developer set it up is consider blackhat or spammy at all. The jquery has 3 images that rotate. Each image has text in it - which is then placed in a H1 or H2 tag behind the images. When viewing the site with images and javascript turned off it looks like the text is the same color as the background and not lined up nicely so that it is visible to anyone who has images and javascript turned off. Let me know if this is a bad practice. If so, what is the best practice to handle this? If the text were another color and aligned neatly visible behind the image would it be safe? Should we just be using an image alt tag instead? What about losing the H1, H2 power then? Any other suggestions for improving the SEO for jquery image rotations where important text appears? I can PM the site URL if you want to take a look. Thanks in advance!
Technical SEO | | IvieDigital0 -
Is there SEO value in having images referenced on other sites?
We use Amazon to host our assets (images, videos, PDFs, etc). These assets can be used across multiple sites we own and we reference them appropriately via our CMS. example asset URL: https://s3.amazonaws.com/lawgical/assets/data/539/original.png We have an infographic we recently distributed that is hosted on Amazon. Obviously we want any link value to go back to our primary URL where we laid out the infographic, however some of the infographic sites are just referencing the above source image URL. Are we losing SEO / link value by not have the infographic hosted on our domain? Do search engines count these image references as a "link"? For your reference... Infographic post: http://www.serve-now.com/articles/841/process-server-vs-sheriff-infographic Example infographic site usage: http://www.infographicsposters.com/law-infographics/which-is-better-process-server-or-sheriff
Technical SEO | | trentc0 -
Micro formats to block HTML text portions of pages
I have a client that wants to use micro formatting to keep a portion of their page (the disclaimer) from being read by the search engines. They want to do this because it will help with their keyword density on the rest of the page and block the “bad keywords” that come from their legally required disclaimer. We have suggested alternate methods to resolve this problem, but they do not want to implement those, they just want a POV from us explaining how this micro formatting process will work. And that’s where the problem is. I’ve never heard of this use case and can’t seem to find anyone who has. I'm posting the question to the Moz Community to see if anyone knows how microformats can keep copy from being crawled by the bots. Please include any links to sites that you know that are using micro formatting in this way. Have you implemented it and seen results? Do you know of a website that is using it now? We're looking for use cases please!
Technical SEO | | Merkle-Impaqt0 -
Image Size for SEO
Hi there I have a website which has some png images on pages, around 300kb - is this too much? How many kbs a page, to what extent do you know does Google care about page load speed? is every kb important, is there a limit? Any advice much appreciated.
Technical SEO | | pauledwards0 -
Can Google read text in Javascript?
We have just completed the redesign of our product page, which you can see here: http://www.uksoccershop.com/p-19045/2011-12-Chelsea-Adidas-Away-Football-Shirt.html Because we want the select size / add to basket section to appear prominently, you can see we are showing only a snippet of the product description in this section and then user has to click "more" to see it. My question is, can Google read the product description here since it's in Javascript? The code is as follows: 2011-12 Chelsea Adidas Away Football Shirt £44.99 Item Code:379606 Brand new, official Chelsea away shirt for the 2011/12 Premiership season, available to buy in adult sizes S, M, L, XL, XXL, XXXL. This football shirt is manufactured by Adidas and is black in colour.[ More...](javascript:void(0);) Brand new, official Chelsea away shirt for the 2011/12 Premiership season, available to buy in adult sizes S, M, L, XL, XXL, XXXL. This football shirt is manufactured by Adidas and is black in colour. Cheer on the Blues in style in the new adidas Chelsea Away Shirt, featuring a striking blue blocked design on an imposing black background complete with the club crest and adidas logo embroidery across the chest for a great style on or off the pitch. The new Chelsea Away Shirt is designed with adidas' ClimaCool technology to bring moisture away from your skin, keeping you cool, comfortable and performing at your best as you emulate the skills of Frank Lampard, Fernando Torres and John Terry on the pitch. Customise your shirt with Premiership shirt printing for your favourite Chelsea stars or choose your own custom name and number. Adult Football Shirt
Technical SEO | | ukss1984
Short sleeves soccer jersey
Chelsea club crest to left chest
adidas logo and stripes
Print sponsor to centre
ClimaCool technology
Machine washable Product code: 379606 The 2011/12 Chelsea away football kit is released on 7th July 2011. <form name="currenychange" action="http://www.uksoccershop.com/p-19045/2011-12-Chelsea-Adidas-Away-Football-Shirt.html" method="get">
<select class="topselectbox" onchange="this.form.submit();" name="currency" style="float:right;"> <option value="USD">US Dollars</option> <option value="EUR">Euro</option> <option value="GBP" selected="selected">UK Sterling</option> <option value="AUD">Australian Dollars</option> </select>
</form> Available Now [Be the first to ask a question](javascript:void(0); "Ask a Question")
[Be the first to review this product](javascript://) Rating: 5 out of 5 stars <form name="cart_quantity" action="http://www.uksoccershop.com/p-19045/2011-12-Chelsea-Adidas-Away-Football-Shirt.html?number_of_uploads=0&action=add_product" method="post" enctype="multipart/form-data"> Which parts of this is Google going to be able to read? Should we make the product title our H1 header for this page and can it currently read that within the code above? </form>0