Learn how to add a favicon to your website: which files you need (SVG, ICO, Apple touch icon, manifest icons), the link tags to use, how to design an icon that stays readable at 16 pixels, and how to fix caching problems. Includes a live icon designer that changes this page's real tab icon.
Learn how character encoding works in HTML: what UTF-8 is, how meta charset tells the browser how to read your page, why text turns into garbled symbols, and how to fix it. Includes a live encoding lab with real bytes and a real page rendered with different encodings.
Start learning the HTML head: what goes inside it, how html, head, title, meta, charset, viewport, link, favicon, style, script and base work together, who reads each tag, and a live look at the head of a real page, with a clickable map of every head element.
Bring the whole HTML head together: a complete, correctly ordered head template, a checklist for essentials, search, sharing, performance, accessibility, security and global audiences, and tools to test it. Includes a live head auditor that scores your page, and a head generator that builds a complete head for you.
Learn the HTML base element: how it changes the starting address of every relative link, image and form, how it affects fragment links like #top, how base target works, why it is risky, and what to use instead. Includes a live URL resolver and a base tag checker.
Learn what belongs inside the HTML head element, what does not, and what the browser does when you break the rules. Includes a live parser lab that shows where the browser really puts each element, and a simulation of how script loading affects your page.
Learn the HTML link element: how it connects your page to stylesheets, icons, canonical addresses, translated versions, feeds, and performance hints like preload and preconnect. Includes a live stylesheet lab, a real link-tag checker, and an hreflang builder.
Learn the HTML meta element: name and content pairs, http-equiv, descriptions, robots, theme-color, color-scheme, and social sharing tags. Includes a live meta tag checker that uses the browser's real parser, and a social card preview builder.
Learn the HTML script element: inline and external scripts, defer, async and type module, where to place scripts, data blocks like JSON-LD, noscript fallbacks, and how to load JavaScript safely. Includes a live loading-order experiment, a script tag checker, and a JSON data block demo.
Learn the HTML style element: how to write CSS directly inside your page, when that is better than an external file, how the order of rules decides which one wins, and how a Content-Security-Policy can block inline styles. Includes a live CSS editor, a cascade-order lab, and a real CSP experiment.
Learn how to write great HTML page titles: where the title shows up, how long it should be, how to structure it for search results and screen readers, what characters are safe, and how to update it in single-page apps. Includes a live tab and search-result preview.
Learn the viewport meta tag: why phones need it, what width=device-width and initial-scale=1 do, why you should never block zoom, safe-area settings for notched phones, and how it connects to responsive CSS. Includes a live viewport reader and a mobile page simulator.