Веб-дизайн для начинающих. HTML, CSS, JavaScript и веб-графика. 5-е изд. Год издания: 2021 Автор: Роббинс Дженнифер Переводчик: ООО БХВ-Петербург Издательство: БХВ-Петербург ISBN: 978-5-9775-4050-6 Язык: Русский Формат: PDF Качество: Издательский макет или текст (eBook) Количество страниц: 956 Описание: Книга поможет освоить веб-дизайн, не имея опыта. На практических примерах показано, как создать простой сайт и постепенно его совершенствовать. Рассказано о создании веб-страниц, содержащих текст, ссылки, изображения, таблицы и формы. Описано применение CSS для создания и выбора цвета, фона, форматирования текста, макетирования страниц и выполнения простой анимации. Даны основы языка JavaScript и подчеркнута его важность в веб-дизайне. Описано создание, оптимизация и сокращение времени загрузки веб-изображений. В каждой главе представлены упражнения, которые позволят освоить описанные методики, и краткие контрольные вопросы для закрепления ключевых понятий. В пятом издании добавлен материал об использовании CSS Flexbox и Grid для создания сложных и гибких макетов страниц, тонкостях адаптивного веб-дизайна для отображения веб-страниц на экранах любых устройств, о работе с командной строкой, Git и другими инструментами веб-дизайнера, а также применении SVG-изображений
Примеры страниц
Оглавление
НАПУТСТВИЕ от Джен Симмонс ................................................................................................................................... 9 ПРЕДИСЛОВИЕ ..................................................................................................................................................................... 11 Структура книги .................................................................................................................................... 14 Типографские соглашения ............................................................................................................... 16 Благодарности ........................................................................................................................................ 16 Об авторе .................................................................................................................................................. 17 Как с нами связаться? ......................................................................................................................... 18 ЧАСТЬ I. НАЧАЛО РАБОТЫ...................................................................................... 19 Глава 1. Знакомство с веб-дизайном .............................................................................21 С чего начать? .........................................................................................................................................22 Распределение ролей при разработке сайтов .....................................................................23 Подготовка к веб-разработке ........................................................................................................36 Подведем итоги ..................................................................................................................................... 41 Контрольные вопросы .......................................................................................................................42 Глава 2. Как все это работает?..........................................................................................43 Связь между Интернетом и Всемирной паутиной ..............................................................43 Порядок обработки информации ................................................................................................44 Пара слов о браузерах ......................................................................................................................45 Адреса веб-страниц: URL..................................................................................................................47 Анатомия веб-страницы ................................................................................................................... 51 Собираем все вместе ..........................................................................................................................57 Контрольные вопросы .......................................................................................................................60 Глава 3. Важные концепции ..............................................................................................61 Множественность устройств… .....................................................................................................62 Соблюдение интернет-стандартов ..............................................................................................64 Постепенное улучшение ...................................................................................................................64 Адаптивный веб-дизайн ....................................................................................................................66 Один Интернет для всех (доступность сайтов) ....................................................................69 Потребность в скорости (быстродействие сайта) ...............................................................72 Контрольные вопросы .......................................................................................................................75 ЧАСТЬ II. РАЗМЕТКА HTML, ПРИМЕНЯЕМАЯ ДЛЯ СТРУКТУРИРОВАНИЯ ВЕБ-СТРАНИЦ ............................................................................................ 77 Глава 4. Создание простой веб-страницы ...................................................................79 Пошаговое создание веб-страницы............................................................................................79 Запуск текстового редактора .........................................................................................................80 Шаг 1. Начнем с ввода контента ...................................................................................................84 Шаг 2. Добавление структуры в HTML-документ .................................................................87 Шаг 3. Добавление тегов в HTML-документ ............................................................................92 Шаг 4. Добавление изображений .................................................................................................96 Шаг 5. Изменение внешнего вида текста с помощью таблицы стилей ..................100 Устранение проблем при разработке веб-страниц .........................................................101 Валидация документов ....................................................................................................................103 Контрольные вопросы .....................................................................................................................105 Глава 5. Разметка текста ..................................................................................................107 Абзацы ......................................................................................................................................................108 Заголовки ................................................................................................................................................109 Тематические разрывы (горизонтальные линейки) .......................................................... 111 Списки ...................................................................................................................................................... 111 Дополнительные элементы разметки контента ................................................................. 116 Организация контента на странице..........................................................................................120 Обзор строчных элементов ..........................................................................................................127 Обобщающие элементы (div и span) ........................................................................................141 Улучшение доступности документа с помощью ARIA .....................................................148 Экранирование символов ..............................................................................................................151 Объединяем все вместе ..................................................................................................................154 Контрольные вопросы .....................................................................................................................158 Обзор элементов: текстовые элементы ..................................................................................158 Глава 6. Добавление ссылок ...........................................................................................161 Атрибут href ........................................................................................................................ 162 Ссылки на веб-страницы в Интернете ...................................................................................164 Ссылки в пределах сайта ................................................................................................................165 Ссылка на фрагмент другого документа ................................................................................176 Открытие новых целевых окон браузера ..............................................................................178 Почтовые ссылки ................................................................................................................................179 Телефонные ссылки ...........................................................................................................................180 Контрольные вопросы .....................................................................................................................181 Обзор элементов: ссылки ...............................................................................................................182 Глава 7. Добавление изображений ..............................................................................183 Раздел первый: добавление изображений с помощью элемента img ................ 184 Раздел второй: добавление SVG-изображений ..................................................................194 Раздел третий: разметка адаптивных изображений ........................................................203 Конец — делу венец .........................................................................................................................218 Контрольные вопросы .....................................................................................................................219 Обзор элементов: изображения .................................................................................................221 Глава 8. Таблицы .................................................................................................................223 Использование таблиц .................................................................................................................... 223 Минимальная структура таблицы ............................................................................................224 Заголовки таблиц ................................................................................................................................227 Растяжение ячеек ...............................................................................................................................228 Доступность таблиц ..........................................................................................................................231 Группировка строк и столбцов ....................................................................................................233 Собираем все воедино ....................................................................................................................235 Контрольные вопросы .....................................................................................................................237 Обзор элементов: таблицы ............................................................................................................238 Глава 9. Формы ....................................................................................................................239 Как работают формы? .......................................................................................................................239 Элемент form ............................................................................................................241 Переменные и контент ....................................................................................................................245 Элементы управления формой ...................................................................................................246 Функции доступности формы ......................................................................................................270 Макет и дизайн формы ....................................................................................................................275 Контрольные вопросы .....................................................................................................................277 Обзор элементов: формы ...............................................................................................................278 Глава 10. Встроенные мультимедийные объекты .....................................................285 Окно в окне: элемент iframe ........................................................................................................285 Многоцелевое средство для встраивания: object ........................................................... 288 Видео и аудио ...................................................................................................................................... 290 Холст ..........................................................................................................................................................301 Контрольные вопросы .....................................................................................................................305 Обзор элементов: встроенные мультимедийные объекты ......................................... 306 ЧАСТЬ III. ПРАВИЛА CSS ДЛЯ ПРЕДСТАВЛЕНИЯ HTML-ДОКУМЕНТОВ ........309 Глава 11. Введение в каскадные таблицы стилей .....................................................311 Преимущества CSS .............................................................................................................................312 Мощь CSS ................................................................................................................................................312 Как работают таблицы стилей? ...................................................................................................313 Важные понятия ..................................................................................................................................320 Единицы измерения CSS .................................................................................................................330 Инструменты вашего браузера для веб-дизайна .............................................................334 Вперед — вместе с CSS ...................................................................................................................336 Контрольные вопросы .....................................................................................................................337 Глава 12. Форматирование текста ..................................................................................339 Основные свойства шрифтов ...................................................................................................... 340 Расширенная CSS3-типографика .................................................................................................361 Свойство color (изменение цвета текста) ..............................................................................363 Еще о типах селекторов ..................................................................................................................365 Настройки текстовых строк .........................................................................................................371 Изменение маркированного и нумерованного списков ...............................................383 Контрольные вопросы .....................................................................................................................387 Обзор CSS: свойства font и text ............................................................................................... 388 Глава 13. Цвета и фоны, а также еще о селекторах и внешних таблицах стилей ..391 Указание цветовых значений .......................................................................................................391 Свойство color (цвет переднего плана) ..................................................................................398 Свойство background-color (цвет фона) ................................................................................399 Свойство background-clip (обрезка фона) ........................................................................... 400 Свойство opacity (управление непрозрачностью) ...........................................................401 Селекторы псевдокласса ............................................................................................................... 403 Селекторы псевдоэлементов....................................................................................................... 408 Селекторы атрибутов ....................................................................................................................... 411 Фоновые изображения ....................................................................................................................413 Все цвета радуги (градиенты) ......................................................................................................431 И, в завершение, внешние таблицы стилей .........................................................................438 Подводим итоги ..................................................................................................................................442 Контрольные вопросы .....................................................................................................................442 Обзор CSS: свойства цвета и фона ........................................................................................... 444 Глава 14. Блочная модель ................................................................................................. 445 Блок элемента ..................................................................................................................................... 445 Свойства width, height и box-sizing (указание размеров блока) ............................ 446 Отступы ....................................................................................................................................................451 Стили границ .........................................................................................................................................457 Поля .......................................................................................................................................................... 468 Присваивание типов отображения ...........................................................................................474 Тени для блока .....................................................................................................................................476 Контрольные вопросы .....................................................................................................................477 Обзор CSS: свойства блока ............................................................................................................478 Глава 15. Плавающие элементы и позиционирование ............................................481 Нормальный поток ............................................................................................................................481 Плавающие элементы ...................................................................................................................... 482 Свободное обтекание текстом CSS-форм ............................................................................. 494 Основы позиционирования ..........................................................................................................502 Относительное позиционирование ......................................................................................... 504 Абсолютное позиционирование .................................................................................................505 Фиксированное позиционирование .........................................................................................514 Контрольные вопросы .....................................................................................................................516 Обзор CSS: свойства плавающих элементов и позиционирования .........................517 Глава 16. CSS-макетирование с помощью Flexbox и Grid .......................................519 CSS Flexbox: создание гибких контейнеров ........................................................................520 Модуль CSS Grid Layout ...................................................................................................................549 Контрольные вопросы .................................................................................................................... 584 Обзор CSS: свойства макета ......................................................................................................... 588 Глава 17. Адаптивный веб-дизайн ..................................................................................591 Зачем нужен АВД? ..............................................................................................................................591 Рецепт адаптивности ........................................................................................................................593 Настройка области просмотра ....................................................................................................594 Гибкие сетки (текучие макеты) ....................................................................................................595 Выбор точек прерывания .............................................................................................................. 603 Стратегии адаптивной разработки ........................................................................................... 606 Несколько слов о тестировании.................................................................................................622 Дополнительные справочные ресурсы по адаптивному веб-дизайну ...................624 Контрольные вопросы .....................................................................................................................626 Глава 18. Переходы, трансформации и анимация .....................................................627 CSS Transitions .......................................................................................................................................628 Модуль CSS Transforms ....................................................................................................................638 Анимация по ключевым кадрам .................................................................................................650 Несколько завершающих слов ....................................................................................................655 Контрольные вопросы .....................................................................................................................657 Обзор CSS: переходы, трансформации и анимация .........................................................659 Глава 19. Дополнительные сведения о CSS-методиках ...........................................661 Стайлинг форм .....................................................................................................................................661 Специальные свойства для форматирования таблиц .................................................... 665 Очистка стилей: сброс CSS и таблица стилей Normalize.css ..............................669 Методика подмены текста изображением ............................................................................671 CSS-спрайты ..........................................................................................................................................673 Проверка поддержки свойств CSS ............................................................................................675 Таблицы стилей: послесловие .................................................................................................... 680 Контрольные вопросы .................................................................................................................... 680 Обзор CSS: свойства таблиц ......................................................................................................... 682 Глава 20. Современные инструменты для веб-дизайна ......................................... 683 Знакомство с командной строкой ............................................................................................ 683 Универсальные CSS-инструменты (процессоры) ............................................................... 689 Grunt и Gulp: инструменты для сборки кода .......................................................................697 Контроль версий с помощью Git и GitHub ............................................................................701 Заключение ............................................................................................................................................710 Контрольные вопросы .....................................................................................................................711 ЧАСТЬ IV. ПРИМЕНЕНИЕ JAVASCRIPT ДЛЯ УПРАВЛЕНИЯ ПОВЕДЕНИЕМ ВЕБ-СТРАНИЦ ........................... 713 Глава 21. Введение в JavaScript ........................................................................................715 Что есть JavaScript? ............................................................................................................................715 Добавление кода JavaScript на веб-страницу ......................................................................719 Анатомия сценария ...........................................................................................................................721 Объект браузера .................................................................................................................................737 События ...................................................................................................................................................737 Объединяя все вместе .....................................................................................................................740 Дополнительные сведения о JavaScript ..................................................................................741 Контрольные вопросы .....................................................................................................................743 Глава 22. Использование JavaScript и DOM ................................................................745 Встречайте DOM ..................................................................................................................................745 Полифилы ...............................................................................................................................................755 Библиотеки JavaScript.......................................................................................................................758 Промежуточный финиш ..................................................................................................................763 Контрольные вопросы .....................................................................................................................764 ЧАСТЬ V. ИЗОБРАЖЕНИЯ ДЛЯ ВСЕМИРНОЙ ПАУТИНЫ ................................ 765 Глава 23. Веб-графика: основные понятия ...................................................................767 Источники изображений ................................................................................................................767 Знакомство с форматами изображений .................................................................................772 Размер и разрешение изображения ........................................................................................785 Стратегия работы с изображениями ........................................................................................789 Фавиконы ................................................................................................................................................793 Подведем итоги… ..............................................................................................................................797 Контрольные вопросы .....................................................................................................................798 Глава 24. Создание веб-изображений ...........................................................................799 Сохранение изображений в веб-форматах ..........................................................................799 Работа с прозрачностью ................................................................................................................ 806 Советы по созданию адаптивных изображений ................................................................813 Оптимизация изображения ...........................................................................................................823 Контрольные вопросы .................................................................................................................... 834 Глава 25. SVG-изображения...............................................................................................835 Рисование с помощью XML ...........................................................................................................837 Возможности SVG, связанные с XML ....................................................................................... 846 Инструменты SVG ...............................................................................................................................853 Советы по созданию SVG ..............................................................................................................856 Адаптивные изображения в формате SVG ........................................................................... 860 Дальнейшее изучение SVG .......................................................................................................... 868 Контрольные вопросы .................................................................................................................... 868 И ... мы это сделали! ......................................................................................................................... 869 ЧАСТЬ VI. ПРИЛОЖЕНИЯ.......................................................................................... 871 Приложение 1 ............................................................................................................................873 Приложение 2 ........................................................................................................................... 889 Приложение 3 ............................................................................................................................891 Приложение 4 ............................................................................................................................897 ПРЕДМЕТНЫЙ УКАЗАТЕЛЬ .......................................................................................906
Роббинс Дженнифер - Веб-дизайн для начинающих. HTML, CSS, JavaScript и веб-графика. 5-е изд. [2021, PDF, RUS] download torrent for free and without registration
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum You cannot attach files in this forum You can download files in this forum
![[Quote]](./templates/default/images/lang/en/icon_quote.gif "Reply with quote"){kind=icon}
![[Profile]](./templates/default/images/lang/en/icon_profile.gif "View user's profile"){kind=icon}
![[PM]](./templates/default/images/lang/en/icon_pm.gif "Send private message"){kind=icon}
