HTML5 и CSS3. Разработка сайтов для любых браузеров и устройств. 2-е изд.

Фрэйн Бен

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

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

Издательство: Питер, Серия: Библиотека программиста, 2016 г.

ISBN 978-5-496-02271-2

Количество страниц: 272.

Содержание книги «HTML5 и CSS3. Разработка сайтов для любых браузеров и устройств. 2-е изд.»:

  • 14 Об авторе
  • 15 О рецензентах
  • 17 Предисловие
    • 17 О чем эта книга
    • 18 Что нужно для работы с книгой
    • 18 Для кого написана эта книга
    • 18 Соглашения
  • 20 Глава 1. Основы адаптивного веб-дизайна
    • 20 Итак, вперед к неизведанному
    • 21 Определение адаптивного веб-дизайна
    • 21 Установка уровней поддержки браузеров
    • 24 Первый пример придания адаптивности
      • 24 Наш исходный файл HTML
      • 27 Укрощение изображений
      • 30 Ввод медиазапросов
    • 35 Несовершенство нашего примера
    • 36 Резюме
  • 37 Глава 2. Медиазапросы — поддержка различных окон просмотра
    • 38 Зачем в адаптивном веб-дизайне нужны медиазапросы
    • 39 Синтаксис медиазапроса
    • 40 Объединение медиазапросов
      • 41 Медиазапросы с использованием @import
      • 41 Медиазапросы в CSS
      • 42 Что можно тестировать с помощью медиазапросов
    • 43 Использование медиазапросов для изменения дизайна
      • 45 В медиазапрос может быть заключен любой код CSS
      • 46 Медиазапросы для HiDPI-устройств
    • 46 Рассмотрение аспектов организации и разработки медиазапросов
      • 46 Привязка различных CSS-файлов с помощью медиазапросов
      • 47 Практические аспекты разделения медиазапросов
      • 48 Вложение медиазапросов путем их встраивания
    • 48 Как поступать — объединять медиазапросы или же записывать их там, где они пригодятся?
    • 50 Метатег viewport
      • 51 Спецификация Media Queries Level 4
      • 52 Медиасвойство использования сценариев
      • 53 Медиасвойства, связанные с взаимодействием со страницей
      • 54 Медиасвойство hover
      • 54 Медиасвойства среды
    • 55 Резюме
  • 56 Глава 3. Динамически изменяемые разметки и адаптивные изображения
    • 57 Преобразование дизайна с фиксированными размерами в пикселах в подстраиваемую пропорциональную разметку
      • 61 Зачем нам нужен Flexbox
      • 62 Линейные блоки и свободное пространство
      • 62 Плавающие элементы (floats)
      • 62 Table и table-cell
    • 63 Представляем Flexbox
      • 63 Тернистый путь к сегодняшнему Flexbox
      • 63 Браузерная поддержка Flexbox
    • 65 Разбираемся с возможностью динамического изменения
      • 65 Текст, безупречно выровненный по вертикали
      • 67 Смещение элементов
      • 68 Изменение порядка следования элементов
      • 69 Различные разметки Flexbox внутри разных медиазапросов
      • 70 inline-flex
      • 71 Свойства выравнивания, имеющиеся у Flexbox
      • 76 Свойство flex
      • 78 Простой зафиксированный подвал
      • 79 Изменение порядка следования исходных элементов
      • 84 Краткое заключение по Flexbox
    • 85 Адаптивные изображения
      • 85 Проблема, присущая адаптивным изображениям
      • 86 Простое переключение разрешения с помощью srcset
      • 87 Более совершенный вариант переключения с использованием атрибутов srcset и sizes
      • 88 Вы что, сказали, что браузер может предпочесть одно изображение другому?
    • 88 Режиссура, применяемая в отношении элемента picture
    • 89 Резюме
  • 91 Глава 4. Использование HTML5 в целях разработки адаптивного веб-дизайна
    • 92 Разметку на HTML5 понимают все современные браузеры
    • 93 Как правильно написать начало страницы на HTML5
      • 93 doctype
      • 93 Тег HTML и атрибут lang
      • 94 Указание альтернативных языков
      • 94 Кодировка символов
    • 94 Покладистость HTML5
      • 95 Разумный подход к разметке на HTML5
      • 96 Приветствую могучий тег <a>
    • 96 Новые семантические элементы в HTML5
      • 97 Элемент <main>
      • 98 Элемент <section>
      • 98 Элемент <nav>
      • 98 Элемент <article>
      • 99 Элемент <aside>
      • 99 Элементы <figure> и <figcaption>
      • 100 Элементы <details> и <summary>
      • 101 Элемент <header>
      • 102 Элемент <footer>
      • 102 Элемент <address>
      • 102 Замечания относительно элементов <h1> — <h6>
    • 103 Семантика HTML5 на текстовом уровне
      • 103 Элемент <b>
      • 104 Элемент <em>
      • 104 Элемент <i>
    • 104 Устаревшие функции HTML
    • 105 Практическое применение элементов HTML5
    • 106 Использование WCAG и WAI-ARIA для повышения доступности веб-приложений
      • 106 Руководство по обеспечению доступности веб-контента (WCAG)
      • 107 Стандарт предоставления возможности полноценного использования Интернета людьми с физическими ограничениями (WAI-ARIA)
      • 107 Если вы не в состоянии запомнить более одной рекомендации
      • 108 Развитие стандарта ARIA
    • 108 Медиавозможности, встроенные в HTML5
      • 109 Добавление видео и аудио средствами HTML5
      • 111 Работа audio и video практически ничем не различается
    • 111 Адаптивное HTML5-видео и iFrames
    • 112 Замечание относительно приоритетности автономной работы
    • 113 Резюме
  • 114 Глава 5. CSS3. Селекторы, разметка, цветовые режимы и новые возможности
    • 115 Разве можно знать абсолютно все?
    • 115 Анатомия правила CSS
    • 115 Простые и полезные трюки CSS
      • 116 Использование CSS при создании многоколоночных разметок для адаптивных конструкций
    • 119 Перенос слов на новые строки
      • 119 Усечение текста с добавлением многоточия
      • 120 Создание панелей, прокручивающихся по горизонтали
    • 122 Предоставление возможности разветвления функций в CSS
      • 123 Запросы возможностей
      • 124 Комбинирование условий
      • 125 Modernizr
    • 126 Новые селекторы в CSS3 и порядок их использования
      • 126 Селекторы атрибутов в CSS3
      • 127 Селекторы CSS3, соответствующие подстрокам значений атрибутов
      • 129 Особенность выбора по атрибутам
      • 130 Селекторы атрибутов позволяют выбрать элементы, чьи идентификаторы и классы начинаются с цифр
    • 130 Структурные псевдоклассы CSS3
      • 131 Селектор :last-child
      • 131 Селекторы nth-child
      • 132 Усвоение порядка работы nth-правил
      • 135 Выбор на nth-основе в адаптивных веб-конструкциях
      • 137 Селектор отрицания (:not)
      • 138 Селектор пустого элемента (:empty)
      • 139 Работа с :first-line независимо от размеров окна просмотра
    • 139 Пользовательские свойства и переменные в CSS
    • 140 CSS-функция calc
    • 141 Селекторы CSS Level 4
      • 141 Псевдокласс :has
      • 141 Адаптивные меры длины, выражаемые в процентных отношениях применительно к окнам просмотра (vmax, vmin, vh, vw)
    • 142 Шрифтовое веб-оформление
      • 142 CSS-правило @font-face
      • 143 Реализация веб-шрифтов с помощью @font-face
      • 145 Предостережение, касающееся пользовательского шрифтового оформления с применением @font-face в адаптивных веб-конструкциях
    • 146 Новые форматы цвета в CSS3 и альфа-прозрачность
      • 146 Цвет в формате RGB
      • 147 Цвет в формате HSL
      • 148 Альфа-каналы
      • 149 Работа над цветовым оформлением с CSS Color Module Level 4
    • 149 Резюме
  • 150 Глава 6. Создание эстетически привлекательных эффектов средствами CSS3
    • 151 Создание теней для текста средствами CSS3
      • 152 Если размытие не нужно, его значение можно опустить
      • 152 Получение нескольких теней для текста
    • 152 Создание теней для блоков
      • 153 Тень внутри элемента
      • 153 Создание нескольких теней
      • 154 Понятие протяженности
    • 155 Градиентные фоны
      • 155 Запись линейного градиента
      • 158 Радиальные градиентные фоны
      • 159 Удобные ключевые слова распространения для задания размеров адаптивных конструкций
    • 160 Повторяющиеся градиенты
    • 160 Узоры из градиентных фонов
    • 162 Использование нескольких фоновых изображений
      • 163 Размер фона
      • 163 Позиция фона
      • 164 Краткий метод записи фона
    • 165 Фоновые изображения с высоким разрешением
    • 165 CSS-фильтры
      • 167 Доступные CSS-фильтры
      • 171 Объединение CSS-фильтров
    • 172 Предупреждения, касающиеся CSS-производительности
    • 174 Резюме
  • 175 Глава 7. Использование SVG для достижения независимости от разрешения
    • 177 Краткая история SVG
    • 178 Графика, представляющая собой документ
      • 179 Корневой элемент SVG
      • 180 Пространство имен
      • 180 Теги title и desc
      • 180 Тег defs
      • 180 Элемент g
      • 181 Фигуры SVG
      • 181 SVG-пути
    • 181 Создание SVG-графики с помощью популярных пакетов и сервисов редактирования изображений
    • 182 Вставка SVG-графики в веб-страницы
      • 183 Использование тега img
      • 183 Использование тега object
      • 184 Вставка SVG-графики в качестве фонового изображения
      • 185 Краткое отступление по поводу URI-идентификаторов данных
      • 186 Создание спрайтов изображений
    • 187 Непосредственная вставка SVG
      • 187 Повторное использование графических объектов из символов
      • 189 Встраиваемая в код SVG-графика позволяет задавать различные цвета в разных контекстах
      • 190 Повторное использование графических объектов из внешних источников
    • 191 Что можно делать с любым методом вставки SVG-данных
    • 192 Дополнительные возможности и особенности технологии SVG
      • 193 SMIL-анимация
      • 194 Задание стилей SVG с помощью внешней таблицы стилей
      • 195 Задание стилей SVG с помощью внутренних стилей
      • 195 Анимация SVG-графики с помощью CSS
    • 197 Анимация SVG-графики с помощью JavaScript
    • 199 Оптимизация SVG
    • 200 Использование SVG в качестве фильтров
    • 202 Заметки по медиазапросам внутри SVG
      • 203 Советы по внедрению
      • 204 Дополнительные ресурсы
    • 204 Резюме
  • 205 Глава 8. Переходы, преобразования и анимация
    • 206 Что такое CSS3-переходы и как ими можно воспользоваться
      • 208 Свойства перехода
      • 208 Краткая форма записи перехода с помощью свойства transition
      • 209 Переходы различных свойств за разные периоды времени
      • 209 Основные сведения о функциях развития процесса по времени
      • 211 Развлечение с переходами на адаптивных сайтах
    • 211 CSS32D-преобразования
      • 212 Масштабирование (scale)
      • 213 Перемещение (translate)
      • 215 Вращение (rotate)
      • 216 Наклон (skew)
      • 216 Матрица (matrix)
      • 217 Свойство transform-origin
    • 219 CSS33D-преобразования
      • 222 Свойство transform3d
      • 223 Использование преобразований при постепенном усложнении
    • 226 Создание эффектов анимации средствами CSS3
    • 229 Резюме
  • 231 Глава 9. Обуздание форм с помощью HTML5 и CSS3
    • 231 Формы HTML5
    • 233 Основные сведения о компонентах формы HTML5
      • 233 placeholder
      • 234 required
      • 235 autofocus
      • 235 autocomplete
      • 236 Атрибут list и связанный с ним элемент datalist
    • 237 Типы вводимой информации, определяемые в HTML5
      • 238 email
      • 239 number
      • 240 url
      • 242 tel
      • 243 search
      • 243 pattern
      • 244 color
      • 244 Ввод даты и времени
      • 247 range
    • 248 Как воспользоваться полифиллами для тех браузеров, которые не поддерживают новые свойства
    • 249 Придание формам HTML5 стилевого оформления с помощью CSS3
      • 252 Обозначение полей, требующих обязательного заполнения
      • 254 Создание эффекта заливки фона
    • 255 Резюме
  • 256 Глава 10. Подходы к адаптивному веб-дизайну
    • 257 Обкатка дизайна в браузере на самых ранних стадиях
    • 258 Просмотр и обкатка дизайна на реальных устройствах
    • 258 Использование принципа постепенного усложнения
    • 259 Определение матрицы браузерной поддержки
      • 260 Функциональное, но не эстетическое единообразие
      • 260 Выбор поддерживаемых браузеров
    • 261 Создание нескольких уровней пользовательского восприятия
    • 261 Привязка контрольных точек CSS к JavaScript
    • 263 Отказ от использования сред разработки CSS при создании конечного продукта
    • 264 Выработка наиболее практичных решений
    • 267 Использование как можно более простого кода
    • 267 Скрытие, показ и загрузка содержимого для всевозможных окон просмотра
    • 269 Средства контроля качества кода
    • 270 Производительность
    • 271 В преддверии великих перемен
    • 272 Резюме

Инструкция как скачать книгу Фрэйн Бен: HTML5 и CSS3. Разработка сайтов для любых браузеров и устройств. 2-е изд. в форматах DjVu, PDF, DOC или fb2 совершенно бесплатно.
HTML5 и CSS3. Разработка сайтов для любых браузеров и устройств. 2-е изд.
Рейтинг книги:
0 голосов
3562

Поиск книг:




При поиске учитываются только слова, длина которых больше 3-х символов.

Статистика: