Visua v4 [mobile first]

An even more responsive experience.

Staying on top of the fast evolving world of web design is a tricky business, luckily it’s also quite enjoyable! I’m proud to finally unveil my mobile-first & responsive theme to the world.

iPhone iPad Visua Design v4

Visua v4

So what is all this ‘mobile-first’ I’ve been talking about? If you’re interested in web design and development it’s as unavoidable as responsive design at the moment, but if you’re an outsider let me break it down for you.

Since the web took off we’ve been building websites in the same manner, in that they had to be designed within a certain amount of pixels, tailored for old desktop monitors and laptops. But since the release of the iPhone and iPad, mobile usage has exploded to a point where it now rivals traditional computers, for example people don’t wait to get home to check their social media updates when they have an app or web-app on their mobile. This led to a wave of websites that optimised their layouts for these devices using modern web techniques.

The problem was that a lot of the design & content wasn’t well thought through, resulting in bad user experiences, for example elements such as sidebars were simply being hidden if they didn’t fit the new transformed layout. It also meant that large images we’re unnecessarily being downloaded then hidden, this is where the mobile-first philosophy shines through.

If you design and build a site for mobile first, you are only putting in what’s necessary. Then as a device’s resolution increases it downloads the larger images and adapts the layout for better viewing. The average user on their desktop is blissfully unaware of the magic behind the scenes, but mobile/tablet users get a faster, more tailored experience. This also allows us to create an almost web-app like environment where only the essentials are being shown, styled nicely, stripped of unnecessary elements.

I’ve released this theme in it’s current state as a work in progress, I’ll slowly be polishing it as time goes on. Internet Explorer users are not going to have a good time on this site due to the browsers lack of support for Media Queries or anything useful, and my lack of care for it. (Now updated and working perfectly in IE8).

I’m hoping in the near future to polish the back-end for this WordPress theme and release it into the wild either for free or for sale with any profits going to worthy causes. Let me know what you think guys, all feedback is welcomed and embraced!

For a much more in-depth look at mobile-first and responsive web design please read these posts by the guys who created these radical new ways of thinking, Ethan Marcotte and Luke Wroblewski.