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

 

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

 

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

 

Люди действительно используют Lynx, поэтому не стоит удивляться, если клиент закажет разработку сайта для Lynx. Этот браузер также важен для инвалидов по зрению: они используют Lynx вместе с речевыми устройствами.

 

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

 

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

 

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

 

1.2 Язык разметки гипертекстовых  страниц HTML

 

Язык разметки гипертекстовых страниц (HTML - Hypertext Markup Language) представляет собой язык, разработанный специально для создания Web-документов. Он определяет синтаксис и размещение специальных инструкций (тегов), которые не выводятся на экран, но указывают браузеру, как отображать содержимое документа. Он также используется для создания ссылок на другие документы, локальные или сетевые, например, находящиеся в сети Интернет.

 

Стандарт HTML и другие стандарты  для Web разработаны под руководством консорциума W3C (World Wide Web Consortium). Стандарты, спецификации и проекты новых предложений можно найти на сайте http://www.3w.org/. В настоящее время действует спецификация HTML 4.0, поддержка которой со стороны основных браузеров постоянно растет.

 

На практике на стандарт HTML большое влияние оказывает наличие  тегов, предложенных и поддерживаемых наиболее известными браузерами, такими как Microsoft Internet Explorer и Netscape Navigator. Эти теги в данный момент могут, как входить, так и не входить в состав действующей спецификации HTML.

 

Информации о тегах HTML Compendium (краткое руководство по HTML) созданно Ron Woodall. Компендиум содержит список тегов и их атрибутов в алфавитном порядке, а также обновленную информацию о поддержке каждого из них со стороны браузеров.

 

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

 

Пользователям Windows определенно следует проверить HomeSite, мощный и недорогой редактор HTML компании Allaire Corporation. В нем имеются средства для выделения цветами синтаксических конструкций HTML, функция FTP, контроль синтаксиса и правописания, многофайловый поиск и замещение. Кроме того, он содержит специальные команды и шаблоны для создания более сложных элементов (фреймов, сценариев JavaScript и DHTML).

 

При работе на компьютерах  Macintosh обращают внимание на BBEdit, коммерческий HTML-редактор компании Bare Bones Software, Inc. Он действительно имеет вес среди Web-разработчиков для компьютеров Macintosh. В его состав входят удобные и быстрые HTML-инструменты, многофайловый поиск и замена, встроенная FTP-функция, поддержка 13 языков программирования, построитель таблиц, контроль синтаксиса HTML и еще множество функций.

 

Последние годы характеризуются  резким ростом рынка авторских инструментов. HTML-редакторы класса WYSIWYG (What You See Is What You Get - что видишь, то и получишь) имеют графические интерфейсы, которые делают написание HTML больше похожим на программу редактирования текстов или разметки страницы. Первоначальной целью этих программ было освобождение пользователей от тегов HTML, наподобие того, как программы разметки страниц защищают разработчика от набора команд языка PostScript. Сегодня их значимость возросла, так как они повышают эффективность и уровень автоматизации производства документов, обеспечивая в то же время доступ к исходному тексту HTML.

 

Наиболее популярными  в настоящее время WYSIWYG-редакторами  являются: Macromedia DreamWeaver, Golive CyberStudio (только для компьютеров Macintosh), Microsoft FrontPage, FileMaker Claris, Home Page, Adobe PageMill.

 

Документ HTML содержит текст (содержимое страницы) и встроенные теги - инструкциями о структуре, внешнем  виде и функции содержимого. Документ HTML разделяется на две основные части: заголовок - head и тело - body. Заголовок содержит такие сведения о документе, как его название и методическая информация, описывающая содержимое. В теле находится само содержим документа (то, что выводится в окне браузера).

 

Каждый тег состоит  из имени, за которым может следовать  список необязательных атрибутов, все  они находятся внутри угловых  скобок < >. Содержимое скобок никогда  не выводится в окне браузера. Имя  тега, как правило, представляет собой  аббревиатуру его функции, что облегчает  его запоминание. Атрибуты являются свойствами, которые расширяют или  уточняют функцию тега. Как правило, имя и атрибуты внутри тега не чувствительны  к регистру. Тег <BODY BGCOLOR=white> будет работать так же, как <body bgcolor=white>. Однако значения определенных атрибутов могут быть чувствительны к регистру. Это относится, в частности, к именам файлов и URL.

 

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

 

Конечный тег имеет  то же имя, что и начальный, но перед  ним стоит слеш (/). Его можно рассматривать как "выключатель" тега. Конечный тег никогда не содержит атрибутов.

 

В некоторых случаях конечный тег не обязателен, и браузер определяет конец тега из контекста. Чаще всего  опускают конечный тег <р> (абзац). Браузеры раньше поддерживали этот тег без соответствующего завершения, поэтому многие авторы Web привыкли использовать краткую форму. Это разрешено не всем тегам, и не все браузеры прощают их отсутствие. Поэтому, если есть сомнения, включите в текст закрывающий тег. Это особенно важно, когда в документе вы используете каскадные таблицы стилей.

 

Некоторые теги не имеет завершающих  тегов, потому что они используются для размещения отдельных (автономных) элементов на странице. Одним из них является тег изображения <img>, он просто помещает графику в поток страницы. Другие автономные теги - это разрыв строки (<br>), горизонтальная линия (<hr>) и теги, содержащие информацию о документе и не влияющие на содержимое, выводимое на экран, такие как <meta> и <base>.

 

Атрибуты добавляются  в тег для расширения или модификации его действий. К одному тегу можно добавить несколько атрибутов. Если атрибуты тега следуют после имени тега, они разделяются одним или несколькими пробелами. Порядок следования не важен. Большинство атрибутов имеют значения, которые следуют за знаком равенства (=), находящимся после имени атрибута. Длина значений ограничена 1024 символами. Значения могут быть чувствительны к регистру. Иногда значения должны находиться в кавычках (двойных или одинарных). Правила записи значения следующие:

 

- если значение представляет  собой одно слово или число  и состоит только из букв (a-z), цифр (0-9) и специальных символов (точка <.> или дефис <->), то можно поместить его после знака равенства без кавычек;

 

- если значение содержит  несколько слов, разделенных запятыми  или пробелами, или содержит  специальные символы, отличные  от точки или дефиса, тогда  его необходимо поместить в  кавычки. Например, URL требуют кавычек,  потому что они содержат символы "://". Также кавычки необходимы при задании значений цветов с использованием формата "#rrggbb".

 

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

 

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

 

Часто встречающейся ошибкой  является перекрытие тегов. Хотя часть  браузеров отображают содержимое, отмеченное таким образом, многие не разрешают  нарушать правило, поэтому важно  размешать теги правильно. Следующий  пример показывает неверное вложение тегов (заметьте, что тег <В> закрывается перед закрытием <I>):

 

The weather is <B><I>gorgeous</B></I>today - данная информация, игнорируемая браузерами.

 

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

 

- разрывы строк. Символы  конца строк в документе HTML игнорируются. Текст и элементы  будут переноситься до тех  пор, пока в потоке текста  документа не встретится тег  <р> или <br>. Разрывы строк выводятся, если текст обозначен как текст с заданным форматом (<рrе>);

 

- символы табуляции и  множественные пробелы. Когда  браузер встречает в документе  HTML символ табуляции и несколько  последовательных символов пробела,  он выводит только один пробел. Таким образом, если документ  содержит: "far, far away", браузер выведет "far, far away". Дополнительные пробелы можно добавить в текстовый поток, используя символ неразрывного пробела (Snbsp;). Кроме того, все пробелы выводятся, если текст является форматированным (находится в тегах <рrе>);

 

- множественные <р>-теги. Последовательность тегов <р>, не прерываемых текстом, всеми браузерами интерпретируется как избыточная. Содержимое будет выводиться так, как если бы был только один тег <р>. Большинство браузеров выведет несколько тегов <Br> в виде нескольких переходов на новую строку;

 

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

 

- текст в комментариях. Браузеры не выводят текст  между специальными элементами <! и ->, которые используются для  обозначения комментариев. После  символов начала комментария  и перед символами окончания  обязательно должен находиться  пробел. В сам комментарий можно  помещать практически все. Комментарии  нельзя вкладывать. В Microsoft Internet Explorer имеется фирменный тег, обозначающий комментарии <com-ment>...</comment>. Однако, он не поддерживается другими браузерами.

 

1.3 Обеспечение доступности  Web-страницы

 

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

 

Большинство дизайнеров рекомендуют  разрабатывать страницы в формате 640x480, чтобы при просмотре пользователям  не пришлось применять горизонтальную прокрутку. Горизонтальная прокрутка  всегда затрудняет восприятие, поэтому  дизайнеры традиционно ее отвергают.

 

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

 

Достойный уважения Web-дизайн включает разработку страниц, доступных для пользователей с ограниченными возможностями, в частности по зрению и слуху. Консорциум World Wide Web объявил об инициативе Web Accessibility Initiative (WAI), которая ставит целью сделать Web более доступным для всех пользователей. Однако успех данной инициативы зависит от участия в ней рядовых разработчиков, которые могут (или не могут) создать Web-сайты в соответствии с поставленными задачами.

 

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