Posts Tagged ‘Responsive Design’

We are pleased to present below all posts tagged with ‘Responsive Design’.

Developing Responsive Designs With Opera Mobile Emulator

Back in 2009, when coding version 10 of Opera Mobile, my Opera colleagues decided to tune the Opera Mobile build machine so that it would churn out builds not only for common mobile platforms, but for Windows and Linux as well. Originally intended for quality assurance and testing, these desktop builds proved also to be useful for Web development; being able to use Opera Mobile on a desktop machine took away the need to do all testing on a phone, and the mobile browser window was suddenly only an Alt/Command + Tab away from our text editor — exciting!

Two Opera Mobile instances

So, we decided to iron out the wrinkly bits, added a Mac build channel, and turned it into a publicly available developer tool, called Opera Mobile Emulator. Coming in at a fairly small size, Opera Mobile Emulator can be downloaded for free from Opera’s developer website or from the Mac App Store, and installing it is straightforward. The engine and UI are exactly the same as when you run Opera Mobile on a phone, while desktop-specific hooks, such as the profile selector, keyboard shortcuts and command-line flags, give you a bit of extra debugging power.

Read more...

Presidential Smackdown EditionSeparate Mobile Website Vs. Responsive Website

The US presidential race is heading into full swing, which means we’ll soon see the candidates intensely debate the country’s hot-button issues. While the candidates are busy battling it out, the Web design world is entrenched in its own debate about how to address the mobile Web: creating separate mobile websites versus creating responsive websites.

Separate Mobile Website Vs. Responsive Website: Presidential Smackdown Edition

It just so happens that the two US presidential candidates have chosen different mobile strategies for their official websites. In the red corner is Republican candidate Mitt Romney’s dedicated mobile website, and in the blue corner is incumbent Barack Obama’s responsive website.

Read more...

Defining Your Mobile StrategyDo Mobile And Desktop Interfaces Belong Together?

The term “responsive design” has gathered a lot of well-deserved buzz among Web designers. As you probably know, it refers to an easy way to dynamically customize interfaces for different devices and to serve them all from the same website, with no need for a separate mobile domain.

Do Mobile And Desktop Interfaces Belong Together?

It solves one major problem, and very elegantly: how to adapt visual interfaces for mobile, tablet and desktop browsers. But when unifying a website, you have to solve problems other than how it will appear in different browsers, which could make the task much more difficult than you first realize.

Read more...

Do Mobile And Desktop Interfaces Belong Together?

The term “responsive design” has gathered a lot of well-deserved buzz among Web designers. As you probably know, it refers to an easy way to dynamically customize interfaces for different devices and to serve them all from the same website, with no need for a separate mobile domain.

Do Mobile And Desktop Interfaces Belong Together?

It solves one major problem, and very elegantly: how to adapt visual interfaces for mobile, tablet and desktop browsers. But when unifying a website, you have to solve problems other than how it will appear in different browsers, which could make the task much more difficult than you first realize.

Read more...

Responsive Menus: Enhancing Navigation On Mobile Websites

Most of us are pretty familiar with responsive Web design by now. Basically, it uses a combination of a fluid layout and media queries to alter the design and layout of a website to fit different screen sizes. There are other considerations, too. For example, a lot of work has been done on responsive images, ensuring not only that images fit in a small-screen layout, but that the files downloaded to mobile devices are smaller, too.

Responsive Menus: Enhancing Navigation On Mobile Websites

But mobile design isn’t just about layout and speed: it’s also about user experience. In this article, we’ll focus on one aspect of the user experience — navigation menus — and detail a few approaches to making them work better on mobile devices.

Read more...

Responsive Images With WordPress’ Featured Images

It’s been a couple of years now since the concept of responsive design took the Web design world by storm, and more and more websites are going responsive. But there are still some barriers and potential problems, not the least of these being the challenge of reducing the size of files that you’re sending to mobile devices.

WordPress Featured Images

In this article, we’ll look at how to use WordPress' built-in featured images capability to deliver different-sized image files to different devices. "Featured images," sometimes referred to as thumbnails, is a feature of WordPress that has been vastly improved since version 3.

Read more...

Creating Mobile-Optimized Websites Using WordPress

“Mobile Web design.” Unless you’ve been hiding under a bush for the last 18 months, you’ll know that it’s one of the hottest topics in the industry at the moment. Barely a week goes by without new tips being unveiled to help us hone our skills in making websites work as well — and as fast — as possible on mobile devices.

Why We Shouldn't Make Separate Mobile Websites

Here are four ways to make your WordPress blog or website mobile-friendly, ranging from the quick and dirty to the complex but potentially very beautiful. As well as outlining the pros and cons of these methods, we’ll include information on plugins that will help without actually doing all the work for you, and we’ll provide some code that you can use for a responsive design.

Read more...

↑ Back to top