Сделать свой сайт

[Stehlen]

Я уже писал о рекламе своих услуг в ЯндексДирект и о возможностях рекламы на моем портале

В данной теме я хочу собрать информацию для начинающих вебмастеров. Я писал о роли интернета в продвижении товаров и услуг, поэтому иметь вебстраницу нужно не просто для галочки (у всех есть и я хочу), а для привлечения дополнительных клиентов.

Здесь я буду писать как совсем простые вещи (с чего вообще начать), так и о некоторых тонкостях сайтостроитель ства. Я конечно сам не спец в этом. Я не программист и не пишу сайты с нуля, но мое троешное инженерное образование научило меня искать и использовать информацию. Ну чтоже, пожалуй начнем с азов.
Домен, хостинг, HTML.
Историю интернета вы можете прочитать в википедии. С тех пор мало, что изменилось. Сайты также находятся на серверах, к ним привязывается доменное имя - gazmap.ru gazinavto.ru и др. Не буду вдаваться в тонкости.
Хостинг
Нам понадобиться место для хранения сайта - хостинг.
Хостинги бывают (грубо говоря) простые - для простого хранения файлов, а ваш браузер просто скачивает файлы и открывает их. И с поддержкой дополнительных возможностей - с базами данных, с PHP и тд. Так же хостинги бывают платные и "бесплатные". Почему в ковычках? Потому, что коммунизм утопия и поэтому бесплатного быть ничего не может. Бесплатный хостинг рано или поздно разместит на вашем сайте свою рекламу. Реклама может сдвинуть вашу страницу вниз или вбок, с ней сайт будет смотреться не очень.
Из простых бесплатных хостингов я рекомендовал бы narod.ru. Это яндекс и их реклама (если они и добавят, обычно они начинают пихать рекламу если сайт пользуется популярностью) не сильно портит сайт, хотя бы лохотрон не рекламируют. Что я имею ввиду под словом простой сайт - это сайт с статичной информацией, то есть нет форума, нет комментировани я (хотя комментировани е можно сделать). Просто страницы с текстом и картинками. Это с одной стороны простой вариант, но с другой стороны для изменения информации нужно копаться в коде страницы. Например тот же народ.ру для упрощения жизни пользователям дает возможность использование онлайн конструктора сайта. Это проще, но сайт теряет свою индивидуальнос ть. Более продвинутым инструментом редактирования страниц является WYSIWYG HTML-редактор. Это редактор где вы видите не код, а уже близко к готовому виду страницу.
Тут стоит не много рассказать о HTML.
HTML (от англ. HyperText Markup Language — «язык разметки гипертекста») — стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц создаются при помощи языка HTML (или XHTML). Язык HTML интерпретирует ся браузером и отображается в виде документа, в удобной для человека форме.
То есть все страницы в интернете написаны кодами - коды описывают местоложение текста, цвет, размер шрифта, где картинка и так далее. Можно писать страницы исходниками (нужно знать все команды и как их применять), а можно используя редакторы или конструкторы. Самые известные редакторы Adobe Dreamweaver, Microsoft FrontPage, WYSIWYG Web Builder 5, TinyMCE.

Если вы хотите сайт с форумом и другими наворотами, то сразу смотрите в сторону платного хостинга. Перед заключением договора с хостинг компанией внимательно изучайте их отзывы. Я выбрал сначала 1gb.ru и очень вляпался. Об этом я писал в своем блоге - выбор хостинга, дешевый и качественный хостинг. И прежде чем выбирать хостинг определитесь, что вы будете делать - для большинства проектов (smf, phpbb,joomla, wordpress) нужен хостинг с Unix, Mysql, PHP. Для некоторых нужен Windows хостинг.
Домен
Определившись с проектом (простой статичный сайт или интерактивный портал) и выбрав хостинг встает вопрос о регистрации домена. Домен это адрес сайта, практически все платные хостинг компании "дарят домены" не спешите принимать подарок. Опять же мой случай - 1gb.ru "подарил" мне домен gazmap.ru, а в итоге мне он встал в 500 кажется рублей (может чуть больше) и последующее продление будет стоить 400 рублей. Компания бегет подарила домен nikroblog.ru и продление у них стоит 120 рублей. Вот такая разница. А если покупать домен у ztelecom.ru то они стоят 100 рублей.
Для тех кто будет делать простой сайт и размещать на народе рекомендую покупать домен в конторе типа ztelecom.ru по 100 рублей и привязывать их к хостингу narod.ru
Заключение:
Для малых компаний достаточно иметь сайт визитку с простыми статичными страницами. Сайт размещайте на хостинге народ.ру, и сразу же привязывайте к сайту купленный домен. Не покупайте домен дороже 100 рублей.

Пример простого сайта размещенного на бесплатном хостинге - gazinavto.ru- установка гбо в Рязани
Пример портала работающего на Joomla - gazmap.ru (портал о гбо)
Пример форума на SMF - Форум о гбо Gazmap.ru

[Stehlen]

Регистрация домена

Рассмотрим процесс получения домена.
1. Заходим на сайт ztelecom.ru
2. Ищем ссылку Регистрация и жмем ее.
3. Заполняем все поля (указывайте реальные данные) и проходим регистрацию.
4. После успешно завершенной регистрации переходим на страницу входа. Вводим свой email и пароль и входим в систему.
5. Теперь нужно узнать свободно ли желаемое доменное имя. Для этого открываем в другой вкладке сайт reg.ru и в центре видим поля для проверки доменных имен. Вводим желаемое имя и жмем кнопку проверить. Выводится список доменов и их статус - свободен или занят. Выбираем свободный домен.
6. Возвращаемся в ztelecom. Ищем большое слово Домены, наводим на него мышку и кликаем Зарегистрировать домен.
7. В центре страницы будет большое поле для ввода доменов на регистрацию. Вводим туда до 20 доменов, думаю 1 для пробы хватит. Нажимаем Продолжить
8. Домен добавиться в корзину, ищем оранжевую надпись Корзина и кликаем по ней.
9. Проверяем домен в корзине.
10. Наводим мышку на Стоимость услуг и в выпадающем списке жмем Пополнить счет.
11. Укажите сумму пополнения - 100 рублей.
12. Ниже выберите способ оплаты.
13. Я плачу через личный кабинет Qiwi. Выбрал его, и жму оплатить.
14. Дальше вижу надпись "Пополнение баланса через платежную систему ROBOX. После оплаты, на Ваш счет поступит 100 руб." Жму перейти к оплате.
15. Открывается робокасса, тут нужно уточнить способ оплаты (я указываю Qiwi кошелек), ввести номер телефона на который зарегистрирова н Qiwi кошелек и указать свой email.
16. Жмем продолжить, видим сообщение "Вам выставлен счет от провайдера «ROBOKASSA» на сумму 114.34 руб. Оплатите его через QIWI Кошелёк в любом терминале с логотипом QIWI или на сайте w.qiwi.ru."
17. Входим в w.qiwi.ru вводим свой номер и пароль (я не описал процесс регистрации в киви потому, что все так просто, что писать не о чем). Жмем сверху на Счета. Видим выставленный счет от Робокасса с комментарием "ROBOXchange.co m: Оплата счета №2565 магазина Ztelecom (regpanel.ztele com.ru) (аккаунт 36256265265652 6) на сумму 114.34 QIWI Кошелек". Жмем Оплатить. Потом ниже Подтвердить
18. Платеж в ztelecom должен пройти в течении получаса. У меня прошел за 3 минуты.
19. Теперь на счете в ztelecom 100 рублей, можно купить домен. Заходим в корзину, видим желаемый домен, жмем продолжить, попадаем на страницу Зарегистрировать домен, еще раз думаем - "тот ли домен вы покупаете? Может придумать другой?" - жмем Продолжить.
20. Здесь необходимо будет создать новый профиль (указать контактные данные владельца домена). Список ДНС серверов заполним потом.
21. После создания профиля жмем Продолжить.
22. Идет регистрация домена. И в итоге мы видим надпись - Домен добавлен в очередь на регистрацию.
23. Теперь остается только ждать.

Регистрация домена за 100 рублей - nikroblog.ru

[Stehlen]

Я писал ранее, как зарегистрировать домен в зоне *.RU за 100 рублей и теперь для создания первого сайта нам нужен хостинг. Рассмотрим пример создания сайта визитки на бесплатном хостинге narod.ru. Сразу хочу уточнить, сайт визитка не значит плохо. Если правильно выбрать заголовки, написать хороший текст, подписывать изображения и не игнорировать некоторые другие нюансы (о которых позже), то простой сайт визитка даст хороший КПД. Под КПД я имею ввиду посетителей, именно для них (а точнее для привлечения их внимания) сайт и делается. Вернемся к основной задаче на сегодня – получение бесплатного хостинга и привязка к нему ранее зарегистрирова нного домена.

Хостинг narod.ru это сервис поисковика Яндекс. Для подключения бесплатного хостинга (а также любой другой услуги Яндекс) достаточно зарегистрирова ть почтовый ящик на яндексе. Для этого заходим на главную страницу Яндекс и ищем слева по середине поля для ввода логина и пароля, а под ними ссылку – Завести почтовый ящик.

Кликнув по ней Вы попадете на страницу ввода имени, фамилии, и желаемого логина. Если логин занят, то яндекс предложит свои варианты.

После ввода информации жмем Дальше. В следующем окне потребуется ввести придуманный пароль, ответ на секретный вопрос, код с картинки и телефон. Как всегда есть подсказки о обязательных к заполнению полях.

Нажимаете Дальше. Регистрация завершена, Вы можете ввести дополнительные данные о себе, а можете сразу попасть в почтовый ящик или приступить к получению бесплатного хостинга. Для этого не выходя из своей новой учетной записи яндекс перейдите на сайт narod.ru. По середине слева ищите кнопку Создать сайт.

Нажав кнопку Вы запустите мастер создания сайта. Первым этапом будет выбор тематики сайта. Выбирайте любую.

Далее будет выбор – из каких страниц состоит сайт и задание заголовка. Это делайте тоже на ваш вкус.

Далее выбор макета и оформления. Тут могу посоветовать только не забивать сильно этим голову, я бы удалил весь этот шаблонный сайт и сделал свой. Я расскажу об этом позже.

Жмите начать заполнять.

Тут нужно перетащить иконку текст (она превратится в прямоугольник) в любое место. После того как перетащите, кнопка Опубликовать станет активной. Жмем ее.

Теперь можно проверить работает ли только, что созданный сайт (а главное хостинг). Для этого нужно ввести в адресную строку браузера имя сайта. В примере это gbovavto.narod .ru, то есть ваш логин.narod.ru . Обычно после нажатия кнопки Опубликовать происходит автоматическое перенаправлени е на новый сайт. Далее наша задача привязать к только, что полученному бесплатному хостингу наш ранее зарегистрированный домен. Для этого переходим на narod.ru

Теперь это окно сменилось. Сайт мы создали, и кнопки создать сайт нет. Зато есть нужная нам строка – Добавить свой домен. Щелкнув ее появится строка ввода доменного имени. Открываем другую вкладку и переходим на сайт ztelecom.ru. Авторизируемся и переходим в раздел Домены – Мои домены.

Щелкаем по своему домену. Откроется список возможных действий.

Щелкаем – Управление DNS-серверами. Делегирование.

Вводим адреса dns1.yandex.ru и dns2.yandex.ru , как указано сверху. Нажимаем изменить. Переходим в вкладку с открытой страницей narod.ru. В строку введите адрес вводите свой домен. Нажимаем кнопку справа от поля ввода Домена.

Если все правильно, то видим зеленый смайлик как на картинке сверху и сообщение Домен такойто добавлен. Прошу обратить внимание, что сайт не будет работать сразу под новым адресом. Должно пройти время пока обновятся базы ДНС серверов. Зарубежные сервера обновляются в течении часа, а наши провайдеры могут делать это и по суткам. Так, что теперь ждать.

В следующий раз я расскажу о подключении к сайту при помощи FTP клиента FileZilla, а с помощью него зальем на бесплатный хостинг свой сайт.

Полная версия с картинками и ссылками - Привязка к бесплатному хостингу narod.ru своего домена

[Stehlen]

Продолжаю описывать создание бюджетного сайта визитки. Напомню, что я уже описывал процесс регистрации домена второго уровня за 100 рублей и процесс привязки домена к бесплатному хостингу народ.ру. Теперь нам нужно подключиться к хостингу через FTP клиент и загрузить туда свой сайт.

Не будем оригинальничат ь с выбором FTP клиента (я пробовал использовать Total Commander, он плохо работает с народом), возьмем пожалуй самый известный и возможно лучший – FileZilla. FileZilla — это свободный мультиязычный FTP-клиент для Microsoft Windows, Mac OS X и Linux. Он поддерживает FTP, SFTP, и FTPS (FTP через SSL/TLS). Для нас главное, что он свободный, то есть бесплатный.

Скачать FileZilla можно по ссылке. Установка не отличается от любых других Windows программ. После установки запустите программу с ярлыка на рабочем столе. В запущенной программе нужно заполнить графы: Хост, Имя пользователя, Пароль.

Сделать свой сайт

Сделать свой сайт

В графу Хост введите логин в яндексе.ftp.na rod.ru, в моем случае это gbovavto.ftp.n arod.ru
В графу Имя пользователя введите логин в яндексе, в моем случае это gbovavto
В графу Пароль введите ваш пароль от сервисов яндекса.

После ввода паролей и имен нажмите быстрое соединение. После соединения в правой нижней части окна программы появится содержимое хостинга. Удалите все оттуда. В левой нижней части окна программы отображается содержимое вашего компьютера.

Сделать свой сайт

Сделать свой сайт

Ваша задача найти слева папку с вашим сайтом, и перетащить ее содержимое в правую часть программы (на хостинг). После того как файлы загрузятся Ваш сайт будет доступен. Для проверки проделанных операций создайте файл index.html в который блокнотом введите просто слово тест. Загрузите его как сказано выше, и зайдите на свою страницу. Должно отображаться слово тест.

В следующий раз я начну рассматривать процесс создания просто страницы и выложу исходники после редактирования которых вы получите сайт для загрузки на хостинг.
Оригинал с картинками можно прочитать здесь - Доступ к файлам на хостинге narod.ru

[Stehlen]

Продолжаю тему создания собственного сайта.
Как регистрировать хостинг и домен, как привязать домен к хостингу, как загрузить файлы на хостинг мы рассмотрели. Осталось создать сайт. Создать сайт с нуля довольно сложно, поэтому я выкладываю исходник сайта в который вы сможете внести свои данные. Вы без особых усилий за вечер сможете сделать сайт аналогичный этому - gazinavto.ru
То что я выложил (исходник) вы можете посмотреть в действии по адресу gbovavto.ru. Это будет важно, так как вы будете видеть какая часть кода за, что отвечает.
Например рассмотрим теги <h2></h2>, то что в них заключено будет заголовком 2 порядка. Это значит, что текст будет по особому отформатирован . Шрифт будет больше обычного текста, но меньше заголовка 1 порядка. Так же на этот тег реагирует поисковый бот. Все что он видит в этом теге он оценивает важнее чем простой текст.

Сделать свой сайт

Сделать свой сайт

На картинке скриншот заголовкой 2 и 3 порядка.

Приступим
Архив site.zip содержит 4 папок и 10 файлов.
Папки:
css - содержит файл стилей вебстраницы.
files - содержит файлы необходимые для работы скриптов страницы (увеличения изображений и т.д.)
images - содержит изображения (фотографии установленного гбо например)
js - содержит скрипты
Файлы:
favicon.ico - это иконка сайта
robots.txt - файл с командами поисковому роботу.
sitemap.xml - файл содержание сайта (необходим для передачи всех страниц поисковому роботу)
index.htm - это главная страница сайта, она загружается когда вы вводите gbovavto.ru
contacts.htm - страница с контактными данными
foto.htm - страница с фотографиями
metan.htm - карта метановых заправок
propan.htm - карта пропановых заправок
price.htm - стоимость услуг
zachem.htm - интересные материалы о гбо

[Stehlen]

После скачивания файлов вы сразу же можете загрузить папки из архива к себе на хостинг. А вот файлы сначала нужно отредактироват ь. Для этого вполне достаточно блокнота, но удобнее использовать текстовые редакторы с расширенным функционалом. Я использую notepad++. И так скачав его вы просто открываете файлы в блокноте и редактируете их. Потом загружаете на хостинг и смотрите что вышло.
Редактирование index.htm
Для удобства пользователей я обозначил строки которые нужно изменить. Первое, что нужно исправить в index.htm это вторая строка - <title>Заголовок страницы</title>. В теге <title> размещается заголовок страницы, это будет видно в вкладке браузера.

Сделать свой сайт

Сделать свой сайт

Заголовок страницы имеет очень большое значение. Дело в том, что сайт мы делаем не для галочки, а для привлечения пользователей. Пользователи приходят в основном - с рекламы, с ссылок на сайтах, с поисковиков. Постоянно вбухивать деньги в рекламу дорого, разместить на каждом сайте ссылку своего сайта не получится. Остаются поисковики, а поисковикам нужно подать информацию не как вздумается, а как ее ищут. Чтобы узнать как ищут ваш товар нужно зайти на сайт подбора слов яндекс и провести маркетинговое исследование . Основной смысл в том, чтобы ваш заголовок страницы искали. Например можно назвать главную так - ИП Рогов - загазую ваш авто! звучит может быть прикольно, но кто вас найдет?? Слово загазую ищут 32 раза в месяц по всему миру. Нет. Теперь смотрим в сервисе подбора слов сколько раз спрашивают такие слова как гбо, газовое оборудование, газобаллонное оборудование:
гбо - 74000 раз
газовое оборудование - 81000 раз
газобаллонное оборудование - 6000 раз.
Это статистика по всему миру, так что не обольщайтесь на такую аудиторию  .
Видно что газовое оборудование лидирует, но в газовое оборудование входит так же оборудование для дома, а вот гбо чуть уступающее больше подходит, лично я никогда не слышал в употреблении к бытовым приборам слова ГБО.
Значит нам нужно обыграть в заголовке слово ГБО. Создавая сайт для компании Gazinavto я использовал заголовок - GAZinAVTO - ГБО в Рязани (газовое оборудование для автомобилей). В таком заголовке присутствует, название фирмы, ключевое слово ГБО, ключевое слово газовое оборудование с уточняющим словом автомобиль, Рязань (региональная принадлежность). И что не мало важно такое заголовок содержит 63 символа, в идеале нужно уложиться в 60, но чуть превысить не страшно. Подсчитать символы можно на специальном сайте - mainspy.ru
Правильный выбор заголовков это основа поисковой оптимизации (SEO). Выбирайте заголовок правильно, и ваш сайт будут посещать.
В конечном варианте строка заголовка должна выглядеть аналогично этой - <title>GAZinAVTO - ГБО в Рязани (газовое оборудование для автомобилей)</title> не удаляйте скобки.
Дальше идет блок meta данных

Код: [Выделить]

<meta http-equiv="content-language" content="ru">
<meta name="description" lang="ru" content="Краткое описание страницы">
<meta name="keywords" content="ключевые слова">
Вместо слов Краткое описание страницы введите текст до 120 символов отражающий суть страницы. Используйте слова установка, регулировка, поколений, гбо. Текст должен быть в кавычках.
Вместо слов ключевые слова введите пару ключевых слов вроде установка, регулировка, поколений, гбо. Текст должен быть в кавычках.
Следующее что нужно изменить - строка 35.

Код: [Выделить]

<div id="sidebar">
<h1><a href="./">Фирма</a></h1>
<p><a href="./">Кратко о фирме</a></p>
Вместо слова фирма пишем название своей фирмы. Нормально уместиться слово примерно из 10 букв. Если ваша фирма имеет название длиннее, то придется изменить стиль страницы. Это не сложно. Если возникнет в этом необходимость, то пишите в эту тему я помогу.
Вместо слов кратко о фирме впишите краткое описание своей компании, например 10 лет в сфере настройки газа на автомобилях.
Идем ниже и ищем код

Код: [Выделить]

<div class="section first">
<h2>Заголовок 2 порядка</h2><br>
<h3>Заголовок 3 порядка</h3>
<p class="lead"; style="text-align: justify;">
Текст
<br>
</p>
<h3>Заголовок 3 порядка</h3>
<p class="lead"; style="text-align: justify;">
еще текст
</p></div>
Это уже собственно текст страницы, меняйте заголовки пишите текст. Закачивайте на хостинг измененный файл и смотрите, что вышло. Помните, что текст должен искаться поисковиком. То есть не стесняйтесь повторения слов ГБО, установка, продажа, регулировка, поколения. 
Позже расскажу, что менять в других файлах, как вставить счетчики посещений в сайты и поделюсь некоторыми хитростями продвижения.
Удачи!

[Stehlen]

Редактирование файла zachem.htm мало отличается от редактирования файла index.htm (см. выше). Только стоит изменить текст заголовков, описаний страницы, и ключевых слов. В данном файле можно опубликовать интересные пользователям статьи о газовом топливе. Статьи добавляются в код показанный ниже:

Код: [Выделить]

<div class="section first">
<h2>Заголовок 2 порядка</h2>
<p class="lead"; style="text-align: justify;">Текст</p>
<h2>Заголовок 2 порядка</h2>
<p class="lead"; style="text-align: justify;">Текст</p>
<h2>Заголовок 2 порядка</h2>
<p class="lead"; style="text-align: justify;">Текст</p>
<h2>Заголовок 2 порядка</h2>
<p class="lead"; style="text-align: justify;">Текст</p>
<h2>Заголовок 2 порядка</h2>
<p class="lead"; style="text-align: justify;">Текст</p>
</div>
Готовый код с статьями выглядит примерно так:

Код: [Выделить]

<div class="section first">
<h2>Выгода от использования газового топлива</h2>
<p class="lead"; style="text-align: justify;">
Помимо экономии на горючем газовое топливо увеличивает разовый пробег автомобиля и тд тп.</p>
<h2>Газовый редуктор</h2>
<p class="lead"; style="text-align: justify;">
Одним из основных компонентов ГБО 1-4 поколения является редуктор испаритель, блаблабла</p>
<h2>Газовые форсунки</h2>
<p class="lead"; style="text-align: justify;">
Наша компания рекомендует использовать газовые форсунки..... таких то фирм и тп</p>
<h2>Газовые баллоны</h2>
<p class="lead"; style="text-align: justify;">
Газовый баллон должен быть окрашен в красный цвет и иметь надпись огнеопасно</p>
<h2>Заголовок 2 порядка</h2>
<p class="lead"; style="text-align: justify;">Текст</p>
</div>
Страница с таким кодом будет выглядеть так:

Сделать свой сайт

Сделать свой сайт

[Stehlen]

В состав сайта входит ява скрипт подгрузки изображений. Это нужно во-первых потому, что эффектно. Во-вторых потому, что облегчает страницу. Сначала загружаются маленькие копии картинок - миниатюры (предпросмотр), а по клику на миниатюры всплывает большая картинка.

Редактирование файла foto.htm до строки

Код: [Выделить]

<div id="content">не отличается от рассмотренных выше примеров. Ниже указанной строки по мимо рассмотренных ранее заголовков присутствует код вывода фотографий.

Код: [Выделить]

<div id="content">

<div class="section first">
<h2>Заголовок 2 порядка</h2>
<h3>Заголовок 3 порядка</h3>
<br>
   <div class="thumbnail">
<a href="./images/001.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/001_res.jpg" alt="описание картинки"></a>
</div>
   <div class="thumbnail">
<a href="./images/002.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/002_res.jpg" alt="описание картинки"></a>
</div>
</div>
<div class="section first">
<h3>Заголовок 3 порядка</h3>
<br>
   <div class="thumbnail">
<a href="./images/003.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/003_res.jpg" alt="описание картинки"></a>
</div>
<div class="thumbnail">
<a href="./images/004.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/004_res.jpg" alt="описание картинки"></a>
</div>
</div>
Для вывода фотографий вам нужно во-первых сделать набор желаемых фото - в оригинальном виде (я рекомендую использовать разрешение не больше 800х600) и в виде уменьшенных копий (я использовал 220х165). В коде 004.jpg является оригинальным изображением (оно открывается по клику), а 004_res.jpg миниатюра (загружается при открытии страницы). Посмотреть пример в действии.

Вы можете добавлять сколько угодно фото, для этого копируйте код аналогично показанному ниже:

Код: [Выделить]

<div id="content">

<div class="section first">
<h2>Заголовок 2 порядка</h2>
<h3>Заголовок 3 порядка</h3>
<br>
   <div class="thumbnail">
<a href="./images/001.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/001_res.jpg" alt="описание картинки"></a>
</div>
   <div class="thumbnail">
<a href="./images/002.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/002_res.jpg" alt="описание картинки"></a>
</div>
<div class="thumbnail">
<a href="./images/003.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/003_res.jpg" alt="описание картинки"></a>
</div>
   <div class="thumbnail">
<a href="./images/004.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/004_res.jpg" alt="описание картинки"></a>
</div>
<div class="thumbnail">
<a href="./images/005.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/005_res.jpg" alt="описание картинки"></a>
</div>
   <div class="thumbnail">
<a href="./images/006.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/006_res.jpg" alt="описание картинки"></a>
</div>
</div>
<div class="section first">
<h3>Заголовок 3 порядка</h3>
<br>
   <div class="thumbnail">
<a href="./images/003.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/003_res.jpg" alt="описание картинки"></a>
</div>
<div class="thumbnail">
<a href="./images/004.jpg" rel="lightbox[plants]" title="описание картинки">
<img src="./images/004_res.jpg" alt="описание картинки"></a>
</div>
</div>
ОГРОМНОЕ ЗНАЧЕНИЕ имеет изменение тегов титл и алт в которых в примере написано описание картинки. Здесь не нужно лениться и обязательно указывать простым языком, что находиться на фото. Поисковики не умеют анализировать изображение, они читают текст. Поэтому если на картинке рампа форсунок, то и подписывайте. А лучше подписывать с учетом своей выгоды. Например писать так - "рампа газовых форсунок Lovato. Регулировка ГБО в Рязани". Тогда по запросу к яндексу "Регулировка ГБО в Рязани" вылезут справа ваши картинки, смотря которые пользователь перейдет на ваш сайт.

Для примера вы можете спросить поисковик такую фразу - "метан на газель в рязани"
И увидите картинки компании gazinavto

[Stehlen]

Файл price.htm содержит цены на ваши услуги. Его редактирование до строки

Код: [Выделить]

<table border="1">
аналогично редактированию файлов рассмотренных ранее. Строка

Код: [Выделить]

<table border="1">
это начало кода отвечающего за вывод таблицы с ценами. Чтобы не ломать голову над кодом я рекомендовал бы воспользоватьс я онлайн html редактором. Например этим - SPAW Editor
Работать в нем очень просто, так же как в MS Word. Рисуете какую надо таблицу, а потом нижней вкладкой переключаете вид с привычного в код. И перед вами готовый код таблицы с внесенными данными, теперь им нужно просто заменить код таблицы который был в файле.
Пример:
код таблицы из архива

Код: [Выделить]

<table border="1">
<tbody>
<tr>
<td><strong>А/М</strong></td>
<td><strong>1 поколение<br />(карбюратор)</strong></td>
<td><strong>2-3 поколение<br />(инжектор)</strong></td>
<td><strong>4 поколение<br /> (впрыск)</strong></td>
</tr>
<tr>
<td>Ваз-2101-07</td>
<td>9500 -10500руб</td>
<td>13500-15000руб</td>
<td>20000-25000руб</td>
</tr>
<tr>
<td>Газ 3307<br />ЗиЛ</td>
<td>13500-15000руб.</td>
<td>--------</td>
<td>--------</td>
</tr>
<tr>
<td>Газель<br />бортовая</td>
<td>11000-13000руб</td>
<td>13500-15000руб</td>
<td>24000-26000руб</td>
</tr>
<tr>
<td>Газель<br />пассажирская</td>
<td>12500-16500руб</td>
<td>14500-15500руб</td>
<td>24000-26000руб</td>
</tr>
<tr>
<td>Иномарки<br />В зависимости от кол-лва циллиндров</td>
<td>9000-12000руб</td>
<td>14000-16000руб</td>
<td>20000-46000руб</td>
</tr>
<tr>
<td>Стоимость ТО</td>
<td>300рублей</td>
<td></td>
<td>600рублей</td>
</tr>
</tbody>
</table>Заменяем на код полученный в редакторе

Код: [Выделить]


<table border="1">
  <tbody>
    <tr>
      <td><br /></td>
      <td>Цена продажи&nbsp;</td>
      <td>Цена установки&nbsp;</td>
    </tr>
    <tr>
      <td>ГБО 2 поколения</td>
      <td>&nbsp;10000 рублей</td>
      <td>15500 рублей</td>
    </tr>
    <tr>
      <td>&nbsp;ГБО 3 поколения</td>
      <td>&nbsp;20000 рублей</td>
      <td>32000 рублей</td>
    </tr>
  </tbody>
</table>Посмотреть как это будет выглядеть можно здесь - пример в действии
Либо в прикрепленный файлах.

[Stehlen]

Важным сервисом для сайта компании занимающейся установкой ГБО является карта газовых заправок. Не секрет, что многих отпугивает газ изза страха не найти заправку. Используя шаблон сайта скаченный в этой теме вы без труда встроите в свой сайт самую полную карту газовых заправок.
Опять же файл начинается с стандартных строк

Код: [Выделить]

<title>Заголовок страницы</title>
<meta http-equiv="content-language" content="ru">
<meta name="description" lang="ru" content="Краткое описание страницы">
<meta name="keywords" content="ключевые слова">
Для чего их менять я описывал выше. Далее идут ссылки на скрипты для правильной работы сайта, нам будет нужно изменить ключ в скрипте вывода карты яндекс. Ключ имеет следующий вид:

Код: [Выделить]

ALjUNk4BAAAAjr1EeAIA3JK9IlrTWwTDtSkcaXOc8mdT3N0AAAAAAAAAAABomoo5Za5uwLXuFo1Z0MiOeYLnaA==
И найти его можно после строки

Код: [Выделить]

<script src="http://api-maps.yandex.ru/1.1/index.xml?key=Вам нужно изменить его на ключ полученный по ссылке - получение API ключа яндекс карт. Получить ключ очень легко, - указываете адрес сайта, соглашаетесь с условиями и жмете кнопку получить API ключ
Заменяете ключ в файле и все готово.

Чуть ниже вы так же можете поменять координаты на которых будет стартовать карта.

Код: [Выделить]

map.setCenter(new YMaps.GeoPoint(39.726197,54.615663), 7);7 в данном случае это масштаб, чем больше число тем ближе будет увеличение. Обычно больше 12 не нужно.
В 80 строке вы можете изменить стандартный заголовок карты.

Код: [Выделить]

<h2>Карта заправок, пропан</h2><br>
Редактирование файлов metan.htm и propan.htm идентичны.

[Stehlen]

Файл contacts.htm это страница с вашими контактными данными. Ее редактирование аналогично показанным выше примерам. В 16 строке необходимо ввести ключ для карт яндекс полученный для карт пропановых и метановых заправок. В 20 строке ввести правильные координаты своей компании:

Код: [Выделить]

map.setCenter(new YMaps.GeoPoint(37.617401,55.751638), 15, YMaps.MapType.MAP);И тоже самое сделать в 39 строке

Код: [Выделить]

map.addOverlay(createObject("Placemark", new YMaps.GeoPoint(37.617401,55.751638), "constructor#pmlbmPlacemark", "Это мы"));
Далее необходимо изменить контактные данные:

Код: [Выделить]

<div id="content">
<div class="section first">
<h2>Как связаться с нами</h2>
<h3>Контактный адрес</h3>
        <p class="lead"; style="text-align: justify;">впишите сюда адрес</p>
<h3>Время работы</h3>
        <p class="lead"; style="text-align: justify;">впишите сюда режим работы</p>
  <h3>Телефон</h3>
<p class="lead"; style="text-align: justify;">впишите сюда телевон</p>
<h3>Электронные адреса</h3>
<p class="lead"; style="text-align: justify;">Email: сюда то что до @<img alt="@" src="http://gbovavto.ru/images/doggy.jpg" />
сюда то что после @<br><a href="http://gazmap.ru/forum/" target="_blank">Задать вопрос на форуме</a></p>
Вот и все. Сайт готов и теперь его нужно загрузить на хостинг. Долее будут рассмотрены файлы влияющие на индексирование сайта поисковыми роботами.

[Stehlen]

Файл robots.txt содержит перечень команд для поисковых роботов - что можно индексировать, что нельзя и другие.
В нем нужно только указать адрес вашего сайта.

Код: [Выделить]

User-agent: *
Sitemap: http://адрес своего сайта/sitemap.xml

User-agent: Yandex

Sitemap: http://адрес своего сайта/sitemap.xml
Host: адрес своего сайтаФайл sitemap.xml это содержание вашего сайта, он нужен для лучшей работы поискового робота. Имя данный файл вы быстрее скормите содержимое своей вебстраницы поисковику.
В нем необходимо изменить адрес вашего сайта.

Код: [Выделить]

<?xml version="1.0" encoding="UTF-8" ?>
<urlset
      xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
      xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
      xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9
            http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">

<!-- Created by Sitemap Generator on http://SitemapGenerator.ru -->

<url>
  <loc>http://адрес своего сайта/contacts.htm</loc>
  <priority>0.6</priority>
  <changefreq>weekly</changefreq>
</url>
<url>
  <loc>http://адрес своего сайта/price.htm</loc>
  <priority>0.6</priority>
  <changefreq>weekly</changefreq>
</url>
<url>
  <loc>http://адрес своего сайта/propan.htm</loc>
  <priority>0.6</priority>
  <changefreq>weekly</changefreq>

Сразу после создания сайта лучше воспользоватьс я кнопками социальных закладок (вверху слева) и добавить ссылки на ваш сайт в разные социальные сети. Это ускорит индексацию сайта.

[Stehlen]

После создания сайта важно знать его эффективность иначе оценить полезность проделанной работы не удасться. Для этого в начале следует добавить сайт в инструменты вебмастера (будем использовать yandex, он более понятен русскому пользователю хотя чуть глюковат).
Зачем это нужно..?
Дело в том, что полезно знать: сколько страниц добавилось в поисковик (сколько вообще он может показать при поиске), сколько сслок ведет на ваш сайт, какой "рейтинг" присвоил поисковик вашему сайту и так далее. Особенно важно знать сколько страниц в поиске, потому что без этого может получиться так, что изза какой то ошибки ваш сайт и не будет показываться поисковыми системами.
Как это сделать.
Сложного ничего нет. Если вы использовали бесплатный хостинг народ, или у вас есть почта Yandex? то вам не нужно регистрировать ся, а можете сразу перейти на сайт Яндексвебмастер.

Как и в любом другом сервисе Яндекс для входа в сервис вебмастеров используйте ссылку войти в правом верхнем углу.
После входа ищите ссылку Добавить сайт
Кликнув по ней вы перейдете на страницу добавления ссылки. Введите ссылку на ваш сайт. Нажмите кнопку добавить.
Следующий этап это подтверждение права на управление сайтом. Вам нужно одним из способов подтвердить право на работу с сайтом через инструмент yandexa. Проще говоря вы должны доказать что сайт ваш. Для этого вам нужно либо создать специальный текстовый файл, любо файл htm и перенести его на хостинг с сайтом. Так же можно в главную страницу вставить мета тег вида

Код: [Выделить]

<meta name='yandex-verification' content='50704b6897265d83' />Последний способ я и использую.

Вначале выберите способ подтверждения - метатег. Яндекс даст инструкцию и код подтверждения.
Для этого открываем FTP клиент (я использую FileZilla) и заходим на свой хостинг. Как это сделать я писал выше.
Скачиваем файл index.htm
Открываем его в блокноте.
Ищем строку

Код: [Выделить]

<meta http-equiv="content-language" content="ru">и перед ней добавляем свой код подтверждения (который даст яндекс

Код: [Выделить]

<meta name='yandex-verification' content='50704b6897265d83' />
Получится примерно так:

Код: [Выделить]

<title>Заголовок страницы</title>
<meta name='yandex-verification' content='50704b6897265d83' />
<meta http-equiv="content-language" content="ru">
<meta name="description" lang="ru" content="Краткое описание страницы">
<meta name="keywords" content="ключевые слова">Сохраняем файл и закачиваем его обратно на хостинг.
Теперь открываем окно с яндексвебмасте ром и жмем кнопку проверить.

После проверки вы увидите сообщение: "Права на управление сайтом успешно подтверждены."

теперь можно пользоваться сервисом.

Важно изменить регион сайта - для этого найдите ссылку География сайта а в ней регион сайта. Укажите свой регион и ссылку на страницу говорящую о принадлежности сайта к вашему региону. Я использую ссылку на страницу с контактными данными.
Очень подробно работа с инструментами вебмастеров от яндекс, google и других поисковых систем описаны здесь

[Stehlen]

После добавления сайта в инструмент вебмастера Вам нужно будет добавить счетчик посещений на свои страницы.
С его помощью Вы будете знать сколько человек посещает Ваш сайт, сколько из них приходит с поисковиков, сколько по ссылкам с других сайтов, сколько по рекламе. Какой примерный возраст вашей аудитории, пол, как много страниц они смотрят. В общем это довольно большое количество интересной информации.

Как регистрировать ся и получить счетчик я писать не буду. Дам лишь ссылки на подробные описания.

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

Код: [Выделить]

</body></html> Для этого их (все страницы сайта с расширением htm) нужно скачать и открыть в блокноте/
Ссылки на информацию:
1. Регистрация и получение кодов счетчика от Яндекс и Google

2. Работа с счетчиками

[Stehlen]

После создания сайта на первый план выходит увеличение его посещаемости. Самый простой способ это Контекстная реклама. Но важно, что бы и в поисковой выдаче сайт был не дальше 2-3 страницы. Для достижения этого нужно работать над текстом, заголовками, картинками, и метатегами. Об этом я писал ранее. Теперь поговорим о так сказать внешней оптимизации.

Поисковики в своем поисковом алгоритме используют ссылки на Ваш сайт. То есть чем больше ссылок тем лучше. Но для достижения хороших результатов ссылки должны быть качественными. Качественные ссылки Вы можете получить с сайтов схожей тематики и сайт должен следить за спамом. То есть если много ссылочного спама, то такие сайты называют ссылочной помойкой и от него толку нет. Так же ссылки должны быть доступны для поисковиков и не закрыты для индексации.
Числовым показателем качества сайта донора является ТИЦ у Яндекса и PR у Google. Это своеобразные рейтинги значимости ресурса. Чем больше ТИЦ и PR сайта. тем выгодней будет для Вас ссылка.

Так же стоит учитывать огромное значение текста вокруг ссылок. Используйте ключевые слова, то есть если вы оставляете ссылку в тексте форума, то делайте ее ввиде ключевого словосочетания, а не просто кидайте ссылку.
Пример не правильной ссылки - http://gazinavto.ru
Пример правильной ссылки - Установка и регулировка ГБО в Рязани
Далее очень много ссылок можно получить из профилей на форумах. Там не получится сделать ссылку из текста, но можно окружить ее текстом. Например в поле сайт своего профиля пишите http://gazinavto.ru а в поле город пишите "Установка и регулировка ГБО в Рязани", в поле интересы - "газовое оборудование, автомобили, газовые форсунки, регулировка гбо". В поле интересы пишите еще текст связанный с тематикой сайта. Для примера смотрите картинку:


На каких сайтах выгодно размещать ссылки написано в материале Внешние ссылки из профилей
Весь список "хороших" сайтов смотрите здесь