So, you think you’ve got project management nailed down

(This is a sponsored post.)
Who needs a project manager? You’re an organized person who can keep track of your own work, right?
Wrong.
Well, wrong if you’re part of a team. The thing about being self-organized is that it’s related to project management but not synonymous with it. Case in point: what happens if your project relies on someone else’s involvement? Sure you’re organized, but can you always say the same about your co-workers? Chances are you need … Read article
The post So, you think you’ve got project management nailed down appeared first on CSS-Tricks.

Link: https://synd.co/2Jrcs8A

Frontend Masters: The New, Complete Intro to React Course… Now with Hooks!

(This is a sponsored post.)
Much more than an intro, you’ll build a real-world app with the latest features in React including 🎣 hooks, effects, context, and portals.
We also have a complete React learning path for you to explore React even deeper!
Direct Link to Article — Permalink… Read article
The post Frontend Masters: The New, Complete Intro to React Course… Now with Hooks! appeared first on CSS-Tricks.

Link: https://synd.co/2xyVxeO

Developing a robust font loading strategy for CSS-Tricks

Zach Leatherman worked closely with Chris to figure out the font loading strategy for this very website you’re reading. Zach walks us through the design in this write-up and shares techniques that can be applied to other projects.
Spoiler alert: Font loading is a complex and important part of a project.
The really interesting part of this post is the way that Zach talks about changing the design based on what’s best for the codebase — or as Harry Roberts … Read article
The post Developing a robust font loading strategy for CSS-Tricks appeared first on CSS-Tricks.

Link: https://www.zachleat.com/web/css-tricks-web-fonts/

Nownownow

Matthias Ott, relaying an idea he heard from Derek Sivers:

Many personal websites, including this one here, have an “about” page. It’s a page that tells you something about the background of a person or about the services provided. But what this page often doesn’t answer – and neither do Twitter or Facebook pages – is what this person really is up to at the moment. A page that answers questions like: What are you focused on at this

… Read article
The post Nownownow appeared first on CSS-Tricks.

Link: https://matthiasott.com/notes/nownownow

Why I don’t use web components

Here’s an interesting post by Rich Harris where he’s made a list of some of the problems he’s experienced in the past with web components and why he doesn’t use them today:

Given finite resources, time spent on one task means time not spent on another task. Considerable energy has been expended on web components despite a largely indifferent developer population. What could the web have achieved if that energy had been spent elsewhere?

The most convincing part of Rich’s … Read article
The post Why I don’t use web components appeared first on CSS-Tricks.

Link: https://dev.to/richharris/why-i-don-t-use-web-components-2cia

Render Snarky Comments in Comic Sans

Hilarious idea by Zach Leatherman. To test if a comment is “snarky" or not, there is an npm package up to the task.
On this site, we generally just delete snarky comments, but I still run a WordPress plugin that allows me to "feature" or "bury" comments. It’s old but it still works fine in the latest WordPress. We use the bury functionality for comments that aren’t rude, snarky, or spam, but also don’t add much to the post. … Read article
The post Render Snarky Comments in Comic Sans appeared first on CSS-Tricks.

Link: https://www.zachleat.com/web/snarky/

Hello Subgrid!

Rachel Andrew’s talk at CSSconf is wonderful because it digs into one of the most exciting changes that’s coming soon to a browser near you: subgrid! That’s a change to the CSS Grid spec that allows for much greater flexibility for our visual designs. Subgrid allows us to set one grid on an entire page and let child elements use that very same grid tracks.
The reason why I’m very excited is because this solves one of the most … Read article
The post Hello Subgrid! appeared first on CSS-Tricks.

Link: https://www.youtube.com/watch?v=vxOj7CaWiPU

Drop caps & design systems

Ethan Marcotte has written up his process for how to make drop caps accessible for screen readers and browsers alike. All of that is very interesting and I’m sure I’ll use a technique like this in the near future, but the part that made me hop out of my seat is where Ethan notes his experience with design systems at Vox:

Since rolling out our new and improved drop caps, we’ve continued to iterate on them. (Including fixing a number

… Read article
The post Drop caps & design systems appeared first on CSS-Tricks.

Link: https://product.voxmedia.com/2019/6/17/18524029/the-ballad-of-drop-caps-and-design-systems

Every Layout

Every Layout is a new work-in-progress website and book by Heydon Pickering and Andy Bell that explains how to make common layout patterns with CSS. They describe a lot of the issues when it comes to the design of these layouts, such as responsive problems and making sure we all write maintainable code, and then they’ve provided a handy generator at the end of each article to create our own little frameworks for dealing with these things.
They also have … Read article
The post Every Layout appeared first on CSS-Tricks.

Link: https://every-layout.dev/

Grid, content re-ordering and accessibility

Take this:

    <li>Get hungry</li>
    <li>Order pizza</li>
    <li>Eat pizza</li>
    </ol>
    That HTML ends up in the DOM that way (and thus how it is is exposed to assistive technology), and by default, those list items are also visually shown in that order. In most layout situations, the visual order will match that DOM order. Do nothing, and the list items will flow in the block direction of the document. Apply flexbox, and it will flow in the inline direction of … Read article
    The post Grid, content re-ordering and accessibility appeared first on CSS-Tricks.

    Link: https://rachelandrew.co.uk/archives/2019/06/04/grid-content-re-ordering-and-accessibility/