Дипломная работа: Графическая концепция web-сайта
Внимание! Если размещение файла нарушает Ваши авторские права, то обязательно сообщите нам
12
Рис. 1.1. Сайт infocernch
О визуальном оформлении сайтов не говорили до середины апреля 1993
года, когда выпустили первый графический браузер Mosaic, поддерживающий
просмотр изображений. Так в однообразный и всем приевшийся текст стали
добавлять картинки.
1994-1996 гг
В этот период разработчики сайтов начинают добавлять, как можно
больше красок и цветных фонов. Что в то время вызвало восторг от
использования ярких, пестрых цветов. В эти годы, в добавок ко всему,
появляется возможность использования различных шрифтов, в частности Times
New Roman и Courier New. Чуть позже разработчики начали размещать на
страницах GIF-изображения.
Рис 1.2. Пример сайта 1994 года
1997-1998 гг
Внешний вид сайта начинает постепенно становится похожим на
привычные нам: сайты теперь строят на основе табличных макетов, добавляют
эффекты и навигационное меню с иконками. Также активно развиваются flash-
технологии, которые позволяют добавлять мигающие заставки. Однако со
13
временем с ними, как и с изобилием ярких цветных фонов и заголовков,
начинается серьезный перебор. Помимо всего прочего, данный период
сайтостроения выделяется активной интеграцией маркетинговой ркламы в
дизайн. Чуть ли не на каждом сайте можно было увидеть всевозможные
рекламные баннеры с лозунгами компаний.
Рис. 1.3. Сайт компании «Apple»
1999-2003 гг
В начале XXI века в web-дизайне появляется спрос на скругленные
углы, переливающиеся кнопки и градиенты. Яркий фон стал отходить на
задний план, и теперь он становится однотонным. Сайты наконец начинают
выполнять свое прямое предназначение и при разработке сайтов дизайну
уделяется меньше внимания. Они становятся намного доступнее и обзаводятся
более удобным пользовательским интерфейсом.
Рис. 1.4. Сайт компании «Яндекс»
14
2004-2006 гг
Начинается эпоха Web 2.0. С приходом Web 2.0 веб-дизайнеры стали
отдавать предпочтение тени, глянцу иконок и кнопок, мягким цветам
интерфейсов. Также делается большой упор на читаемый и функциональный
контент и интеграция в ресурсы анимации.
Рис. 1.5. Сайт компании Nokia
2007-2010 гг
С этого периода дает начало активное развитие мобильных приложений,
а вместе с этим, появляются мобильные версии веб-сайтов. Именно здесь берет
свое начало такое явление, как «адаптивность». Создаются первые социальные
сети и, как следствие, получает распространение рекламы в виде размещения
их иконок на различных сайтах. Активно внедряются длинные макеты сайтов.
Обширное распространение получают стоковые фотографии и новое явление –
скевоморфизм
1
.
1
Скевоморфи
зм — физический орнамент или элемент дизайна, который скопирован с формы другого
объекта, но изготовлен из других материалов или иными методами.
15
Рис. 1.6. Сайт компании Thailand Fruits
2011-2014 гг
В этот период начинает все больше развиваться простой, удобный и
лаконичный дизайн, также появляются такие тенденции, как плоский дизайн и
параллакс. Значительное внимание продолжают уделять адаптивности веб-
сайтов.
Рис. 1.7. Сайт компании Desktime
2015-2016 гг
В это время мир веб-дизайна начинает внедрять черты материального
дизайна, высокого разрешения графики, а также стала появляться
интерактивность. Особую популярность получили видеоконтент и
16
скроллджекинг
2
. Дизайнеры начать ставить фокус на индивидуальность и
креативность, в предпочтение вывели уникальную графику и авторские
иллюстрации. Внушительная часть сайтов, которые мы сейчас посещаем
являются представителями именно этого периода.
Рис. 1.8. Сайт компании Ciga
1.2 Сетки построения сайтов
Люди всегда интуитивно пользовались чувством пропорции. Это
несложно увидеть, потому что уже с самых ранних этапов становления
человечества можно увидеть связь пропорций с измерением и
конструированием, расположением объектов относительно друг друга в
пространстве. Сетками, как разметкой, системой опорных линий, пользовались
для составления планов строительства и разделения территории, с помощью
нее художники эпохи Возрождения увеличивали свои эскизы.
Изначально сетка применялась исключительно в газетном
проектировании в целях повышения эффективности. Макетные листы
позволяли снизить издержки на содержание штатных типографов, подгоняя под
общие стандарты вид страниц и экономя время самих работников. Вскоре
на смену макетным листам пришли более гибкие модульные сетки.
Оба этих преобразования показали работникам индустрии, что единый
стиль оформления повышает качество взаимодействия читателей с изданием.
2
Скроллджекинг (scrolljacking)— послайдовый скролл.
Источник: https://baza.diplomsite.ru/previewfile/756