Сергей aka Sergeevich. Титульный лист для web-странички

автор сайта Razminka

В скобках указана версия программы

Урок написал Сергей aka Sergeevich. Текст, графика и русифицированный PhotoImpact - авторские. Обращаю ваше внимание - картинки к уроку открываются в новом окне. Все вопросы по уроку - на e-mail.
Вы тоже можете прислать свои уроки, поделиться опытом с общественностью.
Razminka

Сегодня я предлагаю вам попробовать создать титульный лист для вашей Web-странички. Делать это мы будем в нашем любимом графическом редакторе. Тематика странички… Ну, допустим, Абхазия

1. Для начала нам нужно сформировать основу. Для этого создаем новый файл, в диалоге создания которого указываем: "Web-page, 750x550, Web-фон" (вообще-то можно и побольше было бы размер сделать…)

2. Теперь нам нужно подобрать хороший фон для нашей странички. Для этого жмём "Web - Background designer" или просто Shift+B. Перед нами откроется диалог выбора фона. Здесь можно дать волю фантазии и выбрать то, что приглянется вам.
Также здесь указываются все основные настройки, текстуры, размеры. Есть над чем призадуматься. После изменения настроек контрастности, цветности у меня получился вот такой вот фон.

3. Фон готов и теперь нужно сделать заголовок красивым шрифтом. Это можно проделать с помощью обычной процедуры добавления в документ надписи (в панели инструментов кнопка с буквой "Т". Нажмите её). Но наш заголовок будет не очень красивым и поэтому постараемся придать ему должную солидность. Нажмём кнопку "Текстура" и перед нами возникнет следующее окошко, где мы:
а) выбираем цвет - какой угодно, к примеру, зеленоватый;
б) во вкладке "Скос" - вид 3D "Труба";
в) вкладка "Прозрачность" - выставляем значение в районе 50-60;
г) вкладка "Тень" - ставим галочку напротив соответствующего пункта и настраиваем вид тени. Остальное можно и не трогать, но если захочется - пожалуйста, будет только лучше.
После этого идём к панели атрибутов шрифта, настраиваем: "Граница" - 6, "Глубина" - 21, размер шрифта - 100, стиль - Garamond, начертание - обычный. А уж после всего этого пишем: "Абхазия", жмём ОК и наблюдаем, что вышло.

4. Вам не кажется, что уже кое-что начинает получаться? Мне кажется :). Поэтому продолжим… К страничке нужно добавить хоть несколько фотографий. Этим и займёмся. Для начала найдём эти несколько фоток и вставим как обычно, то есть - откроем изображение, выделим его, скопируем и вставим в нашу страничку. Если не подходит по размерам - подгоняем посредством инструмента "Transform". Изображениям можно тоже придать эффект тени, кликнув на них правой кнопкой мыши и выбрав "Тень". Можно также настроить тип тени.
Вставив фотографии и отрегулировав тень, имеем вот что

5. Осталось сделать хотя бы пару надписей и ссылки - и наша страничка готова! Я предлагаю для начала забить маленькое описание республики куда-нибудь в левую нижнюю часть страницы. Сделать это можно так: Web - HTML Text Object. Откроется следующее окно, где мы вставим текстовый фрагмент и настроим основные параметры текста - начертание, шрифт, цвет.

Нажав ОК мы увидим, что наш текст теперь висит посередине страницы и выделен в отдельный блок-объект. Слегка подвигав мышкой, мы заставим его сесть в нужное нам место.

6. Теперь добавим ссылки (хотя бы одну), нажав на которую пользователь перейдёт с титульной страницы на страницу, где и будет размещено всё содержание будущего сайта. Пусть эта страница будет называться "index1.htm".
Гулять - так гулять! Сделаем ссылку графической. Для этого нажмём Web - Component Designer и видим окошко, в котором выбираем Button - Ellipse и кликаем на третью сверху кнопочку (ага, такой овальчик зелёненький). А вот тут - внимание! Можете напороться на то, что у вас такого объекта и в помине нет. У меня тоже не было. Ничего страшного! Photoimpact запросит соединение с Интернетом, вы соединяетесь и умная программа скачает то, что вы выберете. После того как объект скачался, вам предложат отредактировать его свойства.
Естественно, надпись "Ulead" мы заменяем на "Вход". После других необходимых настроек тыкаем кнопку "Экспорт",
Экспортируем эту кнопку в Photoimpact как отдельный объект и получаем новое изображение, которое нам надо вставить на страничку. После проведения этой работы нам надо назначить этой кнопке гиперссылку на файл "index1.htm". Делается это следующим образом: двигаем курсором к объекту, жмём правую кнопку мыши и выбираем "Свойства объекта". В открывшемся меню выбираем вкладку "Гиперссылка". Там набиваем адрес страницы, на которую хотим сослаться.

7. Всё, страничка готова! Теперь осталась пара пустяков - сохранить в HTML. Это можно сделать в меню "Файл -> Сохранить для Web -> Как HTML". Открываем браузер и любуемся

<все уроки> <следующий урок> <на главную>