Из данного видеокурса, Вы узнаете, как выбрать шрифты для веб-сайта и создавать красивый четкий текст. Автор, Лаура Франц, расскажет Вам: как создать легко читаемые проекты, которые удерживают посетителей на странице, обратит внимание на такие детали как размер, высота строк, длина строк, выравнивание, цвет, вертикальное пространство, и многое другое. Также Лора покажет как включать веб-шрифты, используя CSS, и как комбинировать шрифты.
Информация о видеокурсе Название: Типографика для веб-дизайнеров Оригинальное название: Typography for Web Designers Год выхода: 2011 Автор: Lynda.com / Лаура Франц (Laura Franz) Жанр: Обучающий, Веб-дизайн, Типографика Продолжительность: 06:25:00 Язык: Русский
Основные темы курса: • Понимание того, как типографика влияет на удобочитаемость • Выбор безопасных веб-шрифтов • Применение веб- шрифтов в CSS с @font-face • Добавление и применение шрифтов от Google • Поиск и применение хорошего размера шрифта, высоты и длины строки. • Улучшение цветовой палитры за счет улучшения контрастности и уменьшения оптической вибрации • Понимание того, как люди воспринимают визуальные элементы • Применение иерархии в HTML и CSS • Применение вертикального расстояния в CSS • Добавление акцентов на заголовках • Понимание классической и современной типографики • Добавление списка ссылок • Создание буквицы • Висячие кавычки, апострофы и дефисы
Введение 1. Добро пожаловать 2. Использование файлов для упражнений 3. Что следует учитывать перед началом курса
01 Использование шрифтов для передачи значения слова или заголовка 1. Как типографика влияет на чтение 2. Понятие разборчивости 3. Как шрифты передают значение 4. Выбор веб-безопасных шрифтов 5. Размер шрифта, регистр 6. Выбор веб-шрифтов для передачи значения 7. Загрузка веб-шрифтов 8.Веб-шрифты в CSS с помощью @font-face
02 Использование шрифтов для текста 1. Выбор веб-безопасных шрифтов для использования в тексте 2. Применение веб-безопасных шрифтов для текста и заголовка. 3. Применение класса к названию ресурса в тексте 4. Выбор второго веб-безопасного шрифта для заголовка 5. Применение второго шрифта к заголовку 6. Выбор веб-шрифта на Google Font API для использования в тексте 7. Добавление и применение синтаксиса Google Font API 8. Выбор второго веб-шрифта для заголовка с Google Font API 9. Добавление и применение второго шрифта к заголовку 10. Анализ шрифтов на некоторых профессиональных сайтах
03 Максимальная читабельность 1. Как мы читаем 2. Поиск и применение хорошего размера шрифта и высоты строки 3. Поиск и применение подходящей длины строки 4. Что такое em 5. Использование em для установки размера шрифта 6. Использование em для длины строки 7. Влияние цвета на читаемость 8. Улучшение цветовой палитры с помощью контраста 9. Улучшение цветовой палитры с помощью устранения оптической вибрации 10. Анализ читабельности текста на профессиональных сайтах
04 Визуальная разбивка текста 1. Как мы группируем визуальные элементы 2. Разработка системы иерархии 3. Применение иерархии в HTML и CSS 4. Разработка системы для группировки для читателей 5. Применение системы в CSS 6. Изменение элемента с помощью создания и применения класса 7. Использование нескольких колонок для создания иерархии 8. Создание 2-х колоночной системы в HTML и CSS 9. Улучшение горизонтальных пробелов для двухколоночного макета 10. Добавление линий для улучшения группировки 11. Добавление акцента в заголовок 12. Анализ группировки на профессиональных сайтах
05 Формирование страницы средствами типографики 1. Понимание типографики традиционной 2. Как создавать ритм и драматизм 3. Применение навыков типографики при создании дизайна
06 Формирование традиционной страницы типографики 1. Дизайн ссылок для традиционной страницы 2. Добавление списка ссылок на традиционную страницу 3. Описание состояний ссылок в CSS 4. Возврат ссылок в исходное непосещенное состояние 5. Использование CSS для различных ссылок 6. Использование комментариев в CSS 7. Выбор цвета фона или изображения 8. Повторяющееся фоновое изображение 9. Формирование макета традиционной страницы 10. Анализ традиционных элементов
07 Формирование модернистической типографической страницы 1. Дизайн типографики ссылок 2. Создание горизонтального списка 3. Добавление и удаление пространства 4. Стиль встроенных (inline) ссылок 5. Выбор цвета фона или изображения 6. Неповторяющееся фоновое изображение 7. Формирование макета современной страницы 8. Анализ элементов типографики
08 Внимание к деталям типографики 1. Исправление двойных кавычек и апострофов 2. Исправление тире 3. Работа с прописными (маюскульными) цифрами и аббревиатурами 4. Исправление символов, которые выглядят неправильно 5. Висячая пунктуация 6. Применение типографических акцентов 7. Визуальная центровка текста 8. Создание буквицы 9. Анализ деталей типографики на профессиональных сайтах • Заключение
Файл Формат: MP4 Качество: PCRec Видео: AVC, 960x540, ~438 Kbps, 23,976 fps Аудио: MP3, 192 kb/s (CBR), 44.1 KHz Доп. материалы: присутствуют Размер архива: 1,81 GB (+3% на восстановление)
