New tools have emerged to address the challenges of responsive web design. And there is that’s been a leap forward in productivity for the team that Richard Knight works with. Its name is Webflow, and it could be the solution to the problems you face with static design comps produced in Photoshop and Fireworks. In this article, Richard will explore the advantages of Webflow and how you can use it to build responsive websites today. He will take you step by step through the process of creating a responsive website layout for a real project, and identify Webflow’s advantages and where it comes up short.
Read more…
To make the right choices for your project, you need to start with a general approach, or methodology. You probably already know of BEM, one of those methodologies developed by a big company, but Maxim Shirshin decided to try BEM on a smaller scale. He wanted the same benefits that Yandex gets from BEM: code sharing, a live style guide, scalability, faster development. He is now convinced that BEM applies to small projects as well. Maxim has written down his findings, in case you find them useful!
Read more…
Stricter functional programming languages are typically used when a system’s performance and integrity are both critical — i.e. your program needs to do exactly what you expect every time and needs to operate in an environment where its tasks can be shared across hundreds or thousands of networked computers. These languages have a steep learning curve for most front-end web developers; however, many more approachable languages incorporate features of functional programming.
Read more…
In this article, Maksim Chemerisuk describes his approach with better-dom to solve the internationalization problem. Since the last article about this, “Writing a Better JavaScript Library for the DOM,” he has revisited the concept to solve the issues raised through feedback. The solution was originally intended to be a set of internationalization APIs for plugins, extensions, etc. It doesn’t rely heavily on the better-dom library, so it could be adapted to any existing JavaScript library.
Read more…
In this article Julian Shapiro will demonstrate that websites can benefit from the same level of interactive and performant motion design found on mobile apps. In the following examples, he’ll be using Velocity JS — a popular animation engine that drastically improves the speed of UI animation. In particular, Velocity.js’ UI pack, which allows you to quickly inject motion design into your pages.
Read more…
Why would you even need to generate SVG on the server? The technology is entirely client-side, so what would motivate anyone to move it from there? When we talk about “generating SVG” nowadays, we mean “generating SVG with JavaScript.” The current state of browser support and libraries makes the creation of complex visuals a trivial task. There are a lot to choose from! So the right question is, how do we continue generating SVG with JavaScript while also putting the results of the generation on the server?
Read more…
Brian Wood found many web shops faced challenges fitting responsive design into their workflow, and the role of most web designers had changed to include coding in some form or another. Well, a new generation of visual responsive design tools has arrived. These responsive design tools are for anyone who understands HTML and CSS (or is willing to learn) and wants to visually design a responsive website — and have code to show for it. You could use one of these tools in the design process to create responsive comps, regardless of whether you intend to use the generated code. So, let’s have a look!
Read more…
The second part of this series addresses the third step into making navigation as simple and predictable as possible, and discusses which type of navigation menu is best suited to which content. A navigation menu is any area of an interface that presents navigation options to enable users to find content on the website. A common distinction in navigation models is between a primary, traditional navigation system and secondary, alternate navigation models. Exactly defining this distinction is difficult.
Read more…
In this article, Per Buer will talk about cache invalidation specifically to readers who already work with Varnish Cache. To learn more about it, you’ll find background information in “Speed Up Your Mobile Website With Varnish.”
A cache miss depends on two factors: the volume of traffic and the average time to live (TTL), which is a number indicating how long the cache is allowed to keep an object. To have a high TTL, we need to be able to invalidate objects from the cache so that we avoid serving stale content. With Varnish Cache, there are myriad ways to do this. You’ll explore the most common ways and how to deploy them.
Read more…
The best writers often work with an editor (or two), who will help them coalesce their words into something more compelling or easier to understand. Having worked with several editors, Paul Lloyd really came to appreciate this aspect of the writing process. Refinement is an essential aspect of any creative process. As refactoring code can make a program more logical and efficient, editing a text can allow an underlying idea to be more clearly stated, or make a piece more enjoyable to read. And when he heard about Editorially, a collaborative writing tool designed with Web writers in mind, he immediately signed up.
Read more…
