Когда появилась профессия веб дизайнер

Обновлено: 02.05.2024

2000 год. Интернет только начал активно появляться в СНГ. Не было wi-fi, не было планшетов, смартфонов. Были только кнопочные телефоны и то не у всех.

Монитор дизайнера был выпуклый и похожий на огромную коробку, на то время плоских мониторов тоже не было. А чтобы выйти в интернет, надо было подключать визжащий модем через телефонный шнур домашнего телефона. И все грузилось очень и очень долго. А за интернет вообще надо было платить за мегабайты. Не было понятия безлимитный трафик. Часто приходилось в браузере отключать картинки, чтобы прогуливаясь по интернету не растратить все деньги. Из всего доступного и нормального софта для веб-дизайнера был только Photoshop. Программа была весьма ценная и передавалась из рук в руки через знакомых и друзей, часто ее качали через локальные сети, которые проводились внутри дома между соседями. Торрентов не было и сильного пиратства как сегодня тоже. Софт было достать не всегда просто. Хотя еще были рынки. Да! Представляете? Чтобы установить Photoshop вам надо было пойти на рынок и найти продавца и купить у него CD диск. Полки с дисками выглядели именно так:

Впечатляет не так ли? Набор функций был весьма скромным. Сейчас пожалуй бы каждый продвинутый пользователь знал досконально этот фотошоп на все 100%.

Я даже больше скажу, Photoshop использовался только для того, чтобы просто нарисовать какую-то картинку для сайта. Такого понятия как "нарисовать макет сайта" изначально не было. Все эксперименты с внешним видом сайта делали исключительно кодом посредством HTML разметки. Код этот создавали в обычном блокноте.

Я не буду вдаваться в подробности HTML об этом обязательно подробно поговорим в других главах. Суть в том, что все старые дизайнеры разбирались хорошо в HTML, другого выхода у них не было. Был только блокнот и Photoshop. Рисование макетов в графическом редакторе пришло намного позже.

Поэтому все, кто начинал интересоваться разработкой сайтов, начинали именно с изучения HTML. Так как понятия веб-дизайн как такого не было.

Все сайты в 1990-2000 году выглядели примерно так:

Вот собственно и весь дизайн сайта который был. Добавляли просто текст, заливали фон картинками, вставляли изображения, таблицы, ссылки и сайт готов.

И как вы можете заметить, на cкриншоте выше, рекомендуемый размер экрана был 800x600 - это скажем так, был эталон. Такой размер экранов был практически у каждого. Так как все мониторы были весьма стандартизированы. И выбора было очень мало. Далее появились экраны 1024x768 - и это считалось очень крутым и модным разрешением. И то, как я помню, переход с 800x600 на 1024x768 был очень мучительным. Все кто был в тренде, давно уже старались делать сайты 1024x768, но клиенты очень сильно упирались и не верили в быстрый переход и смену разрешения экрана. Но в итоге 1024x768 все равно очень быстро стал новым стандартом.

В то время очень модно было использоваться гифки и вставлять их в страницы. И это считалось очень круто. Гифок благо в интернете было полно. Их вставляли куда только угодно. Заливали фон, добавляли рядом с текстом, вообщем использовали везде, где только можно и нельзя.

А вот так раньше выглядели сегодняшние гиганты:

Тогда вся сила сайтов была исключительно в программировании и возможностях самого сайта. Дизайна, как вы видите, особо и не было. Все отталкивалось исключительно от возможностей кода. Ну игрались со стилем шрифтов, по разному разукрашивали блоки, вставляли картинки. Вот собственно и все, что было доступно. Но тогда внешний вид мало кого волновал. Это были технологии первопроходцев. Тогда любой функционал, где можно просто зарегестрироваться, был настоящим чудом. Это были первые страницы, которые загружались в интернет. До этого ничего не было. Да и новые сайты появлялись не так быстро, а сервисы крупные можно было пересчитать по пальцам.

Поэтому, раньше и веб-дизайнера не было. Люди которые создавали сайты - назывались веб-мастерами. Они и картинки рисовали и программировали.

Больших заморочек, разных браузеров, разных гаджетов, размеров экранов, как сегодня не было. И сделать сайт было весьма просто. Даже дизайн никто не оценивал, страница загрузилась, все картинки прогрузились, все работает - уже круто.

Вот такой и был дизайн в 2000 году, когда интернет только начал активно развиваться.

Люди выжимали по максимуму из всех доступных и скромных технологий.

Приход Javascript (1995)

Потом появился Javascript – это язык программирования, с помощью которого веб-страницам придается интерактивность. Каждый начал использовать всплывающие окна и прочий ад на страницах. Падающие снежинки, мигающие элементы, бегущие строки и прочие заманухи. Это было настоящим прорывом. Язык этот активно используется и по сей день.

Ответом на ограничения HTML был Javascript. Хотите вывести всплывающее окно? Или вам нужно настроить динамическое изменение расположения элементов? Ответ один — Javascript. Однако главная проблема заключалась в том, что Javascript ложился поверх материала, из которого состоит веб и, соответственно, должен был загружаться отдельно. Нередко ленивые разработчики использовали его для создания быстрой заплатки для кода, однако в умелых руках он способен превратиться в очень мощный инструмент. В наши дни мы предпочитаем избегать использования Javascript, если тот же самый элемент может быть реализован с помощью CCS, но даже несмотря на это, JavaScript сегодня не теряет своей актуальности как в разработке интерфейсов (jQuery), так и в программировании серверной части (Node.js).

Flash технология (1996)

Потом появилась Flash технология. Adobe Flash (ранее Macromedia Flash), или просто Flash, по-русски часто пишут флеш или флэш) — мультимедийная платформа компании Adobe Systems для создания веб-приложений или мультимедийных презентаций. Широко используется для создания рекламных баннеров, анимации, игр, а также воспроизведения на веб-страницах видео- и аудиозаписей.

Появившаяся в 1996 году технология обещала невиданную ранее свободу и ставила своей целью разрушить барьеры, которые сдерживали развитие веб-дизайна в то время. Дизайнер мог работать с любыми формами, размерами макетов, анимациями, взаимодействиями и использовать любой шрифт и все это при помощи одного инструмента — технологии Flash. Конечный результат работы упаковывался в один файл, а после этого отправлялся в браузер для отображения. Все это работало при условии, что у пользователя стояла последняя версия flash plugin и было немного свободного времени для того, чтобы подождать, пока содержимое загрузиться. Выглядело это волшебно.

Это был новый бум. На флеше делались сайты, мультики, игры. Можно было легко все анимировать, рисовать и без сложно программирования создавать взаимодействие элементов. Можно было создавать все что угодно. Креативу не было предела.

Кстати, из мультиков из самых знаменитых сделанных на флеше была Масяна. На то время этот мультик просто разрывал интернет. Сегодня его можно уже найти перезалитого на Youtube. Раньше он просматривался исключительно отдельным самостоятельным файлом на компьютере.

Сегодня Flash жив и по сей день и в нем можно делать многое, это правда. Программа развивалась все это время и не стояла на месте. Программой давно занимается компания Adobe. Но, это считается уже старой технологией. И ее уже все меньше и меньше используют. Актуальна она осталась для игр и анимации. Возможно еще сегодня используют Flash баннера, но и то, многие крупные рекламные площадки, ограничили возможность загружать такие баннера. Так как Flash считается ненадежной и небезопасной технологией. А Apple и вовсе не воспроизводит Flash на своих устройства.

Я бы не рекомендовал сегодня тратить свое время и изучать это приложение. Оно сделало определенный бум, но дало развитие в технологиях только в рамках своей системы. То есть, это уже не перспективные технологии.

CSS (1998)

СSS очень актуален и современен и по сей день. Он никогда не переставал развиваться и развивается до сих пор. Учить CSS современному дизайнеру обязательно надо. Во всяком случае понимать как он работает.

Подъем мобильного контента — сетки и фреймворки (2007)

Просмотр веба на мобильных телефонах уже сам по себе был испытанием. А кроме различия размеров макетов для разных девайсов появилась также проблема соответствия дизайнов: стоит ли отображать на малом экране тот же вариант сайта, что и на большом, или от отдельных его частей необходимо отказаться? И куда вставлять всю эту мерцающую рекламу на таком крохотном экране? Скорость работы также была проблемой, поскольку загрузка большого количества контента сжигает весь ваш мобильный баланс довольно быстро. Первым шагом к улучшению ситуации была идея использования сеток со столбцами.

После нескольких итераций победу одержала сетка в 960 px, а разделение на 12 столбцов стало использоваться дизайнерами преимущественно. Следующим шагом была стандартизация широко распространенных элементов, таких как формы, меню навигации, кнопки, а также создание возможности их быстрого и простого использования или, попросту говоря — создание библиотеки визуальных элементов, которая содержит в себе весь необходимый код. Победителями здесь стали Bootstrap и Foundation, что также говорит о том факте, что грань между веб-сайтом и приложением стала стираться. Недостатком подхода стало то, что новые дизайны стали чаще выглядеть одинаково. Сами же дизайнеры при этом по-прежнему не могли получить доступ к их изменению без понимания того, как работает код.

Адаптивный веб-дизайн (2010)

Упрощение (2010)

Отрисовка большего количества макетов требует больше времени. Исходя из этого, к нашему общему счастью, дизайнеры решили рационализировать процесс, избавившись от замысловатых эффектов теней и вернувшись обратно к истокам дизайна, отдав приоритет содержимому. Качественные фотоматериалы, подбор шрифтового оформления, красочные иллюстрации и продуманные макеты — таков дизайн, каким мы создаем его сегодня.

Светлое будущее

Все эти годы визуализация дизайна и разные попытки его представления в браузере были Святым Граалем веб-дизайна. Представьте себе, как дизайнеры с легкостью перемещают элементы на экране, а готовый код при этом появляется сам! Речь идет не про изменение порядка элементов как таковое, а про полную гибкость и контроль! Представьте себе, что разработчикам не нужно беспокоится о совместимости с браузерами и они, вместо этого могут полностью сосредоточиться на решении реальной проблемы!

Формально, сегодня существует несколько новых идей, которые поддерживают движение в этом направлении. Новые юниты CSS, такие как vh, vw (высота и ширина области просмотра) позволяют получить гораздо большую гибкость при позиционировании элементов. Они также решают проблему, которая удивляла многих дизайнеров: почему центральное выравнивание по вертикали в CSS делается с таким трудом? Еще одна крутая идея, ставшая частью CSS — Flexbox, который позволяет создавать макеты и изменять их при помощи одного свойства, вместо написания кучи кода. Ну и наконец, web components — еще более основательная попытка, которая представляет собой связанный вместе набор элементов, таких, например, как галерея или форма регистрации. Это создает возможность упростить рабочий процесс, так как элементы становятся строительными блоками, которые могут быть использованы много раз, в том числе и самостоятельно.

Примечание: Годы в скобках указывают на начало того или иного этапа. Данные технологии развивались с разными скоростями, на протяжении длительного времени, поэтому ни в коем случае не считайте период с 1998 по 2007 пустым. Именно тогда и происходила основная эволюция.

Вернемся в сегодняшний день

Вот собственно и вся краткая история веб-дизайна. И сегодня, чтобы создать достойный веб-сайт, недостаточно просто знать HTML и уметь рисовать в Photoshop картинки, надо уметь и понимать намного больше.

Появилось огромное количество новых слов: ТЗ, макет, svg, css, js, cms, контент, скрипты, сервер, хост, ftp, ssh, домен, админка, вёрстка, слои, mysql, sketch, afiinity, ретина, grid system, фреймворк, гайдлан, презентация, брендбук, руководство стиля, флэт, технический дизайн, текстуры, паттерн, mock-up, вектор, растр, иконки, шрифты, параллакс, иллюстрация, palette, artboard, кривые, спрайт, адаптивный дизайн, pixel perfect, ui/ux, скевоморфизм, метро-интерфейс, плитка, длинная прокрутка, лендинг, wow эффекты, эмоциональный дизайн и прочее прочее.

Все это хороший дизайнер сегодня должен понимать. Да, может вам не надо программирование знать глубоко. Но понимание возможностей того же JS, CSS - вам обязательно надо знать. Хотя бы в общих чертах. Иначе все ваши дизайнерские идеи будут оставаться только на уровне плоской неподвижной картинки в фотошопе. Надо понимать технологии и их возможности.

Поэтому будьте настоящим веб-мастером, как в старые добрые времена. Не ограничивайте себя лишь одними знаниями графического редактора. Как это сегодня принято, где веб-дизайнер не способен выйти за пределы графического редактора.

Хотя сегодня инструменты для создания сайта развились настолько хорошо, что можно создавать полноценный сайт без знания программирования. Просто пару кликов мышки и красивый современный сайт готов. Но об этом в других главах.

Эволюция веба

Кто сильно заинтересовался историей, может еще изучить вот этот сайт:

А еще у вас есть уникальная возможность, посмотреть как выглядел тот или иной сайт много лет назад.

Эволюция иконок

Вот пожалуй и все. История веб-дизайна не столь большая, но она очень сильно и быстро развивается. И кто знает какие возможности ждут нас впереди?

Дизайн VR сайтов? Голографический дизайн сайтов? Виртуальные 3d сцены заменят сайты?

Одно я точно могу сказать. Сначала технологии создают дизайн. А потом дизайн создает технологии.

Яркий пример с телевизорами:

Первые цветные телевизоры были огромные, квадратные, с блеклыми цветами. Сначала это был просто кинескоп, микросхемы. Настоящее чудо. Живая картинка. Создавали и открыли изначально технологию, а не дизайн. Время шло, люди захотели большего. Они хотели тонкий телевизор, чтобы везде вмещался, чтобы был легкий, чтобы цвета были лучше. И вот тогда уже дизайн ставит задачу технологиям, которые должны отвечать требованиям дизайна.

Люди сначала изучают новую науку, технологии. Появляется что-то новое. Потом эту технологию очеловечивают. Придумывают, как она должна выглядеть снаружи, какие функции выполнять дополнительные, что можно улучшить. Добавляют ей эстетический вид, удобность, со временем делают более совершенным, красивым, изысканным. Но когда и этого становится мало, начинают придумывать нечто совершенно невероятное, чтобы выделиться среди конкурентов и уже дизайн диктует технологиям как они должны развиваться и что от них требуется.

1990-1994

Итак, главными дизайн-трендами периода 1990-1994 годов стали следующие нововведения:

Появление первых мониторов с разрешением: 640x480 с поддержкой 16 цветов. Да, мы не ошиблись — всего 16 цветов!
Переполненные текстом сайты: первые браузеры поддерживали только текст. Так было до 1993, когда появилась поддержка просмотра изображений.

1990: WorldWideWebe (Nexus) — первый веб-браузер.

1990: Рождение HTML! Это кодовый язык для чтения браузерами и верстки веб-страниц.

1991: Запущен первый сайт.

1993: Mosaic — первый браузер, поддерживавший просмотр изображений совместно с текстом, а также первый инструмент загрузки веб-страниц привычного для нас формата.

1993 — появление портала Yahoo.

1994: World Wide Web Consortium (W3C) утвердился. Сформулирован ряд основных принципов и компонентов, которые делают Web доступным всем и всегда.

1994-1998

Следующая эра (1994-1998) была связана с технологическим взрывом, принесшим веб-дизайну новые, захватывающие возможности. Однако, эпоха нового либерализма в сайтостроительстве заключалась не только в положительных аспектах — на многие дизайнерские решения того времени современному пользователю смотреть откровенно больно.

Общее разрешение экрана: 800х600х256 цветов;
Поддержка цветов возросла до 256;
Яркие, жуткие цвета — людям со слабой психикой не рекомендуется смотреть на это:)
Кричащие объявления — как только интернет начал набирать популярность, бизнес обратился к нему как к маркетинговому инструменту. Привлечь читателя сайты пытались в основном яркими и безвкусными рекламными объявлениями, напоминающими современные баннеры.
Поддержка шрифтов — получают распространение простые шрифты с засечками, такие как Times New Roman и Courier New
Цветные кнопки с симуляцией 3D-эффекта

1994: Opera Browser 1.0 — запущен в качестве исследовательского проекта.

1995: Internet Explorer 1 и 2.

1996: Netscape Navigator 3. В 1996 году почти 90% интернет-пользователей использовало в качестве браузера Netscape Navigator.

1996: Internet Explorer 3. IE3 поддерживает мультимедиа, Java-апплеты, управляющие элементы ActiveX и такие дополнения, как интернет-почта. Все это нивелировало превосходство Netscape на рынке, позволив IE3 стать самым популярным браузером на долгие годы.

PHP (Personal Home Page) выпущен. Создаются новые, простые и динамические приложения, такие как гостевые книги и разнообразные веб-формы.

Macromedia Shockwave создает анимацию и интерактивные приложения для веб-разработок. Позже всю компанию покупает Adobe.

Javascript появляется как часть Natscape Navigator 2.0B3

Запуск сайта BBC (1996)

Выпуск CSS (Cascading Style Sheets) привносит новые возможности для веб-разработчиков. Уже 1% населения Земли имеет доступ в интернет.

Active Server Pages (ASP) реализована на платформе Windows NT 4.0 Option Pack

Мультимедийная и программная платформа Flash запущена. Она открывает новые возможности разработки векторной графики, анимированных игр и приложений.

Введение HTML 4.0 сделало интернет действительно интернациональным, установив универсальный набор символов для поддержки пользователей по всему миру. 100 миллионов пользователей теперь онлайн.

Так как виды и объемы контента в интернете только росли, появилась необходимость в грамотной каталогизации, повышении доступности ресурсов и оптимизации юзабилити в целом. Главным трендом стал растущий акцент на элементы меню и навигации. Дизайн стал чуть более утонченным, но все еще видна зависимость от угловатых решений и основных цветов.

Разрешение монитора 800x600 по-прежнему доминирует, его предпочитает 56% пользователей. Однако 25% перешло на 1024x768, особенно к 2000 году.

Растущий акцент на меню и навигацию;
Более лаконичное и рациональное расположение контента — меньше текста на одном экране, больше мини-страниц;
Темный или однотонный фон страниц очень популярен;
Использование градиентов.

1998 — запуск Google. В последующие годы эта корпорация переосмыслит онлайн-поиск и запустит успешные сервисы во множестве отраслей интернет-индустрии.

Релиз CSS2 также прошел в 1998 году.

2002-2006

Дальнейшие нововведения дали дизайнерам беспрецедентные возможности по интеграции анимированного контента в веб-сайты. Экраны-заставки и флеш-страницы уже в моде, но все больше внимания уделяется надежности и функциональности. Повышение средней скорости соединения открывает возможности для улучшения дизайна. Также это приводит к выходу видео-контента на первый план — как итог, в 2005 году появляется YouTube.

За год до этого на рынок выходит будущий гигант социальных медиа — Facebook (2004).

В период между 2002 и 2006 годами миллионы пользователей перешли от формата 800x600 к разрешению 1024x768 или выше. Формат 640x480 окончательно сдал позиции и исчез в 2005 году.

В 2003 году более половины пользователей интернета использовали 4-х или 32-х разрядные аппаратные средства, отображающие 16 777 216 различных цветов.

Флеш-анимация на страницах.
Особый упор на читаемость и функциональность.
Анимированный контент тонко интегрирован в ресурсы.

В 2004 Firefox 1.0 с открытым исходным кодом составил конкуренцию вездесущему Internet Explorer, самому популярному браузеру того времени.

2003: была запущена WordPress, система для блоггинга и контент-менеджмента с открытым исходным кодом.
Запуск социальных платформ MySpace и Facebook.

2005: Видео-стриминговый сервис YouTube запущен. Впоследствии он был куплен Google в 2006.

2006-2010

На протяжении большей части следующего периода в моде закрепляется сквеморфизм — тренд, при котором в дизайне используются текстуры, схожие с реальными материалами (дерево, ткань и т. д.). Видео-контент продолжает захватывать интернет.

К январю 2010 более 75% пользователей перешли на форматы выше, чем 1024x768.

Длинные макеты.
Стоковые фото.
Сквеморфизм.

2008: Google Chrome появляется и мгновенно добивается успеха. Он быстро завоевывает звание самого популярного браузера на планете за счет минимализма, скорости и модного дизайна.

2007: Появляется первый iPhone, запуская революцию в нашем восприятии смартфонов. Адаптивный дизайн становится все более актуальным.
2008: Первая рабочая версия HTML5.

2010-2014

Появление Flapp.ca (2014)

1152x854 становится наиболее используемым разрешением.

Плоский дизайн.
Адаптивный дизайн.
Javascript-анимация.
Анимированные GIF.
Параллакс.

2010: Рынок в основном контролируется несколькими главными игроками — Chrome, Internet Explorer, Safari, Firefox и Opera.
Между 2010 и 2014, Google презентует более 30 различных апдейтов Chrome, Firefox — более 20, в то время как IE, Opera и Safari радуют поклонников релизами куда менее часто.

Вместо заключения

За последнюю четверть века и практически на глазах у многих из нас произошли поразительные изменения в веб-дизайне. Конечно, были как удачи, так и промахи, но трудно спорить — большинство трендов и нововведений привели дизайн в лучшую форму. Современный интернет сильно отличается от того, каким он был в 1990 году, не правда ли?

С тех пор, как сети исполнилось 25 лет, и до настоящего времени, сменилось еще несколько трендов. Эксперты говорят о возвращении плоского дизайна в формате Flat 2.0, в моде успели побывать контурные кнопки, а сейчас широко используются hero-images, фоновые видео, контрастные цвета. Не сдают своих позиций принципы минимализма, все важнее становится UI-дизайн (и 2016 год, вероятно, пройдет под его флагом). Также стоит отметить отказ многих дизайнеров от гамбургер-меню и довольно широкое использование приема scrolljacking — когда контент слегка меняется по мере скроллинга, создавая тем самым динамику и даже рассказывая некую историю.

Полагаем, что ситуация продолжит развиваться с нарастающей скоростью в ближайшие годы. Поэтому для дизайнеров крайне важно знать об изменяющихся тенденциях и веяниях моды, чтобы всегда давать своим посетителям передовой, восхитительный пользовательский опыт — поражающий как эстетически, так и функционально. Подписывайтесь на обновления нашего блога — и вы всегда будете в тренде :)

Веб - дизайнером принято считать профессионала, наделенного эстетическим вкусом, что занимается разработкой Web - страниц и дальнейшим их объединением в сайты.

СОДЕРЖАНИЕ:

История профессии

Профессия Веб - дизайнер возникла одновременно с появлением сети World Wide Web, благодаря которой можно было создавать ресурсы с целью рекламы. Спустя время произошло множество изменений в данной сфере.

На данный момент работа Веб - дизайнером предусматривает участие в ходе разработки программного обеспечения для различных сайтов, поэтому специалисты постоянно совершенствуют свои навыки.

Особенности профессии

Профессия Веб - дизайнер на сегодняшний день получила широкое распространение, поэтому квалифицированные профессионалы с должным уровнем знаний и умений могут попробовать свои силы в указанной области.

Следует детально рассмотреть возможные плюсы и минусы, чтобы потом работа не была в тягость.

В ряд достоинств следует зачислить пункты:

высокий показатель востребованности на рынке труда;
возможность сотрудничества с различными иностранными компаниями;
постоянное саморазвитие;
хорошая зарплата;
можно работать на дому;
наличие перспектив карьерного роста;
возможность реализации своих идей без финансовых вложений.

Вместе с тем, веб - дизайнер не всегда обладает правом свободно творить, ведь у заказчика может быть абсолютно противоположное видение концепции реализуемого проекта, поэтому специалист обязан действовать в соответствии с пожеланиями своего работодателя, если не сможет навести убедительные аргументы относительно своей правоты.

Обязанности

Веб - дизайнер - это профессионал, что в ходе работы над проектом решает ряд вопросов, напрямую влияющих на будущий успех дела.

Основными функциями является:

проектирование структуры ресурса и навигации;
оформление интерфейса;
предоставление возможностей целенаправленных на слаженное взаимодействие потенциальных пользователей с системой;
подготовка интересного тематического наполнения;
обеспечение высококачественного отображения открытых web - документов;
формулировка порядка компоновки страниц, установка необходимых элементов оформления;
разработка стилевых образцов документов и интерактивных приложений;
работа в сети Internet.

Важные качества

Необходимые качества, которыми должен обладать веб дизайнер:

стремления к прекрасному;
умение концентрироваться;
отличная память;
творческий подход к делу;
стремление к дальнейшему развитию своих умений;
умение логически мыслить и анализировать;
пунктуальность;
скрупулезность;
ответственность;
устойчивость к стрессам;
умение идти на компромисс;
отсутствие проблем со зрением.

Навыки и знания

Веб - дизайнер - это специалист, который обязан знать ключевые принципы функционирования Adobe Photoshop, HTML/ CSS, Corel Draw, Illustrator, Macromedia Flash, успешно применяя предварительно полученные знания в ходе реализации поставленной работодателем задачи.

Специалисты, которые трудятся в этой области, должны придерживаться принципа функционализма и конструктивизма, следить, чтобы создаваемый сайт имел на должном уровне выраженную тематическую идею, что сделает его конкурентоспособным среди остальных проектов подобного профиля.

Перспективы и карьера

Услуги веб - дизайнеров востребованы среди компаний, которые занимаются продвижением сайтов и учреждений с наличием персонального сайта, требующего систематического развития и совершенствования.

Специалисты данного профиля также могут достойно зарабатывать на жизнь фрилансом.

В случае если начинающий специалист работает на крупную компанию, то продемонстрировав трудолюбие и профессионализм, спустя время он может занять место веб - программиста, баннер - мейкера либо менеджера проекта.

Обучение

Работа Веб - дизайнером предусматривает наличие высшего либо среднего профильного образования. Дополнительно приветствуется, если специалист окончил соответствующие курсы.

Также перед поиском работы стоит позаботиться о составлении качественного портфолио, чтобы потенциальные работодатели могли объективно оценить уровень профессионализма и принять решение относительно возможного дальнейшего сотрудничества с начинающим веб - дизайнером.

Веб-дизайн (от англ. Web design ) — отрасль веб-разработки и разновидность дизайна, в задачи которой входит проектирование пользовательских веб-интерфейсов для сайтов или веб-приложений. Веб-дизайнеры проектируют логическую структуру веб-страниц, продумывают наиболее удобные решения подачи информации, а также занимаются художественным оформлением веб-проекта. В результате пересечения двух отраслей человеческой деятельности грамотный веб-дизайнер должен быть знаком с последними веб-технологиями и обладать соответствующими художественными качествами.

Веб-дизайн — вид графического дизайна, направленный на разработку и оформление объектов информационной среды интернета, призванный обеспечить им высокие потребительские свойства и эстетические качества. Подобная трактовка отделяет веб-дизайн от веб-программирования, подчеркивает специфику предметной деятельности веб-дизайнера, позиционирует веб-дизайн как вид графического дизайна [1] .

В настоящее время услуги веб-дизайна предоставляют как специальные компании, так и частные лица (веб-дизайнеры или веб-мастера, являющиеся фрилансерами).

Веб-дизайнер — сравнительно молодая профессия, и профессиональное образование в области веб-дизайна в России пока не распространено. В связи с увеличением спроса на интернет, растет и спрос на дизайн сайтов, увеличивается количество веб-дизайнеров.

Содержание

Объяснение термина

В настоящее время под термином веб-дизайн понимают именно проектирование структуры веб-ресурса, обеспечение удобства пользования ресурсом для пользователей. Немаловажной частью проектирования ресурса в последнее время стало приведение ресурса в соответствие стандартам W3C, что обеспечивает доступность содержания для людей с ограниченными физическими возможностями и пользователей портативных устройств [2] , а также кроссплатформенность [3] вёрстки ресурса. Также непосредственно с дизайном сайтов смежны маркетинг в Интернете (интернет-маркетинг), то есть, продвижение и реклама созданного ресурса, поисковая оптимизация.

Формулировка задачи веб-дизайна

Создание технического задания

Составлением технического задания для специалистов занимается менеджер проекта. Работа с заказчиком начинается с заполнения брифа, в котором заказчик излагает свои пожелания относительно визуального представления и структуры сайта, указывает на ошибки в старой версии сайта, приводит примеры сайтов конкурентов. Исходя из брифа, менеджер составляет техническое задание, учитывая возможности программных и дизайнерских средств. Этап заканчивается после утверждения технического задания заказчиком. Важно сразу отметить, что этапы проектирования веб-сайтов зависят от многих факторов, таких как объём сайта, функциональность, задачи, которые должен выполнять будущий ресурс и многое другое. Однако, есть несколько этапов, которые в обязательном порядке присутствуют в планировании любого проекта.

Этапы проектирования

Информация должна быть проверяема, иначе она может быть поставлена под сомнение и удалена.
Вы можете отредактировать эту статью, добавив ссылки на авторитетные источники.
Эта отметка установлена 13 мая 2011.

При этом дизайнер должен учитывать ограничения стандартов html (не создавать дизайн, который затем не сможет быть реализован стандартными средствами html). Исключение составляет Flash-дизайн.

Количество эскизов и порядок их предоставления оговаривается с проект-менеджером. Так же менеджер проекта осуществляет контроль сроков. В больших веб-студиях в процессе участвует арт-директор, который контролирует качество графики. Этап также заканчивается утверждением эскиза заказчиком.

В небольших студиях, html-кодированием занимается дизайнер, создавший макет сайта.

При программировании сайта специалисту назначаются контрольные точки сроков.

Завершающим этапом разработки сайта под ключ является конечно же тестирование.

Веб-дизайн сайта должен адекватно выглядеть в различных браузерах, особенно в браузерах Internet Explorer, Firefox, Safari, Chrome и Opera.

Процесс тестирования может включать в себя самые разнообразные проверки: вид страницы с увеличенными шрифтами, при разных рамерах окна браузера, при отсутствии флэш-плеера и многие другие. Обнаруженные ошибки отправляются на исправление до тех пор, пока не будут устранены.

Сроки контролирует менеджер проекта. Так же на этом этапе привлекают к работе дизайнера, чтобы он провел авторский надзор.

Файлы сайта размещают на сервере провайдера и производят нужные настройки. На этом этапе сайт пока закрыт для посетителей.

Сайт наполняют контентом — текстами, изображениями, файлами для скачивания и т. д. Иногда тексты составляются специалистом студии, иногда контентом занимается ответственное лицо со стороны заказчика. Это решается на этапе составления технического задания. В случае если контент составляется представителем студии, то это происходит и утверждается параллельно с другими этапами проекта.

Связана с некоторыми изменениями самого сайта. Начинается она с определения семантического ядра. Здесь определяются такие ключевые слова, которые привлекут наиболее заинтересованных посетителей, по которым выиграть конкуренцию проще. Затем эти слова вносятся на сайт. Тексты, ссылки, другие теги адаптируются так, чтобы поисковые системы могли их успешно находить по ключевым словам.

Заказчик или его доверенное лицо просматривают готовый проект и в случае, если все устраивает, то подписывают документы о сдаче проекта.

Так же на этом этапе производится обучение представителя заказчика навыкам работы в администраторской зоне сайта.

Процесс и результат

Уникальный дизайн стоит дороже, но и предполагает отрисовку с нуля, полностью уникальную разработку под конкретный заказ. В зависимости от профессионализма и/или политики компании веб-дизайнер либо разрабатывает идею и концепцию дизайна полностью самостоятельно, либо получает ряд требований (цвет, стиль и т. п.), ожиданий и идей от заказчика или креативного директора (арт-директора) и старается держаться этого направления при разработке макета. Большинство заказчиков ошибочно отождествляют веб-дизайнера и веб-мастера, поручая ему и публикацию сайта.

Иногда дизайнер может предложить дизайн-решение на основе шаблонов (своих или даже чужих), это ускоряет работу и обойдется заказчику дешевле. Некоторые дизайнеры даже специализируются на изготовлении дизайн-макетов для продажи в качестве готовых шаблонов, которые затем могут быть куплены и использоваться менее опытными дизайнерами или веб-мастерами для изготовления типовых сайтов (по сути, без уникального дизайна). Иной раз разработкой веб-дизайна называют небольшую перекомпоновку и адаптацию такого шаблона под конкретный заказ.

Конечным продуктом работы веб-дизайнера является дизайн-макет: картинка, представляющая предполагаемый будущий внешний вид страниц сайта, размером приблизительно 960х640 px (пикселей) — размер, соответствующий среднему стандарту, связанный с необходимостью дальнейшей привязки к разным разрешениям экрана монитора. Картинка эта является многослойной, где, на усмотрение дизайнера, почти каждая деталь — отдельный слой, приложенный к другим слоям-картинкам, за счёт чего может легко выполняться доработка, замена, перекомпоновку и другие задачи. В зависимости от идеи и целей макет может включать фотографии, сложные коллажи, иллюстрации, текстовые слои, уникальные иконки.
Для главной страницы и внутренних иногда рисуются отдельные макеты с дополнениями или изменениями в соответствии с тематикой страницы.

Изображение первоначально может быть векторным или растровым, выполненным в Adobe Illustrator, Adobe Photoshop, GIMP или другом визуальном редакторе (например, Scribus или Inkscape), но для верстальщика изображение, как правило, переводится в растровый формат.

Для демонстрации клиенту изображение обычно переводится в простой однослойный и привычный формат изображений.

Читайте также: