При использовании данной презентации при объяснении новой темы появляется возможность применять методы личностно-ориентированного обучения: проблемный метод, метод эвристической беседы и элементы исследования. Постановка проблемы ставит учащихся в условия, которые побуждают его решать учебную проблему, проводить анализ материала и оперировать им. Такая деятельность позволяет учащимся получить новую информацию, освоит новые способы применения знаний
design.ppt
Презентация к уроку по теме «Веб дизайн»
Основы Webдизайна
Презентация к уроку по теме «Веб дизайн»
Дизайн (англ. design) – замысел,
проект, чертеж, рисунок, термин, обозначающий
различные виды проектировочной деятельности,
имеющей целью формирование эстетических и
функциональных качеств предметной среды.
Презентация к уроку по теме «Веб дизайн»
• Webстраница – публикация.
• Любая публикация – информация + реклама.
Должна привлекать внимание
Большей информативностью;
необычным видом;
Презентация к уроку по теме «Веб дизайн»
В отличии от живописи и полиграфии в webдизайне
придется смирится с экономными палитрами, минимумом
элементов и даже уменьшением размеров изображения.
Основная работа webдизайнера – максимально эффективно и
доходчиво подать информацию.
Презентация к уроку по теме «Веб дизайн»
Элементы webдизайна
Webстраница, в отличии от журнальной или книжной, имеет
специфические элементы дизайна. Это обусловлено ее
интерактивными качествами и особенностями HTML, языка
описания страницы. Это:
• Фоновые текстуры (изображения);
• Баннеры;
• Анимация;
• Кнопки;
• Фреймы;
• Шрифты;
•
Гиперссылки;
• Изображения.
Презентация к уроку по теме «Веб дизайн»
Фоновое изображение
• Однородный фон
• Обои
• Логотип
• Не рекомендуется увлекаться пестротой: отвлекает
внимание
Первое сентября
Презентация к уроку по теме «Веб дизайн»
Основной рисунок переднего
плана или баннер
• Фотография, фотоколлаж, рисунок, логотип,
• Назначение: представить автора, назначение или
привлекающий внимание, но с чувством меры
концепцию сайта
• Рекомендуется
рисунок
броский,
необычный,
Презентация к уроку по теме «Веб дизайн»
АНИМАЦИЯ
Данный элемент является дополнительным и подчиненным
к информационной составляющей. Должна привлекать
к себе внимание к чему либо важному или незаметно
продвигать какуюлибо идею, например, девиз фирмы.
Презентация к уроку по теме «Веб дизайн»
Кнопки и команды переходов
• не только и не столько украшают страницы,
но обеспечивают ее гипертекстовую связь с
внешним миром.
• Не стоит увлекаться числом кнопок. Число
Мюллера 72
Презентация к уроку по теме «Веб дизайн»
Фреймы
Фреймы позволяют разделить экран пользователя на две или
Более частей, каждая из которых будет содержать отдельную,
Независимо просматриваемую страницу. Цель фреймов –
сделать сайт более простым для просмотра и работы.
Презентация к уроку по теме «Веб дизайн»
Выбор шрифта
• Проблемы:
Экраны, как правило, 72 dpi
Никогда нет уверенности в том, что
на
установлен
выбранный шрифт
компьютере посетителя.
Презентация к уроку по теме «Веб дизайн»
Категории шрифтов
• Шрифты старого стиля
• Модерн
• Шрифты без засечек
• Рукописные
• Декоративные
• Символьные
Презентация к уроку по теме «Веб дизайн»
Шрифты старого стиля
oldstyle
• хорошо читаются на бумаге, наклонные
засечки, умеренные переходы штрихов,
небольшой наклон влево
• Times Roman, Garamont
• Плохо читаются на мониторах
Презентация к уроку по теме «Веб дизайн»
Модерн
modern
• используются очень большие переходы
штрихов, наклон – вертикальный, засечки
– горизонтальные.
• Выглядит более холодным и
механистическим
• Bodoni, Elephant, Georgia
Презентация к уроку по теме «Веб дизайн»
Шрифты без засечек
Sans Serif
• нет засечек, переходов штрихов, наклона.
• Читаются хуже, чем с засечками
• Arial, Helvetica
Презентация к уроку по теме «Веб дизайн»
Рукописные
Script
• читаются плохо, используются для
различных приглашений
• Zaph Chancery
Презентация к уроку по теме «Веб дизайн»
Декоративные
Decorative
• привлекают внимание, но читаются плохо
• Matisse ITC
Презентация к уроку по теме «Веб дизайн»
Символьные
• коллекция значков для бумажных
документов
• Symbol
Презентация к уроку по теме «Веб дизайн»
Принципы:
• Все заголовки первого уровня должны
выглядеть одинаково
• Весь обычный текст должен выглядеть
одинаково
• Заголовки
первого
уровня
отличаться от обычного текста
• То же самое для всех элементов
должны
Информсвязь
Презентация к уроку по теме «Веб дизайн»
Гиперссылки
В качестве гиперссылок могут использоваться:
• фрагменты текста;
• графические изображения (кнопки, рисунки,
карты и т.д.);
Презентация к уроку по теме «Веб дизайн»
Пример:
• Для получения информации нажмите здесь
• Для получения информации нажмите здесь
• Для получения информации нажмите здесь
• Для получения информации нажмите здесь
Презентация к уроку по теме «Веб дизайн»
Обработка изображений
• Добавление надписей в
изображение
• Значки для предпросмотра
изображения
• Точное позиционирование
• Поворот и вращение
изображения
• Изменение контраста и
яркости
• Изменение размера
• Настройка прозрачности
Презентация к уроку по теме «Веб дизайн»
Выбор цветовой палитры
Чернобелые
«бедно»;
изображения
часто
выглядят
Копии экранов, использующие стандартные цвета
Windows, также иногда выглядят плохо
Презентация к уроку по теме «Веб дизайн»
Контраст и дисгармония
• Белый медведь на северном полюсе и черная кошка в
темной комнате – это примеры предельно неудачного
выбора контраста
• При создании Webстраниц контраст служит для
выполнения двух важных задач:
Облегчает восприятие информации
(черный
текст на белом фоне или желтый текст на синем
фоне);
Разграничивает различные элементы страницы:
заголовки от основного текста
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Для создания контраста можно
использовать:
Цвет;
Размер измеряется в пунктах = 1/72 дюйма;
Гарнитуру (typeface): засечки, наклон засечек,
толщина засечек, переходы штрихов, наклон,
толщина линий, направление,
пропорциональные.
Эффекты анимации.
Презентация к уроку по теме «Веб дизайн»
Способы получения контраста:
• Полужирным выделяется часть текста,
которой придается особое значение
• Курсивом выделяются специальные термины,
особенно если они встречаются первый раз
• Полужирный курсив, как правило,
используется для заголовков
• Подчеркивание использовать не рекомендуется
Презентация к уроку по теме «Веб дизайн»
• Контраст не должен выглядеть глупо, быть кричащим.
• В контрасте не должны смешиваться разные сигналы
для пользователя.
Презентация к уроку по теме «Веб дизайн»
Советы для выбора цвета:
• Выбирайте сочетающиеся цвета. Как правило, цвета,
вместе встречающиеся в природе, сочетаются.
• Цвета Webстраниц должны сочетаться с цветами
изображений.
• Между текстом и фоном должен быть контраст
• Лучше темный цвет на светлом фоне, чем наоборот
• Цвета
контрастировать,
должны
дисгармонировать
но
не
• Изображения для фона должны быть очень светлые со
слабым контрастом
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Презентация к уроку по теме «Веб дизайн»
Материалы на данной страницы взяты из открытых истончиков либо размещены пользователем в соответствии с договором-офертой сайта. Вы можете сообщить о нарушении.
13.05.2018
Посмотрите также:
© ООО «Знанио»
С вами с 2009 года.
О портале
