Harry Cresswell

#173 – My audience is myself

Hey everyone,

Welcome to issue #173, your weekly monthly roundup of what’s happening in design, code and typography.

The last few weeks I’ve been working with Sanity again, this time paired with Eleventy for the front-end. I have to say I’m absolutely loving this stack, it’s delight to work with – simple, but very powerful.

A good place to start is the Sanity Eleventy Blog Starter. This is the route I took and I’ve made a load of notes on extending the starter with your own customisations. Unfortunately time got the better of me this month, so I’ll get those published ready for the next one.

In the meantime…

Thought provoking #

“I don’t think about other people when I’m adding something to my website. My audience is myself.” Jeremy Keith in Associative trails.

“Searching for a better way to interact with the Internet. I found my answer in RSS. I enjoyed the freedom to see sources as I wanted, the flexibility to move to a new reader if I wanted, the complete lack of advertising. It was hard to not fall in love with the service.” Mark in Why I Still Use RSS.

“The problem with developing front end projects isn’t that it’s harder or more complicated, it’s that you made it harder and more complicated.” Remy Sharp in The web didn’t change; you did.

Things from me #

Accessing HTML data attributes in JavaScript with dataSet. You can easily add custom data to any HTML element using custom data attributes. But how do you access those attributes using JavaScript?

JavaScript and the DOM: Adding and removing classes. This is a quick look at JavaScript interaction based on my notes from Beginner JavaScript by Wes Bos.

Design and Code #

Lots about z-index this month. Both Ahmad Shadeed’s Understanding Z-Index in CSS and Josh Comeau’s What the heck, z-index?? are great places to start if you want to get a clear understanding of how this tricky CSS property works.

“A front-of-the-front-end developer determines the look and feel of a button, while a back-of-the-front-end developer determines what happens when that button is clicked.“ Brad Frost in front-of-the-front-end and back-of-the-front-end web development.

Building a Tabs component from Adam Argyle. A foundational overview of how to build a tabs component similar to those found in iOS and Android apps.

Encapsulated Eleventy/Nunjucks components with macros from Trys Mudford. If you’re more familiar with Twig or Liquid templating than Nunjucks then this is a problem you’ve no doubt come across.

Diving into the ::before and ::after Pseudo-Elements. A great intro to Pseudo-Elements from Will Boyd that will give you tons of ideas for what you can do with them.

Zach Leat takes a look at the fundamental Barebones CSS for Fluid Images.

Typography #

Fluid typography with CSS clamp from Andy Bell.

NewsReader is an original typeface designed by Production Type, primarily intended for continuous on-screen reading in content-rich environments. It’s free and open-source.

“Sustainability isn’t just measured in pounds, emissions, and material sourcing. It’s also measured in bytes”. In These are the world’s most sustainable fonts Lilly Smith takes a look at Formafantasma’s new website which uses Arial and Times New Roman in an effort to be more sustainable.

Something to watch #

A History of the Web in 100 Pages. In this shot documentary, John Allsopp tells the story of the Web through 100 influential pages in the Web’s history.

Monthly Newsletter

Each month I share a roundup of articles, tools and tips for designers and front-end developers. Check out past issues and sign up to get on the list.