Moz Q&A is closed.
After more than 13 years, and tens of thousands of questions, Moz Q&A closed on 12th December 2024. Whilst we’re not completely removing the content - many posts will still be possible to view - we have locked both new posts and new replies. More details here.
How best to wrap anchor tags around a product tile
-
Hi
Say I am on a Product Listing page on ecommerce website and I have product tiles which contain images and name/price underneath them. Is it better to wrap the whole product tile (image and name/price) in an anchor tag (linking to their product page) or to wrap the image and the name/price underneath in anchor tags separately (linking to the product page) ?
thanks
-
To wrap anchor tags around a product, you'll typically want to create a hyperlink that, when clicked, leads to a page or resource related to the product
-
A possible answer to this issue could be:
"To effectively wrap anchor tags around a product tile, you should ensure that the anchor tag encloses the entire content of the product tile. This can be done by placing the opening <a> tag at the start of the product tile and the closing </a> tag at the end of it. Here’s a step-by-step approach:
Start with the opening anchor tag before any of the product tile content. Add the href attribute to the anchor tag with the URL you want the user to be directed to when they click the product tile.
Ensure that the anchor tag has display block (display: block;) style applied to it, so it takes up the full tile space. This is important for making the whole area clickable.
Place all the HTML that makes up the product tile between the opening and closing anchor tags. This includes the image, product title, price, and any other information you wish to display.
Close the anchor tag after all the product tile content.
Remember to style the anchor tag to remove any default styling like underlines (text-decoration: none;) and ensure it inherits text colors (color: inherit;), so it blends seamlessly with your product tile design.Test the implementation across different browsers and devices to ensure the clickable area covers the entire tile consistently."
By wrapping the entire tile in an anchor tag and ensuring the tag is displayed as a block-level element, users will be able to click anywhere on the tile to navigate to the product's detail page.
-
To wrap anchor tags around a product tile effectively:
Use a parent container for the product tile.
Place the anchor tag within the container.
Ensure the anchor tag covers the entire product tile for accessibility.
Set the anchor's href attribute to the product's page URL.
This approach allows users to click anywhere on the product tile to access more details, improving user experience. -
It's generally better to wrap the whole product tile, including the image and name/price, in a single anchor tag. This approach provides a larger clickable area for users, improving the overall user experience and making it easier for them to access the product details.
.
.
.
( IT Business Analyst ) ( -
It's generally best to wrap the entire product tile in a single anchor tag for a larger clickable area and improved user experience on e-commerce product listings.
-
Hi,
In most cases, it's better to wrap the whole product tile (image and name/price) in a single anchor tag linking to the product page. This approach provides a larger clickable area and offers a better user experience, as visitors can click anywhere within the tile to access the product details. It simplifies navigation and ensures consistency in user expectations when interacting with product listings on an e-commerce website.
.
.
.
( Diploma Courses In Canada ) (Canada PR) (PMP Exam Prep)
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 Increase Website Visibility on Google and Bing?
I am working on an e-commerce niche website and I aim to rank higher on Google to drive more traffic to my website. Any suggestions?
Link Building | | digitalenginehub0 -
How to index e-commerce marketplace product pages
Hello! We are an online marketplace that submitted our sitemap through Google Search Console 2 weeks ago. Although the sitemap has been submitted successfully, out of ~10000 links (we have ~10000 product pages), we only have 25 that have been indexed. I've attached images of the reasons given for not indexing the platform. gsc-dashboard-1 gsc-dashboard-2 How would we go about fixing this?
Technical SEO | | fbcosta0 -
Landing page separate from product page
Hello there, I have a wordpress website with a woocommerce plugin. I have 4 landing pages that describe my products and at the end of the pages, I have a CTA to my product page. is it bad for SEO? my website: https://relationadviser.ir
On-Page Optimization | | Aaron.be1 -
Is it OK to shorten your brand name in your title tags
If your title tag is over 55 characters, is it generally OK or good practice to abbreviate your brand name (at the end of the title tag) for the sake of the other keywords in the tag?
On-Page Optimization | | AliMac261 -
Product content length & links within product description
Hello, I have questions regarding content length and links within descriptions. With our ecommerce site, we have thousands of products, each with a unique description. In the product description, I have links to the parent category and grandparent category (if it has one) in the main product text which is generally about 175 words. Then I have a last paragraph that's about 75 words that includes links to our main homepage and our main product catalogue page. Is the content length long enough? I used to use text that was 500 words, and shortening it I still rank when launching new products, so I don't think an increase in text length will have any additional benefit. I do see conflicting information when I do searches, with some people recommending a minimum of 300 words and some saying to try and go a 1000 for category pages. In regards to the links, I noticed a competitor has stopped following this format, so I'm unsure if I should keep going too. Is it too many links to have each of the products link back to the main catalogue and homepage? Is it good to have links with anchor text to the categories a product is in? There are breadcrumbs on the page with these links already. There are already have heaps of links on our pages (footer, and a right sidebar with image links to relevant categories), so my pages do get flagged for too many links. Thanks!
On-Page Optimization | | JustinBSLW0 -
Is it OK to include name of your town to the title tag or H1 tag on a blog to enhance local search results
I recently attended a webinar by ETNA Interactive on local search SEO. The presenter recommended including the name of your town in the title of the blog to increase local search SEO. Is this OK? Ive always been concerned that it is such an obvious attempt to rank locally that Google would consider it "spammy" ? black hat, "sketchy" or otherwise manipulative. Have the rules changed? Is it OK to do? Brooke
On-Page Optimization | | wianno1680 -
Rel canonical tag back to the same page the tag is on?
Very simple, Why would a website (and I have seen tons doing this) link the rel canonical tag back to the same page the tag is on? Example: somepage.htm has a canonical tag linking to somepage.htm I thought the idea of this tag was to tell google if 2 pages are similar, this page is the original, and it's this page which should be indexed and the page with the tag on should pass all PR to the original. Maybe im wrong and someone can help me out to understand this.
On-Page Optimization | | activitysuper0 -
Alt tag matching product titles - e-commerce
Hey all, Just wondering if it is ok to match the alt tag to product titles. Imagine an e-commerce site that lists a whole lot of products on any one page for any one category. Each product listing has a thumbnail image beside it. The easiest way to implement this dynamically is to use the product title for the alt tag. Anyone had any experience with this? Is it overkill / spam of keywords - given that the product title is repeated. Our current situation is that our alt tags are simply blank or say 'photo' which is no good, and we have hundreds of thousands of pages. Cheers, Croozie
On-Page Optimization | | sichristie0