В статье проводится анализ современной системы электронного взаимодействия, а также основных технологий процесса производства web-сайтов. Описываются основные этапы и принципы проектирования, создания и верстки макета сайта. Автор исследования делает акцент на влиянии визуальной композиции веб-сайтов на формирование культуры пользователей сети Интернет.
Ключевые слова: web-сайт, web-дизайн, графическое оформление сайта, вебмастеринг, интернет-культура
В современных условиях глобальная телекоммуникационная сеть информационных и вычислительных ресурсов приобретает свойства технически доступного и социально-массового явления, затрагивающего все сферы человеческой деятельности, что актуализирует исследование культуры Интернета. «Современные технологии взаимодействия открывают широкие возможности для создания культурного продукта с высокой степенью инноваций и креативности, который, в свою очередь, становится автономным источником формирования интернет-культуры, отличающейся высокой динамичностью, интерактивностью, вариативностью, полифункциональностью, способностью к саморазвитию и саморегулированию». [3]
Способом организации информации в Интернете является веб-дизайн. Пользователь воспринимает значение контента в том объеме и с теми коннотациями, в каком виде веб-дизайнер выразил их в композиции сайта и овладевает возможностями, традициями, моделями поведения интернет-культуры.
Веб-дизайн — это процесс производства web-сайтов, который включает техническую разработку, структурирование информации, визуальный (графический) дизайн и доставку по сети. Рассмотрим подробнее, из каких этапов состоит процесс создания веб-сайта. Детальное понимание процесса создания сайта даст нам возможность определить, чем занимаются на каждом этапе и кого принято называть веб-дизайнером. Исходя из четкого понимания цели, для которой создается сайт, объемов сайта, его функциональности задаются основные параметры визуального представления и структуры сайта. Данный этап заканчивается после утверждения технического задания заказчиком, с которым работает менеджер проекта.
На первом этапе происходит структурирование информации (юзабилити). Сюда входят форма и организация содержимого сайта, а также широкий ряд вопросов — от продумывания логической структуры веб страниц до выбора наиболее удобных форм подачи информации. Дизайнер, менеджер проекта прорабатывает концепцию графического оформления сайта. В графическом редакторе компонуется визуальное пространства сайта с помощью элементов украшения или навигации. [1] Собственно, дизайн страницы представляет собой графический файл, который выполняется дизайнером.
Далее происходит верстка сайта, на этой стадии графическая картинка нарезается на отдельные элементы и с использованием технологий HTML и CSS трансформируется в код, который можно просматривать с помощью браузера. На стадии «вебмастеринга» осуществляются действия, способствующие распространению и эффективной доставки сайта по сети. Включает размещение на хостинге и поисковую оптимизацию. Выполняется админом, вебмастером.
Веб-дизайнер — это человек, самостоятельно осуществляющий запуск сайта и выполняет все этапы создания сайта своими силами. При этом следует понимать, что веб-дизайнер может делегировать сторонним лицам выполнение некоторых этапов, но при этом сам контролирует весь процесс. Сам веб-дизайнер должен быть специалистом широкого профиля и разбираться во всех аспектах веб-дизайна. Элементы веб-дизайна — это те абстрактные материалы, с которыми приходится работать дизайнеру.
К основным элементам дизайна относятся: пространство, линия, фигура, цвет, текстура, шрифт, форма, светотень, размер. Именно из них, как из кирпичиков, строится вся композиция дизайна. Чтобы правильно ими пользоваться, надо знать их характерные свойства, сильные и слабые стороны, поведение в разных ситуациях. Современный веб-дизайн базируется на принципах акцентирования, контраста, балансировки, выравнивания, повторения и удобстве восприятия.
- Акцентирование — это подчеркивание особой важности или значимости какого-либо элемента. Во многом оно тесно связано, а то и совпадает с понятием иерархии. Чтобы соблюсти в процессе создания сайта принцип акцентирования, необходимо проанализировать содержимое сайта и выяснить, какая иерархия элементов имеет место в его содержимом. Отличный способ определить, на чем нужно сделать акцент — представить себе перечень элементов, которые требуются на веб-странице. Затем необходимо определиться, каков будет порядок важности этих элементов. После этого можно приступать к созданию дизайна, в котором визуальная иерархия веб-страницы будет отражать важность элементов, определенную вами ранее. Всегда лучше заранее решить, какие именно элементы будут иметь приоритет в визуальном плане.
- Контрастирование — это визуальная дифференциация двух и более элементов. Элементы с высокой степенью контрастирования выглядят четкими и обособленными, в то время, как элементы с низкой степенью контрастирования кажутся сливающимися и имеют тенденцию смешиваться в единую массу. Существует множество характеристик элементов дизайна, которыми можно манипулировать с целью достижения необходимой степени контрастирования элементов, включая цвет, размер, местоположение, тип и толщину шрифта. Если элементы дизайна будут контрастировать между собой, это придаст визуальное разнообразие сайту и позволит избежать заурядности в его внешнем виде. Контрастирование также позволяет привлекать внимание, обеспечивая акцент на определенных элементах.
Между основными принципами дизайна имеется взаимосвязь, которая проявляется в том, что контрастирование затрагивает акцентирование, удобство восприятия и прочие принципы дизайна. Самое большое влияние контрастирование оказывает на визуальную иерархию веб-страницы, поскольку оно часто используется для обеспечения желаемого акцента на конкретных элементах. [2]
Таким образом, оно помогает быстро привлекать внимание к ключевым элементам, например, к содержимому, элементам, позволяющим содержать определенные действия, или к тексту, дающему понять, в чем заключается назначение сайта. Как и всегда, следует принимать в расчет цель, преследуемую сайтом, чтобы намеренно привлекать внимание пользователя к соответствующим элементам посредством продуманного контрастирования.
- Принцип балансировки крутится вокруг идеи о том, как распределены элементы в дизайне и как они соотносятся с общим распределением визуальной нагрузки в рамках веб-страницы. От этого зависит то, насколько уравновешенным окажется дизайн в визуальном плане. Группирование элементов в дизайне создает визуальную нагрузку. Обычно эта нагрузка уравновешивается путем использования равнозначной нагрузки, находящейся на противоположной чаше «весов», благодаря чему достигается баланс в дизайне. Если не сделать этого, то результатом будет ощущение неуравновешенности дизайна, хотя сие не означает, что дизайн обязательно будет плохим. Однако, хорошо сбалансированный дизайн создает тонкое ощущение уравновешенности и, как правило, оказывается более привлекательным. Баланс бывает двух видов: симметричный и асимметричный.
Симметричный баланс в дизайне достигается, когда левая и правая половины дизайна относительно той или иной оси являются как бы зеркальными копиями друг друга и несут идентичную визуальную нагрузку. Как правила, это характерно для сайтов, где логотип и верхнее меню визуально располагаются по центру.
Асимметричный баланс достигается, когда визуальная нагрузка в рамках веб-страницы равномерно распределяется по той или иной оси, однако, отдельные элементы двух составляющих дизайна не являются зеркально одинаковыми. Балансировка является одним из тонких аспектов дизайна, к которому многие разработчики и заказчики приходят инстинктивно.
- Выравнивание — это упорядочение элементов таким образом, чтобы они максимально близко подступали к естественным линиям или границам, которые они образуют. Данный процесс часто называют работой с сеткой. Не выровненные элементы имеют тенденцию отбиваться от общей группы и требовать унификации, к примерам выровненных элементов можно отнести расположенные по одной линии заголовки двух столбцов, либо левые края находящихся друг над другом элементов, выровненных относительно друг друга. Однако, на веб-страницах возможны и намного более замысловатые выравнивания, которые позволяют добиться унифицированного и привлекательного дизайна.
При выполнении этой задачи часто оказывается утомительным и сложным воспроизвести в дизайне выравнивание, которое задумывалось изначально. Однако проблема заключается не только в самой процедуре, но также и в том, что эти детали очень легко упустить из виду. Поэтому знание того, что необходимо соблюдать принцип выравнивания, является немаловажным для веб-разработчика при реализации дизайна в коде.
- Повторение предполагает неоднократное использование в дизайне одних и тех же элементов разными способами. Дизайн, который содержит повторения, становится унифицированным. Повторение может выражаться во множестве форм, включая использование того же цвета, очертаний, линий, шрифтов, изображений и общего подхода к стилизации. Зачастую соблюдение данного принципа оказывается неизбежным, поскольку если дизайн не включает в себя повторяющихся элементов, то это обычно свидетельствует о том, что он лишен логической связанности. Пользователь ожидает увидеть уже знакомые ему вещи, если в ключевых элементах дизайна прослеживаются согласованность и постоянство. Слишком часто бывает так, что тот или иной сайт теряет свою визуальную связанность из-за того, что на каждой его странице дизайнер использует совершенно разные подходы к оформлению, вместо того, чтобы выработать какую-то одну методику и брать ее за основу.
- Удобство восприятия — это принцип, которого пользователь придерживается при визуальном ознакомлении с элементами дизайна. Оно главным образом зависит от того, на чем дизайнер сделал акцент и в какой мере он обеспечил контрастирование элементов между собой. Фактически удобство восприятия всецело будет зависеть от того, как дизайнер скомпоновал все элементы страницы. Чтобы обеспечить удобство восприятия, необходимо учитывать естественный порядок вещей. Обычно человек скользит взглядом слева направо и сверху вниз, именно поэтому сайты, которые навязывают пользователям изучение содержимого справа налево, отталкивают тех, кто привык это делать слева направо. Предпочтение будут иметь те сайты, которые обеспечивают плавный, комфортный и максимально естественный процесс восприятия. Сайт, который обеспечивает удобное восприятие, способствует тому, чтобы у человека возникло желание еще раз пройтись взглядом по тому, что он уже посмотрел, то есть поддерживать у него интерес.
Современный веб-дизайн сайтов — индустрия абсолютно не статичная, ее развитие настолько стремительно, что уследить за всем происходящим не всегда удается. Опытные дизайнеры всегда стараются спрогнозировать важнейшие направления, потому что только так можно получить преимущество перед конкурентами, выделиться на общем фоне. Главным ресурсом вдохновения дизайна традиционно остается веб-пространство и все, что его окружает. Новая система электронного взаимодействия, сформированная веб-дизайном, посредством визуальной композиции веб-сайтов транслирует культурные ценности и формирует восприятие и культуру пользователей.
Литература:
- Веб-дизайн/ DesigNonstop — О дизайне без остановки [Электронный ресурс] — URL: http://www.designonstop.com/webdesign/article/chto-takoe-veb-dizajn-ego-osnovnye-elementy-etapy-i-principy.htm (дата обращения: 26.09.16)
- Веб-дизайн/ Журнал WebForMySelf: все для создания сайта [Электронный ресурс] — URL: http://webformyself.com/trendy-veb-dizajna-glavnye-napravleniya-2016-goda (дата обращения 26.09.16)
- Ляшенко Е. С. Семантика веб-дизайна интернет-культуры/ автореферат диссертации по культурологии [Электронный ресурс] — URL: http://cheloveknauka.com/semantika-veb-dizayna-internet-kultury#ixzz4N0Wu3CSK (дата обращения: 26.09.16)
- Макнейл П. Веб-дизайн. Идеи. Секреты. Советы. М.: Вильямс, 2010. — 480 с.
