Adaptive design is a way of building a website where you create several fixed layouts, each aimed at a common screen size, and the site serves whichever one is closest to the visitor’s device. So a phone might get a single-column version while a desktop gets a wide multi-column one.
Compare it to a clothing shop that stocks small, medium and large rather than one stretchy fabric that fits everyone. Each size fits its group well, but if your body sits between two sizes you get the nearest match, not a perfect one. That is the trade-off with adaptive design: tight control over each layout, but only at the breakpoints you decided in advance. Its main alternative, responsive design, instead uses one fluid grid that bends smoothly to any width.
How does the site know which version to serve? It checks the screen width, often at fixed thresholds like 320, 768 and 1024 pixels, and loads the layout built for that band. The upside is real: because each layout is hand-tuned, you can hide a heavy data table on mobile and show a lean summary instead, rather than shrinking the desktop version until it is unusable.
The catch shows up in maintenance. A new screen size that falls between your bands gets the nearest layout, which may look slightly off, and every content change has to be applied across each version. That is why most teams now start responsive and reach for adaptive only when a device genuinely needs a different experience.
At TopDevs we usually build responsive by default and use adaptive techniques only where a specific device, like a kiosk or in-car screen, calls for its own deliberate layout.
