Моды нужны только тогда, когда одни и те же элементы часто принимают разный внешний вид. У вас же пагинация всегда будет одинаковой. Не нужно абстрагировать слишком сильно, это ловушка.
1. Делайте простенький веб сайт, который будет заточен под экран айфона.
2. Вставляете в свой imock iframe нужных размеров.
3. Внутрь этого ифрейма подгружаете свой мини сайтик-имитацию приложения.
4. Profit!
Просто хорошая, сделанная вручную, анимация. Всё работает на CSS3.
Вам помогут такие инструменты как: transform-origin, transform rotate, transform translate, transform skew, transition, animation, keyframes.
Никаких запасов. Дизайнер должен нарисовать эти иконки в векторе.
Сегодня большинство браузеров отлично поддерживают SVG-иконки и шрифты. Пример: Font awesome
Даже если без SVG, это уже задача верстальщика, векторные иконки конвертировать в png-шки любых нужных размеров.
- автоматическое прохождение летающим дроном (коптером) маршрута в условиях мегаполиса и ограничения предельной высоты полёта
или скажем
- управление кластером летающих дронов, позиционирование относительно друг друга, групповые задачи на сложные действия (вроде переноски вещей, одновременной съемки с разных ракурсов и т.д.)
Чтобы делать кроссбраузерно нужно соблюдать только 2 условия:
1. Использовать Normalize.css
2. Смотреть результаты работы и проверять функциональность во всех доступных браузерах и на всех доступных устройствах. У вас должны стоять все основные браузеры: Chrome, FF, Opera, IE, Edge. Для старых версий IE у вас должны стоять виртуальные машины (они есть бесплатные). Так же желательно иметь пару тройку мобильных устройств (например купить по дешевке подержанный айфон, андройд и какой-нибудь планшет вроде айпада).
Вот собственно и всё. Основные проблемы с кроссбраузерностью вы будете получать при разработке под IE < 11, так что познаете на практике где и что. Главное сразу, после каждого завершенного блока, тут же смотреть результат во всех браузерах.
1. В общении с заказчиком делаете заметки в произвольной форме.
2. Пользуясь инструментом для создания Wirefames (раз, два), создаёте концепт всех страниц сайта. Чем больше деталей, тем лучше.
3. Согласовываете с с заказчиком этот концепт (при желании его можно подписать как приложение к договору)
4. Создаёте пару тройку цветовых решений, согласовываете. Можно даже накидать такой же фрейм в нужных цветах.
5. Собственно рисуете сам дизайн строго по фреймам.
Это проблема любых языков, которые компилируются в JS (ES2015, CoffeScript, TypeScript и т.д.) Они не работают в браузере нативно, так что в любом случае тесты будут бегать лишь на рабочем коде. Другое дело, что ES2015 уже скоро будет работать в браузерах (в том же хроме многие его части работают при включенном "use strict"). Так что просто подождите год)
Обычно должно быть 5-7 размеров
1. Смартфон в вертикальном положении (320-400)
2. Смартфон на боку (480 - 650)
3. Планшет в вертикально положении (768)
4. Планшет на боку (1024)
5. Десктоп (обычно 1200 и 1600).
Между этими размерами должна быть какая-то резина, чтобы переход был плавным и смотрелось нормально на нестандартных девайсах.