Создайте сами
Создайте свой сайт как описано в нескольких простых уроках ниже. Разместите на этом сайте Ваши ссылки. Добавьте Ваш сайт на поисковые серверы.
Внимание!!! В качестве примеров приведены мои ссылки ("http://...). У Вас должны быть "свои"!!!
Ссылка
Сейчас мы с Вами за 1 минуту создадим
небольшую страницу со ссылкой.
Откройте программу Блокнот (Notepad), обычно
Блокнот находится здесь:
ПУСК - > ПРОГРАММЫ - > СТАНДАРТНЫЕ ->
Блокнот
В случае с английской
версией:
START - > PROGRAMS - > STANDART - >
Notepad
Поместите в Блокнот Ваш текст веб-страницы:
<html>
<a
href="htpp://www.kimpower.narod.ru">Заработок в сети со своим
сайтом</a>
</html>
Сохраните этот текстовый файл с
именем page1.html в Вашей рабочей папке.
Запустите этот файл на
выполнение и Ваш браузер откроет этот документ.
Этот простой пример
показывает как создавать страницу со
сылкой.
Шаблон любого сайта
Все сайты состоят из тэгов, тэг - это элемент, заключенный в скобки "<" ">".
Примеры тэгов:
<html> - обозначение начала веб-страницы
</html> -
обозначение конца веб-страницы
<center> - начало размещения по центру всех последующих
изображений, ссылок, картинок и т.д.<br>
Текст по
центру(пример).
</center> - конец размещения объектов по
центру.
<br> - тэг перевода строки.
<title>
Заголовок Вашей страницы
</title>
Это
тэг, который используют поисковые машины для определения тематики Вашего
сайта.
Шаблон любого сайта:
<html>
<head>
<meta
http-equiv="Content-Type" content="text/html;
charset=windows-1251">
<title>Заголовок
сайта</title>
</head>
<body
bgcolor="grey">
Тело Вашего сайта (меню, ссылки, картинки, текст, ролики
и.т.д).
</body>
</html>
Перенесите этот текст в Блокнот и сохраните его в Вашей рабочей папке под именем page2.html. Откройте страницу в Вашем браузере.
Описание тэгов:
<html> - обозначаем тип документа.
<head> -
обозначаем головную часть страницы.
<meta http-equiv="Content-Type"
content="text/html; charset=windows-1251"> - Устанавливаем кодировку страницы
для читаемости страниц на русском.
<title>Заголовок сайта</title>
- заголовок Вашей страницы.
</head> - конец головной части
страницы.
<body bgcolor="grey"> - начало тела страницы с серым цветом
фона.
Тело Вашего сайта (меню, ссылки, картинки, текст, ролики и т.д). - Все видимые элементы страницы размещаются в тэге <body>
</body> - конец тела страницы.
</html> - конец html
страницы.
Таблицы - главный способ размещения объектов
Все объекты на
страницах размещаются в невидимых
таблицах.
Вы задаете размеры этих таблиц,
кол-во ячеек, размеры ячеек и.т.д.
Пример таблицы:
<table border="1">
<tr>
<td>A</td> <td>B</td> <td>C</td> <td>D</td>
</tr>
<tr>
<td>1</td> <td>2</td> <td>3</td> <td>4</td>
</tr>
</table>
Перенесите этот текст в Блокнот и сохраните его в какой-нибудь Вашей рабочей папке под именем page3.html.
А теперь откройте страницу в Вашем
браузере.
Для создания строки
таблицы используется тэг "tr".
Для создания столбца в таблице используется
тэг "td".
Добавление графики на сайт
Чтобы добавить изображение на сайт
используется тэг
img.
Пример веб-страницы с картинкой:
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=windows-1251">
<title>Картинка на
странице</title>
</head>
<body
bgcolor="grey">
<img src="kartinka.jpg">
</body>
</html>
Перенесите этот текст в Блокнот и
сохраните его в Вашей рабочей папке под именем page4.html.
Файл kartinka.jpg
должен находиться в той же папке, что и файл page4.html
Откройте страницу в
Вашем браузере.
Ну вот, теперь
Вы научились размещать картинки на страницах.
Чтобы разместить картинку в конкретном месте нужно использовать таблицу:
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=windows-1251">
<title>Картинка в
таблице</title>
</head>
<body
bgcolor="grey">
<table>
<tr
height="300">
<td width="200"></td><td><img src="kartinka.jpg"></td>
</tr>
</table>
</body>
</html>
Перенесите этот текст в Блокнот и
сохраните его в Вашей рабочей папке под именем page5.html. Откройте страницу в
Вашем браузере.
Здесь Вы
задали высоту строки tr height="300" - 300 пикселей.
И задали ширину столбца
td width="200" - 200 пикселей.
Задавая размеры ячеек и таблицы Вы можете
регулировать положения картинок и других объектов на
странице.
Создание кнопки и меню
Кнопку создать очень просто и элементарно, как и предыдущие объекты:
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=windows-1251">
<title>Магазины 3-го
тысячелетия</title>
</head>
<body
bgcolor="grey">
<table>
<tr
height="300">
<td width="200"></td><td><a
href="http://www.game-z.biz"><img
src="button1.jpg"
border="0"></a></td>
<td width="200"></td><td><a
href="http://www.magashop.net"><img src="button2.jpg"
border="0"></a></td>
<td width="200"></td><td><a
href="http://www.mogozin.com"><img src="button3.jpg"
border="0"></a></td>
</tr>
</table>
</body>
</html>
Перенесите этот текст в Блокнот и
сохраните его в Вашей рабочей папке под именем page6.html. Откройте страницу в
Вашем браузере.
Файлы (button1.jpg, button2.jpg, button3.jpg) должны
находиться в той же папке, что и файл page5.html
Мы создали с Вами меню с
3-мя кнопками при нажатии на которые посетитель переходит на сайты
магазинов.
Вы поняли принцип создания любых
веб-страниц.
Теперь используя любое пособие HTML Вы сможете создавать
свои усовершенствованные сайты и
зарабатывать.
Создание gif анимации
Для оживления веб-страницы
создается gif картинка со сменой кадров, которую можно разместить с помощью
тэга img как и обычную картинку.
Чтобы создать gif анимацию понадобится одна
из этих
программ:
Adobe Image Ready, Ulead GIF Animator, Active GIF Creator, Easy GIF Animator.
Создайте несколько стационарных кадров в формате gif и объедините эти кадры в
анимацию. Но помните - большие анимационные файлы очень замедляют загрузку
страницы. Ваша gif анимация не должна превышать размера в 100
килобайт.
Создание flash анимации
Более продвинутый способ - это оживить сайт с помощью flash анимации. Для создания нам понодобится Adobe Flash CS3 или выше.
Инструкция:
Пример 1:
1. Запустите программу Adobe Flash
CS3 или выше
2. Выберите команду Файл -> Создать -> Ok (FIle -> New
-> Ok)
3. Изобразите в появившемся белом поле простую фигуру или
линию, можно просто использовать карандаш или кисть
4. Нажмите F6
5.
Изобразите еще что-нибудь
6. Нажмите F6
7. Чередуйте рисование с нажатием
клавиши F6
8. Нажмите кнопку F12 и в окне браузера появится созданый Вами
мультик
Пример 2:
1. Запустите программу Adobe Flash
CS3 или выше
2. Выберите команду Файл -> Создать -> Ok (FIle - > New
- > Ok)
3. Создайте квадрат в появившемся окне
4. Выберите кадр номер
100 в верхнем окне
5. Нажмите F6
6. Выберите кадр номер 99 в верхнем окне
и нажмите правую клавишу мыши, во всплывающем окошке выберите команду Создать анимацию
движения
7. Линия
кадров от 1 до 99 должна окраситься в серый цвет
8. Выберите кадр номер 100 в
верхнем окне и нажмите правую клавишу мыши, во всплывающем окошке выберите
команду Создать анимацию
движения
9. Кадр 100
должен окраситься в серый цвет
10. Кликнете на кадр номер 1
11. Наведите
мышку на Ваш квадратик и нажмите правую клавишу мыши
12. В открывшемся меню
выберите Свободное
преобразование
13. Уменьшите Ваш квадратик в 10-15 раз и поверните
его на 90-180 градусов
14. Нажмите F12 и перейдите в окно
браузера
Adobe Flash CS3 автоматически создает html страницу и Вам остается только разместить созданную анимацию в сети.
Размещение страницы в сети
Для размещения страниц в сети удобно
использовать программу Total Commander.
Запустите Total Commander и
нажмите CTRL +
F
Появится окошко для установления FTP соединения с Вашим
хостингом.
Создайте новое FTP
соединение.
Заполните поля в окошке в следующем порядке:
Имя соединения: Любое
Сервер:
(Порт): Адрес FTP сервера
и порт, который выдал Вам хостер
Учетная
запись: Имя FTP Пользователя, который
выдал Вам хостер
Пароль: Пароль FTP пользователя, который выдал
Вам хостер
Поставьте
галочку "Пассивный режим
обмена"
Нажмите ОК
Нажмите "Соединиться" и Total Commander начнет соединение с
FTP сервером для закачки файлов на сервер.
После установки соединения просто
скопируйте файлы на сервер.
Теперь, после копирования файлов,
Ваш сайт доступен всем.
Напоследок. Сайт, на котором Вы сейчас находитесь был создан лично мной с помощью программы TurboSite. Не скажу, что было "ну очень просто", но фантазировать пришлось. Кстати, если Вам понравилось, ссылка на программу в самом низу справа. Желаю успехов!!!
