EN

Tips・New here? Start here

A collection of go-to sites for gathering info on web development

From the dictionary you pull out when stuck, to the place you ask when you are truly lost, to the know-how of working pros. Here are 9 classic info sites that make learning web development go faster, each with a note on when to use it.

Getting better at web development comes mostly from time spent building, but where you look things up and where you run into new ideas changes how fast you grow. This article gathers 9 classic info sites worth knowing from your beginner days. They’re grouped by role, so to start, just bookmarking the two “dictionaries” is plenty.

”Dictionaries” you pull out when stuck

MDN Web Docs

The reference closest to the official standard for HTML, CSS, and JavaScript. Run by Mozilla, the maker of Firefox, it lists the exact specs of tags and properties, which browsers support them, and real examples. Searching like “mdn flexbox” is the standard way to use it. The Japanese version is well filled out, too.

The top page of MDN Web Docs. It shows the heading “Resources for Developers, by Developers” and a search button
The place to return to when in doubt—web development’s “dictionary.”

MDN Web Docs

W3Schools

A tutorial site that explains HTML, CSS, and JavaScript in the shortest possible form. Every page has a “Try it Yourself” editor, so you can rewrite the sample and see the result on the spot. When MDN feels stiff and hard, grasping the idea here first and then returning to MDN works well.

The W3Schools top page. Tutorial menus for HTML, CSS, and JavaScript are lined up
Short explanations plus an editor you can touch right away. Good for a first pass.

W3Schools

Where you ask when you’re truly stuck

Stack Overflow

The largest Q&A site for programmers. Paste an error message into a search and there’s a high chance you’ll find a question from someone who got stuck in the same place, with a worked-out answer underneath. In practice you’ll read it far more often than you post to it.

The Stack Overflow questions page. Questions are listed with their tags and vote counts
The first place you’ll come to rely on when searching for a fix to an error.

Stack Overflow

DEV Community

A posting community where developers from around the world gather. It mixes everything from beginners’ study logs to the know-how of active engineers, and its low barrier to entry is its charm. It’s a friendlier room than Stack Overflow, and a good place to start writing things up yourself.

DEV Community’s top page. It shows the community’s post feed
You get the feeling of hanging out in the same place as learners around the world.

DEV Community

Learn from the working pros

CSS-Tricks

A long-standing outlet that, true to its name, has piled up CSS techniques. Its illustrated guides to Flexbox and Grid are effectively the standard textbook, and its explanations of new CSS features are fast and deep.

CSS-Tricks’s top page. An article introducing the new border-shape property is displayed large
The guides that come up when you search “css tricks flexbox” are worth a look.

CSS-Tricks

Smashing Magazine

A long-standing magazine for web design and front-end. From design and UX to accessibility and coding, it’s strong on long-form articles that make you sit down and read, with high density in every single one.

Smashing Magazine’s top page. It shows an article about UX and a list of category tags
Settle in and read one, and you’ll surely come away with something—a magazine-style outlet.

Smashing Magazine

Codrops

A legendary site that keeps sharing demos and tutorials of high-end web expression. Honestly, a lot of its content is still hard for beginners, but as a place that gives you the surprise of “the web can do this much,” just glancing at it now and then is enough to make you want to build something.

Codrops’s top page. A showcase of creative web expression lines up
A showcase at the cutting edge of web expression. For a feast for the eyes and for setting goals.

Codrops

Free places to learn from scratch

web.dev

A collection of web-development best practices run by Google. Since it’s an official guide from the side that makes a browser, it’s reliable when you want to know the “right answer” for performance or accessibility. The Learn series (Learn CSS, Learn HTML) is used around the world as a free textbook.

web.dev’s top page. It shows the heading “Building a better web, together”
Google’s official web-development guide. The Learn series is ideal for systematic self-study.

web.dev

freeCodeCamp

The blog of a nonprofit platform where you can learn programming for free. The sheer volume of its tutorial articles is overwhelming, and searching “how to do X” in English hits here quite often. Reassuringly, much of its writing is careful and beginner-friendly.

freeCodeCamp’s news page. Programming tutorial articles line up in a list
Thousands of tutorials, all free. It’s popular with people learning English at the same time.

freeCodeCamp

Tips for keeping up your info gathering

  • Separate dictionaries from reading material — MDN and W3Schools are “pulled out when stuck,” the rest are “glanced at now and then.” You don’t need to follow all of them every day
  • Search before you ask — for almost any error you hit as a beginner, someone has already asked about it on Stack Overflow. Pasting the error text into a search is the fastest first move
  • Build the habit of checking the publish date — web tech evolves fast, so an old article’s approach may be deprecated today. When in doubt, check the current spec on MDN
  • Watch out for input overload — reading one article and moving your hands builds your skills more surely than reading ten

Summary

  1. First, bookmark the two dictionaries (MDN and W3Schools) — just having a place to return to when stuck feels reassuring
  2. Stack Overflow is your ally for error searches, and DEV Community is a friendly room for reading and writing study logs
  3. CSS-Tricks, Smashing Magazine, and Codrops give you the techniques and the atmosphere of the field; web.dev and freeCodeCamp are free textbooks for systematic study

FAQ

Should I bookmark them all and read them every day?
You don't need to read them. Keep two "dictionaries to pull out when stuck" (MDN and W3Schools), and occasionally glance at one or two favorites—that's the sustainable amount. When gathering information becomes the goal, your hands stop moving, so keep your building time front and center.
The explanations on MDN feel stiff and hard to read. Is that normal?
That's normal. MDN is written as a reference close to the official spec, so it's precise but dry. Grasp the idea on W3Schools or a tutorial first, then go back to MDN to confirm the exact behavior—that order works well.
How can I tell whether the information is new or old?
Make a habit of first checking the article's publish date and update date. CSS and JavaScript in particular evolve fast, and a "standard" from five years ago can be deprecated today. When in doubt, checking the current spec on MDN is the sure way.
Is it okay to ask a question on Stack Overflow as a beginner?
It is, but search first—the same question has almost certainly been asked already, and finding the existing answer is faster. If you do post, include what you tried, the exact error text, and a small piece of code that reproduces it, and you'll get a much better response.

Popular tips