Обычно ориентируются по ширине экрана клиентского устройства. Например, 640px - телефон, 980px - планшет, 1200 - десктоп. В CSS используют блоки типа
media (max-width: 640px) { настройки стиля для телефона } и т.п.
В готовых фреймворках типа UIkit или Bootstrap существуют готовые классы для быстрой и удобной адаптивной вёрстки.
