Off Screen Rendering & Other Tactics
-
Hi Folks,
We're currently trying to change our website search results to render in HTML in the first instance then switch off to AJAX when our user clicks on filters. But we came across an issue that diminishes the user experience, so we used this method below:
We have moved the search grid offscreen in the initial rendering because we execute a lot of Javascript that modifies the DOM within the grid. Also when a user has performed a search from within the page, the hash is updated to identify the new search terms. Because this is not sent to the server, a user who has done a search and refreshes would see incorrect search results initially and the correct search results would then replace them.
For example, on initial search a user reaches a URL akin to search.veer.com/chicken. When they perform a search from on that page, the hash gets updated tosearch.veer.com/chicken#keyword=monkey. If the user refreshes the page, the server only receives the request for chicken and then serves up the page with those results rendered on it. The Javascript then checks the hash and determines that it needs to run a different search and fires off an AJAX call to get the new results.
If we did not render the results offscreen the user would see the results for chicken (confusingly) and be able to briefly interact with them until the AJAX call returns and the results are replaced with the correct monkey results. By rendering offscreen, the initial results are not visible and the Javascript can move them immediately onscreen if there is no hash, or wait until the AJAX call returns and then rebuild the grid and move it onscreen.
Now I know that rendering text indent to -9999 is a black hat SEO tactic. But, would it be the same in this case? We're only doing this avoid bad UI. Please advise.
Also, we came across these two articles that may serve alternative options. These article state that each tactic is SEO-friendly, but I'd like to run it my the community and see if you guys agree.
http://joshblog.net/2007/08/03/make-your-rich-internet-application-seo-friendly/
http://www.inqbation.com/tools-to-increase-accessibility-in-the-web/
Thank you for your help!
-
Hi Cyrus,
Thanks for your note. So, if the subsequent links are not indexed by Google (via site command) would that be a sure way to know that the links are not getting followed through by Google?
Here's a sample:
http://search.veer.com/food is indexed and in the cache version you can see the image links and the text links below. However in the text version the same links are not visible. Now, I did a site command on the first image - http://marketplace.veer.com/stock-photo/Man-shopping-in-vegetable-department-FAN9018482?slot=01&pg=1&skeywords=search&stermids=1115 and http://marketplace.veer.com/stock-photo/Man-shopping-in-vegetable-department-FAN9018482 to ensure that all possible URL variations are covered. It looks like both links are not indexed. This leads to a conclusion that the links are not getting followed.
Please let me know if you agree. Thanks!
-
This is a grey area, but if they list the links in the text version, they are probably following those links. And if they follow them, they will follow the links on the next page, as long as that page has sufficient PageRank to justify it. So the answer is... maybe.
-
Thanks for your input. I'm learning a lot!
It's interesting because I see the links in the cache version, but not in the text version. Which version is the one I should go with in terms of ensuring that the links are found and crawled through?
Also if they aren't passing PR, anchor text weighting, and other good stuff, does it mean that they can't crawl through to the subsequent pages?
Thank you!
-
It's sort of a trick question, because we know that Google doesn't always list the non-html links it finds in the text only version of it's cache. In fact, it hardly ever does. I think the reason is that Google is still inconsistent about the type of javascript and other types of links it discovers, and so they probably record these links for discovery purposes, but they most likely don't pass much value.
So if Lynx sees the links, it's likely Google does too and is simply not reporting them. That said, if the links aren't listed in Google's cache, it's also more likely those links aren't passing the same value as a regular link (metrics such as pagerank, anchor text weighting, etc)
So we end up in this grey area - it's likely Google is seeing the links, we just don't know how much they are using those links in their ranking algorithms.
-
Hi Cyrus,
I've DL'ed the Lynx browser and compared the browser to the Google Cache Text Version of this page - http://search.veer.com/food. I got two different results - Lynx can definitely see the links in the search results, but Google Text Version is not seeing them. Could it be possible that Lynx browser is different from what Google sees? Or is it that Google Text Version is no longer a valid SEO tool/reference? Please let me know what you think.
Thank you!
-
Hi Folks,
We'd greatly appreciate it if we can get some development expertise regarding the proposed method in the original post in addition to the follow up articles. Does anyone have feedback regarding these? Thank you for your help!
-Corbis
-
Hi Cyrus,
Thanks for your response, we really appreciate it. All of the issues you mentioned are getting addressed in the near future. The reason why the search results pages are not getting index is because they have "noindex" tags on the pages. This is getting addressed as well.
What Lynx browser do you recommend?
Thank you!
-
First of all, let me start with the disclaimer that I'm not an expert in all these areas of technology (AJAX and offscreen rendering) but let me offer my 2 cents.
Google's quality guidelines state that no text should ever be hidden from the user, so in general I recommend against it. In reality, it's actually pretty common - and a lot of webmasters commonly justify CSS image replacement and other techniques using this line of argument > but in general I prefer to always play it safe.
http://support.google.com/webmasters/bin/answer.py?hl=en&answer=66353
That said, I'm more concerned about other areas of your site, specifically that search results are rendered on their own subdomain, while product images are served from another separate subdomain. Splitting the domain authority like this is most likely hurting the ability of your products to rank.
I couldn't find a cached version of your search results, (probably because of the server no cache control) but it appears all the search results depend on JavaScript to render. At least, when I view the page with JavaScript turned off (using the MozBar) I get an empty page.
Also, how are the search results getting crawled? I see a few links to search results on the homepage and /product/images/ page. On the product pages themselves, I see links to search results like this:
http://search.veer.com/?termonly=1&searchTerm=2647 - which I actually think is a brilliant way to get those search results crawled, but I assume that URLs is identical to http://search.veer.com/childhood? Also, the related keywords disappear when I turn off javascript?!
So, I might be worried that big G isn't crawling your search results pages that much at all, which if true, sorta makes the point moot.
Like I said, I'm not expert in this field, so take everything I say with a grain of salt. If you're goal is to get better crawling/indexing of your product pages through Google crawling your search results,
- I'd do an audit of your site with all javascript turned off, or
- Use a text browser such as Lynx to examine your site
- check your server logs to see how often google is visiting your search results,
- See if there is another way to get better indexing of you product pages (related image links, etc)
- Make sure link juice is flowing through your site appropriately through html text links.
Hope this helps! Best of luck with your SEO.
-
Hi Cesar,
Thanks for the input. Greatly appreciate it.
In this case, we're not trying to serve different content for Google vs. our users. Rather, we're trying to make sure that the links in our internal search results are indexed by Google without hindering user experience. Google will see the same links as the users. It's just that users will experience an AJAX rendering instead of static HTML rendering. Would this still make it Black Hat SEO?
Also, any comment on the two articles?
Thank you for your help!
-
"Now I know that rendering text indent to -9999 is a black hat SEO tactic. But, would it be the same in this case? We're only doing this avoid bad UI. Please advise. "
I would definitely stay away from this one personally. This was and is a huge Black Hat practice. If Google sees it different than the user then stay away from it.
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
-
With Google's new Speed Update, what does that mean for AMP pages?
Hey everyone! I wanted to get the other Mozzers opinions on this. With Google announcing a new Speed Update that will affect mobile rankings, I wanted to ask: How will AMP pages play into this? Let me know what you think!
Web Design | | TaylorRHawkins
Thanks!2 -
Show new mobile site to 60% users & old mobile site to 40% users
Hi, We are planning to show new mobile site to 60% users & old mobile site to 40% users. We will show the old site to google crawler. Our old site has some interlinking through footer & content whereas the new site does not has it. We wanted to do this since our new site does not supports some browsers. Will there be an issue with Google on showing the site like this. The mobile site & desktop site will have same url across devices & browsers. Regards
Web Design | | vivekrathore0 -
What do you use for test rendering your dev site?
I'm redesigning our company ecommerce site and need to test render an infinite scroller to ensure that it is as SEO friendly as possible. My problem is that I cannot view it in Webmaster Tools since I am blocking the site from crawlers using robots.txt. I know I could simply unblock Google temporarily but I really would rather not make my dev site available to search engine crawlers.
Web Design | | bearpaw0 -
What To Do When Improved Site Speed & Layout Result In Higher Bounce Rates & Lower Time On Site
We launched a new Bootstrap 3.0 site template 2 weeks ago. The site loads 5x faster and has a much improved layout (utilizing most common above the fold recommendations ). It's only been two weeks, but our bounce rate has increased 5-10% and our avg time on site decreased by 10-18%. Here is the page for one of our most common products so you can see the general experience: <a>http://www.jwsuretybonds.com/surety-bonds/commercial-bonds/auto_dealer_bond.htm</a> (here is the old version: <a>http://199.119.123.134/surety-bonds/commercial-bonds/auto_dealer_bond.htm</a>) We spent two months implementing the new design and working on a speedy load time. We had anticipated a drastic improvement, not mild downturn in user behavior. I'm hopeful that the Analytics metrics aren't showing the true picture on the keywords we care about (can't see anymore due to "Not Provided" listed as most keywords now. Argh!) and perhaps some of the more important/accurate user behavior metrics that we can't see are improving. We know our industry and our clients needs VERY well. We THOUGHT our new content/layout was perfect so it will be tough for us to try to make improvements at this point. We believe our best plan of action now is to add more content on each page and A/B test it along with other subtle changes. The problem is that our new content is very concise and hits on all of the primary visitor intentions, so additions of content could be redundant and making concise answers more "fluffy", which is what we tried to get away from. What do you think? Is there reason for panic? What would your plan of attack be if your "sure shot" new design didn't provide the improvements you "knew" it would? 🙂
Web Design | | TheDude0 -
Pin It Button, Too Many Links, & a Javascript question...
One of the sites I work for has some massive on-page link problems. We've been trying to come up with workarounds to lower the amount of links without making drastic changes to the page design and trying to stay within SEO best practices. We had originally considered the NoFollow route a few months back but that's not viable. We changed around some image and text links so they were wrapped together as one link instead of being two links to the same place. We're currently running tests on some pages to see how else to handle the issue. What has me stumped now though is that the damned Pinterest Pin Button counts as an external link and we've added it to every image in our galleries. Originally we found that having a single Pin It button on a page was pulling incorrect images and not listing every possible image on the page... so to make sure that a visitor can pin the exact picture they want, we added the button to everything. We've been seeing a huge uptick in Pinterest traffic so we're definitely happy with that and don't want to get rid of the button. But if we have 300 pictures (which are all links) on a page with Pin It buttons (yet more links) we then have 600+ links on the page. Here's an example page: http://www.fauxpanels.com/portfolio-regency.php When talking with one of my coders, he suggested some form of javascript might be capable of making the button into an event instead of a link and that could be a way to keep the Pin It button while lowering on-page links. I'm honestly not sure how that would work, whether Google would still count it as a link, or whether that is some form of blackhat cloaking technique we should be wary of. Do any of you have experience with similar issues/tactics that you could help me with here? Thanks. TL;DR Too many on page links. Coder suggests javascript "alchemy" to turn lead into gold button links into events. Would this lower links? Or is it bad? Form of Cloaking?
Web Design | | MikeRoberts0 -
Yes or No for Ampersand "&" in SEO URLs
Hi Mozzers I would like to know how crawlers see the ampersand (& or &) in your URLs and if Google frown upon this or not? As far as I know they purely recognise this as "and" is this correct and is there any best practice for implementing this, as I know a lot of people complained before about & in links and that it is better to use it as &, but this is not on links, this is on URLs. Reason for this is that we looking to move onto an ASP.Net MVC framework (any suggestions for a different framework are welcome, we still just planning out future development) and in order to make use of the filter options we have on our site we need a parameter to indicate the difference on a routing level (routing sends to controller, controller sends to model, model sends to controller and controller sends to view < this is pattern of a request that comes in on the framework we will be using). I already have -'s and /'s in the URLs (which is for my SEO structuring) so these syntax can't be used for identifying filters the user clicks or uses to define their search as it will create a complete mess in the system. Now we looking at & to say; OK, when a user lands on /accommodation and they selects De Kelders (which is a destination in our area) the page will be /accommodation/de-kelders on this page they can define their search further to say they are looking for 5 star accommodation and it should be close to the beach, this is where the routing needs some guidance and we looking to have it as follow: /accommodation/de-kelders/5-star&close-to-the-beach. Now, does the "&" get identified by search engines on a URL level as "and" and does this cause any issues with crawling or indexation or would it be best to look at another solution? Thanks, Chris Captivate
Web Design | | DROIDSTERS0 -
Image sliders & site speed
We are having a new website designed using WordPress and the Genesis framework. We wanted to include header image sliders on a number of internal site pages, but our designer says that sliders on more than just the home page will slow down the site significantly. How much could they slow down the site, and what can be done to minimize their effect on site speed?
Web Design | | GordyH0 -
Ruby on Rails & MemCaching
Anyone else buildling their website using Ruby on Rails? If so, are you also using any memcaching? Do you have any tips on memcached concepts, tricks, caveats, and experiences. How are you also doing SEO, any tricks for generating traffic and some Google love?
Web Design | | Goetzman0