What's your preferred method for creating a mobile website?

JosephDuffy

JosephDuffy

JosephDuffy

Associate
Joined
21 Jan 2011
Posts
52
Hi everyone
I'm currently in the process of designing my current project, which will be a website that will be used by both mobile and desktop users.
I'm trying to find ways of making the website mobile-friendly. I found this article, which I think sums up most of the options pretty well, but I thought I'd ask here as well.
I'm currently swaying towards the approach B from that article, but I feel that some aspects might not work that well (I might have to display: none; one or two things).
So, what's your opinion?
 
I'd use responsive design, which is approach B. Nothing wrong with using display: none on items; so the user is loading some things they won't see, they won't know, and if the site is loading appropriately on the desktop then it's fine for a mobile connection.

Check out smashing's articles on responsive design.
 
Ultimately, it depends on the type of website.

As said, responsive design ['Approach B'] is the best solution for most sites: brochure/portfolio sites, blogs, news sites.

However, task-complex sites - full e-commerce stores, web apps - are more likely to require a dedicated mobile site in order to deliver an effective user experience. The only way to truly tell is to do thorough investigation.

"display: none"s should be used sparingly, as they effectively waste bandwidth on bandwidth-starved mobile devices. But I'd be a hypocrit if I didn't confess to employing this technique on occasion.

If you're considering using lots of these to optimise the flow of content across devices, you may want to consider using content choreography instead.

Oh, and design your mobile version first. It's a great exercise in determining which bits of your site are *really* important :)
 
Last edited:
Couldn't agree more with simisker.

The mobile first approach will allow you to put complete focus on what content is most important so you'll end up with a much better desktop site as a nice side effect. The article by Jordan Moore is definitely worth a read too, I'm planning on using this approach on a project soon.

Good luck with it and have fun as building Responsive sites is fun :)
 
A great example of of a Mobile first design can be seen on one of websites I've recently been involved with (I did the back-end technical build), http://www.rolls-roycemotorcars.com. Site is designed for Mobile -> Tablet (iPad) -> Desktop, based on the width of the screen.

You can see this in action by simply resizing your browser window!
 
mp3duck said:
Our company didn't do the design. Just the build!

although, I don't think the design is poor.
Click to expand...
Wasn't having a dig at you, m'duck :) The aesthetics of the site are fine - refined, seemingly effortless, as you'd expect for RR - but there's been very little concession to a mobile user experience [big tappable buttons/links, an easily-reachable navigation system etc], which makes me think that it probably wasn't designed mobile-first.
 
Last edited:
analog said:
Does anyone have a preferred responsive framework?

I'm currently starting a site using The Goldielocks Approach
Click to expand...

Have a wee look at what I've created for my Major Project at Uni :) http://responsify.it
It will allow you to create a starting point for a Responsive site, based off a fluid grid.


But the Goldilocks Approach is also a good option, the guys from Front did a great job with it.
 
simisker said:
Wasn't having a dig at you, m'duck :) The aesthetics of the site are fine - refined, seemingly effortless, as you'd expect for RR - but there's been very little concession to a mobile user experience [big tappable buttons/links, an easily-reachable navigation system etc], which makes me think that it probably wasn't designed mobile-first.
Click to expand...

Agreed, they've somehow adopted a responsive approach and still got horizontal scrolling.. :eek:
 
You must log in or register to reply here.
Back
Top Bottom