The Best of January 2015: News, Tutorials, and Freebies
2015 has gotten off to a great start. Now that it’s February, it’s time to hunker down and get to work. For inspiration, here are the best web design and development news and resources from the past month.
Firefox 35 Release
While general users won’t notice any differences in the January 13 Firefox 35 release, there are some exciting new features for web developers under the hood. One of the changes is the CSS3 filter property, which allows you to apply Photoshop-like filters to images or any element in the DOM. Craig Buckler takes you for a test drive in his overview of the new Firefox features.
Meet Project Spartan
Microsoft recently unveiled Spartan, its new default browser in Windows 10. Among other features, Cortana will be included, allowing Spartan to learn from your habits and give you details about specific things it thinks will be relevant to you, just like Google Now does on Android. Owen Williams, with The Next Web, was at the unveiling. In his article, he shares the new browser features, including the ability to collaborate with others by marking on the page directly, as well as the ability to click anywhere on the page and comment.
Opera’s former CEO, Jon von Tetzchner, has launched a new Chromium-based browser that is specifically designed for power users. Vivaldi is currently available as a “technical preview” for Windows, Mac or Linux to give you a glimpse of what to expect from this new project. Some of its exciting features are quick navigation shortcuts, page actions, tab stacking and notes. The browser is still in its early days and many of the extra features aren’t yet implemented, but it’s definitely a project to keep an eye out for.
MUST-SEES FOR DEVELOPERS
CSS Vertical Center with Flexbox
Developers have known forever that layouts in CSS were a nightmare, and they considered flexbox to be the savior. That may or may not prove to be true in the long term. Despite what the future may hold for flexbox, David Walsh shares how it easily solves one problem CSS has had for far too long: CSS vertical centering. In this quick tutorial, he shows you how easy it is.
CSS You Can Get Excited About in 2015
CSS is a constantly evolving language. Now is a great time to take a look at some of the emerging features to experiment with. In this article, web developer Rachel Andrew takes a look at some newer modules and individual CSS features that are gaining browser support. She says you won’t be able to use all of these features in production immediately, and some are only available behind experimental flags. However, you’ll find plenty of things here that you can begin to play with — even if it’s only during a prototyping stage of development.
The State of Responsive Web Design
What is going on with RWD? That’s a good question, and one that web-designer and developer Kezz Bracey tackles in her article about the state of responsive web design today. She discusses in-depth what we know about RWD, what has been left by the wayside in recent times, the new tricks we can incorporate into our game today, and what’s coming up on the horizon. She also includes useful links to helpful resources.
How to Scale SVG
SVG stands for Scalable Vector Graphics, so scaling SVG should be easy. But if you are one of the many developers who have opened up your web page in test browsers and discovered that some leave huge blocks of whitespace above and below the image, while others crop it off too short, then you know it isn’t that easy. In this article, Amelia Bellamy-Royds shares an epic guide to scaling SVG. It’s not nearly as straightforward as scaling raster graphics, but that can be good, she says, because it opens up interesting possibilities.
The Most Hearted Pens of 2014
What were the most popular Pens of 2014? Codepen shares the 100 most hearted. While the number itself shows how many people hearted the Pen, the ranking takes heart-levels into account as well. What are your favorites?
WEB DESIGN MIX
How to Make Users Take Action
The amount of information available to an individual online is staggering—we are inundated with information, ads, pictures, cat videos and an avalanche of knowledge. So what can designers do to influence a user to take a specific action in today’s world? There is no single answer, but UI/UX designer Jon Izquierdo has some ideas. It starts with thinking through the user’s psychology and behaviors to make an educated assumption… and then test the heck out of the assumptions.
The Banished Hamburger Menu
If you know a little about mobile design, you might already know that the “hamburger menu” is a frequently used design trick for adding (or hiding) extra functionality somewhere off your main screens. You might also know that it’s terrible for user discovery and engagement, and that Apple discourages its use. Redbooth shares how they seized the opportunity to eliminate the hamburger menu when they started working on a new chat feature for their iPhone app.
The Ten Most Popular Web Fonts of 2014
Typewolf has compiled a list of the ten most popular web fonts of the year and has them featured on the site. Unlike some other lists, this top 10 list features typefaces from all type foundries, regardless of where the typefaces can be purchased or licensed. It’s still a curated list, as Typewolf creater and curator Jeremiah Shoaf choses all the sites featured on Typewolf. However, he believes with font usage data from 365 sites, the list shows a clear picture of what fonts were popular in 2014.
RICG Responsive Images WordPress Plugin
Have you been looking for a responsive images plugin for WordPress? The RICG Responsive Images plugin allows the browser to choose the best image from a list. It works by including all available image sizes for each image upload. Whenever WordPress outputs the image through the media uploader, or whenever a featured image is generated, those sizes will be included in the image tag via the srcset attribute. You can download the RICG Responsive Images plugin here.
20 Free Web Design Ebooks from 2014
Do you want to hone your web design skills, but don’t want to take a class? Ebooks are a great resource for learning new skills. SpeckBoy Design Magazine has compiled a selection of web design related ebooks that were released in 2014. All are available to you for free.
Dashel Icon Set
Check out this icon set containing 45 free icons available in SVG, PSD and PNG formats. Designed by Print Express, this icon set was released exclusively for Smashing Magazine and its readers and is licensed under a Creative Commons—you can use the icons in your commercial as well as your personal projects.