Handy tool/methodology to decide if you should make a responsive site, or build a separate mdot-site. Review the tasks that users want to perform on Device A. List them in priority order. Repeat for Device B. Put the two lists next to each other, and draw lines connecting identical tasks. Depending on the steepness of …
Tag Archives: responsive web design
Boring
We’re not ‘appy. Not ‘appy at all.
The British Government Digital Service (a new team within Cabinet Office, which in its turn supports the Prime Minister and Deputy Prime Minister) is totally getting it: Stand-alone mobile apps will only be considered once the core web service works well on mobile devices, and if specifically agreed with the Cabinet Office. Above that: Apps …
Responsive Struggle
Photo by Marc Thiele Once you overcome that initial struggle of adapting to a new process, designing and building responsive sites needn’t take any longer, or cost any more money. The real obstacle is designers and developers being set in their ways. I know this because I was one of those people, and to those …
Responsive Typography using Face Detection
Typesetting based upon your distance to your screen. Clever use of WebRTC’s getUserMedia and JavaScript Face Detection In case you don’t have a capable browser, this is what it looks like: Responsive Typography: Breakpoints Demo → Responsive Typography: Realtime Demo → (via Jeremy) Related: headtrackr →
Do responsive websites outperform their non-mobile-optimized brethren?
We took a popular ecommerce store (O’Neill Clothing) that we’d recently redesigned and monitored conversions, transactions and revenue for three weeks. Then we quietly deployed the responsive conditions to the already live site and monitored for another three weeks. In case you ever need present some numbers to one of your colleagues in order to …
Continue reading “Do responsive websites outperform their non-mobile-optimized brethren?”
Implementing Off-Canvas Navigation For A Responsive Website
Not only a good example on how to do it, but also an example on how to do it right: enhance progressively, don’t over-rely on jQuery, and trick your browser into using hardware acceleration where possible Implementing Off-Canvas Navigation For A Responsive Website → Not convinced or 100% about hardware acceleration? Be sure to watch …
Continue reading “Implementing Off-Canvas Navigation For A Responsive Website”
jResize
jResize is a responsive web development tool, built in jQuery to assist the workflow of developers on responsive projects. There are various tools for responsive development, iframes at different widths embedded in the page, and the tedious resizing of the browser. So here’s a different approach which grabs all your HTML, and resizes it inside …
Gamma Gallery: A Responsive Image Gallery
Gamma Gallery is an experimental responsive image gallery that attempts to provide an adjustable responsive images approach taking its grid layout and the full slideshow view into account. Both the grid and lightbox are responsive. Gamma Gallery: A Responsive Image Gallery Experiment → Gamma Gallery Demo →
Remote Preview
Remote preview is a tiny JavaScript based tool which I built for our test lab. It allows you to preview any URL on large number of mobile devices simultaneously. Just enter a URL, hit Cmd+S, and new URL gets automatically loaded on each device. Remote preview works on platforms like Android, Blackberry, iOS, Maemo, Meego, …