Мы всегда продумываем структуру и стиль сайта отдельно. А в этом случае это было особенно важно, потому что гидов по фирменному стилю не было.
Это Style Tiles тут собраны различные элементы сайта: простой текст, заголовки и т.п. Мы сделали несколько цветовых схем. В итоге клиент выбрал эту. Так как свои фотографии делать не планировали, то было очевидно, что купленные, скорее всего, будут слишком разными, чтобы смотреться рядом друг с другом хорошо. Поэтому решили делать черно-белые картинки, а на экранах показывать цветные изображения, обязательно содержащие оранжевый цвет. Это объединит их визуально и заодно подчеркнет яркость самого решения DS.
Мы нарисовали иллюстрации видеостен, экранов и меню-бордов.
Сделали несколько иллюстраций для отраслей. Они показываются на главной странице.
Один из слайдов на главной странице
Еще мы сделали анимированную svg-схему. Она показывает работу системы. На устройства можно кликнуть и перейти на соответствующие разделы.
Схема реализована в двух вариантах: для широких экранов и мобильных.
Схема векторная, поэтому хорошо масштабируется. С сервера дополнительно скачиваются только растровые изображения на экранах. Остальное работает прямо на странице.
Сайт, конечно же, Mobile Friendly.
Все растровые картинки на сайте - адаптивные. Они масштабируются под под размер устройства на сервере.
Для этого сайта мы нарисовали ряд иконок. В этот раз мы не стали их делать бекграундом или отдельной картинкой, а сделали для них поле и вставляем прямо кодом. Это очень классно потому что:
Самая “тяжелая” главная страница в ее десктопном варианте загружается менее 3 секунд.
Кроме адаптивных картинок и инлайн-иконок для скорости мы используем:
C "подвалом":
Спасибо за внимание!
Проведите конкурс среди участников CMS Magazine
Узнайте цены и сроки уже завтра. Это бесплатно и займет ≈5 минут.