Backbone.js provides structure to JavaScript applications, but it leaves a lot of design patterns and decisions up to developers who end up running into common problems when they first begin developing in Backbone.js. In this article, Phillip Whisenhunt will explore different design patterns that you can use in your Backbone.js applications, and he’ll look at many of the common gotchas that trip up developers.
Read more…
Tools for live CSS editing aren’t new these days. So, why would someone ever need to create yet another tool and even call it a “live CSS editor of the new generation”? In this article, Sergey Chikuyonok would like to introduce Emmet LiveStyle. This plugin takes a completely different approach on updating CSS. Unlike other live editors, it doesn’t simply replace a whole CSS file in a browser or an editor, but rather maps changes from one CSS file to the other.
Read more…
We’re constantly refining two interfaces simultaneously: one for visitors who load the website, the other for developers who have to tackle the code in the future. But we shouldn’t forget that developers are users, too. Therefore, our convention for naming and organizing files is critical if we are to ensure active development in the future. But do we really design the partials, files and directories that make up this interface with a particular set of users in mind?
Read more…
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…
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…
Jeff Eaton works with media, publishing and enterprise clients. Those businesses produce so much content and manage so many publishing channels that keeping presentation and design-specific markup out of their content is an absolute requirement. Unfortunately, this doesn’t mean that editors and writers are content with rigid, predictable designs for the material they publish, and this is where many well-intentioned content models break down. In this article, Jeff will share five techniques he used on recent projects to solve these problems.
Read more…
Extensive use of media queries is not a viable long-term solution. Media queries do not allow for reusable modules that adapt based on their containers’ size. Responsive Web design has inspired us to think beyond device classifications and to use media queries to adapt a layout to the browser’s viewport size. But this deviates from the hierarchical structure of CSS and characterizes elements relative to the viewport, instead of to their container.
Read more…
Some people waste bandwidth by sending high-resolution images to all devices. Others send regular-resolution images, looking less crisp on high-resolution displays. But what we really want to do is find the one solution that sends the image with the most appropriate size and resolution based on the browser and device making the request that can also be made accessible.
Read more…
When the mockups for the new Financial Times application hit FT Labs desk, Wilson Page knew he and his team had a real challenge on their hands. They were tasked with implementing a far more challenging product, without compromising the performant experience that made the first app so successful. In this article, Wilson Page will discuss some of the changes he made in the latest release and the decision-making behind them.
Read more…
Flexible box layout is a new box model optimized for UI layout, and it makes a lot of tasks much easier, or even possible at all. Flexbox’s repertoire includes the simple centering of elements, the expansion and contraction of elements to fill available space, and source-code independent layout, among others abilities.
Read more…