Основным понятием CSS является стиль – т. е. набор правил оформления и форматирования, который может быть применен к различным элементам страницы. В стандартном HTML для присвоения какому-либо элементу определенных свойств (таких, как цвет, размер, положение на странице и т. п.) приходилось каждый раз описывать эти свойства, даже если на одной страничке должны располагаться 10 или 110 таких элементов, ничуть не отличающихся один от другого. Вы должны были десять или сто десять раз вставить один и тот же кусок HTML-кода в страничку, увеличивая размер файла и время загрузки на компьютер просматривающего ее пользователя.
CSS действует другим, более удобным и экономичным способом. Для присвоения какому-либо элементу определенных характеристик вы должны один раз описать этот элемент и определить это описание как стиль, а в дальнейшем просто указывать, что элемент, который вы хотите оформить соответствующим образом, должен принять свойства стиля, описанного вами. Удобно, не правда ли?
Более того, вы можете сохранить описание стиля не в тексте вашей странички, а в отдельном файле – это позволит использовать описание стиля на любом количестве Web-страниц. Потрясающе удобно! И еще одно, связанное с этим, преимущество – возможность изменить оформление любого количества страниц, исправив лишь описание стиля в одном (отдельном) файле.
Кроме того, CSS позволяет работать со шрифтовым оформлением страниц на гораздо более высоком уровне, чем стандартный HTML, избегая излишнего утяжеления страниц графикой.
Давайте рассмотрим, как мы можем воплотить столь замечательные возможности в жизнь.
Прошли те времена, когда в Интернете на уровне элементарных понятий нужно было объяснять, что такое хостинг. Все уже давно знают, что свою страничку вовсе не нужно держать на домашнем компьютере и каким-то образом обеспечивать к ней постоянный доступ, а на порядок проще разместить ее на так называемом хостинге - на компьютере хостинг-провайдера, чьей головной болью и одновременно сферой приложения профессиональных услуг является обеспечение круглосуточного доступа через Интернет к вашей страничке любых желающих.
Что интересно, еще буквально пару-тройку лет назад под хостингом только это и понималось - размещение и обеспечение доступа. В большинстве случаев это так и выглядело - ваша страничка где-то там лежала, периодически откликаясь на попытки ее посмотреть, а нередко и не откликалась, причем когда кто-то из ваших знакомых интересовался, в чем там дело, вы только криво усмехались и отвечали что-то вроде: "Да опять у хостера какие-то проблемы".
Но время шло, и хостинг как интернетовская услуга претерпел значительные изменения. Во-первых, значительно возросла стабильность доступа - если раньше странички "валялись" не менее пары раз в день, то теперь недоступность странички из-за проблем у хостера - явный нонсенс. Во-вторых, значительно изменилось само "железо", на котором размещаются сайты - раньше серверы собирали черт знает из чего на неизвестно чьей коленке, а сейчас любой уважающий себя хостинг-провайдер использует специальные серверы, созданные именно для решения подобных задач.
В-третьих, понятие "техническая поддержка пользователей" из полуабстракции в виде студента на телефоне, который говорил исключительно на фидошном сленге и через минуту общения с клиентом тут же терял человеческое лицо, превратилась во вполне четкую структуру, которая занимается именно поддержкой пользователей, а не их посыланием во все места с их идиотскими вопросами.
В-четвертых, хостинг-провайдеры стали намного более требовательно относиться к вопросам защиты данных клиентов. Если раньше сохранность вашей страницы на сервере хостинга зависела только от вашей предусмотрительности (то есть - догадаетесь ли вы всегда держать актуальную копию сайта на домашнем компьютере), то теперь, независимо от того, что именно вдруг произошло на сервере хостера, вопрос сохранности вашей информации лежит целиком на нем.
Хостинг как интернетовская услуга претерпел значительные изменения
В-пятых, понятие хостинга стало включать в себя большой набор всевозможных дополнительных видов услуг - предоставление почтовых ящиков, баз данных, скриптов, статистики, защиты от спама и вирусов, листов рассылки и так далее.
И при всем этом богатстве услуг вполне серьезный хостинг стал стоить совсем небольших денег - $5, $10, $15 или $20, в зависимости от дисковой квоты и набора предоставляемых сервисов. Причем уровень стоимости похожих пакетов услуг у разных хостинг-провайдеров отличается весьма незначительно. Не бывает такого, чтобы у одного хостинг-провайдера, скажем так, оптимальный хостинговый пакет стоил $10, а у другого - $30. Разница обычно составляет буквально два-три доллара. Но вот как раз эти ничтожные пара долларов в месяц могут означать весьма существенные отличия в уровне и видах предоставляемых услуг.
Мне не раз приходилось слышать разговоры из серии: "Ну, и зачем ты в этой конторе хостишься, когда вон у тех - и оплата ниже на два бакса, и дискового пространства предоставляют больше, и список сервисов - две страницы?". Но потом, когда пользователь, соблазненный экономией двух долларов в месяц и списком сервисов на две страницы, переходил на нового хостинг-провайдера, вдруг выяснялось, что техподдержка там отвечает на звонки с 11 до 17, кроме выходных, причем как они отвечают - так лучше бы вообще не отвечали; что сайт имеет тенденцию вдруг падать и не подниматься, потому что вырубилось электричество, защиты у провайдера нет, так что все серверы полегли, а поднялись после появления электричества далеко не все, но никто и не почесался; что из заявленного длинного списка сервисов реально представлена дай бог половина, причем из них восемьдесят процентов - вещи, которые никогда не понадобятся, зато многое из того, что действительно нужно, работает через пень-колоду, и так далее. И становится не сильно понятно, зачем такие проблемы из-за каких-то двух долларов в месяц? Стоит оно того или нет?
Или наоборот. Бывает так, что вебмастер (или организация) сели к какому-то хостинг-провайдеру, мучаются с его ненавязчивым сервисом, а переходить в другое место - боятся, потому что, дескать, "от добра добра не ищут". От добра - точно, не ищут. Но в данном случае речь идет совсем не о добре, а о некачественном предоставлении услуг.
Понятие хостинга стало включать в себя большой набор всевозможных дополнительных видов услуг
Закончились времена доморощенных хостеров. Точнее, почти закончились, потому что где-то еще остались конторы, предоставляющие хостинг на кошмарном уровне девяностых годов прошлого столетия. Но они очень скоро отомрут, потому что не могут, не умеют и не хотят оказывать эту услугу так, как полагается на современном уровне, а сегодняшнего клиента уже не удовлетворяют фразы "не волнуйтесь, завтра починим" или "пока нет, но скоро будет". Ему нужно сейчас, в полном объеме и качественно.
Однако у неискушенных клиентов тут же возникает вопрос: как выбрать хостинг-провайдера, если они все предлагают примерно одинаковый набор предоставляемых услуг, цены на которые различаются совсем незначительно? Здесь, на мой взгляд, следует обращать внимание на две вещи. Во-первых, сайт провайдера и данные, которые на нем представлены. Если на сайте нет никакой информации о самой компании, используемом оборудовании, защите, сертификатах и так далее - это шарашкина контора. Список предоставляемых услуг - еще далеко не все. Клиенты должны знать, где расположено помещение с серверами, как оно охраняется, что предусмотрено в случае проблем с электричеством, и так далее.
Конечно, тут многое зависит от ваших личных требований к хостингу. Потому что если вам нужно разместить страничку с парой фотографий и текстом "Когда-нибудь здесь будет крутая страница", тогда, конечно, вас мало будет интересовать охрана дата-центра и защита электропитания. Но в этом случае вам и нормальный хостинг не нужен - достаточно просто разместить страничку на одном из бесплатных серверов. А вот в случае размещения серьезного проекта, корпоративного ресурса и так далее все эти вопросы обязательно нужно выяснить, потому что, например, неответ корпоративного ресурса в течение какого-то времени может обернуться серьезными финансовыми потерями.
Ну, и во-вторых, поинтересуйтесь впечатлениями тех людей, которые уже пользуются услугами каких-то хостинг-провайдеров. Пускай они расскажут, что им понравилось, а что нет, с какими проблемами им пришлось столкнуться. Это может быть весьма показательным.
И последнее. Если вам не нравится тот хостинг-провайдер, на котором в настоящий момент размещен ваш проект, - не останавливайтесь перед тем, чтобы подыскать более подходящую фирму. Перенести проект на новый хостинг, как правило, особого труда не составляет, а выигрыш от подобных действий может быть весьма значительным. Потому что на современном этапе хостинг должен отвечать очень высоким требованиям. И есть немало провайдеров, которые этим требованиям действительно отвечают.
Множество владельцев малого бизнеса просто не имеют достаточно ресурсов для проведения рекламной компании, которая бы позволила раскрутить их интернет-ресурс. Именно для решения этой проблемы в интернете существует множество online сервисов, которые позволяют владельцу сайта самостоятельно (DIY, do-it-yourself) заняться популяризацией своей веб-странички.
На сайтах подобного рода специалисты по поисковой оптимизации могут дать вам множество полезных советов и рекомендаций. Эта статья предоставляет возможность мне поделиться с вами своим опытом в области поисковой оптимизации. Назовем эти рекомендации как "10 минут для поисковой оптимизации".
Эти советы будут полезны для каждого, у кого есть хотя бы несколько страничек, сверстанных на HTML, но все же главной темой данной статьи будет привлечение посетителей на вашу домашнюю страничку.
Первые шаги
Перед тем, как начать, следует рассмотреть несколько моментов, которые необходимо знать перед началом оптимизации. Только вот для этого может потребоваться и более 10-ти минут. Итак, следует учесть следующее:
Определитесь со своей целью:
99% из вас знают, какой именно товар вы собираетесь рекламировать, поэтому вам нужно только определиться с ключевыми словами, по которым посетитель и попадет на ваш сайт. Вот несколько полезных советов. Во-первых, нужно проанализировать статистику посещаемости сайта, чтобы узнать, по каким ключевым словам посетители попали на ваш сайт. Во-вторых, посетите сайт вашего конкурента, который широко известен в просторах интернета.
Посмотрите на заголовки нескольких его страничек и попытайтесь определить, какие именно ключевые слова используются. Также посмотрите исходный текст странички (в Internet Explorer'е его можно посмотреть с помощью пункта меню View (Вид) - > Source (Просмотр html-кода)) и скопируйте информацию, содержащуюся в META-тегах. На своей страничке же вы должны определиться с частотой (разумной) использования наиболее запрашиваемых ключевых слов.
Здесь очень важно заметить, что профессиональные оптимизаторы имеют у себя под рукой гораздо больше инструментов, да и информации для установки нужных ключевых слов (с высокой их частотой в тексте страницы).
Дизайн сайта - привлекателен ли он для покупателя?
Вот тут-то и находится один из подводных камней. Суть его в том, что непривлекательный дизайн сайта - это прямой путь к низкой посещаемости ресурса. Безусловно, на тему разработки юзабилити сайта (т. е его дизайна), написано очень много и книг, и статей. Но пусть в рамках данной статьи все аспекты юзабилити рассмотреть и не получиться, то несколько замечаний тут не помешает:
1. Избегайте использовать в цветовой гамме сайта необычные и странные цвета. В противном случае посетителю будет тяжело прочитать информацию на вашем ресурсе (красный текст на голубом фоне - вот вам и яркий пример ужасного дизайна). Также не рекомендуется использовать текст мелкого шрифта; старайтесь придерживаться размера шрифта в пределах от 10 до 12 (2 или 3 в Macromedia Dreamweaver).
2. Использование на сайте рекламных блоков (как графических, так и текстовых), будут только отвлекать ваших посетителей. К примеру, если вы продаете автомобили BMW, то рекламировать на сайте средство для повышения потенции "Виагра" будет очень некстати.
Каждый графический элемент на вашей страничке может как повышать, так и понижать доверие посетителей к вашему ресурсу. Старайтесь использовать это место на сайте очень мудро и пользователи это оценят.
10 минут на раскрутку
1. Проверка на спам
Перед началом работ по оптимизации одним из ключевых моментов является тот факт, для раскрутки своего сайта вам не следует использовать приемы, которые могут быть восприняты поисковой машиной как спам. Но самое неприятно в этом то, что вы можете об этом и не подозревать! Некоторые веб-мастера (с устаревшими знаниями о принципах работы поисковых машин) используют на веб-страницах скрытый текст. Они ошибочно полагают, что таким методом помогут сайту подняться в глазах поисковика. Но это в корне неверно и данный прием может только добавить проблем для поисковой оптимизации.
Для обнаружения скрытого текста нужно всего лишь с нажатой левой кнопкой мыши провести от начала до конца страницы. Выделив таким образом всю страничку, можно легко найти скрытый текст (как правило, цвет шрифта у скрытого текста совпадает с цветом фона странички) - он просто будет выглядеть как подсвеченный.
Также вам захочется проверить частоту ключевых слов, которые встречаются на страничке. В данном случае является недопустимым повторение 5-6 ключевых слов, которые расположены друг за другом. Таким образом поисковую машину уже не проведешь, так что лучше таких приемов не использовать.
Для получения более детальной информации о нечестных методах раскрутки, которые приводят только к негативным результатам, можно ознакомиться с документом: "Inspecting your Web Site for Spam."
2. Проверка на релевантность (значимость) сайта для поисковой машины
Очень важно для вашего ресурса всегда быть в фокусе у поисковика. Для примера, если ваш ресурс будет ассоциироваться с ключевой фразой "Продажа автомобилей BMW", то ссылка или информация о продаже недвижимости будет совершенно излишней. Имейте в виду, что большинство поисковых машин будут судить о вашем ресурсе именно в зависимости его тематики. А она в первую очередь зависит от текстовой информации, которая содержится на страницах вашего сайта.
3. Подбор правильного содержания сайта
Текстовая информация на вашем сайте является решающей для удержания на сайте человека, который только что на него зашел. К слову, что это так важно, хочу добавить, что у множества компаний есть свой профессиональный копирайтер, который и занимается контентом (информацией на сайте). Поэтому так важно при написании статей придерживаться ключевых слов, которые вы выбрали в качестве цели для поисковой оптимизации своего ресурса. Но, в свою очередь, размещать ключевые слова в тексте без связи с остальной информацией (т. е ключевые слова не соответствуют тематике статьи) - верный путь потерять посетителя вашего сайта.
Важное замечание: очень часто первые 25-30 слов вашего сайта - это то, что каждый поисковик будет использовать для его описанию. Постарайтесь использовать ваши ключевые слова внутри этой области, не забывая при этом, чтобы это самое описание выглядело разборчиво и наглядно.
4. Работа над заголовком сайта (Title)
В заголовок вашей странички очень желательно поместить те ключевые слова или фразы, которые наиболее полно характеризуют предмет рекламы на ней. Для примера: "Продажа автомобилей BMW - MeBMW.com" Для поисковых машин заголовок является очень важным, а ключевые слова (фразы) в нем только помогут выше подняться в рейтингах. Но здесь главное не переусердствовать и использовать ключевые слова в пределах разумного. Заголовок также играет большую роль и в релевантности сайта. Именно его содержание будет сравниваться с текстовой информацией (контентом) остальной части веб-страницы. Чем больше будет совпадений у заголовка страницы с ее контентом, тем более она будет значимой для поисковой машины.
6. Навигация сайта... Сделайте ее интуитивно понятной
Могу предположить, что вы, как и большинство, используете для навигации на своем сайте графические элементы или текстовые ссылки. Здесь вам один мой небольшой совет - создайте меню для навигации на своем сайте предпочтительнее в виде текстовых ссылок его разделы. А разместить его лучше внизу страницы - так удобнее для посетителя. Теперь, при добавлении разделов, вы их можете называть, используя ключевые слова/фразы для лучшей информативности описания вашего раздела. Для примера сравним два варианта меню:
Аксессуары к автомобилям BMW | Продажа автомобилей BMW | Подробнее о MyBMW.com
и как после этого смотрится вот такое:
Аксессуары | Продажа автомобилей | О нас
7. Проверьте работоспособность ссылок и орфографию/грамматику
Совсем уж не помешает еще разок проверить все ссылки на сайте и правописание. После чего, если вы уверены, что это уже окончательный вариант, можете смело загружать сайт в интернет.
Спешить нужно медленно
А что же дальше? Сейчас много поисковых машин предлагают такую платную услугу, как предоставление вашему новому веб-сайту постоянную или срочную индексацию. В противном случае неизвестно, когда же до него доберется поисковый паук и проиндексирует его в своей базе. Если же вы воспользуетесь услугой срочной индексации, что уже через пару дней можно пожинать плоды в виде посетителей. Правда, у каждой поисковой машины здесь свои сроки.
Но все же эта статья посвящена тем, у кого денег для такой услуги попросту нет (да и стоит она недешево, вот может с первой прибыли ею и воспользуемся). Тем не менее, если ваш сайт уже посетил поисковый робот и внес его в свою базу, то вам остается теперь только ждать, когда он опять посетит его вновь на предмет наличия нового материала. Вот поэтому так важно своевременно обновлять контент на сайте - добавлять новые статьи, заводить новые разделы и т.д. (все зависит от вашей фантазии и сообразительности).
Но что же делать, если же вы желаете уменьшить это время или если до вашего сайта робот еще и не добрался? Вот для этого и придется кропотливо регистрировать все ваши новые странички вручную на сайте поисковика. А перед регистрацией (первой или повторной) не помешает также внимательно ознакомиться с правилами, которые очень подробно расписаны у каждого поисковика. Так, на всякий случай.
Существует несколько разных способов форматирования элементов веб-страниц. Вообще под форматирование подразумевается придание им каких-либо нужных веб-дизайнеру атрибутов - например размер шрифта и его цвет. Но в этой статье мы не будем рассматривать именно такую работу со стилями - как показала практика их лучше менять средствами каскадных таблиц стилей - CSS. А это уже тема других статей.
Вы уже знаете, что для разделения страницы горизонтальной полоской необходимо воспользоваться тегом <hr>. Теперь давайте рассмотрим еще несколько методов изменения внешнего вида элементов нашей веб-страницы
Форматирование текста
В нашей страничке у есть строка ссылок "<p><a href="index.html">Главная страница</a> - <a href="aboutme.html">Обо мне</a></p>".
Попробуем сделать текст ссылок более крупным. Это можно сделать с помощью тега <b>, который отвечает за жирный шрифт (bold.
Поэтому наша строка "<p><a href="index.html">Главная страница</a> - <a href="aboutme.html">Обо мне</a></p>" преобразуется в "<p><a href="index.html"><b>Главная страница</b></a> - <a href="aboutme.html"><b>Обо мне</b></a></p>".
Вот как это будет выглядеть в коде:
Добавление изображений в веб-страницу
С помощью добавления изображений на страниц можно значительно увеличить ее привлекательность и добавить информативности. Пусть у вас есть изображение test.jpg, которое лежит в папке images. Тогда для его отображения на странице необходимо воспользоваться вот таким кодом:
У тега, который отвечает за вывод изображения, есть несколько параметров:
* Расположение изображения (директория).
* Ширина (width) и высота (height).
* Заголовок (title).
* Альтернативный текст (alt).
Параметры ширина и высота должны соответствовать реальным размерам изображения. В противном случае они уменьшат или увеличат его (естественно, что исходное изображение при этом останется прежних размеров).
Параметр заголовок используется для краткого описания картинки. Эта надпись появляется при наведении курсором мышки поверх картинки.
Последним, но не менее важным идет тег alt. Он очень важен для соответствия кода веб-страницы стандартам консорциума W3C. Этот тег отображается на месте изображения в том случае, если посетитель использует текстовый браузер или у него отключена функция отображения графики.
Такие поисковые машины, как Google и Яндекс (да и все остальные) могут использовать заголовки изображений для их индексации. В дальнейшем эта информация используется для поиска картинок по определенным ключевым словам.
Поиск
