Responsive grid that enlarges images

Responsive Zoom Grid

I recently had a website design to implement that had a grid of images on the homepage. Normally I’d use something like Masonry for that, but in this instance I needed a custom solution. The grids were based on 356px squares. Some images were square, some were rectangular, taking up two squares horizontally, and one was […]

Read article

Scaling Text

One of the challenges posed in modern web development is dynamic text sizing. Images can be set to “auto” or “100%”, but text doesn’t work that way. It is sized relative to its base size rather than its container. How can it be scaled?

Read article

Making a Custom Icon Font for Your Website

Reducing server calls for image resources will speed up your page load and enhance performance. A great way to do this is to replace sprited icons with mobile-friendly custom fonts.

Read article

GitHub Octocat Ninja

10 CSS Pro Tips

There are lots of resources for cool CSS implementations, like animating elements and applying complex effects, but often it’s the little things that are the most useful. Those aren’t flashy enough to get mentioned in books and articles. They are the finesse techniques that experienced developers use to make their work more elegant and their workdays shorter. Here […]

Read article

Mobile toolbox

Mobile Toolkit: Off-canvas Sliders

On a mobile website I recently built I had two sliders. The first was the main navigation menu, and the second was a product filter. They used similar CSS techniques and had to be coordinated with each other, as they both occupied the same off-canvas area to the left of the visible content. The Off-canvas […]

Read article

Big vs little

Lightweight Mobile-friendly Slider

On a mobile device, every byte counts. That’s why I decided to roll my own slider for a mobile site I built recently. My version is well under 2k. I can get this savings because I’m only building one slider with one action for one website. I’m not trying to write a plugin that does everything for everyone.

Read article

Ups, Downs, and Highlights

Recently I developed an incrementor/decrementor for a quantity input field. Key stakeholders were uncomfortable with the small size at which Mac OS rendered the HTML version, and asked for a custom solution.

Read article

Lessons from Failed Projects

Spend enough time in IT and you’ll see plenty of failed dev projects. Although there is a huge amount of wisdom to be gained from a failed project, I have never seen that benefit reaped by an organization. That’s really unfortunate, but it could easily be avoided. I want to begin by talking about how an organization identifies a failed […]

Read article

Progressive Degradation

By now you’ve probably heard designers throwing around the terms “progressive enhancement” and “graceful degradation” when discussing their web designs. I’ve come to realize that most designers and even some developers are misusing these terms. They are using them as excuses for designs that never tried to be universally accessible. I’ve begun to call this […]

Read article

The Cost of Bad Design

We’ve all seen what we would call bad design on the web, and we usually base this judgement on our personal aesthetic preferences. I have a new definition of bad web design that goes beneath the surface: If your “web design” doesn’t actually work on the web you’ve failed.

Read article

Loyalty and Luxury

A few days ago a friend and marketing guru tweeted a question about whether luxury brands should employ loyalty programs. I think it’s a great question well worth considering. Luxury brands are certainly challenged in this economy, but deciding if, or how to design a loyalty program is a question of weighing short-term revenue needs […]

Read article

A little Sales semantics

In the business 2.0 world we have recognized that keys to success include words like trust, value, engagement and integrity. We have learned that the old “push” model is not effective in today’s world of the empowered customer.  Yet language artifacts of outdated business models persist.  As a business development professional the single word I […]

Read article