Tried again with Chrome (was using FF before) (also I went to walmart.com and got redirected)
What browser are you guys using on Android?
What browser are you guys using on Android?
If you doubted the importance of responsive/adaptive mobile friendly websites...
- Thread starter Fatbat
- Start date
I was using firefox, but now I am using chrome. I was getting served some desktop versions of sites on firefox, where I am not on chrome.
Walmart is a classic example of why detecting user agents is flawed.
I tested it in chrome dev tools and it fails on some user agents while works on others.
If some one is going to go this route with their site, I would suggest using something like https://51degrees.com/products/device-detection.
It has nice features built into it (depending on language) like auto detection and redirection to a mobile version.
Personally I would just make the site responsive to screen size, but thats just me.
But in the end the message is clear, and its not just coming from google, if a site has bad response times, doesn't use SSL and doesn't support mobile then you're SOL.
I tested it in chrome dev tools and it fails on some user agents while works on others.
If some one is going to go this route with their site, I would suggest using something like https://51degrees.com/products/device-detection.
It has nice features built into it (depending on language) like auto detection and redirection to a mobile version.
Personally I would just make the site responsive to screen size, but thats just me.
But in the end the message is clear, and its not just coming from google, if a site has bad response times, doesn't use SSL and doesn't support mobile then you're SOL.
Hence the need to fix the website for mobile users. I use a smartphone almost every time for browsing. I just use laptop or desktop if I need to read a website with the really small prints.
So far so good. I can sort of see the appeal. I have managed to move all of my not work browsing to mobile. Chats and messaging too. Going to try this out for the next month or so.
Not sure what phone you have, but for me I rarely have issues with small print on my phone, in general mobile browser adapt text if it thinks it's too small. My phone has a 1080p screen and it's pretty impressive how small text can be before realising it's actually tiny, the detail on a full HD screen is crazy.
I got my first smartphone for Christmas, and it really woke me up to how shitty a lot of sites look on mobile. Before that everything looked shitty on mobile because my phone was from like fucking 2002.
Actually you're one of those who supported me when I joined WF and started banging on about it. There were a few others too of course.
Well let me be one of those in support of responsive web > native app shift that's coming in 2015.
But with the example of Walmart above, doesn't that mean it's best to have two versions of your site -- one desktop and one mobile?
Or how about say if you're a bank? On your site is tons of menus & features, from branch locator, to descriptions for personal / business / investing, credit card comparisons, etc. There's no way you're fitting all that onto a phone, so wouldn't it be best to have a separate mobile site, so users can easily login to check their account balance with their phone, etc.?
What am I missing here? RWD can only take you so far, before you're forced to create a separate mobile version of your site, correct? Or am I wrong?
Or how about say if you're a bank? On your site is tons of menus & features, from branch locator, to descriptions for personal / business / investing, credit card comparisons, etc. There's no way you're fitting all that onto a phone, so wouldn't it be best to have a separate mobile site, so users can easily login to check their account balance with their phone, etc.?
What am I missing here? RWD can only take you so far, before you're forced to create a separate mobile version of your site, correct? Or am I wrong?
Yep, you're wrong. Do you really want to maintain two versions of your sites? Or just one version that works on all devices? You can make RWD do anything you want it to. Look at Bank of Montreal's website for example... Personal banking | BMO Bank of Montreal Perfect example of what you're talking about and it works great. Load it up in your browser and check it out. It works exactly the same on mobile as it does on desktop, in one single version.
As pointed out earlier, Walmart is not a good example.
This is a pretty good gallery site of RWD sites Media Queries As with anything, some are better than others, but it's quite an extensive collection that you can look through to see various techniques do deal with different UI elements.
I hate to start a speculation war, but I thought I would ask since I'm curious.
Does anyone have experience with RWD and Google in relation to hiding or showing elements based screen size?
For example;
I'm currently building a RWD site but some of the text on the page is being hidden or shown depending on the size of the screen.
I have links to other site's social media profiles (facebook, twitter, etc) which on desktop are shown as actual URLs but on smaller screen sizes they are hidden and replaced with the word 'View'.
I know I could replace the url in the element for larger screen sizes with the same text, which would improve consistency and remove some redundancy, but I know there will still be times where different text based on size is unavoidable.
I assume that it probably wouldn't matter all that much since Google is smart enough to realize that the site is responding to the screen size.
But then I have this niggling thought in the back of my head that when Google (Google bots not manual review) looks at the site, they will see a difference in what text is being shown, and that might cause problems.
I'm not sure it matters in the end, but I'm curious to know peoples thoughts or experience.
Side Note: Matt Cutts said RWD is A-Ok but then he says a lot of shit and wasn't talking about hiding elements.
Does anyone have experience with RWD and Google in relation to hiding or showing elements based screen size?
For example;
I'm currently building a RWD site but some of the text on the page is being hidden or shown depending on the size of the screen.
I have links to other site's social media profiles (facebook, twitter, etc) which on desktop are shown as actual URLs but on smaller screen sizes they are hidden and replaced with the word 'View'.
Code:
<a href="http://fb.com/blahblah" class="hidden-xs">http://fb.com/blahblah</a>
<a href="http://fb.com/blahblah" class="visible-xs">View</a>I know I could replace the url in the element for larger screen sizes with the same text, which would improve consistency and remove some redundancy, but I know there will still be times where different text based on size is unavoidable.
I assume that it probably wouldn't matter all that much since Google is smart enough to realize that the site is responding to the screen size.
But then I have this niggling thought in the back of my head that when Google (Google bots not manual review) looks at the site, they will see a difference in what text is being shown, and that might cause problems.
I'm not sure it matters in the end, but I'm curious to know peoples thoughts or experience.
Side Note: Matt Cutts said RWD is A-Ok but then he says a lot of shit and wasn't talking about hiding elements.
Google still has to be lax on the rules of correctly coded responsive website because some basic issues regarding the detection of a mobile user and serving different content for different devices still exist.
You can find more insight on:
https://productforums.google.com/forum/#!topic/webmasters/gJOHX1GbKms
Especially from ets:
On the specific question (#1) about cloaking, let me give you the most official answer I've seen. JohnMu from Google has previously given this advice:
"Suppressing some content (provided the primary content is still visible) is fine for mobile versions of your site. You could do that in a variety of ways".
If you want more drastic differences between desktop and mobile content than you can comfortably manage without risking cloaking, I'd agree with Boltsabre (who has given you great advice - as always): use dynamic serving and a Vary header (if possible) to signal that's what you're doing.
Looking at your specific example, I wouldn't like to say on which side of the line this example might fall. I think I'd do that with dynamic serving because the content differences between the mobile and desktop versions of the page look like they might be quite substantial.
I completely agree that the advocates of responsive design often prioritize the ease of maintenance and development over user experience - and user-experience is often better served by dynamic serving. Responsive design essentially gives the same website to all users, merely reformatted for the device. And desktop sites made to work like mobile sites with mobile navigation (purely for the developer's convenience) often give a terrible user experience. Mobile users don't merely use different-sized devices: they also work on different speeds of connection in different environments (e.g. standing at a bus stop in the rain compared to sitting at a desk) and they may be demographically different people. So I agree that dynamic serving often makes much better sense. And both dynamic serving and responsive are superior in SEO terms to separate URLs, though separate URLs can produce a better user experience.
It's true that Google recommends responsive design, but do what you think is best for your user. That always trumps what it says in the guidelines. Google's number one guideline is do what's best for the user
Also consider this practice on your future sites:
Home - schema.org
Some other issues regarding the image size are tackled here:
wordpress - Is there a good practice for serving images to mobile and HIDPI/retina devices yet? - Stack Overflow
The warning go to blogger sites as well, so strange !
To be Mobile Friendly i have to change my site design, can i ignore that ?
And how fast will new mobile device to add functions and features to facilitate browsing non-mobile friendly webpages? If it is fast, then this issue is just a short term basis.
To be Mobile Friendly i have to change my site design, can i ignore that ?
And how fast will new mobile device to add functions and features to facilitate browsing non-mobile friendly webpages? If it is fast, then this issue is just a short term basis.
Is using one site for mobile and desktop really the best answer if you're running an offer that takes credit card payments? Sales funnels for desktop and mobile e-commerce should be designed differently in a lot of cases, which is a case against one unified design.
"One unified design" isn't always the best answer. But paying a web developer, an iOS developer, and an Android developer is probably a worse solution than paying your web developer to design more explicitly.
I'm not sure if you're talking about multi-form checkouts or use cases where you might require different form inputs based on device (i.e. wanting to require additional business information for desktop, but wanting to be short and to the point on mobile), but in both cases you should be able to achieve what you're after without sacrificing performance with the technology that's available now.
There are many Javascript frameworks that have changed the game in this area, now allowing developers to easily mimic the look and feel of native mobile apps while meaningfully removing/adding DOM elements, unlike basic CSS framework's show/hide helpers.
There are certainly still use cases where you would want a native application instead of using a JS or responsive framework, but I have a hard time thinking of a situation where even a complex checkout cart would warrant the additional cost.
To further clarify: Sometimes split test results for a credit card page design for desktop that increase conversions for desktop would be decrease conversion rates if applied to mobile and vice versa.