How does a Responsive Site kill SEO?
-
How does a Responsive Site poentially kill SEO?
I've seen a few feeds on twitter how a website took a rankings dive after implementing a Responsive theme; yet, it's not clear to me what is actually going on within a Responsive site that would cause the SEO rank to tank? I can only speculate that it introduces a bunch of 404 errors, or that it changes all of the URLs into gibberish, so you loose all of the links coming into your website if not 301'ed?
Can someone clarify, what are the actual mechanical issues on a Responsive website that becomes a concern to SEO? Thanks.
-
Hello Jason,
This is one of the best (ok, IMO the best explanation of responsive design I have seen to date) especially laying out the difference between server side - dynamic design - and responsive. The thought you placed into this whole answer to provide one that is concise and cogent is excellent.
I like the point up about the lazy designer and page speed as something to be aware of.
Typically, as an agency, we are not often dealing with a client bringing mobile and desktop forward. It is more likely we will be dealing with someone whose site has lost appeal, power, relevance, etc. and we typically build responsive for all. So the thoughts around url changes are helpful as well.Thank You,
Robert
-
Hi Steve,
At this point I wouldn't say responsive design is fundamentally better or worse than other options from an SEO perspective. But there are a number of SEO pitfalls you'd want to avoid when moving from some other structure, to a responsive design.
First a Quick Set of Definitions:
"Responsive Design" means different things to different people. If you ask 5 people to define it, you'll get 8 different definitions.
Most people (including Google and the W3C) would say that "responsive design" is primarily using media queries and proportional layouts to adapt a webpage to different viewport widths on the client.
Detecting UserAgents is actually a server side technique that would commonly be used for an alternative approach to responsive design, that google calls "Dynamic Design".
Many people mistakenly call both Serve Side Adaption and Client Side Adaption "Responsive Design" when in fact there are important distinctions for SEO.
Changes in URLS can hurt SEO
In either case, if you're moving from having separate URL's for your desktop (www.mysite.com) and mobile (m.mysite.com) to a new design based on responsive or dynamic design, then you are going to be changing some URL's in the process. Any time you change your URL's you run the risk of hurting your SEO. The best practice is to 301 redirect all the m.mysite.com pages to their new www.mysite.com responsive design equivalents If you happen to be changing the main desktop URL's at the same time, it's even more important that you use 301's to preserve the equity in your old URLs.
Responsive vs. Dynamic
Google loves client side responsive design (it's the easiest/cheapest for Google to crawl), so it's actually their first choice, and you don't have to do anything special for responsive design SEO.
If however, you are doing "Dynamic Design" such as detecting user agents on the server to adapt pages for different devices, then you need to tell Google that the page will look different for different user agents. This is done using the Vary HTTP header.
Content Differences
Responsive Design means that you basically have the same content on your desktop and mobile version of your site. That can mean that you don't have keywords which are popular on mobile devices, such as "download mobile app" which can obviously hurt SEO for those keywords. Having a dynamic site (with different content for mobile and desktop) or even having separate URL's for mobile and desktop can sometimes give you a better chance to optimize your keywords for mobile searches.
Speed
Most Responsive Designs are slower than Dynamic designs or separate URLs. It doesn't have to be that way, as their are work-arounds for Responsive Design speed challenges. But fundamentally, responsive design means downloading more variations and code to the client, than a well behaved dynamic site, which means it's usually slower. Too often, lazy designers use the same images for all devices on a responsive design page, and then it's quite a bit slower.
Pagespeed is an SEO ranking factor so, it can hurt your SEO. If you choose Responsive Design, make sure you are only downloading properly optimized images for each device, and that you have highly optimized the pageload of your responsive design. Your users and your search engines will thank you for having fast pages.
Conclusion
Responsive Design doesn't have to be bad for SEO, and in many cases it is better for SEO than other options. The search engines have given us good options to have optimal SEO with any of the three major techniques for addressing device diversity, so I would't let SEO drive my architecture decision.
I'd choose separate URLs, Dynamic Server Adaption, Responsive Design Client Adaption, or mixes of the last two (Responsive Design with Server Side Components or RESS) based on my user base, the tasks my users are going to want to complete on each device, and my development resources, rather than any concerns over SEO.
All the best.
-Jason "Retailgeek" Goldberg
-
Steve
First, I stumbled onto this discussion and my mouth fell open as I gurgled out ... What the....
So, I then read the good answers from Thomas and Daniel and felt a twinge of relief. Here is what I suggest when you hear something like that: First ask the question It was your site that fell in rankings or someone elses? If they say someone elses, ask if they personally saw the rankings drop post implementation of the new design. If theirs, ask the same pointed questions if you were trying to help someone determine what the problem is.
Now, once you ascertain (and I am willing to bet over 90% fall into this group) that they never personally saw the data, you have answer one: Somebody said that somebody said. OK, not great SEO work. But, if they say it is theirs or they got to dig through, ask this How did it affect the rankings and how did you determine that was the cause? Now you are getting into some serious SEO detective mojo! That's where we find the real answers.Great question Steve!!
Good job Thomas and Daniel, Thanks for keeping the world clean!
Robert
PS - we build a lot of sites and 80% plus are responsive. We have see NO drop in rankings that could be attributable to a responsive design. BTW our site and several of our large firm owned sites are fully responsive and rocking cool. They are fine.
-
Hi Steve,
I think you should rephrase the question...
How can a responsive design harm SEO?
Typically a responsive design is driven by either USER AGENT or screen size... Both of these, if implemented correctly will not affect the way the Google Bot crawls the site. I would doubt there will be issues with 404's as the URL will be the same regardless of the device.
I would suggest it is poor implementation of the design.
Hope this helps!
Dan
-
The re-ordering of content on a page could give the page different emphasis. You would have to take a look at the page as a Google bot, to determine if the responsive theme displays the content differently. This could even go as far as throwing up links that should be navigational as content. What does or doesn't fall between a
and
makes a difference.
For the most part, I wouldn't expect a properly designed responsive site to change your SEO.
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
-
Confirm responsive design is accessible to crawlers?
Trying to ensure crawlers can access all important info on a new responsive website, but it's javascript-heavy. Following Google's advice/best practices, but can't get the Fetch and Render tool to confirm it's working. Anyone dealt with this before? Also posted in Product Forums with more detail: https://productforums.google.com/forum/#!msg/webmasters/PjxtBYClupw/56id80FUQdMJ
Web Design | | BoxerPropertyHouston0 -
Best way to indicate multiple Lang/Locales for a site in the sitemap
So here is a question that may be obvious but wondering if there is some nuance here that I may be missing. Question: Consider an ecommerce site that has multiple sites around the world but are all variations of the same thing just in different languages. Now lets say some of these exist on just a normal .com page while others exist on different ccTLD's. When you build out the XML Sitemap for these sites, especially the ones on the other ccTLD's, we want to ensure that using <loc>http://www.example.co.uk/en_GB/"</loc> <xhtml:link<br>rel="alternate"
Web Design | | DRSearchEngOpt
hreflang="en-AU"
href="http://www.example.com.AU/en_AU/"
/>
<xhtml:link<br>rel="alternate"
hreflang="en-NZ"
href="http://www.example.co.NZ/en_NZ/"
/> Would be the correct way of doing this. I know I have to change this for each different ccTLD but it just looks weird when you start putting about 10-15 different language locale variations as alternate links. I guess I am just looking for a bit of re-affirmation I am doing this right.</xhtml:link<br></xhtml:link<br> Thanks!0 -
/index.php/ What is its purpose and does it hurt SEO?
Hello Moz Forum, I am still in the process of cleaning up the lack of attention to detail and betrayal set by our soon to be ex-SEO company. You can see a previous question I ask regarding betrayal SEO. I am analyzing every page on our website and i am noticing this /index.php/ in most of our URLs. We want to leave our expression engine cms and convert to wordpress. I have been reading about index.php but most of it is over my head for now. What does concern me is the "layman's" findings i am seeing through analytics. Our main domain has two URLs. one that ends in .com and the other ends in .com/index.php/ The one that ends in .com has a higher page rank than the ladder. And there are other internal pages with the same two variations. Can someone please explain to me what is /index.php/ ? what are the benefits of it? what are the cons? What will happen to my site once we move to wordpress? As always, your comments and suggestions are greatly appreciated.
Web Design | | CamiloSC0 -
Does Google penalise for alot of advertising on your site?
I look after the search side of a decorating website on which we carry a large amount of advertising from external brands as that is our business model. Do you know if we would get penalised for having too much advertising - would it be deemed to affect the user experience? Many thanks for your help on this.
Web Design | | Pday0 -
Seo and CSS media queries
Hello to all participants! I'm starting on responsive design with css media queries and I was wondering if hidding content can, in this case, can also be bad for seo? I know that hidding content is bad (eg. display: none;), but is it also like that with responsive design or does Google see it other way? If I have a news column with title, image and text for 1024px and hide the text and image leaving just the title for 768px, or smaller, will Google consider this black hat and will it be bad for seo? are there any articles I can read about this subject, and other similar subjects? sorry for my english 🙂 thanks
Web Design | | Lusodados1 -
Should the parent directory of the main site-navigation be clickable or not?!?
Highly discussed in our team is the question: Should all parent navigation items be clickable, or only the ones that have no child menu appearing on mouse over? At Starwood Germany, we would like to adjust the main navigation for all our websites in order to improve consistency and user friendliness. At the moment, most of our websites feature both clickable non-clickable parent items, depending on whether the items have a corresponding child menu (appearing on mouse over) or not. See example here: http://www.imperialvienna.com/en Some of our team members believe it might be irritating and/or confusing for the user if some items are clickable while others are not. What do you think? Any thoughts and insights would be truly appreciated!
Web Design | | DFM_GSA0 -
Html 5 main and secondary navigation for SEO best performances
I am building a website which will have a main navigation related to the site and each link of the main navigation will have a secondary navigation. We do not want to use a megamenu style navigation. I will try to explain it with a example: Let's start with an example for a computer store "My PC Store", the Main Navigation would be: Desktop PC's Notebook & Tablets
Web Design | | netbuilder
Multimedia When clicking on the "Notebook & Tablets" the user is directed to the page domain.com/notebook-tablet.html and on this page the secondary navigation appears: Laptop Netbook Tablets / iPad I am confused on how I should organize the semantic navigation for best SEO performances and I need advice / suggestions. I thought about 2 different ways to do it but which one is more appropriate in terms of SEO? PROPOSITION A Home Page: <header> My PC Store <nav> Desktop PC's Notebook & Tablets Multimedia </nav> </header> Sub-Page (Notebook & Tablets): <nav>(or <aside>?) Desktop PC's Notebook & Tablets Multimedia </aside> </nav> <header> Notebook & Tablets <nav> Laptop Netbook Tablets / iPad </nav> </header> As you notice on the home page the Main Site Navigation is included in the <header>while it is not in the sub-pages. PROPOSITION B Home Page: <header> My PC Store <nav> Desktop PC's Notebook & Tablets Multimedia </nav> </header> Sub-Page (Notebook & Tablets): <header> Notebook & Tablets <nav> Desktop PC's Notebook & Tablets Multimedia </nav> # Notebook & Tablets * Laptop Netbook Tablets / iPad </header> The main navgation remains always in the <header>(home page / sub-pages) of all page. I need suggestions... How would you guys organize the nav ? </header> </header>0 -
What can this charity site do to improve SEO?
Hello wise ones, We have been working with the charity Volunteers of America to create a new site for their car donation program at carshelpingpeople.org They are a national charity with extensive local programs run by regional affiliates, so the site is divided into a small national section linked to Regional Affiliate sections. You get to the regional sections either by entering your zip code or clicking on your state in the bottom nav of the national pages. Right now we have developed regional sections for Michigan, Nevada, Maryland, Washington D.C., New Jersey, Delaware and the Philadelphia area. The site is about 2 1/2 months old, and while our conversion rate is pretty good (7%) our organic search ranking isn't improving as quickly as we'd like to see. Car donation is a very competitive space, and we would appreciate any advice on how to improve the SEO of the site. Thanks so much.
Web Design | | Phibnax0