Основные этапы разработки сайта. Типовые виды сайтов. Файловая структура сайта

1. Основные этапы разработки сайта

Можно выделить шесть основных этапов разработки сайта:

1) составление технического задания;

2) подготовка текстового содержания и иллюстраций;

3) разработка дизайна сайта;

4) кодирование и программирование;

5) тестирование сайта;

6) публикация и раскрутка сайта.

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

2. Типовые виды сайтов

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

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

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

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

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

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

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

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

3. Файловая структура сайта

Если сайт состоит из нескольких страниц, то не имеет смыс­ла тщательно продумывать, как называть и размещать файлы на сайте. Но чем больше сайт, тем сложнее управлять расположен­ной на нем информацией. Бывает так, что уже никто не помнит, что находится на страничке с названием page54a.htm и где нахо­дятся иллюстрации к прошлогодней презентации. Можно избе­жать подобной ситуации, если сделать ряд подготовительных шагов. Самый простой способ разделения файлов — разделение по выполняемым функциям. В простом статическом сайте мож­но выделить несколько групп файлов:

• странички сайта, файлы с расширением HTML;

• таблицы стилей, файлы с расширением CSS;

• клиентские скрипты, обычно написанные на JavaScript, файлы с расширением JS;

• графические файлы, используемые в дизайне сайта, файлы с расширением JPG, GIF, PNG, SWF;

• файлы для скачивания посетителями, файлы с расширени­ем ZIP, RAR, MP3, PDF< DOC и т. п.

Не стоит все эти файлы размещать в одном каталоге. Лучше всего сделать для каждой группы файлов свой каталог, тогда сра­зу станет ясно, где и что лежит. Ниже приведен один из возмож­ных примеров файловой структуры сайта.

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

Для динамических сайтов обычно добавляются также сле­дующие каталоги:

Два типа графики на web-сайтах. Существует два типа гра­фики, которая используется на сайте. Первый тип — это графи­ка, используемая в дизайне сайта: логотип, графические элемен­ты оформления, разнообразные кнопки и пиктограммы. Данный тип графики характерен тем, что он появляется почти на всех страничках сайта, и при смене дизайна сайта автоматически ме­няется и вся «оформительская» графика. Поэтому логично такую графику хранить в одном месте.

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

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

/articles/ — в этой папке будут храниться статьи

/images/ — а в этой — иллюстрации к статьям

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

Имена файлов. Логично и понятно названный файл позво­лит сэкономить время при обновлении сайта. Кроме того, при передаче поддержки сайта другому человеку будет гораздо легче объяснить, что и где находится. Не рекомендуется называть файлы безликими именами (pagel.htm, 123.htm и т. п.). Необ­ходимо, чтобы при взгляде на список файлов сразу было по­нятно, что в них находится. Другими словами, называть файлы следует, исходя из смысла странички. Если страничка содержит общую информацию о компании, то ее можно назвать, к при­меру, about.html, а страничку с контактной информацией — contacts.html.

В некоторых случаях для группы файлов могут использовать­ся похожие имена, состоящие из базового имени и цифры. На­пример, article_l.htm, article_2.htm, article_3.htm и т. д. Заметьте, что в качестве разделителя базового имени и цифры использует­ся знак подчеркивания (пробелы в именах файлов запрещены).

Русский или английский? При формировании имен файлов можно взять за основу либо русский язык, либо английский. Так как использовать русские символы в именах файлов нельзя, то при использовании русского в качестве базового языка необ­ходимо писать имена файлов в транслитерации (русские слова латинскими буквами). В этом случае страничку с описаниями услуг можно назвать, например, uslugi.htm, а страничку с инфор­мацией об истории фирмы — istoriya.htm.

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

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

Ограничения на имена файлов со стороны операционных сис­тем. Кроме логических и интуитивных аспектов именования файлов, существуют также и ограничения, связанные с операци­онной системой. Хотя большинство пользователей работают за компьютерами, оснащенными Windows, на серверах в Интернете стоит более надежный UNIX (точнее, одна из ее версий, как правило, FreeBSD и Linux). Правила наименования файлов в Windows и UNIX разные. Основное различие, которое и вызыва­ет большинство проблем, — регистр символов в именах файлов. Windows не различает регистр в именах файлов, т. е. файлы с на­званиями index.html и Index.HTM1 для нее будут неразличимы.

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

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

Вторая большая проблема в именах файлов — это русские буквы. Если файл называется «галерея.htm» и он сохранен в ко­дировке Windows 1251, то при обращении к страничке браузе­ром в кодировке koi-8r ссылка на такой файл в тексте странич­ки автоматически будет перекодирована в «ЗБМЕТЕСЛит» («галерея.htm» в кодировке koi-8r). Файл с таким именем на сайте отсутствует, и, следовательно, найден не будет — посети­тель получит страничку с сообщением о 404-й ошибке (файл не найден).

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

• в именах файлов можно использовать только латинские буквы [a—z], цифры [0—9], знак подчеркивания «_» и де­фис «-»), а также точку «•» как разделитель собственно имени файла и его расширения;

• в именах файлов должны использоваться только символы нижнего регистра;

• имя файла должно начинаться с буквы;

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

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