Доступно [Lynda.com] CSS: Макеты страниц (CSS: Page Layouts) (На Русском)

[Slivrobot]

[Lynda.com] CSS: Макеты страниц (CSS: Page Layouts) (На Русском) Спойлер

• 0. Вступление 4m 20s
  • Приветствие 54s
  • Использование файлов упражнений 3m 26s
• 1. Основы макета 1h 39m
  • Обзор блочной модели 8m 47s
  • Расчёт размеров элемента 11m 11s
  • Понимание схлопывания отступов Margin 7m 59s
  • Расчёт значений Em 7m 41s
  • Расчёт процентных значений 7m 51s
  • Нормальный ход документа 13m 3s
  • Контроль отображения элемента 8m 53s
  • Использование CSS-сбросов 7m 11s
  • Фиксированные, резиновые и отзывчивые макеты 9m 9s
  • Инструменты отладки CSS 6m 46s
  • Использование Firebug и WebKit Web Inspector 11m 5s
• 2. Размышления о дизайне 53m 15s
  • Рабочий процесс дизайна страницы 3m 6s
  • Инструменты дизайна страницы 4m 56s
  • Определение структуры страницы 7m 18s
  • Создание активов изображений 8m 58s
  • Создание начальной структуры страницы 7m 3s
  • Добавление смысла при помощи классов и ID 5m 23s
  • Структурирование контента при помощи HTML5 6m 6s
  • Построение внутренней структуры 10m 25s
• 3. Работа с плавающими элементами 1h 36m
  • Плавающие элементы 7m 50s
  • Очистка плавания 7m 28s
  • Содержание плавающих элементов 7m 50s
  • Метод Clearfix 10m 38s
  • Плавание строчных элементов 14m 34s
  • Двухколоночный макет со свойством Float 8m 17s
  • Трёхколоночный макет со свойством Float 11m 30s
  • Размышления о высоте колонок 7m 3s
  • Создание колонок одинаковой высоты 10m 42s
  • Плавающие элементы — Лабораторная 5m 25s
  • Плавающие элементы — Решение 5m 21s
• 4. Позиционирование элементов 51m 42s
  • Относительное позиционирование 7m 59s
  • Абсолютное позиционирование 8m 59s
  • Фиксированное позиционирование 4m 23s
  • Контроль порядка наложения 8m 31s
  • Обрезка контента 8m 21s
  • Контроль переполнения контента 5m 38s
  • Позиционирование элементов — Лабораторная 3m 59s
  • Позиционирование элементов — Решение 3m 52s
• 5. Создание фиксированных макетов 48m 46s
  • Размышления о дизайне фиксированных макетов 3m 28s
  • Определение сетки макета 7m 57s
  • Определение размеров колонок 9m 30s
  • Применение сетки при помощи CSS 8m 56s
  • Создание активов на основе сетки 8m 26s
  • Ресурсы по дизайну на основе сетки 6m 22s
  • Создание фиксированных макетов — Лабораторная 4m 7s
• 6. Создание эластичных макетов 44m 35s
  • Дизайн для эластичных макетов 2m 30s
  • Расчёт процентных значений 8m 45s
  • Установка значений эластичной ширины 6m 6s
  • Эластичные изображения 8m 10s
  • Установка минимальной и максимальной ширины 7m 24s
  • Создание эластичных макетов — Лабораторная 4m 53s
  • Создание эластичных макетов — Решение 6m 47s
• 7. Создание отзывчивых макетов 49m 36s
  • Обзор отзывчивого макета 3m 49s
  • Использование медиазапросов 7m 16s
  • Организация стилей 8m 39s
  • Отзывчивый контент 8m 33s
  • Размышления о мобильном дизайне 7m 32s
  • Создание отзывчивых макетов — Лабораторная 4m 23s
  • Building responsive layouts: Solution 9m 24s
• 8. Enhancing Page Design 1h 22m
  • Creating multi-column text 6m 36s
  • Using borders to enhance design 13m 59s
  • Rounding corners 6m 56s
  • Adding drop shadows 10m 35s
  • Working with opacity 6m 8s
  • Utilizing the background property 15m 5s
  • Working with CSS sprites 7m 58s
  • Enhancing page design: Lab 6m 22s
  • Enhancing page design: Solution 8m 38s
• Additional Resources 6m 25s
  • Additional resources 6m 25s

Содержание

Скрытый текст. Доступен только зарегистрированным пользователям.
Скрытый текст. Доступен только зарегистрированным пользователям.

• Обзор блочной модели
• Расчёт процентных значений и значений em
• Контроль отображения элементов
• Создание фиксированного, резинового и отзывчивого макетов
• Структурирование контента при помощи HTML5
• Плавающие элементы
• Использование относительного, абсолютного и фиксированного позиционирования
• Определение размеров колонок
• Создание активов и макетов на основе решётки
• Рассмотрение проблем особенностей мобильного дизайна
• Работа с многоколоночным текстом
• Улучшение дизайна страницы с помощью CSS спрайтов

Темы:

В курсе CSS: Макеты страниц представлены основные концепции макетов, даны советы, как создавать правильно структурированный HTML, основываясь на прототипах и разметке, а также освещены критические навыки создания макетов, такие как позиционирование и работа со свойством float. Автор Джеймс Вильямсон покажет, как использовать вместе эти приёмы для создания фиксированных, резиновых и отзывчивых макетов. Дизайнеры также узнают, как улучшить восприятие страниц с помощью креативного использования методов CSS для создания нескольких столбцов текста, изменения непрозрачности, и настройки свойства Background (Фон). К курсу прилагаются файлы упражнений.

Продолжительность: 8:57 ч
Переводчик: Силя Сильхи
Автор: James Williamson
CSS: Макеты страниц
(CSS: Page Layouts)
Lynda.com [русский перевод]