Верстка веб-страниц

Содержание

Слайд 2

Что такое вёрстка веб-страницы?

Это создание структуры html-кода, размещающего элементы веб-страницы (изображения, текст

Что такое вёрстка веб-страницы? Это создание структуры html-кода, размещающего элементы веб-страницы (изображения,
и т. д.) в окне браузера, согласно разработанному макету, таким образом, чтобы элементы дизайна выглядели аналогично макету.

Слайд 3

Структура веб-страницы

Структура веб-страницы

Слайд 4

Типовые веб-макеты

Типовые веб-макеты

Слайд 5

Какие существуют подходы к вёрстке веб-страниц?

Табличный подход
таблица - как структура веб-страницы
Вёрстка слоями
вышедший

Какие существуют подходы к вёрстке веб-страниц? Табличный подход таблица - как структура
из употребления тег
Блочная вёрстка
вёрстка с помощью тега
и др.
Вёрстка фреймами
верстка с помощью тега
пример: http://frame.free.nanoquant.ru/

Слайд 6

Табличный подход

Табличный подход

Слайд 7

Преимущества табличной верстки

Удобство и широкие возможности верстки
Создание колонок
«Резиновый» макет
«Склейка» изображений
Фоновые рисунки
Выравнивание элементов
Особенности

Преимущества табличной верстки Удобство и широкие возможности верстки Создание колонок «Резиновый» макет
браузеров

Слайд 8

Недостатки табличной верстки

Долгая загрузка
Громоздкий код
Плохая индексация поисковиками
Нет разделения содержимого и оформления
Несоответствие стандартам

Недостатки табличной верстки Долгая загрузка Громоздкий код Плохая индексация поисковиками Нет разделения

Слайд 9

В каких случаях применение табличной верстки обоснованно

Высота колонок должна быть одинаковой
Макет должен

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

Слайд 10

Блочная верстка

HTML4

Блочная верстка HTML4

Слайд 11

Блочная верстка

HTML5

Блочная верстка HTML5

Слайд 12

Преимущества блочной верстки

Разделение содержимого и оформления
Быстрая загрузка страницы
Более компактный, лаконичный код
Более правильная

Преимущества блочной верстки Разделение содержимого и оформления Быстрая загрузка страницы Более компактный,
индексация страниц, по сравнению с табличной версткой
Соответствие стандартам
Имя файла: Верстка-веб-страниц.pptx
Количество просмотров: 76
Количество скачиваний: 0