CategoryTechniques

September 19, 2013 — In 2010, Microsoft shifted its focus from propriety Web technology to open Web technology. This refocus materialized a few years later — in Internet Explorer, the Windows operating system, its developer tools and its cloud software and things have changed for the better so far. Across the board, Web developers should see significant improvements, making Windows an HTML5-friendly platform. Read more…

September 17, 2013 — This article scratches the surface of the Three.js library. Once you are comfortable with the API, experimenting with particles, mapping and more complicated meshes can yield incredible results. Three.js is a gold mine for creating beautiful and complex Web experiments. Taking the extremely simple demonstration explained here and turning it into a mind-blowing experiment merely takes experimentation and the willingness to try new things. Read more…

September 11, 2013 — Over the past few months Jon Rundle has been involved in launching two large institutional websites with complex navigation systems on which maintaining simplicity becomes increasingly difficult as content requirements grow and tiers of navigation are added. In this article, Jon will illustrate the techniques involved in implementing responsive navigation on a large website. Read more…

August 26, 2013 — Thanks to strong mobile Web adoption worldwide, we have seen the launch of even more responsive designs in 2012 and 2013. Most of these have been in the publishing category, but lately we are starting to see complex transactional websites, such as Currys UK, take a brave step into this new world. Read more…

August 16, 2013 — The proliferation of mobile devices, increased user expectations, and the very real risks of losing customers and dropping in search result rankings have laid a heavy burden on developers to optimize loading time at all costs. The Web development community previously didn’t spend much time concerning itself with load issues and for that reason and more, Web developers aren’t conditioned to think very hard about the unique load requirements of their clients’ websites. We need to include a specification for load requirements as a regular checklist item when bidding and planning Web work. Read more…

August 12, 2013 — In this article, we’ll demonstrate methods to identify how people interact with a website differently on mobile devices, and the design decisions that can be made based on this understanding. Our objective is not only to improve Web performance but to increase the client’s return on investment. The following techniques center on the two unique characteristics of mobile phones: small batteries and small screens. Read more…

August 10, 2013 — In this article, Stephen Shaw introduces a technique for perfect horizontal and vertical centering in CSS, at any width or height. The techniques works with percentage-based width/height, min-/max- width, images, position: fixed and even variable content heights. Read more…

July 30, 2013 — Welcome to the second part of the sample chapter from Smashing Book #4. You might want to read the first part of this chapter beforehand — if you haven’t already. In part 1 we explored the infrastructure of the Internet and the make-up of a Web server. We left off at the stage where our Web server software is up and running again, and we’ve just double-checked this by telnetting an HTTP request and received the successful response code. It’s now time for… finding your website! Read more…

July 23, 2013 — Help! The Internet is gone! In this article, Paul Tero explores the infrastructure of the Internet and the make-up of a Web server, imparting lots of little tips and commands along the way, opening up a new perspective on how websites can stop working — and be fixed. Read more…

July 8, 2013 — If you read Smashing Magazine, you’re probably already on board with creating the best possible website experience for your audience. And if you go the responsive design route then you’ll need a strategy to make images flexible, too — a responsive image solution. This article leads you through the basics, and then arms you with the information you’ll need to pick the best responsive image solution for your situation. Read more…