Screens & Devices

// the web is everywhere

The web no longer lives only on desktop computers. In 2026, more than 60% of all web traffic comes from mobile devices. But that's just the beginning. The browser has escaped the desk and is now on every screen imaginable.

When you build for the web, you're building for all of these at once — whether you plan to or not.

// every screen that runs a browser

📱 Smartphone — the dominant device. 375px–430px wide. Touch input. No hover. Vertical scroll. Battery and data conscious. Your site must work here first.

📟 Tablet — 768px–1024px. Touch and sometimes keyboard. Used for reading, media, light work. iPad Safari has its own quirks.

💻 Laptop / Desktop — 1280px–2560px. Mouse and keyboard. Multiple windows. Where most web development happens — but no longer where most browsing happens.

📺 Smart TV — 1920px–3840px (4K). Remote control navigation. No mouse. No touch. D-pad input. Netflix, YouTube, and thousands of web apps run in TV browsers. LG webOS and Samsung Tizen both run Chromium.

⌚ Smartwatch — 320px–400px at 1x but tiny physical size. Extremely limited interaction. Mostly notifications and quick actions.

🚗 Car Dashboard — Android Auto and Apple CarPlay run web-based interfaces. Voice-first. Distraction rules limit interaction complexity.

🥽 AR / VR Headsets — Meta Quest Browser, Apple Vision Pro Safari. Spatial web. 3D environments. The next frontier — and it runs on the same HTML/CSS/JS stack.

// mobile first

The industry standard is to design for the smallest screen first, then scale up. This is called mobile-first design. It forces you to prioritise — if something doesn't fit on a phone screen, it probably isn't essential.

CSS handles this with media queries — rules that apply only when the screen is a certain size. You'll use these in Website 101.