Web Development Reading List #101

7 min read
Web Design, Design, Web Development Reading List
Share on Twitter, LinkedIn

About The Author

Anselm is a freelance front-end developer who cares about sustainable front-end experiences and ethical choices in life. He writes the WDRL, and is co-founder … More about Anselm ↬

Email Newsletter

Weekly tips on front-end & UX.
Trusted by 200,000+ folks.

Welcome back to the Web Development Reading List (WDRL) for this week! Our dear friend Anselm Hannemann is keeping track of everything in the web development reading list so you don’t have to. The reaction on the first post last week was quite overwhelming. Instead of the previously announced biweekly schedule here on Smashing Magazine, Anselm will post it in sync with the original WDRL; so, expect content to appear weekly here from now on.

What’s happening in the industry? What important techniques have emerged recently? What about new case studies, insights, techniques and tools? Our dear friend Anselm Hannemann is keeping track of everything in the web development reading list so you don’t have to. The result is a carefully collected list of articles that popped up over the last week and which might interest you. The reaction on the first post last week was quite overwhelming, so we moved from a bi-monthly frequency to a weekly frequency (for now). — Ed.

Welcome back to the Web Development Reading List (WDRL) for this week. Instead of the previously announced biweekly schedule here on Smashing Magazine, I will post it in sync with the original WDRL; so, expect content to appear weekly here from now on.

News

Typekit has added WOFF2 support to its stack, which means you can save up to 30% on your web font kit’s size. To activate WOFF2 support, just republish your kits.
Mozilla will change the way you write add-ons. Writing a Firefox extension has always been a massive effort compared to Chrome. Now, Mozilla is introducing WebExtensions, largely compatible with Chrome’s extension model, making the whole workflow much simpler, faster and more secure.
According to the latest StatCounter data, UC Browser is still on the rise and has already passed IE Mobile and Opera. Soon, it might pass Android’s native browser. If you’re not already, you should start testing your websites and apps in UC Browser.

General

A recent discussion, arising mostly from an article by Alex Russell titled “Doing Science on the Web,” gives some new perspective on how we can test new web platform features without repeating the errors made with vendor prefixes. While Alex proposes that developers register for experiments, some people argue that this is worse and is a kind of vendor lock-in that would not work out.
TheNextWeb tested iOS 9’s content-blocker feature and found that it simply blocks all clutter and ads that are normally displayed on a website. Because this is enabled for all users, it will likely have a big impact on the revenue models of ad-driven websites.

Concepts And Design

The in-depth article “UI Mechanics of a Date Picker” breaks down the importance of small details in that little UI widget on your website, the date picker.
Anna Yeaman has collected a lot of emails and created an analysis of “Typographic Patterns in HTML Email Newsletter Design”. If you’re sending email newsletters, then this study is interesting and provides good defaults.
Brad Frost has talked a lot about death to bullshit already. Now, he’s published it as a web project with an interactive demo. So, if someones want you to integrate an auto-appearing overlay, modal or fade-in banner, let them test the experience for themselves on this website.
John D. Jameson shares some solid guidelines for letterspacing web typography.

Tools

“Write ESXXXX JavaScript in a common way with Browserify and Babelify including extracted source maps and Uglifyify for production builds.”
Surely, this one isn’t for everyone, but people who want to build a diagram or graph from some code or a simple list will love the Mermaid diagram syntax visualizer, which shows you a live diagram of what you type.

Security

With the Ashley Madison data leak, we as developers should put more effort into securing our systems. Password hashing and encryption should already be the default, but as we now see, protecting email addresses and other private details is equally important.
Joel Weinberger’s slidedeck reveals where content security policy is heading next and why open web platform security is the better term for it.
“We’re struggling to get traction with SSL because it’s still a premium service.”

Privacy

The UN’s new privacy chief, Joseph Cannataci, raises concerns about broken privacy on the Internet and expresses a desire to build a Geneva Convention for the Internet.

Web Performance

If you want to measure front-end performance, then it’s important to measure how the page performs when it’s loaded and the user interacts with it.
“A Beginner’s Guide to Website Speed Optimization” by Kinsta is good for everyone who wants to understand the basics of what slows down a web page and why having a fast website is important.

HTML And SVG

If your website has SVG icons, then you’re probably using a sprite sheet. But it wouldn’t be SVG if it was easy. Turns out you should always use a wrapping HTML element (such as a div) set to display: none, instead of setting it directly on the svg root element.
Ana Tudor is always good for mathematical constructions of visual modules. Over on CSS-Tricks she shares a breakdown of how to fit SVG shapes into a container properly. If you struggled to understand viewBox and the box-module handling of SVG, this post is for you and you also get a mathematical refreshment for free.

Accessibility

As a good developer, you care about your users. It’s well known but can’t be overstated that outline: none prevents accessibility on elements and should be avoided.
Marco Zehe, a blind accessibility engineer at Mozilla, shares the big accessibility improvements that have landed in Firefox 41 for Mac OS X users.

JavaScript

“The @font-face Dilemma” by Chris Manning shares current methods of web font integration and compares old font loader methods with the newer font observer technique.
You all know of the discussion around whether to use jQuery or not. However, you can do a couple of things with plain JavaScript that you probably didn’t know about.
Maurizio Mangione’s “Polymer Unit Testing” is a great primer on why testing your custom web components is important.

CSS And Sass

Sara Soueidan continues her series on the basics of CSS, this time discussing the various possibilities of styling check boxes and radio buttons with either CSS or SVG.

Work And Life

Marcy Sutton asks “How will people remember you when you’re gone?”
I have posted several articles on agile workflows. I myself often work agile for projects, and yet I don’t want to hide “More Agile, More Problems,” in which Steven Hoober talks about his experiences in over 200 agile projects.

Go Beyond

The well-known artist Banksy has created a new kind of amusement park: Dismaland. A post on Imgur shows what it’s about. Also check out the official trailer.
That thing we work on all day, the Internet? Did you know it’s built on hacks?
Noah Stokes’ “On Passion” sheds new light on the overused term “passion.” Follow your passion, but do it wisely, and don’t turn everything into your passion — it wouldn’t work.
“Who Benefits the Most From Open-Source Software?” Baldur Bjarnason asks this often avoided question and gives some answers you might not want to hear. The sad truth is that developers’ efforts are too often abused by companies that do not give back.
“Bushfires, Heatwaves and Early Deaths: The Climate Is Changing Before Our Eyes” — and we still don’t care. It’s time to recognize that everyone is involved and can do something, even if it’s only a small change.

And with that, I’ll close for the week. If you like what I write each week, please support me via Flattr or Gratipay or by sharing this resource with others. You can learn more about the costs of the project. It’s available via email and RSS and online.

Thanks and all the best, Anselm