I’ve been building a mobile version of a new site I have, everything’s going ok so far.
Just wondering, once the smart phone is detected and the mobile.css kicks in, how do I give the user the option to revert back to the main site desktop.css
<link rel=“stylesheet” href=“css/desktop.css”>
/* Smartphones (portrait and landscape) ----------- */ @media only screen
and (min-width : 320px)
and (max-width : 480px) {
Sometimes the user, including myself wants to see the full site and not the mobile version.
Is it possible to switch between the two via a standard link?
At present I’m using CSS media queries and just hiding (display:none) to the elements I don’t need for desktop.
Quite happy with the way things look in portrait & landscape, for now I think the JS solution might work best.
Do you have a resource for the correct JS to use?
What do you use yourself? Server-side? Different sites? What about SEO?
Though I must admit, sometimes sites just seem better without changing anything for mobile, my main reason for this choice.
I only do simple sites, but I prefer the idea of having one site that displays differently for different devices (or displays the same … The way you can double to to zoon in on an iPhone makes me question the usefulness of responsive design).
However, I also feel that most sites are full of a lot of junk that shouldn’t appear on mobile or desktop. If content is stripped down to what’s really needed, I don’t see why content can’t be easily accessible on any device. The notion that you have to have separate sites—that mobile users want something different—doesn’t stack up for me. I still feel that a well designed site can offer what everyone needs.
Don’t fall into the trap of just setting superfluous content to display: none on mobile devices. That means they don’t see it but still download it—an untenable scenario. If you have to hide it, it probably shouldn’t be there in the first place. Eventually we’ll have to break away from the current web design conventions, which are rooted in the old world of print design.
having one site that displays differently for different devices
Absolutely, the way like things to be done myself, what I’m aiming towards… good responsive design, no?
I also feel that most sites are full of a lot of junk that shouldn’t appear on mobile or desktop.
Yes, lots of my sites are mainly content heavy, I think this is due to my SEO background but don’t mind using images here and there for a better feel to your site.
If you have to hide it, it probably shouldn’t be there in the first place.
Also agree, but on a desktop layout its always nice to have a welcoming introduction header, depending on the site of cause and some quick links in the side, amongst other things. The type of stuff that won’t cause much download time for the mobile user.
This is a big subject Ralph and been reading lots of discussions about where all this mobile is heading.
How I see it, clients want mobile sites, users want less clicks and fast information and others just want to browse on their phone.
Appreciate the feedback as I’m still new/learning about smartphone design.
And did you have any JS references to hand?
Yes, there is a lot of debate about it all, and no one’s totally right or wrong, I suspect. It depends a lot on the site and its needs. I use a few apps that are totally different from the desktop site (like my favorite news site) but I often wish the desktop site did things like the app.
There is also growing evidence that mobile browsing is less and less about ‘info on the go’.
Anyhow, I have no idea if these links are relevant to the issue, but a few style switching links I have are:
