Breaking down CSS Box Shadow vs. Drop Shadow

Drop shadows. Web designers have loved them for a long time to the extent that we used to fake them with PNG images before CSS Level 3 formally introduced them to the spec as the box-shadow property. I still reach for drop shadows often in my work because they add a nice texture in some contexts, like working with largely flat designs.
Not too long after box-shadow was introduced, a working draft for CSS Filters surfaced and, with it, a …

Breaking down CSS Box Shadow vs. Drop Shadow is a post from CSS-Tricks

Link: https://css-tricks.com/breaking-css-box-shadow-vs-drop-shadow/

5 Tips for Starting a Front-End Refactor

For the last two weeks, I’ve been working on a really large refactor project at Gusto and I realize that this is the first time that a project like this has gone smoothly for me. There haven’t been any kinks in the process, it took about as much time as I thought it would, and no-one appears to be mad at me. In fact, things have gone almost suspiciously well. How did this happen and what was the issue?

Well, …

5 Tips for Starting a Front-End Refactor is a post from CSS-Tricks

Link: https://css-tricks.com/5-tips-starting-front-end-refactor/

A Look Back at the History of CSS

When you think of HTML and CSS, you probably imagine them as a package deal. But for years after Tim Berners-Lee first created the World Wide Web in 1989, there was no such thing as CSS. The original plan for the web offered no way to style a website at all.

There’s a now-infamous post buried in the archives of the WWW mailing list. It was written by Marc Andreessen in 1994, who would go on to co-create both the …

A Look Back at the History of CSS is a post from CSS-Tricks

Link: https://css-tricks.com/look-back-history-css/

On-Site Search

CSS-Tricks is a WordPress site. WordPress has a built-in search feature, but it isn’t tremendously useful. I don’t blame it, really. Search is a product onto itself and WordPress is a CMS company, not a search company.

You know how you can make a really powerful search engine for your site?
Here you go:

Link: https://css-tricks.com/on-site-search/

Prettier + Stylelint: Writing Very Clean CSS (Or, Keeping Clean Code is a Two-Tool Game)

It sure is nice having a whole codebase that is perfectly compliant to a set of code style guidelines. All the files use the same indentation, the same quote style, the same spacing and line-break rules, heck, tiny things like the way zero’s in values are handled and how keyframes are named.
It seems like a tall order, but these days, it’s easier than ever. It seems to me it’s become a two-tool game:

A tool to automatically fix easy-to-fix

Prettier + Stylelint: Writing Very Clean CSS (Or, Keeping Clean Code is a Two-Tool Game) is a post from CSS-Tricks

Link: https://css-tricks.com/prettier-stylelint-writing-clean-css-keeping-clean-code-two-tool-game/

The Art of Comments

I believe commenting code is important. Most of all, I believe commenting is misunderstood. I’m tentative to write this article at all. I am not a commenting expert (if there is such a thing) and have definitely written code that was poorly commented, not commented at all, and have written comments that are superfluous.

I tweeted out the other day that “I hear conflicting opinions on whether or not you should write comments. But I get thank you’s from junior …

The Art of Comments is a post from CSS-Tricks

Link: https://css-tricks.com/the-art-of-comments/

Getting Nowhere on Job Titles

Last week on ShopTalk, Dave and I spoke with Mandy Michael and Lara Schenck. Mandy had just written the intentionally provocative “Is there any value in people who cannot write JavaScript?" which guided our conversation. Lara is deeply interested in this subject as well, as someone who is a job seeking web worker, but places herself on the spectrum as a non-unicorn.

Part of that discussion was about job titles. If there was a ubiquitously accepted and used …

Getting Nowhere on Job Titles is a post from CSS-Tricks

Link: https://css-tricks.com/getting-nowhere-job-titles/

A Bit on Buttons

Here’s three recent things that have come across my desk in recent days regarding buttons. One, an accessibility flub that needed to be fixed. Two, an article about the fundamental differences between links and buttons but how they can look too similar for our own good. Three, the logical extreme of the button element: never use them outside of forms unless injected with JavaScript.

A Bit on Buttons is a post from CSS-Tricks

Link: https://css-tricks.com/a-bit-on-buttons/

Writing Smarter Animation Code

If you’ve ever coded an animation that’s longer than 10 seconds with dozens or even hundreds of choreographed elements, you know how challenging it can be to avoid the dreaded “wall of code". Worse yet, editing an animation that was built by someone else (or even yourself 2 months ago) can be nightmarish.
In these videos, I’ll show you the techniques that the pros use keep their code clean, manageable, and easy to revise. Scripted animation provides you the opportunity …

Writing Smarter Animation Code is a post from CSS-Tricks

Link: https://css-tricks.com/writing-smarter-animation-code/

CSS-Tricks Chronicle XXXII

Hey y’all! Time for a quick Chronicle post where I get to touch on and link up some of the happenings around the site that I haven’t gotten to elsewhere.

Technologically around here, there have been a few small-but-interesting changes.
Site search is and has been powered by Algolia the last few months. I started up writing some thoughts about that here, and it got long enough I figured I’d crack it off into it’s own blog post, so look …

CSS-Tricks Chronicle XXXII is a post from CSS-Tricks

Link: https://css-tricks.com/css-tricks-chronicle-xxxii/