The most popular Front-End links of 2016

Chris Brandrick
Statuscode
Published in
5 min readDec 30, 2016

--

We send an email newsletter to over 70,000 front-end web developers each and every week.

As such, we thought it would be worthwhile to take a look back over all the issues we have sent throughout 2016 and highlight some of the most popular articles we’ve shared.

Here’s what front-end developers clicked on in 2016:

1: Google’s HTML & CSS Style Guide

Google | Shared in Issue 258

This isn’t new, but a few recommendations in here might surprise you.

Google’s advice is both useful and intriguing and plenty of you seemed to agree, making this our most clicked link of 2016.

google.github.io

2: Do You Know These Eight HTML5 Tags?

Simon Codrington | Shared in Issue 229

Simon shares details on some of the lesser known HTML tags, along with practical explanations and handy examples.

Includes a look at contextual highlighting with ‘mark’, quotations with ‘q’, and more.

sitepoint.com

3: Dirty Tricks From The Dark Corners Of Front-End

Vitaly Friedman | Shared in Issue 232

This superb slidedeck from a workshop given by Smashing Magazine’s proprietor proved popular. You’ll no doubt learn a few things from this.

speakerdeck.com

4: A Guide to Writing Maintainable CSS

Adam Silver | Shared in Issue 239

MaintainableCSS outlines an approach to writing modular, scalable CSS without worrying about overzealous, pre-existing styles causing problems.

maintainablecss.com

5: Bootstrap 4 — A Visual Guide

Carol Skelly | Shared in Issue 243

This visual look through what was new in version four of popular front-end framework Bootstrap — including cards, font changes, an XL grid tier, and tweaks to button styling, proved popular back in June.

medium.com/wdstack

6: Debugging The Web

Paul Irish | Shared in Issue 266

Paul Irish shares what’s worth knowing in Chrome’s DevTools and how they’ll help you when debugging your sites and carrying out front-end work. A lot of useful stuff here.

youtube.com

7: Twelve Fancy Chrome DevTools Tips

David Gilbertson | Shared in Issue 258

This roundup features several simple Chrome DevTools tips — you may uncover a few features you hadn’t got round to trying yet.

hackernoon.com

8: Delivering Octicons with SVG

Aaron Shekey | Shared in Issue 228

GitHub.com no longer delivers its icons via an icon font — it has switched to SVG. Plenty of folks wanted to take a look at the why and how.

github.com/blog

9: HEAD

Josh Buchea | Shared in Issue 243

A comprehensive list of everything that could go in the <head> of your document. Starts from the usual basics (title, charset, etc.) but works up to a significant number of meta and link tags useful in various situations.

github.com/joshbuchea

10: A Basic HTML 5 Template

Louis Lazaris | Shared in Issue 237

Louis Lazaris covers the bare elements you need for an HTML 5 template and how they come together. Originally published in 2013 but updated for 2016.

sitepoint.com

11: Front-End Performance — The Dark Side

Mathias Bynens | Shared in Issue 237

A focus on security-sensitive situations in which performance can actually be a bug rather than a feature.

dev.opera.com

12: Flexbox Patterns

CJ Cenizal | Shared in Issue 236

Some interactive examples showing practical ways to use Flexbox to build UI components for your own site, along with code you can use.

flexboxpatterns.com

Get a round-up of the best front-end HTML, CSS, WebGL, Canvas, browser technology, and more every week when you sign-up to FrontEnd Focus.

--

--

Chris Brandrick
Statuscode

Editorial Director at Cooperpress | Curator of Switch Weekly