Browse by Section

Bright Pixels Monogram

Tools Perfect for Nerds

Boy, I knew Brett Terpstra was prolific, but this list is nuts. If you’re a developer or write markdown frequently, I’m sure you’ll find more than one of Brett’s projects to be incredibly useful. …More

Cherish Thine .dotfiles

Earlier this year, I started to feel it was time to buy a new Mac, but wanted to make a sensible and adult decision. I’d wait till the Fall, see what Apple had announced for the year, and then decide. The Fall…More

Scheduled Posts in Jekyll with Zapier

One of the tradeoffs of using a static site generator like Jekyll is not having scheduled posts. Sure you can add a date in the future, but static means exactly that, there’s no dynamic part to find and compare…More

Fix Broken Images from Siteleaf

I recently started using Siteleaf to manage this site, and I had an issue with image uploads. Siteleaf puts images in an _uploads folder that Jekyll doesn’t output by default. To fix that, put the following in…More

The New CSS Layout 4/5 stars

The New CSS Layout by Rachel Andrew. Photo taken in Cozumel, Mexico If you’ve been working on the web for the past few years, you’ve noticed how quickly our layout tools have improved. I gave four…More

Exclude Posts From RSS in Jekyll

Let’s say you want to exclude a post from your RSS feed. How do you go about doing that? Well, there are a few ways. First, you’d need to add something to the front matter of your post: #…More

The Meaning of AMP

Jeremy Keith: At AMP Conf, the Google Search team were at pains to repeat over and over that AMP pages wouldn’t get any preferential treatment in search results …but they appear in a carousel above the…More

Saying Goodbye to Firebug

Jan Honza Odvarko: Firebug has been a phenomenal success. Over its 12-year lifespan, the open source tool developed a near cult following among web developers. When it came out in 2005, Firebug was the…More

Rebuilding Slack.com

Mina Markham on Several People Are Coding: In August, we released a major redesign of slack.com, and we want to give you a peek behind-the-scenes. Rebuilding our marketing website was a massive project that…More

How Do I Keep Up With the Web?

I got the following question from a nice fellow by the name of Chris Martin: Hi Tim, Your event on CSS Grid popped up in my Twitter feed today. Awesome! That got me thinking about a question a student…More

A Sticky Situation

Ethan Marcotte: Last week, I thought I’d clean up my blog entries a bit. (Yep. I’m that fun.) Before, there were a couple short but dense paragraphs, each containing a truckload of links: one linking to my…More

Moving to Netlify

In June 2015, I set out on a bold journey. One where no one had gone before. If you’re thinking of space, hell yea that would be amazing, but no. I set out to host my Jekyll site on Heroku. I’d been paying…More

Be Kinder to Each Other

Hui Jing after reading some negative comments on the Update CSS Grid page of the Windows Developer Feedback site: The world is not a perfect place. Life is not fair. But the matter of fact is, we live in…More

CSS is Not Broken

Keith J. Grant: You cannot be proficient in JavaScript until you understand coercion, prototypal inheritance, and asyncronous(sic) flow control. Likewise, in CSS, you have to understand the cascade,…More

Hassle-free Full Bleed with *:not()

Dave wrote this the day I went to Vegas and I haven’t had time to write about it. Let’s say you’re making a blog post layout. Content is entered into a CMS inside a WYSIWYG editor field. You echo that…More

Personal Site Redesigned

Three months ago, I set out to redesign my personal site. I usually start feeling the itch every year or so. I don’t really know what version this is, but feel free to look at previous iterations on the Wayback…More

Learn CSS Grid

Jen Simmons: I am starting to see a bunch of simple introductions, link-baity false-narratives, and weirdly-wrong ideas to creep into the conversation about CSS Grid. They are not as helpful. Frequently…More

Creating a Microblog with Jekyll

I wanted to get away from Twitter. If you don’t get why, that’s ok. It’s not the point of this post. I want to talk about creating a microblog. What’s a microblog? In essence, it’s…More

Code Smells in CSS Revisited

Harry Roberts: Way back in 2012, I wrote a post about potential CSS anti-patterns called Code Smells in CSS. Looking back on that piece, I still agree with all of it even four years later, but I do have…More

A Simple Use of CSS Grid

You might’ve heard awesome people like Rachel Andrew and Jen Simmons advocating for the use of CSS Grid. If you haven’t, I recommend you follow Jen and Rachel on Twitter. You should watch this talk, and this…More

Jenn Schiffer's Awesome XOXO Talk

This talk is eye-opening. Jenn talks about how she first started doing satire of the web industry, and the resulting abuse she’s received. Personally, I’d love to see more satire. We take ourselves way too…More

Speeding Up Your Heroku Jekyll Site

Something I missed about hosting my site on an Apache server, was how easy it was to turn on compression and caching. I finally spent an afternoon a few months ago to figure out how to do that on Heroku. It’s…More

It's More Than Just the Words

Rachel Andrew on the effect of no longer having a personal site: As we move our code to CodePen, our writing to Medium, our photographs to Instagram we don’t just run the risk of losing that content and the…More

Speeding Up Your New Mac Setup

Past-Me has been a jerk many times. Past-Tim doesn’t think about Future-Tim, saving him time, money, and sometimes even heartache. Setting up a new Mac can be a huge pain, and thankfully Past-Me finally did…More

Switching Back to Kramdown

I’ve written previously on switching to Redcarpet to process markdown. Since then, I was determined to find out if I could do the same thing with Kramdown since it’s already a dependency of…More

A Year of Ruby, Together

This is an important talk to watch. All of us use open-source libraries, and while this talk is ruby-specific, our support and contribution to the communities we belong to is important. Most open-source…More

Hello, Jekyll

Trent Walton: I’ve logged quite a lot of hours battling databases, plugins, and a GUI editor to write (and occasionally design) blog posts. Wordpress has served me well, but to simplify the process I’ve…More

Normalize (CSS) No More

Shaun Rashid: Like many web developers, I have used a reset/normalize style sheet in a variety of projects with the intention of having a common starting point for all browsers when it comes to styling CSS.…More

The Value of Writing CSS

Eli Fitch in a tweet: Don’t ever let somebody tell you that focusing on CSS doesn’t make you a “real developer”. Being good at CSS is rare, has tremendous value(sic) This tweet really struck a cord with…More

Neonto Tries Their Hand at React

Neonto has just announced the impending release of a new design tool. Neonto Studio allows users to “Build real native mobile apps better and faster.” Their new offering—React Studio—is a design tool that…More

Why I Don’t Use CSS Preprocessors

Roger Johansson: Whenever I mention that I don’t use CSS preprocessors I tend to get strange looks from people who cannot imagine writing CSS without Sass. And so I have to defend my choice and explain why,…More

Signed Git Commits with Tower

Aaron Parecki: My favorite Git client is Tower. I wanted to find a way to sign my git commits despite that not being a supported feature of Tower. Turns out it only took a couple configuration options to…More

Get the Original Image from a Data URL

Chris Coyier: Someone wrote in asking how they might get the “original image” when all they had was the data URL version of the image. I’m not exactly sure how you get into that situation, but hey, I woke…More

CSS Writing Mode

Ahmad Shadeed: Recently, while editing some CSS in Opera inspector, I noticed a CSS property called writing-mode, this was the first time that I know of it. After some research, I learned that its purpose…More

Emotionally Complicated Class Names

This list is pretty hilarious. I’ll add my own just for fun. .it-s-friday-and-i-just-need-this-to-work { align-items: neatly !please; // !now can also be used depending on your level of desperation } …More

Sticky Headers

Jeremy Keith: I made a little tweak to The Session today. The navigation bar across the top is “sticky” now—it doesn’t scroll with the rest of the content. I made sure that the stickiness only kicks in…More

Don't Overthink It (Flexbox) Grids

Chris Coyier: Four years ago I posted “Don’t Overthink it Grids” and it resonated with quite a few people. Even back then, I thought we might have been at Peak Grid. Someone was promoting a new grid…More

You Don't Need JavaScript for That!

Cristina Silva on the Thoughtbot Blog: Every project has different needs, so make sure you’re picking solutions that work best for your project’s goals. No single solution will work for all projects. In the…More

Lint Your CSS with stylelint

David Clark on CSS-Tricks: You write CSS. Probably a lot of CSS. And you make mistakes. Probably a lot of mistakes. Somebody needs to stop you from making mistakes in your CSS. … You try to control…More

CSS and Scalability

Adam Morse: After countless implementations of css systems that broke down and became difficult to maintain as apps and teams grew larger…I’ve found I want little to no part of the cascade’s…More

Teaching the Order of Margins in CSS

Charlotte Jackson: I was paired with a graphic designer who was just starting her HTML & CSS learning journey. I really enjoyed working with her because she wanted to understand everything, and because…More

Frontend Performance Tuning WordPress

Jon Bellah: Back in September of last year, I got a chance to see Tim Kadlec give his talk, Reaching Everyone, Fast at From The Front. I walked away with a few pretty great tidbits from the talk that left…More

The Web Is Back!

Creativity on the web has been on a bit of a vacation. I’m not pointing fingers, I’m guilty. Many of us are culprits in making some pretty homogenous-looking websites. We played the hand we were dealt.…More

Expressive Type for Copy Blocks

Mark Huot tells the story of overriding poorly written defaults: When overriding everything we find ourselves writing markup such as .product-meta p or, worse yet, .product-meta p, .product-meta ul,…More

Managing Typography on Large Apps

Harry Roberts: I’ve written before about managing typographical styles across larger projects, but an issue that I still see clients continually coming up against is that of specifically managing their…More

An Interview with Una Kravets

Una Kravets: …a lot of time people hear these new terms in the dev world and they get kind of worried because the more people are talking about them the more it seems like everybody is using them and you’re…More

Light Frames, Great Content

Uncle Dave: Abiding in “light frames, great content” means I’m not limited by an arbitrary number of kilobytes. Some content needs to be bigger, commented, zoomed-in on, animated, felt, sung, interacted…More

Confidence and Overwhelm

Rachel Andrew: A lot of folk feel overwhelmed right now. Things seem to be changing so quickly. It doesn’t seem enough to be a good designer, or to know HTML and CSS well. Do we need to learn all of those…More

‘Pushing Against a Tidal Wave’

Rachel Smith: The web design and development industry has grown out of infancy and is moving in to what I like to think of as the awkward teenage years. We are maturing, rebelling against the limitations…More

iPad Test

Dear Reader, If you’re seeing this, it means I’m publishing from my iPad. Oh, hell yes. Tutorial coming soon. …More

Publishing To Jekyll From iOS

Disclaimer: This method will only work if you have an external build process. If you host your Jekyll site on Github pages, for example, you’re good to go. If you’d like to learn how to setup your…More

What Is a Front End Developer?

Laurence Bradford: At this point, after looking through multiple job descriptions, I am totally confused. My goodness. There were so many times in this article that I wondered if I was even a front end…More

Clean Up Your Metadata

Jeremy Keith on all the meta elements you need for nice previews on Twitter and Facebook: Okay, I’ll attempt to dial down my sarcasm, but I find this wastage annoying. It adds unnecessary complexity, which…More

Switching to Redcarpet

I’ve always hated the way Jekyll uses liquid tags to highlight code snippets. I found a way to do this, which until today, I never knew existed. Redcarpet is the answer here. Here’s what I wanted…More

Dynamic Web Typography with Typekit

Tom Newton talking about a new Typekit feature: When your Dynamic Kit JavaScript loads in the browser it detects the characters you’re using and requests that only the used characters are sent. For example,…More

Heroku Redirects with rack-rewrite

A month ago, I moved this blog over to Heroku, and I’ve been really happy. It’s made writing and deploying a lot easier. But I needed a way to redirect the feeds to FeedPress and display my nice 404 page, which…More

Hosting a Jekyll Site on Heroku

I love using Jekyll. I use it for this blog, my personal site, and it’s the first thing I suggest when people want something with content that needs to be updated. However, deploying gets complicated when…More

New Permalinks

Matt Gemmell writes a compelling piece on why we should ditch date permalinks. Joe Darnell did it, and now me too. Good riddance ridiculously long URLs! …More

Post Status Reviews Layers by Obox

Brian Krogsgard: I am definitely not on the bandwagon for page builders, though it seems the WordPress product world is. Where traditional options heavy theme sales have died away, page builders have risen…More

Emmet’s Hidden Features

Jordan Moore: There are heaps of really useful features alongside Emmet’s primary text-expanding function. Here are a few of the hidden gems that I frequently use when coding. …More

Pinging FeedPress with Rake

Using Jekyll instead of a CMS like WordPress, means that some things aren’t automated like before. With WordPress, when you publish a new post, the system automatically pings services around the web letting…More

A List Apart Issue 386

In “Surveying the Big Screen”, Mike Pick does a great job of pointing out the need to explore the possibilities on larger screens.1 Alex Feyerke writes an excellent article titled…More

Organize that Sass!

One of the many beauties of working with Sass is how easy it is to get organized. In the past, importing different CSS files wasn’t good practice and in fact made for more HTTP requests. With Sass, you can…More

Why You Should Use Sass

Dan Cederholm on A List Apart: …the reality is that Sass (and other CSS preprocessors) can be a powerful ally—a tool that any style-crafter can easily insert into their daily work. It took me a while to…More

Starting with Sass

Chris Bowler: I’ve looked at several tutorials over the years, but many were written with a certain assumption for the level of knowledge on the other end. Many can be a struggle for the beginner because…More

Deployments with GitHub and SSH

I had no idea that deployments could be this easy. Which surprises me, because I thought I had explored my deployment options. Kennedy was kind enough to make a video too. Obviously this route is a bit nerdy,…More