One common feature of content sites (including this one), is links/buttons/etc to share a piece of content on social media. Typically this is Twitter, but many sites will include ways to share links o
I came across Brian Baking’s “Cool Things People Do With Their Blogs” which led me to Luke Harris’ stats page which motivated me to finally make something similar of my own. I’ve written previously ab
How to define your relationship to sites you link to | Stefan Judis Web Development Published at Dec 20 2021 Updated at 8 months ago Reading time 1min Views 460 This post is part of my Today I learned
13 Jun 2022 / San Francisco, California What’s the smallest amount of CSS that you can write to make HTML look halfway decent? I took a crack at that today after I removed all the styles from my websi
Erin & I had a lovely vacation last month,driving around southwest Colorado –Bishop Castle, the Great Sand Dunes,Chimney Rock, the Durango-Silverton Railroad,the (terrifying) Million Dollar Highway,th
When I first heard Nicole Sullivan talk about OOCSS , I thought “Oooh, smart.” When I read Jonathan Snook’s riff on that idea in SMACSS I thought “Oooh, smart.” When I heard Harry Roberts say “ never
Understanding the color-scheme property 25th Aug 2022 You would have heard of the CSS color-scheme property if you are interested in adding a dark theme to your website. Here’s what it looks like: :ro
1. Unless you already have your own Webmention receiver, sign up for one and add the secret key/token to your project. Below are two examples: If you’re using Webmention.io , add your API Key (found o
Publish date: 25th August 2022 Author: Heydon The primitive Sidebar layout is a kind of quantum layout whereby the sidebar only exists as a sidebar where there is available space. As the Sidebar docum
If a utility class only does one thing, chances are you don’t want it to be overridden by any styles coming from elsewhere. One approach is to use !important to be 100% certain the style will be appli
Before we get into all the hacking and unorthodox ways of doing things, let’s talk about background-clip: text properly. If you want an image or a gradient applied to a run of text, like so: You can a
Guides & Tutorials Guides & Tutorials Personalization — the process of creating customized experiences for visitors to a website — is a hot topic on the web in 2022. In a crowded world of digital expe
Benj Edwards / How-To Geek From streaming services to software to content, it feels like we’re constantly shelling out money every month to keep access to the things we want. So what’s behind this shi
I’ve been working on a redesign of my personal site,and found I was fixing the same issue over and over.Make the change, test it, commit, and then…why is it broken again? The intended behavior When se
That ain’t rhetorical: I’m really interested in finding great use cases for CSS multi-column layouts. The answer seems straightforward. Use columns when you want to split any content into columns, rig
I always thought that the semantically appropriate way to represent a rating (e.g. a star rating) is a element. They essentially convey the same type of information, the star rating is just a
posted on August 17., 2022 If you open a plain HTML document with no CSS and you focus an interactive element like a button, link, or textarea, you’ll see that by default browsers use the outline prop
Home All articles Looking at several ways to animate a border in CSS Aug 1, 2022 Bramus Twitter GitHub Homepage On this page Setting borders There are a few methods available to set a border on an ele
Before streaming, how did people watch films without buying them? It's hard to imagine that there is a whole generation growing up that have no concept of "the time before". The time before the intern
Scrollbars. A very mundane thing that every website and app has. Historically, it has been difficult to consistently customize scrollbar styling on the web. So it is understandable that frontend devel
Home All articles Layout is where the browser figures out the geometric information for elements - their size and location in the page. Each element will have explicit or implicit sizing information b
One of the most common pieces of feedback I give to design system teams about their documentation is this: write using the active voice. In this post I’ll explain what the active voice is and why it m
On Friday, I wrote that the major differences between junior and senior developers is their ability to fix broken code . Honestly, the only difference between a junior and senior developer is that you
I recently (July 2022) wiped and reloaded my MacBook Pro with macOS Monterey. I documented my process and the tools / apps / settings I use on a daily basis. You can watch me talk about this setup on
As WebAIM has developed the WAVE accessibility evaluation tool over the years, many of our improvements have been driven by our own evaluation work. Here are some “power user” tips I use to get the mo
Y’know that situation where you tell the client, “Here’s your website and you can edit those four (4) little homepage features in the CMS” and the client says “Okay okay okay” and you check the site a
You’ve seen something cool on the web and you want to start making your own animations? Sometimes when you’re getting started with web animation it can be overwhelming to pull apart all the methods an
A friend of mine was looking for a simple, easy to update, website stack. After some soul searching, we settled on 11ty with Netlify CMS . It was impressed with how easy it was to set up, so I'm going
Mat De Sousa is the founder of two Shopify apps, WideBundle and WideReview. Mat De Sousa This story is available exclusively to Insider subscribers. Become an Insider and start reading now. Mat De Sou
CSS nesting is a convenience syntax addition that allows CSS to be added inside of a ruleset. If you've used SCSS , Less or Stylus , then you've most certainly seen a few flavors of this: .nesting { c