[ Обновленные темы · Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Форум » Компьютеры и др. техника » Создание сайтов и программирование » Что такое верстка веб-страниц (Что такое верстка веб-страниц)
Что такое верстка веб-страниц
virtsiteДата: Четверг, 29.11.2018, 15:45 | Сообщение # 1
Лейтенант
Группа: Администраторы
Сообщений: 54
Репутация: 0
Статус: Offline
Верстка веб-страниц это создание HTML-кода, благодаря которому различные элементы (изображения, текст, формы) будут отображаться в документе в
соответствии с ранее разработанным дизайнерским макетом. При этом
учитываются все ограничения, которые накладывают технологии HTML и CSS,
принимаются во внимание особенности различных браузеров.

Прежде чем верстальщик приступит к работе, дизайнер в графическом редакторе, например, Adobe Photoshop, подготавливает серию макетов
веб-страниц.
Таким образом, верстальщик строит свою работу на основе набора рисунков, которые представляют макеты отдельных страниц сайта.
Проанализировав полученные рисунки, верстальщик решает, каким образом реализовать все это на веб-странице. Обычно, чтобы в дальнейшем было
удобно работать, исходный макет разбивается на отдельные блоки. Как
правило, выделяются такие крупные блоки, как "шапка", основное
содержимое страницы и "подвал" (который может и отсутствовать). Кроме
этого каждый из этих блоков может разбиваться на более мелкие блоки.
Предположим, что в соответствии с задумкой дизайнера вверху сайта должны быть цветная и белая полосы. На них должны отображаться заголовок
сайта и набор пиктограмм, выравненных по центру. Положение пиктограмм
по отношению друг к другу должно оставаться неизменным, и каждый рисунок
является ссылкой на соответствующий раздели сайта.
Верстальщик может выбрать один из следующих вариантов реализации в HTML-коде указанных особенностей:
  • сформировать единый рисунок и сделать его картой-изображением,
  • разрезать картинку на отдельные фрагменты и свести их воедино при помощи таблицы, сделав из каждого отдельного фрагмента ссылку на
    соответствующий раздел сайта,
  • позицианировав каждый элемент соответствующим образом.


При этом верстальщик должен помнить, что хотя все указанные методы приводят к необходимому результату, но у каждого из них есть свои
недостатки. И эти недостатки следует также учитывать.
Когда с "шапкой" будет покончено, и она получит свое воплощение в HTML-коде, верстальщик переходит к работе над следующим блоком. Теперь,
допустим, это будет блок с основным содержимым страницы. Здесь уже
присутствует текст. Поэтому формируется файл CSS стилей, в котором будут
учтены следующие факторы:
  • различные цвета (фона, текста, ссылок, заголовков),
  • гарнитура и размер основного шрифта и шрифта заголовков,
  • размеры текста различных модулей (новостного блока, новых материалов, анонсов статей и т. д.),
  • параметры различных линий и рамок.


Затем полученный CSS-файл подключается к документу и формируется окончательный HTML-код главной страницы.

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


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

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


источник: https://msiter.ru/articles/chto-takoe-verstka-veb-stranic
 
Форум » Компьютеры и др. техника » Создание сайтов и программирование » Что такое верстка веб-страниц (Что такое верстка веб-страниц)
  • Страница 1 из 1
  • 1
Поиск: