Web development is my craft

I recently posted a rant about icon fonts. In the past, my strong opinions about such things have led people to call me opinionated and pedantic. The thing is, this isn’t just a hobby to me. It’s my craft.

This isn’t just any old career path. It’s something I believe in. It’s something I’m passionate about. Why wouldn’t I do it to the best of my ability?

There are a few topics in particular that I get really fired up about. When somebody just doesn’t get these—or worse, doesn’t care—that’s when I get upset. But it’s only because I care about the web.

USE LESS JAVASCRIPT!

This has got to be the single biggest issue with the current state of the web. There’s HTML-in-JS, CSS-in-JS, React, Vue, Angular… It’s absolutely fucking everywhere. JavaScript can and should be used to enhance a website, but a website should never rely on it.

If you must use JavaScript, can you use vanilla JS? It’s really powerful nowadays—much more so than the framework-obsessed would have you believe—at a fraction of the size.

If you love state-based UI, I get it! But there’s an ever-growing list of anti-frameworks that give you the same benefits without the overhead of a massive dependency:

Write semantic HTML

Semantic HTML, or the lack thereof, is something I get particularly upset about. The fact is, you must always use the right element for the right purpose. This isn’t me being pedantic. A website might look all right visually, but it can still be riddled with problems due to <div> soup. It matters.

If you need a paragraph, then for fuck’s sake, use a <p>, not a <div>. The “p” literally stands for “paragraph”!

But why does it matter?

There are a number of reasons. I’d say the most important is accessibility, but there are others. Here’s a short list from the MDN Web Docs about the importance of semantic HTML:

You get all the proper functionality, accessibility, and SEO baked in, without having to re-implement it (often badly) using JavaScript. And it’s not hard to do. You just need to ask yourself: what kind of data should this HTML element hold? And then make the most appropriate choice.

Here’s a shorst list to get you started.

Keep your CSS sane

The web development community loves to give CSS a hard time—especially those who brown-nose JavaScript. They say it’s “broken”. They say it “doesn’t scale”. They complain about the cascade. These are all features, not bugs.

To make your life much easier, and perhaps even learn to love CSS, I highly recommend learning a maintainable methodology. There are a bunch out there, but OOCSS and SMACSS are good places to start.

I also like the approach that the Tachyons library takes. I frequently rip helper classes out of their code, without needing to include the whole thing. It’s the methodology that matters.

My friend Chris Ferdinandi has a nice boilerplate called Kraken, too.


If you agree with the points I’ve made, and you crave a simpler web, my friend Chris gave a fantastic talk called The Lean Web. I highly recommend it to all my developer friends. 💯