Different HTML based on resolution
-
Is it acceptable in terms of SEO to display different HTML based on a users resolution size?
I feel I'm wasting space on my site catering for all the 1024 x 768ers
-
SEO Wise I don't think there's any issues, though I wonder what resolution the Googlebot reports itself as having. It's important though that you do it the way Chas Blackford states; if you have actual server side code that changes a bunch of things around based on resolution then you might get in trouble. This is an interesting article about using stylesheets to segment mobile layouts (it also mentions Media Queries which are kind smart/new phone specific):
http://www.alistapart.com/articles/return-of-the-mobile-stylesheet
There are some implementation issues, the most important of which is reliably getting the resolution from the agent. Essentially, you can't guarantee it 100% of the time. From what I've read a combination of user agent string matching and resolution detection can probably get you most of the way though.
-
Yes it's acceptable - the key is utilizing CSS and use a DOCTYPE with a DTD to present a different UX based on the device. Work with an experience coder who can structure the page template to put the content first, minimizing scripts, etc - you want to score high on the Google page speed test (https://developers.google.com/pagespeed/).
Then test across all devices you think 80% plus visitors will be using (check your Google Analytics to profile browsers, OS, devices and resolution)
BTW - Here's what Google has to say about SEOmoz (scoring an 83/100)
High priority. These suggestions represent the largest potential performance wins for the least development effort. You should address this item first:
Leverage browser caching
Medium priority. These suggestions may represent smaller wins or much more work to implement. You should address these items next:
Minimize redirects, Optimize images
Low priority. These suggestions represent the smallest wins. You should only be concerned with these items after you've handled the higher-priority ones:
Inline Small CSS, Enable compression, Defer parsing of JavaScript, Minify CSS, Specify a cache validator, Minify JavaScript, Minify HTML, Specify a character set, Optimize the order of styles and scripts, Remove query strings from static resources, Specify a Vary: Accept-Encoding header -
Hi Niall
Responsive design seems to be everywhere now and your point above seems to touch on this. From a UX perspective there really isn't a perfect design that caters for every single display and user. Google Analytics allows you to track screen resolution so I suggest that for any particular track this for a while and if there are mutliple types then think of designing to cater for it.
However even though I am in website design I tend to head for he safety of the middle ground and have not yet fully dived into the HTML5 /Responsive area yet as most customers are not demanding it.
However as the tablet and smart phone become the default device as opposed to the fun one it may become an issue.
hope this helps
Kieran
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
-
What is the best program to create an html sitemap?
I already have an xml sitemap, so I've been researching how to create an html sitemap with over 10,000 urls for an ecommerce website. Any program, paid or unpaid, just needs to be created so it looks good to put in the footer of our website.
Technical SEO | | ntsupply0 -
Will it make any difference to SEO on an ecommerce site if they use their SSL certificate (https) across every page
I know that e-commerce sites usually have SSL certificates on their payment pages. A site I have come across is using has the https: prefix to every page on their site. I'm just wondering if this will make any difference to the site in the eyes of Search Engines, and whether it could effect the rankings of the site?
Technical SEO | | Sayers1 -
How best to deal with www.home.com and www.home.com/index.html
Firstly, this is for an .asp site - and all my usual ways of fixing this (e.g. via htaccess) don't seem to work. I'm working on a site which has www.home.com and www.home.com/index.html - both URL's resolve to the same page/content. If I simply drop a rel canonical into the page, will this solve my dupe content woes? The canonical tag would then appear in both www.home.com and www.home.com/index.html cases. If the above is Ok, which version should I be going with? - or - Thanks in advance folks,
Technical SEO | | Creatomatic
James @ Creatomatic0 -
Different IP's in one Server
Hi, I just want to ask if there is no bad effect in SEO if we do have different websites that has different IP address but has shared in only 1 server? Thank you
Technical SEO | | TirewebMarketing0 -
Internet Explorer and Chrome showing different SERP's
Well the title says it all really. Same query, different browsers, same computer and different search results. I thought at first it may have differed because I was logged into my google profile on chrome but I logged out and tested and still different results. Is this normal ?
Technical SEO | | blinkybill0 -
Local SEO - ranking a page for two different cities
I have a site that ranks very well for {service}{cityA} but I want it to rank for {service}{cityB} too. My first thought is to create a separate landing page optimised for {service}{cityB}, but is there a better option? Have one page for {service} and try and get it to rank for {city A} and {cityB} by using different anchor text? Anything else?
Technical SEO | | SEOboarder0 -
Best practices for migrating an html sitemap? Or just get rid of it all together?
We are migrating a very large site to a new CMS and I'm trying to determine the best way to handle all the links (~15k) in our html sitemap. The developers don't see the purpose of using an html sitemap anymore and I have yet to come up with a good reason why we should migrate rather than just get rid of the sitemap since it is not very useful to users. The html sitemap was created about 6 years ago when page rank sculpting was a high priority. Currently, since we already have an XML sitemap, I'm not sure that there's really a need for a html sitemap, other than to maintain all the internal links. How valuable are the internal links found in an html sitemap? And will it be a problem if we remove these from our link profile? 15,000 links sounds significant, but they only account for less than .5% of our internal links. What do all you think?
Technical SEO | | BostonWright0 -
Do search engines treat 307 redirects differently from 302 redirects?
We will need to send our users to an alternate version of our homepage for a few hours for a certain event. The SEO task at hand is to minimize the chance of the special homepage getting crawled and cached in the search engines in place of our normal homepage. (This has happened in the past so the concern is not imaginary.) Among other options, 302 and 307 redirects are being discussed. IE, redirecting www.domain.com to www.domain.com/specialpage. Having used 302s and 301s in the past, I am well aware of how search engines treat them. A 302 effectively says "Hey, Google! Please get rid of the old content on www.domain.com and replace it with the content on /specialpage!" Which is exactly what we don't want. My question is: do the search engines handle 307s any differently? I am hearing that the 307 does NOT result in the content of the second page being cached with the first URL. But I don't see that in the definition below (from w3.org). Then again, why differentiate it from the 302? 307 Temporary Redirect The requested resource resides temporarily under a different URI. Since the redirection MAY be altered on occasion, the client SHOULD continue to use the Request-URI for future requests. This response is only cacheable if indicated by a Cache-Control or Expires header field. The temporary URI SHOULD be given by the Location field in the response. Unless the request method was HEAD, the entity of the response SHOULD contain a short hypertext note with a hyperlink to the new URI(s) , since many pre-HTTP/1.1 user agents do not understand the 307 status. Therefore, the note SHOULD contain the information necessary for a user to repeat the original request on the new URI. If the 307 status code is received in response to a request other than GET or HEAD, the user agent MUST NOT automatically redirect the request unless it can be confirmed by the user, since this might change the conditions under which the request was issued.
Technical SEO | | CarsProduction0