Веб-дизайн для недизайнеров Год издания: 2022 Автор: Осборн Трэйси Переводчик: Брайт Д. Издательство: Питер ISBN: 978-5-4461-1917-2 Язык: Русский Формат: PDF Качество: Издательский макет или текст (eBook) Интерактивное оглавление: Да Количество страниц: 176 Описание: Пора сделать веб-разработку доступной для всех. Забавное, полезное и насыщенное информацией руководство охватывает все ключевые принципы дизайна, передовые практики, полезные шоткаты, профессиональные советы, реальные примеры и базовые знания программирования, необходимые для создания красивого веб-сайта, которым вы будете уверенно делиться со всем миром. Почему? Потому что вы научитесь разрабатывать современные сайты! «Веб-дизайн для недизайнеров» содержит все необходимое, чтобы вы чувствовали себя комфортно, занимаясь веб-разработкой, в том числе множество реальных примеров веб-сайтов, которые должны вдохновлять и мотивировать. Не нужно тратить время и деньги на дорогого графического дизайнера, эта книга проведет вас через основы, воспользовавшись самыми быстрыми шоткатами, – вы все сделаете сами, и прямо сейчас.
Примеры страниц
Оглавление
ОБ АВТОРЕ 7 БЛАГОДАРНОСТИ 15 ПРЕДИСЛОВИЕ 16 ВВЕДЕНИЕ 18 ГЛАВА 1 Если из всех глав выбирать одну, то лучше эту 21 ВНЕШНИЙ ВИД — НИЧТО, ФУНКЦИОНАЛ — ВСЁ 21 Хорош ли дизайн? Измеряйте 23 Показывайте свой дизайн — и пусть оценивают! 23 ГОТОВЫЕ РЕШЕНИЯ ПО УЛУЧШЕНИЮ ДИЗАЙНА 24 Избавляйтесь от беспорядка в дизайне — улучшайте внешний вид 24 ГЛАВА 2 Теория и принципы веб-дизайна 29 РАЗДЕЛ 2.1 31 С Е Т К А 31 ГОТОВЫЕ РЕШЕНИЯ 34 Сетки в программах для создания мокапов 34 Сетки для веб-дизайна 36 ЖИВОЙ ПРИМЕР 38 РАЗДЕЛ 2.2 40 Ц В Е Т 40 ГОТОВЫЕ РЕШЕНИЯ 47 Ограничьте цветовую схему 47 Используйте цвет для акцентирования 48 Не забывайте про контраст 48 Находите палитры на специальных сайтах 49 ЖИВОЙ ПРИМЕР 52 РАЗДЕЛ 2.3 55 Т И П О Г РА Ф И К А 55 ОСНОВЫ ТИПОГРАФИКИ 56 Категории шрифтов 56 Межстрочный интервал и высота строки 58 Кернинг и межбуквенный интервал 59 ПРИНЦИПЫ ТИПОГРАФИКИ 60 Используйте в дизайне не более двух гарнитур 60 Избегайте выравнивания по ширине или по центру 61 Выравнивание по центру может вызывать сложности 62 Длина строки 63 ГОТОВЫЕ РЕШЕНИЯ 63 Бесплатные ресурсы для выбора шрифтов 63 Сайты с отобранными шрифтами 65 ЖИВОЙ ПРИМЕР 67 РАЗДЕЛ 2.4 68 Б Е Л О Е П Р О С Т Р А Н С Т В О 68 БАЗОВЫЕ ТЕЗИСЫ О БЕЛОМ ПРОСТРАНСТВЕ 70 Белое пространство улучшает восприятие 70 Белое пространство облегчает чтение 70 Белое пространство усиливает Call-to-action 72 Белое пространство задает изысканный тон 73 НЕМНОГО ТЕОРИИ 74 Интервалы между строк 74 Пространство между элементами 74 Пространство между группами элементов 75 ГОТОВЫЕ РЕШЕНИЯ 76 Удваивайте белое пространство между элементами 76 Убедитесь в оптимальном размере межстрочных интервалов 76 ЖИВОЙ ПРИМЕР 76 РАЗДЕЛ 2.5 79 М А К Е Т И И Е РА РХ И Я 79 ЖИВОЙ ПРИМЕР 84 РАЗДЕЛ 2.6 86 Т Е К С Т 86 ЖИВОЙ ПРИМЕР 92 РАЗДЕЛ 2.7 94 П О Л Ь З О В АТ Е Л Ь С К И Й О П Ы Т 94 ДО НАЧАЛА ДИЗАЙНА 94 Конкурентный анализ 95 Опросы и интервью 96 В ПРОЦЕССЕ ДИЗАЙНА 96 Вайрфреймы, прототипы и юзабилити-тестирование 97 ПОСЛЕ ЗАПУСКА ПРОЕКТА 97 Регулярное юзабилити-тестирование 98 ГОТОВЫЕ РЕШЕНИЯ 98 Помогите пользователю действовать, как хотите вы 98 Обращайте внимание на размер сайта 100 Выполняйте юзабилити-тестирование 100 Включайте аналитику 100 ЖИВОЙ ПРИМЕР 101 РАЗДЕЛ 2.8 102 И З О Б РА Ж Е Н И Я И Х УД О Ж Е С Т В Е Н Н Ы Е Э Л Е М Е Н Т Ы 102 ОСНОВЫ 103 Фотографии и иконки не обязательны 104 Лица как мощный инструмент 105 Обращайте внимание на размер файлов 105 Внимательно выбирайте стоковые фотографии 107 Иконки 108 ГОТОВЫЕ РЕШЕНИЯ 109 Сайты стоковых фото 109 Художественное оформление (иконки, графика и иллюстрации) 110 ЖИВОЙ ПРИМЕР 111 РАЗДЕЛ 2.9 113 Д О П О Л Н И Т Е Л Ь Н Ы Е Н Ю А Н С Ы 113 НАЧИНАЙТЕ С ПРОСТОГО 113 ОРИЕНТИРУЙТЕСЬ НА «ПРАВИЛО ТРЕТЕЙ» 114 ИЗБЕГАЙТЕ ЧИСТОГО ЧЕРНОГО 116 СВЕТ ДОЛЖЕН ПАДАТЬ СВЕРХУ 117 КОНТРАСТ ПОДЧЕРКИВАЕТ ГЛАВНОЕ 117 МЕНЯЕМ ФОН — ИЗМЕНЯЕМ ЦВЕТ 118 БУДЬТЕ ВНИМАТЕЛЬНЫ ПРИ НАЛОЖЕНИИ ТЕКСТА НА ИЗОБРАЖЕНИЕ 119 СОВЕТЫ ПРИ ПРОЕКТИРОВАНИИ ПОРЯДКА ДЕЙСТВИЙ ПОЛЬЗОВАТЕЛЯ 120 ГЛАВА 3 Процесс дизайна и выработка профессионального видения 123 РАЗДЕЛ 3.1 124 П О И С К В Д О Х Н О В Е Н И Я 124 РАЗДЕЛ 3.2 133 П Л А Н И Р О В А Н И Е 133 РАЗДЕЛ 3.3 137 П Р О ТО Т И П Ы 137 СОЗДАНИЕ ВАЙРФРЕЙМА 142 МОКАП ВАШЕГО ДИЗАЙНА 147 РАЗДЕЛ 3.4 152 П О Л У Ч Е Н И Е О Б Р АТ Н О Й С В Я З И 152 ОЦЕНКА ДИЗАЙНА СВЕЖИМ ВЗГЛЯДОМ 153 РЕКОМЕНДАЦИИ ПО СБОРУ ОБРАТНОЙ СВЯЗИ 154 Демонстрация вашего дизайна друзьям и семье 155 Демонстрация дизайна незнакомым людям 155 РАЗДЕЛ 3.5 157 К О Д Д И З А Й Н А 157 НЕ СТАРАЙТЕСЬ БЫТЬ ОРИГИНАЛЬНЫМ 157 ИСПОЛЬЗУЙТЕ ФРЕЙМВОРК CSS 158 НЕ ЗАБЫВАЙТЕ: ДИЗАЙН ДОЛЖЕН БЫТЬ ОТЗЫВЧИВЫМ 159 УДЕЛИТЕ ВНИМАНИЕ РАЗМЕРУ САЙТА 160 ИСПОЛЬЗУЙТЕ АНАЛИТИКУ 161 ГЛАВА 4 Предубеждения 165 ГЛАВА 5 Дополнительные ресурсы 169 КНИГИ 169 БЛОГИ И ОНЛАЙН-ЖУРНАЛЫ 170 ОНЛАЙН-КУРСЫ 171 ПРИМЕРЫ ДЛЯ ВДОХНОВЕНИЯ 171 РЕСУРСЫ ДЛЯ РАБОТЫ С ЦВЕТОМ 172 РЕСУРСЫ ШРИФТОВ 172 РЕСУРСЫ ИЗОБРАЖЕНИЙ 173 CSS-ФРЕЙМВОРКИ 173 ВЕБ-АНАЛИТИКА 173 СОЗДАНИЕ ВАЙРФРЕЙМОВ 173 СБОР ОБРАТНОЙ СВЯЗИ 174 ЗАКЛЮЧЕНИЕ 174 ССЫЛКИ 174
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