Browsers, Standards and Your Two References
Your page will be opened in browsers you do not use, on phones and laptops you do not own. That could be chaos: every browser deciding for itself what a heading or a colour means. It is not, because every browser maker implements the same public standards, documents that define exactly how HTML, CSS and JavaScript must behave. And two free references tell you, for any feature, what it does and whether it is safe to use today.
Electrical sockets are a good comparison. Because there is a public standard for them, any plug made to that standard fits any socket built to it, whoever made either. Web standards do the same for pages and browsers.
How Many Browsers Are There, Really?
There are dozens of browsers, but far fewer engines. An engine is the part of a browser that reads HTML, applies CSS, runs JavaScript and draws the page. The rest of the browser, its tabs, bookmarks and settings, is built around it.
Three engines matter. Blink is under Chrome, and also under Edge, Opera, Samsung Internet and most other browsers. Gecko is Firefox's engine. WebKit is Safari's engine. For years Apple required every browser on iPhone and iPad to use WebKit, whatever its name on the home screen; since 2024 the European Union, and since the end of 2025 Japan, have been exceptions where other engines are allowed. Either way, WebKit decides what most iPhone users see.
The practical result: testing your page in one browser from each engine, say Chrome, Firefox and Safari, covers almost every visitor you will ever have.
Who Writes the Rules?
Each language has a group that maintains its standard. The HTML standard, and the DOM from the previous topic, are kept by the WHATWG, a group formed by the browser makers themselves. CSS is defined by the CSS Working Group at the W3C, the World Wide Web Consortium. JavaScript's official name is ECMAScript, and its standard is written by a committee called TC39. The accessibility guidelines Chapter 12 teaches, WCAG, also come from the W3C.
These documents are public and free, and most of them are "living": they are updated continuously rather than released as numbered versions. You will almost never need to read one. What matters is that they exist, and that when two browsers disagree, the standard says which one is right.
MDN: What Does a Feature Do?
MDN, the MDN Web Docs, is the reference that working frontend developers keep open all day. Every HTML element, CSS property and JavaScript feature has a page there, written for people rather than for browser makers, and maintained by a community that includes the browser vendors.
Every MDN page has the same shape, so reading one teaches you to read them all. A summary at the top says what the feature is for. Then comes its syntax, what you type. Then working examples. At the bottom, a compatibility table shows which versions of which browsers support it. When a tutorial and MDN disagree, trust MDN: tutorials go out of date quietly, and MDN is corrected.
Baseline: Can You Use It?
New features arrive in browsers at different times, so a feature that works in one browser may still be missing from another. Baseline is a label, shown on MDN pages and elsewhere, that answers "is this safe to use?" in one word.
A feature is Baseline newly available once it works in the latest version of every major browser, on desktop and on phones. It becomes Baseline widely available about two and a half years later, once enough people have updated their browsers that almost every visitor has it. This book teaches only widely available features as normal. Where a newer feature is worth knowing, the page says it is new and when it arrived.
Why Isn't "It Works on My Computer" Enough?
You will test your pages in the browser you happen to use. Your visitors will not all use it. A feature you tried in Chrome may be missing in the version of Safari on someone's older iPhone, and the first you would hear of it is a visitor who gave up. Checking the Baseline label before you rely on something takes ten seconds, and it is the habit that keeps a page working for everyone.
- "Chrome is the web." Chrome is one engine of three. Safari's engine alone decides what most iPhone users see, so a page that only works in Chrome is broken for a large share of visitors.
- "Newer features are always better." A feature missing in one major browser breaks the page for everyone using it. Widely available is the safe bar.
- "A good tutorial is as reliable as the reference." Tutorials are written once and rarely updated. MDN and Baseline are maintained as browsers change.
- Two bookmarks, MDN and Baseline, answer most of the questions a working frontend developer has in a day.
- Writing to the standards is why pages built today will still open correctly in ten years.
Knowledge Check
Which engine does Firefox use?
- Blink, the engine that Chrome also uses
- WebKit, the engine that Safari also uses
- Gecko, its own engine that no other big browser uses
- A new engine it builds for each new version
What does Baseline "widely available" tell you about a feature?
- It arrived in every major browser in the last month
- It has worked in every major browser for years
- Most popular websites already use it on their pages
- It works in Chrome, which most visitors are using
You want to know what a CSS property does and see an example. Where do you look first?
- MDN, which has a page for every property
- The CSS standard, read from the beginning
- The Baseline label, which explains each feature
- The first tutorial a search engine finds for it
Why is testing in Chrome, Firefox and Safari enough to cover almost every visitor?
- Because nobody uses any browser except these three
- Because other browsers copy what these three display
- Because almost every browser uses one of their engines
- Because the standards only apply to these three
You got correct