Учебное пособие

Создание сайта

       

Этапы последней подготовки сайта

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

1. Заголовки страниц

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

Название страницы размещается в контейнере <head> </head> служебной части файла между открывающим и закрывающим тегами заголовка:

<title>
Название на любом языке длиной не более 256 знаков
</title>

На самой странице заголовок не отображается. Заголовок больше чем на 60-80 знаков выбирать не стоит, поскольку основные "потребители" названия - заголовки браузеров и закладки не вмещают длинных строк обрезая их сверх возможной длины. Заголовок, который "уползает" за длину строки браузера или закладки, выглядит не самым лучшим образом, а ведь закладки - одно из самых значимых современных маркетинговых достижений.

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

2. Мета теги

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

Вы можете посмотреть, как это выглядит на других сайтах, заглянув в исходники командой Вид=>Просмотр HTML-кода. Мета теги - это служебные и необязательные для браузеров атрибуты страницы, размещенные в ее заголовке (между тегами <head> </head>), которые содержат описание страницы, ключевые слова к ней, некоторую информацию об авторе, управляющие команды для поисковых роботов и прочую служебную информацию, не предназначенную для отображения посетителям.

Выглядят мета-теги следующим образом:

<meta name=autor content="Автор страницы">
<meta name=KEYWORDS content="ключевые слова для вашего сайта через запятую">
<meta name=DESCRIPTION content="описание страницы">

В каждый контейнер <META NAME=___ CONTENT="___"> вы помещаете соответствующие значения, индивидуальные для каждой страницы (то есть, каждая страница должна содержать свое собственное описание и свои собственные ключевые слова, которые ей наиболее соответствуют). Это довольно большая работа, но необходимая. От этой работы, в частности, зависит, некоторым образом, количество посетителей на вашем сайте.

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

Длина каждого поля content ограничена 1024 знаками, поэтому не стесняйтесь написать большое, продуманное описание и тщательнее работайте над ключевыми словами. Однако следует помнить, что мета-теги включены в код страницы, так что увеличение их длины ведет к увеличению объема страницы, а следовательно, увеличивает время загрузки. Поэтому не следует увлекаться.

3. Подписи и копирайты

Ваш сайт - это ваша интеллектуальная собственность, которая охраняется международными законами об авторском праве. Мы не будем обсуждать сейчас степень соблюдения этих законов в нашей стране (скажем только, что при желании они очень даже соблюдаются), важно, что законы эти существуют и они адекватно отражены в Российском законодательстве. Так что, если вы их не нарушаете, то они работают на вас. Механизм вступления в действие закона достаточно прост: под каждым материалом, который вы хотите защитить, ставится значок копирайта и фамилия человека, которому эти права принадлежат. Теперь ваши права защищены законом.

4. Комментарии

Стоит предположить, что ваш сайт будет разрастаться и наступит время, когда вы вряд ли сможете удержать в голове все детали и нюансы вашего собственного макета, когда объем страниц перевалит за пару сотен. Чтобы создать себе более комфортные условия, добавьте в тело страницы комментарии, поясняющие значение того или иного участка кодов. Комментарии оформляются тегом <!-- -->, в них удобно указывать также и области распределения материалов, например:


<!-- Начало основного текста -->
<!-- Конец основного текста -->

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

5. Изображения

Тег <img…> имеет несколько важных параметров, к сожалению, используемых реже, чем должно. Первый такой параметр - это высота и ширина картинки - атрибуты weight и height. При наличии этих атрибутов браузер сразу оставляет необходимое поле для картинки и загружает страницу дальше, не дожидаясь окончания подгрузки картинки. Таким образом, посетитель сразу видит вашу страницу и может начинать изучать ее, не дожидаясь загрузки картинок.

Атрибут alt содержит в себе описание или комментарий к картинке, который высвечивается при наведении на картинку мыши или, если картинка не загрузилась, - вместо нее. Он не является обязательным, но, все же, рекомендуется им пользоваться. Почему? Многие пользователи отключают изображения для ускорения времени загрузки, а следовательно, для уменьшения расходов на подключение. Если вы не заполните теги alt, то посетитель просто ничего не увидит, возможно, если ваши картинки играют ключевую роль в навигации, даже не поймет, куда он попал, и что ему дальше делать. То есть, если ваша система навигации построена на картинках, то необходимо предусмотреть и альтернативную ей текстовую навигацию для пользователей с медленным или дорогим интернетом.

Последние два атрибута - border и bordercolor. Эти атрибуты устанавливают толщину и цвет рамки вокруг изображения. Разные браузеры по умолчанию принимают разные значения этих атрибутов, поэтому рекомендуется везде проставить атрибут border и установить его значение равное 0, атрибут bordercolor при этом не нужен. Если вы хотите поставить рамку вокруг изображения, то учтите, что толщина рамки прибавляется к размерам картинки (то есть, рамка толщиной в 1 точку с каждой стороны увеличивает размеры картинки на 2 точки по высоте и ширине). Поэтому заранее закладывайте рамки в макет.

 

 

 

Top.Mail.Ru
Top.Mail.Ru