Posts Tagged ‘Techniques’

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

Keeping The Big <picture> SmallHow To Avoid Duplicate Downloads In Responsive Images

The <picture> element is a new addition to HTML5 that’s being championed by the W3C’s Responsive Images Community Group (RICG). It is intended to provide a declarative, markup-based solution to enable responsive images without the need of JavaScript libraries or complicated server-side detection.

How To Avoid Duplicate Downloads In Responsive Images

The <picture> element supports a number of different types of fallback content, but the current implementation of these fallbacks is problematic. In this article, we’ll explore how the fallbacks work, how they fail and what can be done about it.

Read more...

Brave New WorldDesigning For A Maturing Android

Android is huge: 480 million people currently use Android devices, and 1 million new devices are activated daily. This means that every three weeks, the number of people who activate new Android devices is equal to the entire population of Australia. (Recent studies by Nielsen show that more Android devices are on the market than iOS devices.)

Designing For A Maturing Android

Popular apps that become available on Android experience huge growth. For example, Instagram grew by 10 million users with the launch of its Android app — in just 10 days.

Read more...

CSS3 TransitionsThank God We Have A Specification!

This article is packed with a number of quirks and issues you should be aware of when working with CSS3 transitions. Please note that I’m not showing any workarounds or giving advice on how to circumvent the issues discussed.

Thank God We Have A Specification!

Alex MacCaw has already written a very insightful and thorough article on “All You Need to Know About CSS Transitions.” Whereas Alex wrote about achieving particular effects, I’m going to talk about the technical background, especially the JavaScript-facing side. Pitfalls — this article is all about pitfalls.

Read more...

How To Maintain Hierarchy Through Content Choreography

One of the issues we need to be concerned with in responsive design is how to maintain hierarchy as elements on the screen are resized and reflowed. Trent Walton first called attention to the issue with his post “Content Choreography,” which showed how visual hierarchy gets lost when columns are dropped below one another.

Maintaining Hierarchy Through Content Choreography

While techniques exist to help with part of the problem, the solution also requires conscious thought in how you structure blocks of content in your HTML. You need to think about how you’ll want to rearrange blocks of content as your design moves from single to multiple columns.

Read more...

Overview And ExamplesHow To Benefit From CSS Generated Content And Counters

Generated content was first introduced in the CSS2 specification. For several years, the feature was used by relatively few Web authors due to inconsistent browser support.

How To Benefit From CSS Generated Content And Counters

With the release of Internet Explorer 8 in 2009, generated content was rediscovered, and many interesting implementations were adopted for the first time. In this article, we’ll discuss some possible uses of generated content.

Read more...

A Collaborative Lean UX Research Tool

Liverpool FC fans sing “You’ll Never Walk Alone” to their players during matches. UX research is best done when a team is involved. When you run UX research on your own without active observers, you are missing its point.

The Rainbow Spreadsheet: A Collaborative Lean UX Research Tool

This article describes and gives you a tool I created called the Rainbow Spreadsheet. With it, you will be able to collaboratively observe UX research sessions with team members (or clients). You will be able to conduct research that involves the entire product team, with results that are turned around quickly and that team members will be committed to acting on.

Read more...

Case StudyImprove Mobile Support With Server-Side-Enhanced Responsive Design

In many ways, responsive Web design deserves a big share of the honor for making the Web more usable on non-desktop devices. This trend of letting the browser determine more about how a Web page should be displayed makes sense, especially now that mobile browsers are slightly more trustworthy than in the old days of mobile.

Improve Mobile Support With Server-Side-Enhanced Responsive Design

However, a responsive website is not automatically a mobile-friendly website. Amid the buzz of trendy Web development techniques, the good ol’ Web server doesn’t get the spotlight it deserves. Modern Web development should be about finding the right balance between server-side and client-side implementation.

Read more...

↑ Back to top