Веб-Самоделкин. Как самому создать сайт быстро и профессионально

А. А. Гладкий, 2012

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

Оглавление

* * *

Приведённый ознакомительный фрагмент книги Веб-Самоделкин. Как самому создать сайт быстро и профессионально предоставлен нашим книжным партнёром — компанией ЛитРес.

Купить и скачать полную версию книги в форматах FB2, ePub, MOBI, TXT, HTML, RTF и других

Глава 1.

С чего начать

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

Термины и определения, используемые веб-разработчиками

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

Баннер — статичное или динамичное изображение стандартного размера (как правило — 468х60 пикселей или 100x100 пикселей), предназначенное для размещения рекламы.

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

Веб-страница — логическая единица Всемирной паутины, однозначно определяемая адресом (URL) и представляющая собой файл HTML-формата. Веб-страница может включать в себя текст, графические объекты, фотографии, аудио — и видеоматериалы и иные элементы. Все веб-страницы можно разделить на две категории: статические (на них представлена постоянная информация) и динамические (наиболее характерный пример — страница со списком результатов, выданными поисковой системой). Для просмотра веб-страниц предназначены специальные программы, называемые Интернет-обозревателями, или браузерами. Совокупность логически связанных между собой веб-страниц образует сайт.

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

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

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

Интернет-обозреватель (браузер) — программа, предназначенная для просмотра содержимого веб-страниц (самые известные — Internet Explorer, Opera и Mozilla Firefox).

Клиент — компьютер, который использует ресурсы других компьютеров сети, в первую очередь — серверов. Кроме этого, клиентом называется программа, программа, которая вырабатывает запросы на доступ к удаленным ресурсам и передает их по сети на конкретный компьютер.

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

Контент — информационное наполнение сайта: текст, изображения, таблицы и иные элементы, упорядоченные в соответствии с заранее разработанной структурой сайта при помощи тэгов. Иначе говоря, контент — это то, что вы видите на сайте.

Куки (Cookies) — элемент данных, с помощью которых удаленный сервер помечает конкретный Интернет-обозреватель при его посещении. В следующий раз сервер «узнает» этого пользователя, благодаря чему сможет либо предложить ему какие-то данные с учетом заявленных прежде пожеланий либо, наоборот, не показывать этому посетителю те данные, которые он уже видел (например, рекламу). Отметим, что куки (cookies) не умеют изучать содержимое жесткого диска компьютера пользователя. Некоторые их сведения хранятся лишь в течение текущего сеанса работы с сервером и автоматически удаляются сразу после закрытия интернет-обозревателя. Но есть и такая информация, которая сохраняется в отдельном файле и записывается на жесткий диск в специально предназначенные папки.

Посещаемость сайта — количество посетителей сайта за определенную единицу времени. Для ведения статистики посещений предназначены специальные счетчики, которые можно найти, например, на портале www.hotlog.ru. Посещаемость сайта является ключевой характеристикой для определения его рейтинга или для оценки того, насколько он интересен и полезен для кого-либо.

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

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

Трафик — объем принятой и переданной информации. Обычно единицей измерения трафика является один мегабайт.

Тэг — элемент языка программирования HTML, представляющий собой текст, заключенный в угловые скобки < >. Тэг — это активный элемент, определяющий представление или отображение находящейся за ним информации. Некоторые тэги имеют дополнительные атрибуты. В большинстве случаев тэги используются в паре: один тэг открывающий, второй — закрывающий.

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

Хостинг — размещение сайта на внешнем сервере (т.е. когда файлы сайта лежат не в локальном компьютере, а переданы на веб-сервер), круглосуточно подключенному к Интернету. В настоящее время существует великое множество специальных хостинговых площадок, активно предлагающих свои услуги по размещению сайтов. По своей сути хостинговая площадка представляет собой мощный сервер, подключенный к Интернету по высокоскоростному каналу связи. Различают два вида хостинга: коммерческий и бесплатный. В последнем случае платой за услуги хостинга может являться размещение рекламных банеров на страницах сайта. Также следует учитывать, что бесплатный хостинг могут содержать ограничения по объему размещаемой информации и использованию тех или иных приложений. В коммерческом хостинге подобных ограничений практически нет. Отметим, что иногда на хостинговой площадке размещается не только сайт, но и сервер организации.

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

Что представляет собой современный веб-сайт?

Итак, что же представляет собой современный веб-сайт? На этот вопрос мы попытаемся ответить в данном разделе.

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

Давно прошло время, когда сайтом называлась средней привлекательности страничка в Интернете, на которой содержалась статичная информация вроде «наша фирма открылась тогда-то, мы продаем бананы и ананасы, наш адрес такой-то, а телефон — такой-то». Сегодня любой сайт состоит из нескольких веб-страниц, каждая из которых содержит определенную информацию.

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

Кроме этого, практически каждый сайт содержит такие страницы, как Ссылки, Форум и Контакты.

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

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

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

• Имя — здесь отправитель сообщения вводит свои имя в произвольной форме (это может быть ФИО, название организации, псевдоним, и др.).

E-mail (может называться Электронный адрес или т.п.) — в данном поле нужно ввести электронный адрес, на который отправитель сообщения желает получить ответ. Данный параметр следует заполнять внимательно, поскольку если указать электронный адрес с ошибкой — ответ на отправленное сообщение получен не будет.

Тема сообщения — в данном поле можно ввести тему сообщения. Это делается по аналогии с тем, как заполняется данный параметр в обычных электронных письмах.

Текст сообщения — данный параметр может называться по-разному, а может и вообще не иметь названия, но суть от этого не меняется: это поле предназначено для ввода текста сообщения. Отметим, что на некоторых сайтах существует ограничение по количеству символов, вводимых в данное поле (например, не более 500 или 1000 символов).

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

Отправить — данная кнопка (она может называться по-разному — Отослать, Send, Submit, и т.д.) предназначена для отправки подготовленного сообщения.

Пример формы для отправки сообщения представлен на рис. 1.1.

Рис. 1.1. Пример формы для отправки сообщения на странице Контакты

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

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

Некоторые сайты имеют страницу, которая называется Карта сайта. Главная задача этой страницы — обеспечить быструю навигацию по сайту. Дело в том, что далеко не всегда можно перейти на любую страницу сайта с его главной или с какой-то другой страницы: иногда для этого нужно последовательно открывать несколько страниц. Например, чтобы просмотреть сведения об условиях отпуска какого-то вида продукции за наличный расчет, может потребоваться вначале открыть страницу с видами продукции, затем перейти на страницу требуемого вида продукции, и только после этого — на страницу с условиями отпуска этого вида продукции за наличный расчет. А на странице Карта сайта представлена полная развернутая структура всего сайта, что позволяет быстро найти требуемую страницу и перейти на нее.

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

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

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

Еще один вариант зарабатывания денег с помощью сайта — размещение на нем платных материалов. Это могут быть, например, книги, статьи, мультимедийные файлы, энциклопедические сведения, и т. д. Чтобы получить доступ к этим материалам, пользователь должен будет не только щелкнуть мышью на соответствующей ссылке, но и перевести определенную суму денег по указанным реквизитам. В подобных ситуациях для расчетов удобно использовать электронные системы интернет-платежей — например, WebMoney, Яндекс. Деньги, и т. п.

ПРИМЕЧАНИЕ

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

Многие владельцы сайтов любят проводить на своих веб-ресурсах опросы на разные темы. Кого-то интересует отношение клиентов к компании («Довольны ли вы сотрудничеством с нашей компанией?»), кого-то — мнение посетителей по злободневной теме («Поддерживаете ли вы войну в Ираке?»), а кто-то советуется с посетителями («Как вы считаете, в какой валюте лучше хранить сбережения — в долларах, евро или рублях?»), и т. п. После вопроса предлагается несколько вариантов ответов (например, «Да», «Нет», «Не знаю», и др.), и каждый пользователь может с помощью соответствующего переключателя выбрать какой-то один вариант. При этом во многих опросах исключается возможность повторного ответа со стороны одного и того же пользователя (читай — полученного с одного IP-адреса) в течение определенного промежутка времени (как правило — сутки).

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

Разработка концепции сайта

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

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

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

1. Для чего необходимо создание сайта? Например, сайт может быть нужен для зарабатывания денег, для общения и досуга, для поиска работы, для представления компании (корпоративный сайт), для привлечения клиентов или увеличения их числа, для продвижения конкретного продукта или линейки продуктов, для технической поддержки, для интернет-торговли, и т. д.

2. Что будет получено в результате создания сайта? Ответ нужно сформулировать максимально конкретно: доход в размере столько-то рублей в месяц, увеличение числа клиентов на 20%, продажа нового продукта не менее чем на такую-то сумму в месяц, и т. п. Однако подобная конкретика возможна не всегда. Например, если вы создаете сайт, чтобы разместить на нем резюме и найти работу, можно поставить такую задачу: получение отклика не менее чем от 5 потенциальных работодателей в неделю (декаду, месяц, и т.п.). А для нового корпоративного сайта можно поставить задачу привлечения посетителей не менее 50 человек в день.

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

4. Что требуется для создания сайта, а также для его последующего обслуживания, поддержки и администрирования? Например, нужно столько-то денег (заплатить за хостинг, и т.п.), один веб-программист, один дизайнер, высокоскоростной канал связи, программное обеспечение для разработки и администрирования сайтов (кстати, с некоторыми такими программами мы познакомимся ниже, в соответствующих главах книги), и т. п.

5. Что будет утрачено в случае, если результат создания интернет-ресурса не оправдает ожиданий? Например, не окупятся затраты на создание сайта в сумме 1000 долларов, предприятие не получит 20 новых потенциальных клиентов в месяц, товары для интернет-магазина «зависнут» на складе, и т. д. И при этом необходимо оценить, насколько тяжелыми окажутся для вас возможные последствия низкой эффективности будущего веб-ресурса.

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

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

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

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

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

Информационное наполнение (контент) сайта

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

При планировании информационного наполнения сайта важно определить тип и формат представления данных. Будет ли контент представлять собой только текст, либо в него будут добавлены графические объекты, звуковые файлы, Flash-элементы и т.п.? Какие страницы будут включены в состав веб-ресурса — только статические HTML-страницы или динамические, генерируемые на основании сформированных пользователем запросов? Отметим, что характерной особенностью динамичных страниц является то, что они предоставляют посетителю именно те сведения, которые его интересуют, причем именно в той форме, которая для данного посетителя является наиболее удобной для восприятия.

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

по типу аудитории, которой адресовано содержимое сайта;

по времени поступления информации (как правило, наиболее свежая и актуальная и информация следует первой);

по важности представляемых сведений;

по структуре, которая действует на данном предприятии (этот критерий используется при проектировании и создании корпоративных сайтов);

по типу представляемых сведений;

по релевантности.

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

Еще один немаловажный момент — это объем представленной на сайте информации. Этот параметр может выражаться в стандартных страницах (например, 30 страниц формата А4), однако данный показатель нельзя признать объективным: ведь многое зависит, в частности, от ширины строк, от размера шрифта, и т. п. А вот наиболее точным критерием для оценки количества текстового контента является его измерение в количестве печатных знаков (обычно — в тысячах печатных знаков). Данный показатель можно использовать в двух вариантах: с учетом пробелов или без учета пробелов.

Также необходимо заранее предусмотреть количество иных элементов контента: графических объектов, таблиц, мультимедийных файлов, и т.д., а также порядок из размещения и представления на сайте. Причем данный процесс можно формализовать — например, определив, что после каждых 2000 — 3000 знаков текста обязательно должен следовать рисунок, анимационный файл либо иной объект.

СОВЕТ

Однообразный текст на сайте может выглядеть скучно и неинтересно, поэтому в большинстве случаев рекомендуется «оживить» его какими-либо элементами (рисунками, анимацией, и т.п.). Помните, что текст с экрана монитора читать труднее, чем текст, представленный на бумажном носителе. Но и слишком злоупотреблять «разбавлением» текста не стоит, иначе контент будет выглядеть слишком «пестро», а это всегда мешает сосредоточиться.

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

СОВЕТ

В настоящее время существует немало виртуальных магазинов и бирж интернет-контента, где можно дешево купить подходящий текст. Наиболее популярными такими биржами в настоящее время являются ресурсы www.textsale.ru и www.advego.ru. Расчеты за купленные материалы осуществляются через систему WebMoney (www.webmoney.ru), при этом биржа берет определенный процент за каждую купленную/проданную статью.

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

предоставлять посетителю возможность быстро найти ту информацию, которая его интересует;

давать посетителю максимально полное представление о том, из чего состоит веб-ресурс;

что еще интересного и полезного можно найти на данном сайте.

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

Меню. Этот инструмент представляет собой перечень основных страниц веб-ресурса, и находится чаще всего на всех страницах сайта (реже — только на главной его странице).

Раскрывающийся список. Главное достоинство данного инструмента состоит в его компактности. Однако раскрывающийся список по наглядности во многом уступает меню.

Карта сайта. Отдельная страница, на которой представлена развернутая структура всего сайта. Более подробно о том, что представляет собой карта сайта, мы говорили ранее, в разделе «Что представляет собой современный веб-сайт?».

Back and Forward. Данный инструмент целесообразно использовать в случаях, когда предполагается последовательное изучение посетителями представленной на сайте информации. Обычно это выглядит примерно так: на странице идет текст, а под ним — кнопки или ссылки Вперед и Назад (они могут называться по разному: Next и Back, Далее и Возврат, и т.п., но суть от этого не меняется). После того как посетитель изучит информацию, содержащуюся на данной странице, он нажимает кнопку Далее и переходит на следующую страницу, где представлена очередная порция материала. Для возврата на одну из предыдущих страниц предназначена кнопка Возврат.

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

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

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

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

Если предполагается, что посетитель будет читать предложенную информацию с экрана — рекомендуется не делать страницы слишком большими, а подавать материал «порционно». А вот что касается материалов, находящихся в разделах «Версия для печати», то их дробить не стоит, а лучше подавать всю информацию сразу в полном объеме.

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

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

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

Понятие статической и динамической веб-страницы

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

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

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

ПРИМЕЧАНИЕ

Адрес страницы, написанной на языке HTML, будет заканчиваться символами html, следующими после точки.

Принципиальное отличие динамической веб-страницы от статической состоит в том, что ее содержимое является не постоянным, а может изменяться. Оно формируется в зависимости от пожеланий пользователя, а точнее — на основании запросов, созданных посетителям и отправленным на веб-сервер. Как мы уже отмечали ранее, наиболее типичный пример динамической веб-страницы — это страница с результатами поиска, выданными поисковой системой (тем же www.google.ru) на основании отправленного пользователем поискового запроса. Еще один характерный пример использования веб-страниц — интернет-магазины: посетитель с помощью опций указывает, какой товар и с какими свойствами его интересует, отправляет запрос (для этого обычно предназначена соответствующая кнопка — Отправить, Выбрать, и т.п.), и через пару секунд получает на экран перечень товаров, соответствующих установленным критериям. Помимо этого, динамические страницы имеют широчайшее применение и в других сайтах, самого разного назначения и направленности.

Динамические страницы также могут создаваться с помощью языка HTML, однако более подходящим для этого является другой язык — РНР (в первую очередь благодаря своей более широкой функциональности). Соответственно, формат файла страницы будет уже не HTML, а РНР, а ее адрес в Интернете будет заканчиваться символами php, следующими после точки.

Как выбрать хостинг

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

Большинство веб-разработчиков полагает, что хороший хостинг должен иметь следующие качества:

быстрота;

надежность;

широкий ассортимент технических возможностей;

невысокая стоимость;

наличие эффективной и доступной службы технической поддержки;

предоставление достаточного количества места для размещения сайта.

Рассмотрим подробнее каждое из перечисленных качеств.

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

Конец ознакомительного фрагмента.

Оглавление

* * *

Приведённый ознакомительный фрагмент книги Веб-Самоделкин. Как самому создать сайт быстро и профессионально предоставлен нашим книжным партнёром — компанией ЛитРес.

Купить и скачать полную версию книги в форматах FB2, ePub, MOBI, TXT, HTML, RTF и других

Смотрите также

а б в г д е ё ж з и й к л м н о п р с т у ф х ц ч ш щ э ю я