Back in 2008, smartphones were a small market and it was commonplace for sites to be designed for a fixed width - say, 900px or 960px - with the page centered if the browser window was larger. Many designers said fluid width was better, but since user screens typically varied between 1024x768 and 1920x1080, fluid width allowed longer line length than is optimal for ease of reading, and so many sites (including Stack Exchange) use fixed width.
Now that mobile devices are common, what is the the best approach to support both desktop and mobile browsers?
- Establish a separate mobile site (e.g: mobile.example.com)
- Serve a different CSS to mobile devices; if so how? Server-side browser sniffing, or a @media rule?
- Some kind of fluid layout
- Something else?