WEB-mastering

Web-mastering

Форма и содержание, первый шаг

Распределение обязанностей.

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

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

Следующий специалист, это web-мастер проекта, как правило это опытный программист, знающий HTML, CSS, Java Script (обязательно), а также PHP, Perl, Java, базы данных, и т.д. (желательно). Его основная задача - кодинг, воплощение и техническая реализация идей всех остальных членов команды, для своей части работы он использует не менее широкий арсенал программ и утилит, для написания, редактирования, проверки правильности кода и его отладки.

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

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

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

Внешний вид и контент.

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

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

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

С чего начать.

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

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

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

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

Полезные ссылки.

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

http://www.cooltext.net

http://www.zyris.com/zygraphics

http://www.angelfire.com/me/physc0/enterlogo.html

А тут Вы найдете неплохие коллекции фоновых изображений для своего сайта

http://textures.boom.ru

http://web.zero.ru/fon/background.shtml

По этим ссылкам Вы найдете много различных картинок

http://www.caravan.ru/~sokolov/

http://gifcollection.boom.ru

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

Проблема использования чистого HTML.

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

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

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

Периодически компании производители подают заявку с описанием синтаксиса нового элемента на рассмотрение и принятие его в число стандартных элементов. В то же самое время Консорциум W3C занял выжидательную позицию и не слишком торопится с рассмотрением и принятием новых тэгов. На практике происходит следующее: расширения живут собственной жизнью, одни из них не приживаются и естественным образом покидают список претендентов на стандартизацию (<BGSOUND>, <IMG dynsrc="...">....) , вторые наоборот становятся очень популярными (<FRAME>, <HR size="...">, <FONT size="...">, <IMG align="...">....) и в последствии становятся стандартными, третьи же, уже однажды внесенные в стандартный - чистый HTML, становятся нежелательными (<U>, <S>, <BASEFONT>, <STRIKE>, <ISINDEX>, <DIR>, <CENTER>....) т.к. на смену им приняты более эффективные.

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

Создатели страниц, тем не менее, стараются выходить из сложившегося положения путем написания нескольких вариантов сайтов с предоставлением права выбора посетителю, или путем предоставления альтернативного содержимого. Поэтому в правилах хорошего тона - при внедрении в код страницы нестандартного элемента или стандартного, но сравнительно молодого, не поддерживаемого старыми браузерами - стало написание альтернативного содержимого в специальных дескрипторах (<NOSCRIPT>, <NOFRAMES>....)

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

Если Вы, все же с опаской смотрите на расширения и не собираетесь применять их на собственном сайте, то у Вас могут возникнуть сложности с определением, является ли стандартным тот или иной, известный Вам элемент. В этом случае Вам не остается ничего другого, как только обратиться на сайт самого Консорциума W3C http://www.w3.org, где имеется описание официальной спецификации, там описан самый, что ни есть чистый HTML.

Там же на их сервере, по адресам: http://validator.w3.org/ для HTML и http://jigsaw.w3.org/css-validator/ для CSS,
Вы сможете в режиме on-line проверить специальной программой Validator правильность кода любой из страниц Вашего сайта с точки зрения Консорциума W3C, для этого необходимо указать ее URL. Справедливости ради надо сказать, что Internet Explorer, например, довольно стойко переносит Ваши многочисленные ошибки, и будет стараться воспроизводить код правильно, чего, увы, не скажешь о браузерах от Netscape. Тем не менее проверить Ваш код программой Validator не будет лишним, все равно, иногда это бывает полезно даже для того, чтобы, например, правильно определить <!DOCTYPE> для Вашего документа.

Учет особенностей браузеров

Проблема браузеронезависимости.

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

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

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

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

Сравнительный анализ

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

Популярность ОС среди пользователей сети
операционная система	популярность ОС в %
Windows'98	46.66%
Windows'2000	21.52%
Windows'XP	24.31%
Windows'NT	3.36%
Windows'Me	2.65%
MacOS,Unix,Прочие	1.5%

Вывод напрашивается однозначный - абсолютное большинство пользователей сети, в силу ряда причин работают на платформе Windows, их общая численность составляет 98,5 %, против остальных 1,5 %. Такое положение, если не удивляет, то, по крайней мере, значительно упрощает работу.

Как и с платформами, с браузерами дело обстоит не иначе, Internet Explorer от Windows, хотя довольно недавно обозначился как лидер на рынке браузеров, уже достиг такого же абсолютного превосходства.

Популярность браузеров
браузер	популярность	платформы
Internet Explorer v.6.0	43.68%	Win, Mac
Internet Explorer v.5.5	16.22%	Win, Mac
Internet Explorer v.5.0	31.77%	Win, Mac
Internet Explorer v.4.xx	1.89%	Win, Mac, Unix
Netscape Navigator, Mozilla, Opera, Прочие	6.44%	Win, Mac, Unix

Так же, тенденция налицо и превосходство Internet Explorer можно называть подавляющим, тому есть масса причин, как, например то, что в связи с предпринятыми мерами отдела маркетинга фирмы Microsoft, их браузер бесплатно входит в комплектацию оперативной системы как составная часть Windows '98.

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

Поддержка браузерами под Win интернет-технологий
браузер	frames	i-frames	css	java	java script	dhtml
Internet Explorer v.5.5	+	+	%	+	+	+
Internet Explorer v.5.0	+	+	%	+	%	+
Internet Explorer v.4.0	+	+	%	+	%	+
Internet Explorer v.3.0	+	+	%	+	%	-
Netscape Navigator v.6.0	+	+	%	+	+	+

здесь обозначения символизируют:
+ поддерживает
- неподдерживает
% поддерживает частично
Печально, что неважно дела обстоят с поддержкой CSS, таким удобным и полезным инструментом форматирования страниц, вернее его версии CSS2, и как следствие неполной возможностью использования DHTML.

Выводы

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

Хотя в свое время браузер от Netscape и был наиболее предпочитаемым среди пользователей, а вклад компании в развитие языка HTML трудно переоценить, реалии рынка браузеров таковы, что Internet Explorer является самым популярным на сегодняшний день (около 95% ! пользователей). И эта популярность пришла к нему не только потому, что он распространяется бесплатно, а еще и потому, что он действительно удобнее в работе. И самое главное - Internet Explorer давно уже избран как стандарт многими разработчиками программ и дополнительных утилит, что обеспечивает их полную совместимость и интеграцию.

Главными недостатками Internet Explorer являются недостатки свойственные всем продуктам от Microsoft - это проблемы при инсталляции, а также стремление расходовать максимальное количество оперативной памяти компьютера и как следствие потеря в скорости. На фоне этого надо отметить, что Netscape несколько быстрее в работе со скриптами, менее требователен к ресурсам компьютера и не исключено, что следующие его версии будут гораздо удобнее, а интерфейс будет более продуманным. Однако главным его недостатком по-прежнему остается то, что он является платным. При всех его многочисленных недочетах это только усугубляет невыгодность его положения на фоне остальных браузеров, после выхода очередной его версии v 6.01 появились слухи о том, что это последняя его версия.

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

Организация страниц в узлы, навигация

При создании достаточно больших документов надо помнить о том, что не все из посетителей имеют высокоскоростной доступ в Интернет. У большинства пользователей модемный коннект, где скорость передачи данных 2-3 kB в секунду не считается плохой. Сосчитайте суммарный "вес" Вашего документа и всех размещенных в нем изображении, а также подгружаемых звуков и оцените, как долго он будет грузиться. Большинство потенциальных посетителей прервут загрузку страницы из соображений экономии средств, если она будет грузиться дольше 30-40 секунд.

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

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

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

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

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

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

Тестирование

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

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

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

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

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

Теоретически большинство людей работают с разрешением 800x600, их по некоторым оценкам-53%, хотя практически во всех интернет-кафе, фирмах, и пр. экзотикой считаются мониторы с диагональю 19" и более. Диагональ 17" - теперь уже стандарт, а пользователи на таких мониторах используют разрешение не ниже чем 1024x768, их примерно 38%, а чаще стремятся выжать максимум.

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

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

Обратная связь.

В процессе ознакомления с материалами Вашего сайта у посетителей может возникнуть к Вам ряд вопросов по существу освещаемых тем, предложений и просто пожеланий. Это может быть кто угодно - Ваш оппонент предлагающий развернуть дискуссию, клиент Вашей фирмы, который так и не смог разобраться с механизмом оплаты товара или Web-мастер сайта с подобным контентом изъявил желание обменяться с Вами баннерами. Разместите на своем сайте ссылку на адрес электронной почты для обратной связи.
Синтаксис: <A href="mailto:webmaster@domen.ru?Subject=E-mail to Web-master"> E-mail to Web-master. </A >.
В этом случае при клике на ссылку у посетителя запустится программа почтовый клиент, например: Outlook Express в которой автоматически подставится указанный Вами адрес.

Пример: E-mail to Web-master.

Или при помощи картинки:

Синтаксис: <A href="mailto:webmaster@domen.ru?Subject=E-mail to Web-master"> <img src="mail.gif"> </A >

Пример :

А так-же при помощи формы :

Синтаксис:

<form action="mailto:имя@домен.ru?subject="Comment from Home Page" method="post" enctype="text/plain">
Ваше мнение о cайте:<br>
<SELECT name="мнение">
<OPTION>хорошее </OPTION>
<OPTION>неплохое</OPTION>
<OPTION>так себе </OPTION>
<OPTION>отстой</OPTION>
<OPTION>никакое </OPTION>
</SELECT>
<br> Ваш личный комментарий: <br>
<TEXTAREA type="text" NAME="комментарий" ROWS=5 COLS=50></TEXTAREA> <br>
Ваше имя: <br>
<INPUT type="text" NAME="имя" SIZE="57"> <br>
Электронная почта: <br>
<INPUT type="text" name="e-mail" size="52" maxlength="360"> <br>
<INPUT type="reset" VALUE=Сброс >
<INPUT type=SUBMIT VALUE=Послать>
</FORM>

Пример:

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

	http://chat.ru		http://coolmail.to
	http://www.e-mail.dux.ru		http://www.alloymail.com
	http://www.az.ru		http://yandex.narod.ru
	http://www.forfree.at		http://www.mail.ru
	http://www.crosswinds.net		http://www.gnwmail.com
	http://www.softhome.net		http://www.rocketmail.com
	http://www.bigfoot.com		http://www.mailcity.com
	http://www.hotmail.com		http://mail.yahoo.com
	http://www.iname.com		http://www.geocities.com

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

http://top.one.ru/mailhelp.html

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

Чтобы обзавестись гостевой книгой - сходите сюда :

	http://www.guestbook.ru		http://www.guestworld.com
	http://www.bravnet.com		http://www.tealnet.com
	http://www.glacierweb.com		http://www.dreambook.com
	http://www.guestbook.de		http://www.webpromote.net/guestbooks
	http://www.freeguestbooks.com		http://www.guestpage.com

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

http://www.webclub.ru/free/sendform

http://sas.vov.ru/form.phtml

Обновление содержимого страниц.

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

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

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

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

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

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

Оптимизация графики используемой на сайте

Форматы графики используемой в сети

Взвесив все ЗА и ПРОТИВ использования на страницах Вашего Web-узла графических изображений Вы, скорее всего, решитесь на её использование. Для работы с изображениями в WWW используют два основных формата: JPEG ( Joint Photographic Experts Group - объединенная группа экспертов фотографии ) и GIF, ( Graphical Interchange Format - графический обменный формат ) реже используют специально созданный формат PNG ( Portable Network Graphics - переносимая сетевая графика )

Формат GIF позволяет создавать изображения не более чем с 256 цветами и использует алгоритм сжатия без потерь качества исходного изображения, кроме того он позволяет конструировать анимационные графические файлы. Этот формат в основном используют для создания баннеров - анимационных картинок или картинок, на которых присутствует текст. Анимация создается по простому принципу: сначала создаются несколько картинок-кадров, задается их очередность, частота обновления кадров в секундах и количество повторений, а после они связываются в один файл с расширением .gif, причем размер такого файла часто меньше суммы размеров, входящих в него изображений. Такая экономия достигается при оптимизации анимации, когда одинаковые во всех изображениях участки запоминаются как один статический.

Например:

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

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

Инструментарий.

Для работы с GIF-изображениями подойдет программа Gif Construction Set с которой можно познакомиться на сайте компании

http://www.mindworkshop.com

или Embelish, с которой можно познакомиться на сайте компании

http://www.dadaware.com

или Ulead GIF Animator с которой можно познакомиться на сайте компании

http://www.ulead.com

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

	- до оптимизации		- после оптимизации
1.666 kB		595 B

Для работы с JPG-изображениями подойдет программа Ulead Smart Saver Pro с которой можно познакомиться на сайте компании

http://www.ulead.com

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

http://www.adobe.com

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

Выбор места для размещения Web-страниц

Хостинг.

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

	http://narod.ru		http://www.az.ru
	http://chat.ru		http://www.halyava.ru
	http://www.newmail.ru		http://i-connect.ru
	http://www.agava.ru		http://www.lgg.ru
	http://www.fortunecity.com		http://www.netcity.ru
	http://www.freeserwers.com		http://www.hotmail.ru
	http://www.geocities.com		http://www.ussr.to
	http://www.spree.com		http://www.viaduk.net
	http://www.tripod.com		http://home.vibor.ru
	http://www.xoom.com		http://windoms.sitek.net
	http://www.bizland.com		http://www.intergrad.com
	http://www.fsn.net		http://hosting.agava.ru
	http://www.crosswinds.net		http://www.dp.ru
	http://www.virtualave.net		http://www.artnet.ru/generator
	http://www.az.ru		http://www.zk.ru
	http://www.tam.ru		http://www.sunday.ru
	http://www.shortway.to		http://home.c99.ru
	http://webservis.ru

На этом сервере вы получите возможность устанавливать свои собственные скрипты и доступ к ним по ftp

http://www.44.ru/cgi-bin/start.pl

На что надо обратить внимание.

Однако для того чтобы выбрать окончательно необходимо обратить внимание на следующие пункты.

· Отсутствие дискриминации по контенту. Некоторые сервера ставят условия, касающиеся содержимого Вашего сайта.

· Надежность Web-сервера. Посетите их Web-узел в пиковые часы и убедитесь, что проблем с доступом не возникает.

· Отсутствие скрытых завуалированных видов оплаты места ввиде всевозможных доплат за различные услуги и рекламы.

· Техническая поддержка. Предоставят ли Вам возможность общения с администратором сервера, есть ли возможность доступа по протоколу FTP ( File Transfer Protocol ) , и т.д.

· Объем выделяемого Вам пространства. Обычно это 5-10 мегабайт .

· Дополнительные возможности. Не будет лишним, если сервер предложит Вам: бесплатную почту, счетчик посещений, гостевую книгу, чат, различные CGI-скрипты и т.д.

· Какое программное обеспечение установлено на сервере. Например UNIX-сервера чувствительны к регистру букв в названиях файлов, т.е. если у Вас в исходном коде будет стоять ссылка на файл background.gif, а файл будет назван background.Gif или Background.gif, то он не будет визуализирован. Однако у таких серверов более высокая степень защищенности от взломов.

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

Выбор доменного имени и имени сайта

Доменная система имен.

В сети каждый компьютер имеет свой уникальный адрес, который может быть представлен как последовательностью четырех целых чисел от 0 до 255, разделенных между собой точкой, так и именем. В Интернете используется многоуровневая так называемая доменная система имен или URL - Universal Resource Locator . Каждый уровень называется доменом. Домены разделяются точками. Чем выше доменный уровень, тем правее он стоит в имени. Обычно домен верхнего уровня обозначает страну, где расположен сервер т.е. ru-Россия, uа-Украина, de-Германия, fr-Франция, а кроме того различные организации com-коммерческие, net-сетевые, org-прочие.
Синтаксис : http :// www . отдел . компания . ru

Например, если в вашей Super company есть отдел маркетинга, а сайт компании лежит на сервере провайдера Best server, то URL отдела маркетинга будет выглядеть так: http :// www . marketing . super_company . best_server . ru где отдел маркетинга будет иметь домен четвертого уровня, Ваша компания - домен третьего уровня, Ваш провайдер - домен второго уровня, соответственно.

Регистрация доменного имени.

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

Например :

http://www.internic.net

Или :

http://www.ripn.net/nic

- для Российской зоны ru.

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

Альтернативой регистрации собственного доменного имени может явиться использование хостинга на серверах с хорошо запоминающимся доменом второго уровня. При удачном сочетании с именем Вашего сайта, это в итоге может принести гораздо больше пользы, чем от регистрации собственного домена. Например, очень удачным оказалось название сайта фэн-клуба группы DDT на сервере
http://www.fanat.ru
информативное, легко запоминающееся имя:
http://ddt.fanat.ru
все ясно из названия, врядли ему можно подыскать более удачную альтернативу.

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

Здесь вместо URL укажите настоящий URL Вашего сайта.

Создание документа с помощью SSI

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

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

Аналогичного эффекта можно достичь, используя Java Script или CGI-скрипты, однако простота и удобство использования SSI способствуют широкому распространению этой технологии. Это работает следующим образом: при получении запроса на документ, содержащий SSI-директивы, сервер обрабатывает документ, выполняет все директивы, а получившийся документ отсылает клиенту. Для того, чтобы сервер знал о возможном нахождении в коде документа SSI-директив, необходимо его предварительно настроить - т.е. указать те расширения файлов, в которых они могут быть обработаны.

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

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

Рассмотрим подробнее процесс на примере:
Для начала создадим файл file1.shtml следующего содержания:

<html>
<head>
<title> FILE1 </title>
</head>

<h1>Тестовая страница 1</h1>
<p>Текст, набранный и сохраненный в файле file1.shtml </p>

</body>
</html>

После чего создадим файлы file2.html и file3.html следующего содержания:
Файл file2.html

<body>
<h2>Тестовая страница 2</h2>
<p>Текст, набранный и сохраненный в файле file2.html </p>

Файл file3.html

<h3>Тестовая страница 3</h3>
<p>Текст, набранный и сохраненный в файле file3.html </p>

Затем все три файла разместим на сервере и получим:
если при этом посетитель просмотрит исходник страницы, то он не увидит файл file1.shtml в том виде, в каком тот лежит на сервере, а прочтет исходник, сгенерированный сервером, согласно директив, в него включенных. Интересной особенностью тут является то, что включаемые отрывки кода могут быть прерваны в любом месте, например, это может быть незаконченная таблица, или тэг вставляющий ссылку. В нашем случае начальный тэг <body> находится в файле file2.html, а конечный </body> - в файле file1.shtml.

Создание документа с помощью SSI

Рассмотрим подробнее процесс на примере:
Для начала создадим файл file1.shtml следующего содержания:

После чего создадим файлы file2.html и file3.html следующего содержания:
Файл file2.html

<body>
<h2>Тестовая страница 2</h2>
<p>Текст, набранный и сохраненный в файле file2.html </p>

Файл file3.html

<h3>Тестовая страница 3</h3>
<p>Текст, набранный и сохраненный в файле file3.html </p>