|
Занятие # 3. часть 1. Создание элементарных Web страниц. Выбор и практическое применение HTML - редакторов. Создание Web страниц при помощи редактора Macromedia Dreamweaver 8. Добрый день мои уважаемые подписчики. Я рад нашей встрече и приветствую вас от всей души. На предыдущих двух занятиях мы говорили о дополнительных инструментах для успешного ведения вашего бизнеса. Прежда чам приступить к новой теме я дам краткие характеристики еще некоторых ходовых товаров в сети, которые также могут служить дополнением к вашей основной работе. Любой из этих пакетов имеет ценность еще и потому, что каждый конкретный товар может служить отдельным источником дохода. Каждый из этих товаров в раздельности может выступать как отдельное направление вашей деятельности и при достаточном внимании к этому направлению, оно может служить источником дополнительного и весьма ощутимого дохода. Даю ссылки на некоторые из этих товаров посредством небольших рекламных текстов:
_______________________________________________________________________________________________________
А теперь приступим непосредственно к теме нашего занятия и зададим себе простой, на первый взгляд, вопрос - что необходимо знать и уметь для создания своей маленькой, элементарной Web страницы? В методике занятия мы применим теоретическое изложение и будем сочетать теорию с практическими действиями, т. е. мы, в принципе, и будем создавать Web страницу. Подчеркну сразу - это не будет голая теория, так как я обязательно дам ссылки на скачивание прекрасных видео роликов и в сочетании с этим текстом, это будет очень наглядный и полезный урок. Вначале вы почитаете текст, далее посмотрите ролики и я гарантированно заявляю - вы будете готовы самостоятельно делать свою, может быть, первую страницу. И еще важный момент - в сети вы не очень то и найдете подробное описание работы с редакторами Web страниц на русском языке, ведь и редакторы, и многое другое в сети имеет английское происхождение, поэтому переводов и нет. Итак с чего мы начнем? Вопрос, а вернее ответ, очевиден - с приобретения редактора HTML - страниц и установки его на компьютер. Скажу сразу, в обязательной поставке вашего компьютера, имеются редакторы HTML - страниц, вы можете выбрать их в меню "Программы" и применять на свое усмотрение. Я не буду перечислять их названия, скажу только следующее: на практике очень многие известные предприниматели, да и неизвестные также, выбирают редакторы HTML - страниц типа Macromedia Dreamweaver различных вариантов (версий). Они имеют и английский, и русскоязычный варианты. И в том, и в другом случае работать с этими редакторами просто, понятно, очень наглядно и показательно. Поэтому то эти редакторы широко применяются при создании Web страниц. Где взять данный редактор? Его можно найти и в сети, смотрите по этой ссылке: http://macromedia.com далее по вкладке downloads выйдете на несложную регистрацию, после чего вам предоставят ссылку на скачивание данного редактора. Данные редакторы можно приобрести и в киосках или магазинах по продаже видео продукции, дисков, компьютерных программ и т. д. Установка данной программы на компьютер не составит особого труда. Рекомендация практического характера. Существуют различные версии этого редактора, например, версия 4 или версия 8. Приобретайте обе версии, а там разберетесь, с каким редактором вы будете работать. На практике обычно используют обе версии. Я лично создаю свои страницы при помощи DW-8, а закачиваю сайты (страницы) на хост при помощи DW-4. Очень удобно и весьма просто. Продолжим перечислять то, что необходимо знать и уметь для создания элементарной Web страницы. Итак редактор приобретен, установлен на компьютер. После запуска программы перед вами предстанет окно macromedia DREAMWEAVER и справа вы увидите версию программы. В нашем случае это 8. В этом окне, в разделе Create New, выбираете HTML, посредством которого вы и выходите на главное меню редактора DW-8. В этом же окне имеется раздел OPEN, в котором открываются создаваемые вами страницы. Но продолжим знакомство с главным меню редактора DW-8. Посмотрим внимательно на главные кнопки меню: File; Edit; Insert; Modify; Sait. Не пугайтесь, что они на английском языке, основные манипуляции мы разберем и покажем практически и вы увидите, что ничего сложного и мудренного там нет. Перед началом создания своей Web страницы необходимо установить русский язык. В редакторе DW-8 это Кириллица Windows. Для этого нужно проделать следующие манипуляции: нажимаем на Modify, далее выбираем Page Properties..., появляется новое окно Page Properties, в котором кликаем по Title/ Encoding и выбираем Кириллица Windows, далее по Apply и по OK. Русский язык установлен. Не забывайте это проделывать каждый раз при создании новых страниц. Обратите внимание на маленькое окошко несколько ниже основного меню под названием Title. В это окошко надо вписать название создаваемой вами страницы, которую мы и создаем теретическим методом с практическими пояснениями. К примеру, напишите: создание элементарной Web страницы. Или что то в этом роде. Смысл вот в чем? Во - первых, страница обязательно должна иметь название, так как имя отражается в коде страницы и нужно для поисковых машин и каталогов. И во - вторых, это название и будет отражаться в окне браузера при открытии вашей Web страницы. Двигаемся далее. Теперь мы можем приступить непосредственно к созданию Web страницы. Но маленькое отступление. Сайты, их главные и другие страницы, имеют весьма разнообразный и пестрый вид. И это понятно, так как каждый сайт ваяется конкретным Web дизайнером, а он вправе делать любой дизайн страниц своего творения - сайта. Мы же применим классический вариант дизайна страницы - посредине главная часть страницы, на которой и будет размещаться основная часть материала, а слева и справа - фоновые полосы значительно меньшего размера, чем основная часть посредине. Здесь уместно говорить и о цветах нашей страницы. На этот счет есть масса мнений и предложений, есть экспертные оценки и прочие исследовательские материалы. Мы не станем в них углубляться, а кое что примем за аксиому. Ведь известно и не требует доказательств то, что для нормального восприятия тетста на мониторе компьютера наиболее приемлем черный цвет на белом фоне экрана монитора. Так и в нашем случае принято за оптимальный вариант построения страницы считать: посредине цвет белый, а боковые полосы обе синего цвета различных оттенков. Конечно, ни в коем случае не считайте это догмой. Оптимальный вариант дизайна своего сайта вы выберете сами. Это просто предлагаемый вариант, который весьма расспространен в сети. О размерах и сочетаниях полос. Оптимальной считается ширина средней полосы 600 - 850 пикселей (pixels). Этого вполне достаточно для размещения основной массы материала вашей Web страницы. Нижний, верхний предел - все это зависит от объема вашего материала и можно придерживаться следующего правила: с увеличением объема материала на основной половине - растет и ширина этой полосы. И наоборот, если материал занимает небольшой объем,- полоса может быть и поменьше. Вы сами выбираете себе оптимальный размер страницы. А теперь, для наглядности манипуляций с размерами, я приведу два примера маленькой рекламы, размеры баннеров которой я выставляю с помощью редактора Web страниц DW-8. Размер первый я выставляю шириной в 450 пикселей.
Размер второй я выставляю шириной в 600 пикселей.
Все размеры рекламных блоков, а заодно и действующие ссылки сделаны при помощи нашего DW-8. Время на создание и полное оформление этой рекламы составило не более 5-7 минут. Этот редактор отличная штука, очень удобная в работе и вы убедитесь в этом без всякого сомнения. Вы будете делать такие вставки по ходу создания ваших страниц и это не вызовет никаких затруднений. Хочу еще обратить ваше внимание вот на что? Почему я так подробно расписываю процесс создания Web страницы и при этом, как бы не очень наглядно, так как перед вами нет самого HTML - редактора. Почему подробно? А дело в том, что подробного описания работы Web редакторов, да еще и на русском языке, вы нигде и не найдете, так как программы имеются, а их описания я что то не встречал. Теперь о наглядности. Ниже я вам дам ссылки на видеоролики по работе с HTML - редакторами и на фоне роликов наш теоретический материал будет смотреться вполне наглядно. Продолжаем далее. Итак, как же задать размер нашей страницы или применительно к нашему случаю - размер средней полосы. Делается это при помощи таблицы, которую мы вводим в нашу страницу и которая и будет ограничивать выбранную нами ширину полосы в пикселях. Таблицу зададим размером 1 на 1. Манипуляции при этом следующие: нажимаем Insert, далее выбираем Table - открывается окно таблицы в котором мы делаем следующее: 1. выставляем размер таблицы, например, 650 пикселей; 2. выставляем величину отступа текста от левой стороны таблицы Cell padding,- 15 пикселей; 3. количество строк и колонок (Rows и Columns) выставляем по 1; 4. нажимаем OK. Таблица размером 1 на 1 появляется на нашей странице. Действия с таблицей следующие: 1. выравниваем ее по центру кнопкой Align Center; 2. задаем цвет внутренней границы таблицы кнопкой Brdr (Border Color of cell); 3. задаем цвет внутри таблицы кнопкой Bg (Background Color); 4. задаем цвет фона нашей страницы (цвета боковых полос) кнопкой Modify, далее Page Properties..., открывается окно Page Properties и в этом окне выбираем цвет кнопкой Background color и нажимаем OK. И опять для наглядности я приведу два примера таблиц, вставленных в создаваемую страницу при помощи редактора DW-8. Таблица №1, размером 1 на 3. Таблица №2, размером 2 на 3. Внутренние границы таблицы №2 выбраны белого цвета, в отличие от границ синего и красного цветов таблицы №2. Итак с границами нашей Web страницы мы определились, научились их выставлять и теперь можно приступать к написанию txt (текстового) материала, вставлять в страницу рисунки (Image), вставлять ссылки (Hyberlink), формы для подписки и делать другие, нужные вам манипуляции.
Вся кнопочная панель расположена внизу основного меню DW-8 - в нижней части окна редактора Dreamweaver. Здесь вам нужно выбирать тип шрифта и его размер, выбирать цвета шрифтов. Имеется также возможность введения шрифта типа B (полужирный), шрифта типа I (курсив, т.е. наклонный). Вы также сможете выравнивать ваш текст по левой и правой границе документа, по ширине и по центру. Если вы имеете навыки работы в обычном текстовом редакторе Word, здесь, в редакторе HTML - страниц DW-8, у вас проблемм не будет никаких. С набором текста мы ознакомились. Обратите только ваше внимание на следующие окошка: Format; Font; Style; Size; - с ними придеться больше всего работать при наборе ваших текстов, поэтому поработайте с этими регулировками, разберитесь со стилями текстов, выбирайте для ваших текстов самый подходящий и самый красивый стиль и шрифт. Не думайте, что самым красивым и применимым является всем хорошо известный Times New Roman, который, в принципе, применяется только в секретарских целях. Посмотрите другие сайты и Web страницы, посмотрите рассылки и вы увидите, какие шрифты являются наиболее ходовыми и применимыми. Прежде чем двигаться дальше, хочу обратить ваше внимание на следующее: не забывайте сохранять свой, только что начатый создаваться документ. Как? Очень просто: кнопка "File", далее выбираете Save As...(сохранить как...) и сохраняете свой создаваемый документ в любой папке, которую вы сами и выбираете. Меню с папками появляется при выборе и нажатии на Save As.... Какую папку выбрать? Любую, но удобно делать так,- раз вы создаете свою Web страницу, а в будущем и сайт - создайте новую папку на рабочем столе вашего компьютера и назовите ее, например, Sait. Туда вы и будете сохранять всё, что будет принадлежать вашей странице - рисунки, коды, файлы и т.д. В любом случае перед вами стоит задача создания полновесного и довольно таки объемного сайта, поэтому в папке Sait будет накапливаться много различного материала. И еще один момент практического характера, на который обращаю ваше внимание. При работе по созданию сайта с помощью DW-8 обязательно создавайте резервные копии ваших творений - страниц и сайтов. Потому что на начальном этапе их создания, когда вы еще не совсем освоили редактор, может случиться и ошибка, в результате которой можно потерять создаваемый документ, над которым мы так усердно трудились. Я не буду приводить конкретный механизм таких утерь документов, но поверьте, такое случается и не так уж и редко. Нажали не ту кнопку, или вовсе не нажали,- такое бывает. Тем более, что и меню на английском, а вам знакомы только YES, OK, NO. А нажимать надо не всегда YES, иногда надо жать и NO, даже если ваша рука автоматически подводит курсор на YES. Восстанавливать утерянные таким образом страницы весьма затруднительно, а часто и вовсе невозможно. Для этого надо перерыть все архивы, просмотреть все диски и т. д.,- поверьте, это очень трудоемкая работа, поэтому лучше ее все таки избежать. А избежать можно только созданием резервных копий создаваемых вами страниц и других документов.
На следующем занятии мы продолжим изучение и практическое применение редактора DW-8, а сейчас я даю вам обещанную ссылку на скачивание видео ролика по практической работе с редактором DW-8. Размер первой части: 8.25 мегабайта. Кликните, чтобы скачать Внимательно прочитайте и изучите данный урок, просмотрите рекомендованный видео ролик, соедините теоретическую часть с практическим показом и я уверен, что создание элементарных Web страниц не вызовет у вас никаких проблемм и затруднений. Благодарю всех за внимание, на этом заканчиваем. До следующей рассылки через 48 часов. С уважением и пожеланиями всяческих успехов Леонид Черняк: автор проекта Вопросы и пожелания по курсу присылать по адресу: |
По написанию текстового материала.