Author: Jon Raasch
Twitter: Follow Jon Raasch on Twitter
You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.
In the early days of mobile, debugging was quite a challenge. Sure, you could get ahold of a device and perform a quick visual assessment, but what would you do after discovering a bug?
With a distinct lack of debugging tools, developers turned to a variety of hacks. In general, these hacks were an attempt to recreate a given issue in a desktop browser and then debug with Chrome Developer Tools or a similar desktop toolkit. For instance, a developer might shrink the size of the desktop browser’s window to test a responsive website or alter the user agent to spoof a particular mobile device.Read more...
Besides learning how to accomplish these specific tasks, you'll also master a variety of useful CSS and jQuery tricks that you can leverage when creating your own interactive techniques. The solutions presented here are certainly not perfect, so any thoughts, ideas and suggestions on how you would solve these design problems would be very appreciated.Read more...
Over the past few years, mobile web usage has considerably increased to the point that web developers and designers can no longer afford to ignore it. In wealthy countries, the shift is being fueled by faster mobile broadband connections and cheaper data service. However, a large increase has also been seen in developing nations where people have skipped over buying PCs and gone straight to mobile.
Unfortunately, the mobile arena introduces a layer of complexity that can be difficult for developers to accommodate. Mobile development is more than cross-browser, it should be cross-platform. The vast number of mobile devices makes thorough testing a practical impossibility, leaving developers nostalgic for the days when they only had to support legacy browsers.Read more...
Interactivity can transform a dull static website into a dynamic tool that not only delights users but conveys information more effectively. In this post, we'll walk through five different coding techniques that can be easily implemented on any website to provide a richer user experience. These techniques will allow you to better display difficult content, help users find information more effectively and provide meaningful UI cues without overwhelming the user: on-page text search, drag controls for oversized content, subtle hover effects, comment count bars and a full-page slider.
Websites often have search boxes to allow users to find content from their archives. But what if you want to find content on the given page? Information Architects
has had on-page text search that provides a great user experience. Let's recreate this using jQuery.
jQuery plug-ins provide an excellent way to save time and streamline development, allowing programmers to avoid having to build every component from scratch. But plug-ins are also a wild card that introduce an element of uncertainty into any code base. A good plug-in saves countless development hours; a bad plug-in leads to bug fixes that take longer than actually building the component from scratch.
Fortunately, one usually has a number of different plug-ins to choose from. But even if you have only one, figure out whether it's worth using at all. The last thing you want to do is introduce bad code into your code base. The first step is to figure out whether you even need a plug-in. If you don’t, you’ll save yourself both file size and time.Read more...