[Lynda.com] — «Типографика для веб–дизайнеров»
Курс от Lynda.com «Типографика для веб-дизайнеров» (Typography for Web Designers).
Автор Лаура Франц (Laura Franz)
Из данного видеокурса, Вы узнаете, как выбрать шрифты для веб-сайта и создавать красивый четкий текст. Автор, Лаура Франц, расскажет Вам: как создать легко читаемые проекты, которые удерживают посетителей на странице, обратит внимание на такие детали как размер, высота строк, длина строк, выравнивание, цвет, вертикальное пространство, и многое другое.
Также Лора покажет как включать веб-шрифты, используя CSS, и как комбинировать шрифты.
Основные темы курса:
Понимание того, как типографика влияет на удобочитаемость Выбор безопасных веб-шрифтов Применение веб- шрифтов в CSS с @font-face Добавление и применение шрифтов от Google Поиск и применение хорошего размера шрифта, высоты и длины строки. Улучшение цветовой палитры за счет улучшения контрастности и уменьшения оптической вибрации Понимание того, как люди воспринимают визуальные элементы Применение иерархии в HTML и CSS Применение вертикального расстояния в CSS Добавление акцентов на заголовках Понимание классической и современной типографики Добавление списка ссылок Создание буквицы Висячие кавычки, апострофы и дефисы
Goal Accomplishment Criteria
Материал изучен
-
Использование шрифтов для передачи значения слова или заголовка
1. Как типографика влияет на чтение
2. Понятие разборчивости
3. Как шрифты передают значение
4. Выбор веб-безопасных шрифтов
5. Размер шрифта, регистр
6. Выбор веб-шрифтов для передачи значения
7. Загрузка веб-шрифтов
8. Веб-шрифты в CSS с помощью @font-face
-
Использование шрифтов для текста
1. Выбор веб-безопасных шрифтов для использования в тексте
2. Применение веб-безопасных шрифтов для текста и заголовка.
3. Применение класса к названию ресурса в тексте
4. Выбор второго веб-безопасного шрифта для заголовка
5. Применение второго шрифта к заголовку
6. Выбор веб-шрифта на Google Font API для использования в тексте
7. Добавление и применение синтаксиса Google Font API
8. Выбор второго веб-шрифта для заголовка с Google Font API
9. Добавление и применение второго шрифта к заголовку
10. Анализ шрифтов на некоторых профессиональных сайтах
-
Максимальная читабельность
1. Как мы читаем
2. Поиск и применение хорошего размера шрифта и высоты строки
3. Поиск и применение подходящей длины строки
4. Что такое em
5. Использование em для установки размера шрифта
6. Использование em для длины строки
7. Влияние цвета на читаемость
8. Улучшение цветовой палитры с помощью контраста
9. Улучшение цветовой палитры с помощью устранения оптической вибрации
10. Анализ читабельности текста на профессиональных сайтах
-
Визуальная разбивка текста
1. Как мы группируем визуальные элементы
2. Разработка системы иерархии
3. Применение иерархии в HTML и CSS
4. Разработка системы для группировки для читателей
5. Применение системы в CSS
6. Изменение элемента с помощью создания и применения класса
7. Использование нескольких колонок для создания иерархии
8. Создание 2-х колоночной системы в HTML и CSS
9. Улучшение горизонтальных пробелов для двухколоночного макета
10. Добавление линий для улучшения группировки
11. Добавление акцента в заголовок
12. Анализ группировки на профессиональных сайтах
-
Формирование страницы средствами типографики
1. Понимание типографики традиционной
2. Как создавать ритм и драматизм
3. Применение навыков типографики при создании дизайна
-
Формирование традиционной страницы типографики
1. Дизайн ссылок для традиционной страницы
2. Добавление списка ссылок на традиционную страницу
3. Описание состояний ссылок в CSS
4. Возврат ссылок в исходное непосещенное состояние
5. Использование CSS для различных ссылок
6. Использование комментариев в CSS
7. Выбор цвета фона или изображения
8. Повторяющееся фоновое изображение
9. Формирование макета традиционной страницы
10. Анализ традиционных элементов
-
Формирование модернистической типографической страницы
1. Дизайн типографики ссылок
2. Создание горизонтального списка
3. Добавление и удаление пространства
4. Стиль встроенных (inline) ссылок
5. Выбор цвета фона или изображения
6. Неповторяющееся фоновое изображение
7. Формирование макета современной страницы
8. Анализ элементов типографики
-
Внимание к деталям типографики
1. Исправление двойных кавычек и апострофов
2. Исправление тире
3. Работа с прописными (маюскульными) цифрами и аббревиатурами
4. Исправление символов, которые выглядят неправильно
5. Висячая пунктуация
6. Применение типографических акцентов
7. Визуальная центровка текста
8. Создание буквицы
9. Анализ деталей типографики на профессиональных сайтах
Don't miss new posts!
Subscribe for the Goal and follow through to its completion
