Создание баннера - Создание сайта
Баннер представляет собой рекламный рисунок для рекламы в Интернете созданного сайта. Как правило, баннер - это графическое изображение прямоугольной формы в формате Gif или Jpeg. Баннер помещается на Web-странице и имеет ссылку на сайт рекламодателя. Размеры баннеров стандартизированы.
Размер баннера в пикселах |
Тип баннера |
468х60 |
Full Banner (Стандартный баннер) |
234х60 |
Half Banner (Баннер половинного размера) |
88х31 |
Micro Ban (Микро полоса) |
120х90 |
Button1 (Кнопка 1) |
120х60 |
Button2 (Кнопка 2) |
120х240 |
Vertical Banner (Вертикальный баннер) |
125х125 |
Square Banner (Квадратный баннер) |
728х90 |
Leaderboard ("Перетяжка" вверху страницы) |
Запустите Adobe PhotoShop (Пуск > Программы>Adobe PhotoShop CS2)
Выберите команду Файл>Новый. На экране появится диалог Новый. Заполните его по образцу:
В поле Имя в верхней части диалога можно указать имя создаваемого документа. По умолчанию предлагается Безимени-1. Не изменяйте название. Это можно сделать позже, при сохранении рисунка.
Параметр Разрешение определяет разрешение создаваемого рисунка - количество пикселов (точек, из которых строится изображение) на дюйм. Для экрана этот параметр составляет 72.
В результате получаем следующее:
Баннер, который мы будем создавать, состоит из простого логотипа компании ООО "ДИНАС" и двух сменяющих друг друга анимированных надписей, приглашающих посетить сайт компании. Начнем с подготовки логотипа, который в свою очередь будет состоять из трех объектов, размещенных один внутри другого: текста, эллипса и прямоугольника.
Нарисуем в левой части окна документа прямоугольную область размером 150х50 пикселов, которую затем зальем выбранным цветом.
Выберите инструмент Прямоугольная Область на панели инструментов. Настройте панель свойств инструмента (в верхней части окна) как показано на рисунке:
Щелкните мышью в левой части создаваемого документа. Зальем выделенную область цветом, используя инструмент Заливка. Выбрать подходящий цвет можно либо используя палитру Образцы, либо щелкнув на соответствующей кнопке.
Снимите выделение (Меню Выделение>Снять Выделение).
Создадим внутри прямоугольника эллиптическую область с размерами горизонтальной и вертикальной осей 140х40 пикселей с помощью инструмента Овальная Область. Если область выделения нужно будет расположить иначе, воспользуйтесь командой меню Выделение>Трансформировать Выделенную Область. Залейте область выделения белым цветом. Снимите выделение.
Сохраните документ в своей папке с именем Banner. psd, которое позволит нам редактировать свой документ в дальнейшем.
Добавим в создаваемый логотип надпись ООО Динас. Когда в рисунок добавляется текст, он всегда помещается на отдельный слой. Слои дают возможность редактировать отдельные элементы изображения независимо друг от друга. Управление слоями осуществляется с помощью палитры Слои. Видимость любого слоя может быть отключена при нажатии на кнопку рядом с названием слоя. Кроме того, для каждого слоя можно назначать свой стиль оформления, используя палитру Стили. Выбранный стиль присваивается всем объектам, находящимся на данном слое. С помощью кнопки в правом верхнем углу панели стилей вы можете выбрать подходящий для вас набор из выпадающего списка панели.
Нажмите кнопку Горизонтальный Текст на панели инструментов, установите текстовый курсор в нужное место и напишите текст. Самостоятельно оформите его, используя возможности панели свойств. Для точного позиционирования текста можно использовать инструмент Перемещение . Должно получиться примерно следующее:
Создадим еще 2 текстовых слоя с надписями "Ищите Канцтовары Недорого?" и "Заходите СЮДА!", расположенными на рисунке справа от логотипа, одна под другой так, чтобы они могли сменять друг друга. Присвойте каждому из слоев подходящий на ваш взгляд стиль. Должно получиться примерно следующее:
С помощью КнопкиНовый Слой в нижней части панели Слои создайте новый слой. Измените его название на Дверь (щелкните на названии слоя в палитре слоев). Создадим здесь рисунок открытой двери, чтобы посетителю сайта, увидевшему баннер, было понятно, куда нужно заходить.
Отключите видимость текстовых слоев, чтобы они не мешали при создании двери, используя кнопку рядом с названием слоя.
Сначала нарисуем основу двери с помощью инструмента. Залейте созданное выделение цветом. В дальнейшем можно использовать какой-либо стиль слоя на ваше усмотрение. Снимите выделение.
Теперь внутри данного прямоугольника нарисуем меньший прямоугольник - дверную коробку. Залейте его цветом, отличным от белого. В дальнейшем из этого прямоугольника будет создана дверь.
Теперь можно выполнить преобразование области выделения с помощью команды Редактирование>Трансформирование>Искажение. Изменим положение левого углового маркера, перетащив его на середину нижней стороны белого прямоугольника.
Подобным образом изменим положение левого верхнего угла прямоугольника так, чтобы левая сторона выделенной прямоугольной области стала вертикальной. Внесите также и другие необходимые изменения чтобы привести дверь к следующему виду. Примените сделанные изменения (кнопка на панели свойств в верхней части окна). Снимите выделение.
Вид баннера на данном этапе представлен на рисунке:
Сохраните файл. В дальнейшем он будет анимирован.
Похожие статьи
-
Создание Web-страниц в прикладной программе FrontPage - Создание сайта
Создание новой пустой Web-страницы Если при открытии окна программы FrontPage в нем отображается пустая страница, то разработку веб - страницы можно...
-
Что такое Flash? Flash (от англ. Flash - "вспышка", произносится "флэш") Flash - это технология веб-мультипликации и создания интерактивного контента от...
-
Структура сайта в виде блок-схемы (Рисунок 1) Рисунок 1 - Структура сайта в виде блок-схемы Mockup главной страницы Макет сайта (Рисунок 2) был выполнен...
-
Создание заголовков - Создание сайта
Заголовки - отличный инструмент структурной организации содержимого Веб-страницы. Стандарт HTML предусматривает возможность использования заголовков...
-
Adobe Dreamweaver Adobe Dreamweaver - это HTML-редактор от компании Adobe, который на сегодняшний день очень известный. Первая его версия была выпущена в...
-
Анкеты, опросные листы и многие другие документы представляют собой бланки, предназначенные для заполнения и последующей обработки, Часто бланк также...
-
Сервисы сайта - Создание сайта
Сервисы сайта направлены на облегчение использования сервисов компании. Так, например, онлайн-консультация позволяет пользователю быстро получить ответ...
-
Для того, чтобы создать страницу сайта достаточно в текстовом редакторе, в блокноте сделать следующую надпись: Первая страница сайта создана. После...
-
Окно прикладной программы FrontPage - Создание сайта
После запуска программы FrontPage (Пуск - программы - Microsoft Office - FrontPage ) на экране появится окно программы, в котором отображается новая...
-
Знакомство с программой FrontPage - Создание сайта
Прикладная программа FrontPage 2003 - это визуальный html-редактор для быстрого создания сайта. Язык HTML является основным языком программирования Web -...
-
Проектирование и разработка сайта Средства разработки Язык гипертекстовой разметки HTML В Интернете сосредотачивается и передается достаточно большое...
-
Во введении актуализируется необходимость создания вашего электронного средства обучения (педагогический подход, используемая методика). Автор дает...
-
Анализ целевой аудитории. - Создание сайта
Пользовательская аудитория - преимущественно мужчины (80%), а так же женщины (20%) в возрасте от 18 до 50 лет. Можно разделить на четыре (4) основные...
-
Организация связи в Internet - Создание сайта
При организации связи между вычислительными машинами, используется специальный набор правил, которые называются протоколом связи. Схема связи: клиент -...
-
Автоматизированное извлечение текстов для корпуса политических статей сайта Lenta. ru Для создания полезного обучающего корпуса требуется постоянное...
-
Center Выравнивание текста по центру. Текст помещается по центру горизонтали окна браузера или контейнера, где расположен текстовый блок. Left...
-
Практическое решение примеров в программе Macromedia Flash (скриншоты примеров) Пример анимационная баннер сайта. Пример баннер сайта состоит 227 кадров...
-
Создание форм для ввода данных, Создание отчетов - Разработка информационной системы "Гостиница"
Для того чтобы нам было в дальнейшем удобно и быстро работать с базой данной мы должны создать ряд нужных форм. Формы в БД Access можно создавать с...
-
Разработка графической части На данном этапе создания веб-сайта для рекламного агентства "ART", был разработан дизайн подобающе данной тематике. Стиль...
-
Начинать следует с определения структуры таблицы, соответствующей предметной области, т. е. с определения полей, которые надо включить в таблицу, типов...
-
Структура web-документа - Создание сайта
Каждый HTML-документ, отвечающий спецификации HTML какой-либо версии, должен начинаться со строки объявления версии HTML <!DOCTYPE...>, которая обычно...
-
Резюме Наименование проекта: Компания услуги по созданию интернет-сайтов. Инициатор проекта: Иванов Иван Иванович Организационно-правовая форма -...
-
Оформление сайта, Язык HTML - Создание сайта
Оформление или дизайн - это внешний вид сайта. Эта та оболочка, которую вам придется надевать на ваш сайт, как этикетку на коробку с товаром. От этой...
-
Выводы и рекомендации к сайту - Создание сайта
Хотя полного аналога проекта компании "Музыкальная компания BOOM", найти на белорусском рынке не удалось, все же были выведены общие критерии, актуальные...
-
Инвестиционная привлекательность рынка - Создание сайта
К настоящему времени наблюдается устойчивый тренд роста числа белорусских потребителей, использующих Интернет для получения всевозможной информации. По...
-
Как создать свой сайт? Итак, создание сайта всегда начинается с идеи. Прежде, чем приступить к работе над сайтом, вы должны четко представлять, что вы в...
-
Использование техники фреймов позволяет разбить окно браузера на произвольное число независимых подокон, каждое из которых отображает отдельную HTML -...
-
Шаблоны сайта Bootstrap3 Веб-дизайн является одним из основных элементов в процессе создания сайта. Именно от него зависит, насколько удобно и комфортно...
-
Применение полученных знаний на практике. Создание приложения - Программирование на языке C++
Я применил полученные знания при разработке простого приложения TodoList. Я соблюдал все принципы SOLID. Придерживаясь принципа инверсии зависимости я...
-
Создание форм 1. Для создания формы Биатлонисты совершаем следующие действия Таблицы > Биатлонисты > Создание> Форма, как показано на рисунке...
-
Один из наиболее простых и, в то же время, наиболее выразительных способов изменения внешнего вида текста состоит в изменении шрифта, которым он написан....
-
Задание 3. Создание Web-страниц в PowerPoint - PowerPoint и презентация
Программа PowerPoint, входящая в состав Microsoft Office, позволяет на профессиональном уровне подготовить слайды для проведения презентаций. Благодаря...
-
Программные средства создания растровых изображений Среди программ, предназначенных для создания компьютерной двумерной живописи, самыми популярными...
-
DipTrace имеет интегрированные библиотеки, которые содержат графическую информацию о символах и типовых корпусах компонентов и текстовую упаковочную...
-
Постановка задачи - составление по возможности точного и понятного словесного описания того, как должно работать будущее приложение, - что должен делать...
-
Создание запроса выбора в режиме конструктора. - Технология создания и управления баз данных
Для создания запроса выбора с помощью Конструктора необходимо открыть окно Конструктора запроса, выполнив действия: Окно БД => объекты Запросы =>...
-
Объектом автоматизации сайта "вопрос-ответ" является предметная область "Проектирование информационных систем". Основное назначение сайта "вопрос-ответ"...
-
Назначение системы Сайт "вопрос-ответ" предназначен для поиска ответов на интересующие пользователей вопросы, с рейтингом пользователей, возможностью...
-
Этапы создания сайта - Разработка интернет-магазина компьютерной техники
Разработка сайта - процесс трудоемкий, в котором обычно участвуют несколько специалистов. Чтобы проект был успешным, необходимо как минимум определить:...
-
"WWWSQLDesigner" позиционируется как абсолютно бесплатный, доступный для пользователей, универсальный веб-редактор, значительно упрощающий процесс...
Создание баннера - Создание сайта