Adventures in Interface Development

  • SVG Spriting

    SVG Spriting

    SVG sprites offer the same efficiencies as PNG sprites, but they can be trickier to implement because of their innate scalability.

  • Creating Social Icons from Glyphs

    Creating Social Icons from Glyphs

    Even though using font glyphs for social icons allows only one color, complex color can be added with background gradients in a CSS-styled structure around the glyph.

  • Making a Custom Icon Font for Your Website

    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.


  • Responsive Interactive Map

    Image maps won’t work in a responsive layout and Flash won’t work on mobile. If you want a responsive graphic with shaped hotspots and rollover effects you need SVG.

  • Accessible Custom Checkbox

    In an earlier post I explored custom styling of form selects. In this article I discuss how to make accessible custom checkboxes to match your interface styling. The same technique can be used for radios.

  • 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…