How to properly link to products from category pages?
-
Hi All,
We have an e-commerce website and the category pages are built so that there is a product image and below it there is the title. Both the image and the title are in a href (each on its own).
I encountered the following unfinished discussion here at MOZ:
http://www.seomoz.org/q/how-to-optimize-achor-text-links-on-ecommerce-category-page#post-93758The discussion states that its improper.
The question is - if it is wrong then why? (maybe because Google will give its weight to the image anchor instead of the text anchor since it is higher in the page).
The other question is how to resolve the matter?
Should I add nofollow to the image href?Thanks
-
Dear Everett,
Can you supply the link to the article?
Thanks
-
Also see this page for more information on using named anchor links (i.e. page.html#image) to avoid the "first link counts" issue. This is what Alan Mosley is recommending. I think it is much safer than using CSS to try and "trick" search engines. You can put the image on product pages in a named anchor like #image.
Resources:
http://www.seomoz.org/blog/results-of-google-experimentation-only-the-first-anchor-text-counts
http://www.seomoz.org/ugc/3-ways-to-avoid-the-first-link-counts-rule
http://www.seomoz.org/blog/the-first-link-counts-rule-and-the-hash-sign
-
No problem, glad I could help!
-
Works amazing!!!!!
Thanks a lot for all of your help.
-
I would do something like this: http://jsfiddle.net/D7vMG/3/ (do you see the z-indexes? it makes sure the anchor is higher positioned then the paragraph.)
You can of course use only the <a>-tag and not a heading. In that case you can put the position: absolute on the a-tag.</a>
<a>Hope it helps! Good luck!</a>
-
THANKS!!! I've been working on it since your first reply
Last question (I'm a bit rude now) -
I also have price beneath "The New Ipad" anchor. Currently it is not in the href and I'm thinking of keeping it this way (which would mean it will be in the H3 but not in the href).
Also, the href's are simple href's not surrounded by h3's, What do you think? Changing them? (keeping the price outside the href but inside the H3)
It seems correct but changing would mean of a lot of anchors will be changed on the entire website... scarry
-
Yeah of course, you can style the link any way you want. Even hide it although I wouldn't recommend that hehe.
I made this jsfiddle for you: http://jsfiddle.net/D7vMG/1/
good luck trying it yourself!
-
It is pretty much as if the anchor flows over the entire image.
I did this a while back on a dutch telecom website called typhone dot nl. Check it out, it's on the frontpage (the offer blocks all have it)
The H3 is just there as an example. If I just got an H1 above all products, i use h2's, if there is a h2, i use h3's. and so on.
-
That's what the css code above does, it puts the link beneath the image visually when users look at the site, while keeping the link above the image in the actual code.
-
I should not of said 2 pages, but it has been shown that both links will give link text relevancy.
The javascript link will be followed, it will not help
-
Is there a way to do so and having the link appearing beneath the image?
I don't want to change the design
-
Dear Alan,
If Google will see it as two pages I'm guessing I will need to add a canonical to the # version. Is that the case?
What about having the image with a javascript link? (location.href) or is that suspicious?
-
Dont use no-follow, you will just leak link juice.
One way around this, is to use a anchor # in your url for the image. like page.html#someterm
This will in fact give you link text relevancy for both, google will see this as 2 different pages.
Make sure you have alt text for the image.
This tataic and well as what x-com may in the future be seen as over optimization, so it may be tter to do somthing like this
Your link text
You can just link the whole lot in the one link.
Or move your text to above the image.
-
Thank you for the answer.
I'm not too strong with css besides for the basics,
what you mean is that the anchor will be displayed beneath the image for the user even though the code is placed before the image and also that clicking on the image will actually be like clicking on the anchor since its size includes the image???
Brilliant, it will also give more "engagement credit" to the anchor instead of splitting it (actually ppl usually clicking on the image).
By the way, do you put all of your products on the page as H3?
Thanks
-
Hi Noamflint, we develop a lot of e-commerce websites and I want to fill you in how we tackled this problem several months ago and how.
We deleted the anchor of the image! In our code it looks something like:
The New iPad
As you see at the moment there is no anchor on the image, but our clients do want this. because of usabilty. and people just love clicking images.
We solved this with CSS:
div { position: relative; padding-top: 30px; display: block; }
div h3 { position: absolute; top: 0px; left: 0px; display: block; }
div h3 a { width: 200px; height: 230px; display: block; }
div img { width: 200px; height: 200px; display: block; }
This code above is pseudo of course, but i hope you see what we are trying to accomplish. The anchor tag is positioned absolute in the parent div. With the dimensions on it, the link is above the image, so when people hover the image. they automatically hover the link. Clicking in it, takes them to the detail page.
You should try it! Maybe it will help you out.
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
-
Ecommerce category pages
Hi there, I've been thinking a lot about this lately. I work on a lot of webshops that are made by the same company. I don't like to say this, but not all of their shops perform great SEO-wise. They use a filtering system which occasionally creates hundreds to thousands of category pages. Basically what happens is this: A client that sells fashion has a site (www.client.com). They have 'main categories' like 'Men' 'Women', 'Kids', 'Sale'. So when you click on 'men' in the main navigation, you get www.client.com/men/. Then you can filter on brand, subcategory or color. So you get: www.client.com/men/brand. Basically, the url follows the order in which you filter. So you can also get to 'brand' via 'category': www.client.com/shoes/brand Obviously, this page has the same content as www.client.com/brand/shoes or even /shoes/brand/black and /men/shoes/brand/black if all the brands' shoes happen to be black and mens' shoes. Currently this is fixed by a dynamic canonical system that canonicalizes the brand/category combinations. So there can be 8000 url's on the site, which canonicalize to about 4000 url's. I have a gut feeling that this is still not a good situation for SEO, and I also believe that it would be a lot better to have the filtering system default to a defined order, like /gender/category/brand/color so you don't even need to use these excessive amounts of canonicalization. Because, you can canonicalize the whole bunch, but you'd still offer thousands of useless pages for Google to waste its crawl budget on. Not to mention the time saved when crawling and analysing using Screaming Frog or other audit tools. Any opinions on this matter?
Intermediate & Advanced SEO | | Adriaan.Multiply0 -
How to deal with canonicals on dup product pages in Opencart?
So I have a seriously large amount of duplicate content problems on my Opencart site, and I've been trying to figure out the best way to fix them one by one. But is there a common, easy way of doing this? Because frankly, it is a nightmare otherwise. I bought an extension which doesn't appear to work (http://www.opencart.com/index.php?route=extension/extension/info&extension_id=20468&utm_source=ordercomplete&utm_medium=email&utm_campaign=wm), so now I'm at a loss.
Intermediate & Advanced SEO | | moon-boots0 -
Do internal links from non-indexed pages matter?
Hi everybody! Here's my question. After a site migration, a client has seen a big drop in rankings. We're trying to narrow down the issue. It seems that they have lost around 15,000 links following the switch, but these came from pages that were blocked in the robots.txt file. I was wondering if there was any research that has been done on the impact of internal links from no-indexed pages. Would be great to hear your thoughts! Sam
Intermediate & Advanced SEO | | Blink-SEO0 -
Site wide links - should they be nofollow or followed links
Hi We have a retail site and a blog that goes along with the site. The blog is very popular and the MD wanted a link from the blog back to the main retail site. However as this is a site wide link on the blog, am I right in thinking this really should be no follow link. The link is at the top of every page. Thanks in advance for any help
Intermediate & Advanced SEO | | Andy-Halliday0 -
Product Descriptions for a product with many designs
I'm a newbie with SEO and I have a question regarding product descriptions. Let's say I am selling 100 dog id tags. The tags are all made of same materials, same size, just different designs. Now for the product description, do I need to write a different set of description for all 100 tags? This is an example of a short product description(there's more) for all the pet tags: Personalized with 4 lines of information and 20 characters in each line. Lifetime guarantee - If your pet ID tag ever becomes illegible, we will replace it free of charge. Solid one-piece construction - No glued or ""sandwiched"" materials to wear out or fall apart. Split ring for collar attachement included with EVERY tag. Countless uses - School backpacks, luggage, fashion accessories, and many more! All of the above information pertains to all the pet tags. Can all my product descriptions contain that information, or will I need to modify this 100 times for each individual pet tag? I read up a lot on duplicate content so I am slightly confused. Will this hurt my SEO? Thanks, Keith
Intermediate & Advanced SEO | | ktw0160 -
Do 404 pages pass link juice? And best practices...
Last year Google said bad links to 404 pages wouldn't hurt your site. Could that still be the case in light of recent Google updates to try and combat spammy links and negative SEO? Can links to 404 pages benefit a website and pass link juice? I'd assume at the very least that any link juice will pass through links FROM the 404 page? Many websites have great 404 pages that get linked to: http://www.opensiteexplorer.org/links?site=http%3A%2F%2Fretardzone.com%2F404 - that was the first of four I checked from the "60 Really Cool...404 Pages" that actually returned the 404 HTTP Status! So apologies if you find the word 'retard' offensive. According to Open Site Explorer it has a decent Page Authority and number of backlinks - but it doesn't show in Google's SERPs. I'd never do it, but if you have a particularly well-linked to 404 page, is there an argument for giving it 200 OK Status? Finally, what are the best practices regarding 404s and address bar links? For example, if
Intermediate & Advanced SEO | | Alex-Harford
www.examplesite.com/3rwdfs returns a 404 error, should I make that redirect to
www.examplesite.com/404 or leave it as is? Redirecting to www.examplesite.com/404 might not be user-friendly as people won't be able to correct the URL in the address bar. But if I have a great 404 page that people link to, I don't want links going to loads of random pages do I? Is either way considered best practice? If I did a 301 redirect I guess it would send the wrong signal to the crawlers? Should I use a 302 redirect, or even a 304 Not Modified redirect?1 -
Any idea why I can't add a Panoramio image link to my Google Places page?
Hey guys & gals! Last week, I watched one of the Pro Webinars on here related to Google Places. Since then, I have begun to help one of my friends with his GP page to get my feet wet. One of the tips from the webinar was to geotag images in Panoramio to use for your images on the Places page. However, when I try to do this, I just get an error that says they can't upload it at this time. I tried searching online for answers, but the G support pages that I have found where someone asks the same question, there is no resolution. Can anyone help? PS - I would prefer not to post publicly the business name, URL, etc. So, if that info is needed, I can PM. Thanks a lot!
Intermediate & Advanced SEO | | strong11 -
Two links from one page with different Anchor text
Example Business Name - UberPuter UberPuter targets the keywords "Computer Repairs" right from their home page. UberPuter has the option to place links on 150 of their customers pages that are happy with the service. Would it be best to place two anchor text links one with the brand name and one with the keyword anchor text in "computer repairs" pointing both at the home page or should UberPuter only place one link back to the home page for the Keyword Anchor text? To the best of my knowledge G only counts the first link on a page as a "Vote" so my thought is to only include the single link with the keyword anchor text. Thanks,
Intermediate & Advanced SEO | | SEOKeith0