Link tags: resource

Start at the beginning: the importance of learning the basics - localghost

I’d recommend going in the order HTML, CSS, JS. That way, you can build something in HTML, add CSS to it as you learn it, and finally soup it up with your new-found JS knowledge.

Excellent advice for anyone new to web develoment.

Once you start getting into interactive website territory, with API calls and fancy stuff, that’s where you need JavaScript (JS) knowledge. More specifically, vanilla JS: plain JS with no additional frameworks or plugins. The JS that your browser understands without having to do any pre-processing. It makes working with frameworks a whole lot easier, and it’ll help you to know when not to use a framework (and avoid making users download massive JS bundles when all you need is a tiny bit of code).

Can I include a tag to a tag? Based on HTML Spec WHATWG

A neat little tool when you need a reminder about what elements can go in other elements.

Tiny Helpers

A very comprehensive collection of standalone little tools for web design and development—tools that do one thing.

Learn CSS

This is a great (free!) course on learning CSS from the basics up. Nicely-pitched explanations with plenty of examples.

Library: Accessibility resources, guides, communities, and more

A very comprehensive directory of accessibility resources.

A Complete Guide To Accessible Front-End Components — Smashing Magazine

Vitaly has rounded up a whole load of accessibility posts. I think I’ve linked to most of them at some point, but it’s great to have them all gathered together in one place.

Responsible Web Applications

An excellent collection of advice and examples for making websites responsive and accessibile (responsive + accessible = responsible).

Operator Lookup - Search JavaScript operators · Josh W Comeau

Operators in JavaScript—handy! I didn’t know about most of these.

AddyOsmani.com - Preload late-discovered Hero images faster

Did you know there’s an imagesrcset attribute you can put on link rel="preload" as="image" (along with an imagesizes attribute)?

I didn’t. (Until Amber pointed this out.)

Service Workers | Go Make Things

Chris Ferdinandi blogs every day about the power of vanilla JavaScript. For over a week now, his daily posts have been about service workers. The cumulative result is this excellent collection of resources.

Grid Cheatsheet

A useful resource for CSS grid. It’s basically the spec annoted with interactive examples.

Lightning-Fast Web Performance: an online lecture series from Scott Jehl

Scott is brilliant, therefore by the transitive property, his course on web performance must also be brilliant.

Modern CSS Solutions

…for old CSS problems.

Very handy!

Front-end Bookmarks

A collection of articles and talks about HTML, CSS, and JS, grouped by elements, attributes, properties, selectors, methods, and expressions.

A Variable Fonts Primer

Everything you ever wanted to know about variable fonts, gathered together into one excellent website.

iHateRegex - regex cheatsheet for haters

Piece together your own regular expression or choose from a pre-made selection.

(Like the creator if this site, I’m not a fan of regular expressions …or they’re not a fan of me. The logic just doesn’t stick in my brain.)

Design Questions Library | d.school public library

This site is not meant to be exhaustive, but rather a useful guide—our FAQ for design understanding. We hope it will inspire discussion, some questioning, a little soul searching, and ideally, a bit of intellectual support for your everyday endeavors.

The Design Questions Library goes nicely with the Library of Ambiguity.

ffconf - Web development & JavaScript conference in Brighton, UK

All of the talks from ten years of FF Conf …including this pretentious one from five years ago.

Preload, prefetch and other link tags: what they do and when to use them · PerfPerfPerf

Following on from Harry’s slides, here’s another round-up of thoserel attribute values that begin with pre.

More Than You Ever Wanted to Know About Resource Hints - Speaker Deck

Slides from Harry’s deep dive into rel values: preconnect, prefetch, and preload.