Меню
» Шаблоны
» Скрипты
» Иконки
» Анимация
» Фоны
» Учебник HTML
» Учебник CSS
» Учебник JAVASCRIPT
» Создание сайта
» Оптимизация сайта
» Размещение сайта
» Раскрутка сайта

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

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

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

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

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

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

Для быстрого создания собственного сайта с красивым дизайном и любой сложности, ознакомтесь с популярными конструкторами сайтов на сайте site-builders.ru.

Основные этапы создания веб-сайта

  1. Продумайте структуру узла и решите, по крайней мере, какая информация должна находиться на домашней странице и на других важных страницах. Обязательно определите, для кого в первую очередь предназначен узел, какова ваша главная цель и как часто вы собираетесь обновлять материал.
  2. С помощью текстового редактора или редактора веб-страниц создайте страницы для своего узла (или хотя бы некоторые из них) и сохраните в виде HTML-файлов. Используя графический редактор, создайте иллюстрации.
  3. Просмотрите готовые HTML-файлы посредством браузера. Проверьте, грамотно ли набран текст, как функционируют ссылки, и обратите внимание на внешний вид графического материала. Повторяйте указанные в пунктах 2, 3 действия до тех пор, пока узел не станет вполне приемлемым для публикации.
  4. Опубликуйте свой веб-узел, разместив все его файлы (НТМL-файлы и файлы других типов) на веб-сервере, как описано в разделе "Рамещение сайтов".
  5. С помощью браузера просмотрите веб-страницы, хранящиеся на веб-сервере. Если вы рассчитываете на большую посещаемость своего веб-узла, просмотрите его страницы с применением последних версий наиболее популярных браузеров, поскольку браузеры разных производителей форматируют страницы немного по-разному. Кроме того, просмотрите страницы с компьютера, отличного от того, где они были созданы, — возможно, вы заметите случайно оставленные ссылки на файлы, находящиеся на жестком диске вашего компьютера.
  6. Сообщите всем о своем узле, дождитесь откликов, выберите наиболее удачные из предлагаемых рекомендаций и пожеланий и повторите описанные выше этапы с учетом новых идей.

Не знаете, как создать сайт? Конструктор сайтов uCoz то, что вам нужно!

Планирование структуры веб-сайта

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

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

Цель создания веб-сайта

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

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

Определение состава посетителей

Вне зависимости от того, сайт какого типа проектируется, конечной целью его организации является привлечение внимания максимального числа посетителей.

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

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

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

Средства навигации по веб-сайту

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

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

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

Общие рекомендации по разработке веб-сайта

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

  • Обеспечьте гибкую структуру узла. Многие узлы имеют иерархическую структуру: их домашняя страница содержит общую информацию и ссылки на страницы с более полными и конкретными сведениями. Это действительно превосходный способ организации данных, однако старайтесь ограничить число переходов, которые нужно выполнить, чтобы найти нужную информацию. Посетители обычно готовы пройти по ссылкам три или четыре уровня иерархии узла. Причем на каждом следующем уровне информация должна становиться все более привлекательной - лишь при этом условии интерес Посетителей будет поддерживаться на должном уровне. Не заставляйте их переходить на другой уровень только потому, что этого требует разработанная вами структура.
  • Используйте навигационные ссылки. Если вы хотите, чтобы посетители, перемещаясь по узлу, просматривали страницы в определенной последовательности, создайте ссылку Вперед, которая будет указывать на следующую страницу (при этом не забудьте о ссылке Назад). Удобно также иметь ссылку ведущую на домашнюю страницу. Обычно навигационные ссылки привязывают к кнопкам или значкам. И хотя большинство браузеров хорошо отображает графику, все же не лишним будет дополнить значки или кнопки текстовыми ссылками, например в верхней части веб-страницы использовать графические кнопки, а в нижней — текстовые ссылки.
  • Применяйте фреймы. Если вы решили предоставить посетителям возможность просматривать страницы в любом выбранном ими порядке, продумайте механизм использования фреймов, в которых постоянно будут отображаться ссылки на страницы. Обычно "содержание узла" представлено во фрейме, находящемся в левой части каждой страницы. Хотя посетители и переходят от страницы к странице, фрейм с содержанием остается на экране. После того как посетитель ознакомится с одной страницей, он сможет выбрать другую ссылку.

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

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

Выбор средств разработки веб-сайта

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

Веб-страницы могут включать такие компоненты:

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

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

Для создания веб-страниц вам понадобятся такие инструментальные средства:

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

Создание веб-сайта

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

Файлы веб-страниц

Веб-страница хранится в файле формата HTML с расширением htm или html. Такой файл обычно содержит отображаемый текст и теги HTML, которые задают Форматирование страницы, а также размещение на ней рисунков и гиперссылок.

Главная страница веб-узла обычно имеет имя index.html, поскольку это — применяемое по умолчанию имя файла, которое ищут браузеры. Например, если пользователь введет в браузере адрес http://www.leonardo-studio.narod.ru, то он увидит страницу данного веб-сайта, хранящуюся в файле index.htm.

Каждый рисунок, который отображается на веб-странице или служит ее фоном, хранится в отдельном файле. Обычно это файлы с расширением gif, jpg, jpeg, png, bmp. Местоположение изображения на странице задается с помощью специального тега HTML.

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

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

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

Среди популярных профессиональных веб-редакторов можно отметить Microsoft Front Page. Он имеет достаточно широкую поддержку, обладает наглядным интерфейсом, благодаря чему научиться работать с ним совсем не сложно. Microsoft Front Page содержит специальные средства, функционирующие на серверах, которые их поддерживают, а также инструменты для редактирования простых изображений. Он поставляется с перечнем тем и шаблонов, которые могут быть применены на создаваемых веб-узлах. Важной особенностью редактора является его интеграция с Microsoft Office. К недостаткам Microsoft Front Page следует отнести следующие. Нередко созданный с его помощью код HTML вызывает проблемы при взаимодействии с браузерами, отличными от Internet Explorer. Редактор не всегда может работать с большими корпоративными узлами, часто не принимает изменения, вносимые в код вручную.

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

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

Динамические веб-страницы

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

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

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

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

Для создания серверных сценариев используются следующие языки и технологии.

  • Perl и CGI. Язык Perl является самым старым и на текущий момент наиболее установившимся из всех известных языков создания сценариев. Его трудно изучить, но он обладает возможностями по обработке текста, не имеющими аналогов в других языках. CGI (Common Gateway Interface - общий шлюзовой интерфейс) представляет собой технологию, которая используется в веб-страницах для вызова сценариев языка Perl.
  • Active Server Page. Технология компании Microsoft, интегрированная с Visual Basic и довольно простая в изучении.
  • PHP. Бесплатная программа, освоить которую сравнительно легко. Она была написана специально для создания динамических веб-страниц.
© Leonardo-studio 2006
Hosted by uCoz