Любой веб-сайт обязательно проходит несколько этапов:
Предварительный анализ
Создание идей
Рисование визуальных элементов и композиции структуры сайта
Напишите код, который описывает структуру и дизайн каждой веб-страницы на HTML , CSS , Javascript и т. Д.
Тестирование сайта
Изменение нецелевых частей
Публикация сайтов в интернете или в интранете
Обновление и перезапуск в Интернете, в соответствии с потребностями клиента или времени
Дальнейшие обновления сайта могут быть сделаны двумя способами:
через вмешательство веб-дизайнера
путем доступа владельца сайта к интерфейсу администрирования, предоставленному веб-дизайнером.
Наиболее рекомендуемый метод - второй, где на сайте есть CMS (система управления контентом), где владелец сайта больше не зависит от веб-программиста.
После того, как структура сайта была создана, она находится на стадии разработки графического интерфейса, который, помимо своих эстетических целей, должен также облегчить доступ посетителя ко всем публичным разделам сайта, быть всеобъемлющим и, что не менее важно, обеспечить быструю загрузку страниц. Кстати, различные графические элементы сделаны. Рекомендуется прочитать наиболее представительные отчеты о юзабилити.
С точки зрения дизайна, сайты в основном состоят из таблиц с линиями (невидимыми на экране), в которые вставляются изображения (логотип, символические изображения, кнопки и т. д.) И текст, чтобы макет был единым. не визуально визуализируйте организацию стола. Ячейки таблиц
может иметь цветной фон,
может состоять из изображений и рисунков, которые повторяются по горизонтали или вертикали,
могут быть заполнены более или менее неправильными текстурами (такими как гравий, листва и т. д.)
или может остаться белым.
Следует отметить, что в настоящее время место таблиц занял популярный режим форматирования CSS , который является более «чистым» решением, чем использование таблиц с точки зрения программирования.
Таким образом, графический дизайнер изначально использует графическую программу (например, Adobe Photoshop или Corel PhotoPaint ) для создания « снимка » сайта. Он создает форму графических кнопок, размер и положение логотипа сайта, задает место меню на экране, размер и внешний вид текста, цветовую схему сайта и другие специфические аспекты. Из-за того факта, что это основное изображение затем «разрезается» на более мелкие изображения для встраивания в таблицы или определения в CSS, для веб-страниц действуют те же правила композиции, что и для печатной графики, но с ряд технических параметров, которые позволяют позднее реализовать элементы программирования. Таким образом, «веб-графика» будет работать иначе, чем « инженер печати », пытаясь предвидеть, где могут возникнуть проблемы, и находить решения, чтобы избежать любой деформации сайта, независимо от того, должны ли использоваться относительные или абсолютные размеры. Например, веб-дизайнер должен знать, что предпочтительнее использовать фоновые рисунки с цветовой кодировкой или осью x или y, чем фоновые изображения в одном очень большом изображении, которое уменьшит отличная скорость загрузки сайта.
После того, как исходное изображение было разделено на несколько меньших изображений, они помещаются в таблицы или располагаются с помощью CSS либо путем непосредственного написания кода HTML в простой программе для редактирования текста, такой как Блокнот , либо с помощью HTML-редактор, обычно WYSIWYG- типа, такой как Dreamweaver . Это создает первый «скелет» сайта, называемый « макет », который имитирует сайт и все его функции, не имея фактического содержания, а только пропуская текст и временные изображения. В случае простого сайта с несколькими страницами все, что остается сделать, это ввести окончательный контент. В случае сложного сайта, такого как каталог или виртуальное хранилище , макет входит в сложную стадию программирования , которая может использовать более сложные языки ( серверная, например, PHP , ASP). или на стороне клиента ), а также базы данных.
В заключение, реализация веб-сайта предполагает 4 основных аспекта:
Покупка названия сайта (веб-домена)
Хостинг сайта на сервере
Веб дизайн (создание самого сайта)
Верстка сайта и подключение к CMS