[ПРЕДЫДУЩАЯ СТРАНИЦА][СЛЕДУЮЩАЯ СТРАНИЦА]
[ОГЛАВЛЕНИЕ][ПРЕДМЕТНЫЙ УКАЗАТЕЛЬ]
[КОНЕЦ СТРАНИЦЫ]

Разработка и опубликование документов в WWW

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

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

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

Перед тем, как взяться за разработку собственного документа для публикации в WWW, поговорите с администратором доступного вам сервера и узнайте, сможет ли он предоставить для вашего документа место на сервере, какие существуют ограничения по объему информации, и т. п. Если вы собираетесь установить сервер WWW на своем собственном компьютере, то обратитесь к Приложению (стр. 173).

Программное обеспечение, которые вам понадобится на первом, учебном, этапе, включает:

1. Какую-либо программу просмотра WWW-документов:

Рекомендации по выбору и установке программ просмотра приведены в Приложении (стр. 173). Если возможности вашего компьютера позволяют установить программу просмотра типа Netscape или Mosaic, но у вас нет выхода в Internet, то вы все же можете использовать эти программы просмотра для отладки ваших документов, загружая при этом файлы с локального компьютера без выхода в сеть.

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

2. Текстовый редактор, способный сохранять редактируемый документ в виде простого текстового файла.

Небольшие документы удобно редактировать при помощи редактора edit, поставляемого с операционной системой MS DOS, или Notepad, поставляемого с Microsoft Windows. Пользователи системы UNIX могут применить любимый ими vi или pico, а владельцы Apple Macintosh - BBEdit.

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

Что такое HTML?

Гипертекстовый WWW-документ, как уже отмечалось во введении, может содержать стилизованный и форматированный текст, графику и гиперсвязи с различными ресурсами Internet. Чтобы реализовать все эти возможности, был разработан специальный компьютерный язык, названный HyperText Markup Language (HTML), то есть, Язык Разметки Гипертекста. Справочное руководство по языку HTML вынесено в отдельный раздел (стр. 80 и далее), который рекомендуется тщательно изучать по мере необходимости, а в данном разделе мы бросим взгляд на HTML "с высоты птичьего полета".

Документ, написанный на HTML, представляет собой текстовый файл, содержащий собственно текст, несущий информацию читателю, и флаги разметки (markup tags). Флаги представляют собой определенные стандартом HTML последовательности символов, заключенные между знаками < и >. Согласно флагам разметки программа располагает текст на экране, включает в него рисунки, хранящиеся в отдельных графических файлах, и формирует гиперсвязи с другими документами или ресурсами Internet. Файл на языке HTML принимает "гипертекстовый облик" только тогда, когда он интерпретируется программой просмотра. Давайте для иллюстрации сказанного рассмотрим короткий пример.

Пример на HTML [50]

<HTML>
<HEAD><TITLE>A Simple HTML Document</TITLE>
</HEAD><BODY><H1>A Simple HTML Document</H1>
<P>A document to be published on the
Web can include the following features:
<UL>
<LI>Stylized text <LI>Inline images <IMG
SRC="face.gif" ALT="Face">
<LI>Links to other information
</UL>
<P>To assist the authors
in writing Web pages, many useful <A HREF=
"http://www.yahoo.com/Computers_and_Internet/">
utilities</A> have been designed.
</BODY>
</HTML>

[ПРИМЕР]

Как мы видим, этот нехитрый документ начинается с флага <HTML> [51], который сообщит программе просмотра, что данный файл - это документ на языке HTML. Заканчивается документ флагом </HTML>, который является закрывающим флагом, парным флагу <HTML>.

Далее - между флагами <HEAD> и </HEAD> - следует головная часть документа, внутри которой, между флагами <TITLE> и </TITLE>, находится название документа. Название выводится не вместе с самим документом, а в полосе заголовка окна программы просмотра (title bar), а также используется и для других целей (см. Справочное руководство по HTML, стр. 86).

Затем - между флагами <BODY> и </BODY> - помещается основная часть документа, так называемое тело.

Между флагами <H1> [52] и </H1> располагается заголовок (heading), который программа просмотра выводит крупным и/или жирным шрифтом.

Флаг <P> отмечает начало параграфа, [53] текст которого выводится с новой строки. Каждому параграфу предшествует пустая строка. Обратите внимание на то, что длина строки текста, выводимого программой просмотра, в общем случае, не совпадает с длиной строки в исходном HTML-файле и определяется размером окна программы просмотра и размером символов шрифта, который эта программа использует для вывода текста.

Флаги <UL> и </UL> отмечают начало и конец так называемого непронумерованного списка (unnumbered list), [54] каждому элементу которого предшествует флаг <LI> (list item). Каждый элемент списка программа просмотра выводит с новой строки и предваряет символом .

Флаг <IMG SRC="face.gif" ALT="Face"> (image source) включает в документ изображение, хранящееся в файле face.gif. О графических файлах далее будет рассказано более подробно. Атрибут ALT="Face" задает так называемый альтернативный текст (в данном случае, Face), который неграфические программы просмотра выводят на экран вместо соответствующего рисунка. Этот же текст будет виден, если в графической программе просмотра отключить автоматическую загрузку изображений (что обычно делается при медленной работе сети).

Флаг <A HREF= "http://www.yahoo.com/Computers_and_Internet/"> отмечает начало якоря гиперссылки (hyperreference anchor), или, как его называют чаще, якоря гиперсвязи (hyperlink anchor). Атрибут HREF="URL" указывает URL документа, на который делается ссылка. Синтаксис URL, рассмотренный выше (стр. 11), полностью совпадает с синтаксисом URL в гиперсвязях. Обратите внимание: URL гиперссылки заключен в двойные кавычки, - их пропуск является весьма частой ошибкой начинающих авторов. Якорь гиперссылки заканчивается флагом </A>. Как мы уже говорили, программа просмотра выделяет якорь из окружающего текста цветом и/или подчеркиванием и/или жирным шрифтом. [55]] Когда указатель мыши находится на якоре, то он обычно принимает вид указующего перста (в чем вы можете убедиться, подведя указатель к любому блихайшему якорю в тексте). Если в такой момент щелкнуть клавишей мыши, [56] то программа просмотра начнет загружать связанный с этим якорем документ.

Как мы надеемся, рассмотрев вышеприведенный пример, вы получили некоторое первоначальное представление о том, что такое HTML. Теперь настало самое время для "боевого крещения", то есть создания и, возможно, опубликования в World Wide Web своего первого документа.

Этапы большого пути, или Как стать автором в WWW

В этом разделе мы вместе с читателем пройдем весь тернистый путь создания и опубликования документа в WWW. При этом мы будем предполагать, что читатель использует наиболее распространенный в России IBM-совместимый компьютер с установленной на нем системой Microsoft Windows. Чтобы сконцентрироваться именно на технике, а не на частностях языка HTML, в качестве упражнения мы поработаем над тем самым документом, который уже рассмотрен нами в предыдущем разделе. Успешно сделав это, вы сможете приступить к созданию и публикации материалов, несущих полезную и интересную информацию. А пока . . .

Ввод и редактирование текста

Запустите простой текстовый редактор Notepad, поставляемый с операционной системой Microsoft Windows. Полностью перепечатайте приведенный на странице 50 пример на HTML и сохраните его в файле на жестком диске. Назовите файл ex1.html. Название файла не играет особой роли, однако, его расширение должно быть либо .html, либо .htm [57] поскольку программа просмотра по расширению определяет, что в данном файле находится HTML-документ. [58]

Не закрывая редактора Notepad, запустите программу просмотра, установленную на вашем компьютере, например, Netscape или I-View. Откройте только что созданный вами файл, используя меню File | Open FileNetscape) или File | OpenI-View). На экране в окне программы просмотра вы должны увидеть документ приблизительно так, как было показано выше, за исключением рисунка улыбающейся физиономии - ведь файл с этим рисунком еще не существует. [59] Если ваш компьютер имеет выход в Internet, то проверьте действие гиперсвязи: щелкните мышью на подчеркнутом слове utilities, - при этом программа просмотра должна загрузить документ с URL http://www.yahoo.com/Computers_and_Internet/.

Если гиперсвязь не сработала, то выясните, не допустили ли вы каких-либо опечаток в URL или во флагах <A ...> и </A>, охватывающих якорь гиперсвязи. [60] Самые типичные ошибки - это лишние пробелы, пропущенные двойные кавычки, символ > или /. Если вы напечатали все правильно, а ссылка все равно не действует - не отчаивайтесь. Существует вероятность того, что сервер www.yahoo.com в данный момент просто недоступен из-за проблем с сетью.

Если гиперсвязь сработала правильно, и программа просмотра загрузила связанный документ, вернитесь к своему документу, нажав экранную кнопку с надписью "Back".

Теперь вы можете вносить изменения в текст документа и наблюдать, как это отражается на его внешнем виде в окне программы просмотра. Для этого:

  1. Внесите изменения в исходный текст в окне редактора Notepad.
  2. Сохраните изменения, используя меню NotepadFile | Save
  3. Перезагрузите документ в программе просмотра, нажав экранную кнопку Reload или используя соответствующий пункт меню. Пронаблюдайте, как изменения в исходном тексте на HTML отражаются на его представлении в окне программы просмотра. При необходимости дальнейшего редактирования возвращайтесь к пункту 1.

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

Включение графики в HTML-документ

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

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

Кодирование графической информации

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

Растровый способ, с которым нам необходимо ознакомиться подробнее, заключается в том, что все изображение по вертикали и горизонтали разбивается на достаточно мелкие прямоугольники - так называемые элементы изображения, или пикселы (Picture Element = pixel или pel). В файле, содержащем растровую графику, хранится информация о цвете каждого пиксела данного изображения. Чем меньше прямоугольники на которые разбивается изображение, тем больше разрешение (resolution), то есть, тем более мелкие детали можно закодировать в таком графическом файле.

Размер (size) изображения, хранящегося в файле, задается в виде числа пикселов по горизонтали (width) и вертикали (height). Для ориентировки укажем, что на дисплее IBM PC с видеокартой VGA можно разместить растровый рисунок с максимальным размером 640х480, т.е., 640 пикселов по горизонтали и 480 по вертикали. Мониторы компьютеров с видеокартой SVGA обычно используют разрешение 800х600 и выше.

Кроме размера изображения, важной является информация о количестве цветов, закодированных в файле. Цвет каждого пиксела кодируется определенным числом бит (bit), то есть элементарных единиц информации, с которыми может иметь дело компьютер (см. также стр. 25). Каждый бит может принимать два значения - 1 и 0. В зависимости от того, сколько бит отведено для кодировки цвета каждого пиксела, возможно кодирование различного числа разных цветов. Нетрудно сообразить, что если для кодировки отвести лишь один бит, то каждый пиксел может быть либо белым (значение 1), либо черным (значение 0). Такое изображение называют монохромным (monochrome). Далее, если для кодировки отвести четыре бита, то можно закодировать 24=16 различных цветов, отвечающих комбинациям бит от 0000 до 1111. Если отвести 8 бит - то такой рисунок может содержать 28=256 различных цветов (от 00000000 до 11111111), 16 бит - 216=65536 различных цветов (так называемый High Color). И, наконец, если отвести 24 бита, то потенциально рисунок может содержать аж 224=16777216 различных цвета и оттенка - вполне достаточно даже для самого взыскательного художника! В последнем случае кодировка называется 24-bit True Color, или иногда Millions of Colors. Следует обратить внимание на слово потенциально: даже если в файле и отводится 24 бита на каждый пиксел, это еще не означает, что вы действительно сможете насладиться такой богатой палитрой - ведь технические возможности мониторов ограничены.

Форматы графических файлов

Для хранения растровой графической информации было разработано много различных форматов графических файлов, отличающихся способом хранения цвета пикселов рисунка, а также возможностями размещения в файле дополнительной информации. [61] Для нас наибольший интерес представляют следующие четыре формата: Windows Bitmap, поскольку он является "родным" для Microsoft Windows, GIF и JPEG, поскольку именно они наиболее широко применяются для хранения рисунков на WWW-серверах, а также новый формат PNG.

Windows Bitmap (BMP - "би-эм-пи") - это весьма простой формат, который предусматривает запись цвета пикселов, идущих последовательно слева направо и снизу вверх. [62] Файлы с графикой в этом формате обычно имеют расширение .bmp. Информация о цвете каждого пиксела хранится в виде последовательности бит; для каждого пиксела в файл помещается ровно столько бит, сколько используется для кодировки его цвета. В результате размеры таких графических файлов довольно велики. Например, файл, содержащий 256-цветный рисунок 500х400 будет иметь размер несколько больший, чем 500х400х8=1600000 бит =200000 байт=195 килобайт, [63] а если это рисунок с кодировкой цвета 24 битами, то размер составит почти 600 килобайт. [64] Формат этот интересен для нас только потому, что в нем умеют считывать и записывать графику большинство графических программ для Microsoft Windows, начиная с самой простейшей - Paintbrush - и заканчивая профессиональными типа Adobe PhotoShop. В результате, этот формат может быть использован для переноса графики из одной программы в другую.

Формат GIF ("джиф") был разработан специально для пересылки графических файлов по сетям CompuServe. Файлы в этом формате имеют расширение .gif. В среднем, размер файла с цветным изображением в формате GIF составляет от 10 до 50 процентов от размера файла с тем же изображением в формате BMP, описанном выше. Компактность записи достигается благодаря использованию специальных алгоритмов кодирования, позволяющих значительно уменьшить размер файла при полном сохранении всей графической информации. [65] Формат GIF идеально подходит для монохромных и 16-цветных рисунков, а также 256-цветных рисунков (а больше 256-ти цветов в этом формате и не сохранишь), не содержащих большого количества мелких деталей.

Формат PNG (Portable Network Graphics) с точки зрения пользователя похож на GIF, но обеспечивает примерно на 30% более плотное сжатие, более быстрое декодирование и сохранение параметров гамма-коррекции, обеспечивающих высокую верность воспроизведения цветовой гаммы при переходе с одной компьютерной платформы на другую. Кроме того, в нем можно сохранять изображения 24-bit True Color. Пока еще этот формат распространен не очень широко, но уже рекомендован консорциумом WWW в качестве стандарта и можно ожидать, что вскоре он в значительной степени заменит GIF. [66] В настоящее время единственной программой просмотра, способной отображать рисунки в формате PNG, является Arena. Версия 3.0 программы Netscape Navigator не способна расшифровать PNG-файлы и для их просмотра требует установки какой-либо внешней программы (external viewer), в качестве которой можно использовать одну из графических программ, обсуждаемых ниже (о программах-помощниках см. также стр. 23).

Формат JPEG ("джейпег") был предложен в конце 80-х Объединенной Группой Экспертов в Области Фотографии и сразу же завоевал всеобщую признательность. Файлы с графикой в этом формате имеют расширение .jpg. Этот формат обеспечивает весьма высокую степень сжатия файлов с цветными рисунками (значительно превосходящую возможности GIF) при незначительной потере цветовой информации. [67] Программы, умеющие сохранять файлы в формате JPEG, дают возможность задать степень сохранения информации при сжатии. При выборе величины последней в случае высоких требований к качеству рисунка следует поэкспериментировать, устанавливая различную степень сохранения информации и считывая полученный файл программой просмотра, добиваясь при этом приемлемого компромисса между размером файла и качеством изображения. В большинстве случаев приемлемым оказывается качество, даваемое используемой вами графической программой по умолчанию. При использовании формата JPEG следует помнить следующее:

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

Создание графических файлов

Ну что ж, теперь вы имеете представление о том, как изображения хранятся в файлах, и пришло время рассказать о том, как же эти файлы создать. Чаще всего для этого применяется метод сканирования готовых рисунков и фотографий. В большинстве случаев удовлетворительного качества удается добиться даже при помощи ручных сканеров стоимостью порадка 100 долларов, но для достижения профессиональных результатов при сканировании цветных изображений не обойтись без дорогостоящего цветного сканера. [68] Как показывает практика, сканирование цветных слайдов или негативов непосредственно с фотопленки при помощи специального сканера типа Kodak PhotoCD дает значительно лучшие результаты, чем сканирование тех же кадров, отпечатанных на фотобумаге, при помощи распространенных планшетных сканеров. В последнее время все чаще применяется непосредственное считывание кадров изображения с цифровых фотоаппаратов и телекамер, имеющих специальный аппаратно-программный интерфейс с компьютером.

Кроме сканера или цифровой камеры и поставляемого с ними программного обеспечения, вам понадобится какая-либо программа, умеющая манипулировать параметрами изображения (размерами, яркостью, контрастностью, цветовой гаммой и т.п.) и преобразовывать графические файлы из одного формата в другой. Иногда подобная программа входит в комплект поставки сканера. Наиболее распространенными программами для работы с изображениями для IBM PC под Microsoft Windows 3.1 или Windows 95, являются: [69] Lview Pro, Graphics Workshop for Windows, PaintShop Pro и Adobe PhotoShop. Две последние из вышеупомянутых программ - наиболее мощные и универсальные. К тому же, они позволяют не только изменять параметры изображения и сохранять его в различных форматах, но и рисовать, а также ретушировать готовые рисунки.

Итак, подготовка графических файлов методом сканирования состоит из следующих этапов:

  1. получение качественной фотографии или рисунка;
  2. сканирование и запись сканированного изображения в файл;
  3. ретуширование изображения, корректировка яркости, контрастности и цветового баланса при помощи упомянутых выше программ;
  4. запись готового изображения в формате GIF или JPEG.

Можно обойтись без сканирования и нарисовать рисунок полностью "компьютерными" средствами с использованием специальных программ, что чаще всего применяется для черчения технических чертежей, планов, схем, сложных формул, [70] графиков и диаграмм. При таком подходе вы либо рисуете изображение на дисплее "вручную" (обычно при помощи мыши), либо вводите в программу некоторые данные, по которым она создает требуемый график или чертеж. Рисование "вручную" требует немалого искусства, опыта и наличия весьма дорогого и сложного программного обеспечения, такого как Adobe PhotoShop, PaintShop Pro, Adobe Illustrator, CorelDraw или других профессиональных графических пакетов. Для создания и ретуширования простых рисунков подходит графический редактор Paintbrush, входящий в комплект поставки Microsoft Windows 3.1, или его "потомок" - Paint из комплекта Windows 95. Недостатком этих "рисовалок", кроме весьма ограниченных возможностей, является их неспособность сохранять файлы в форматах GIF или JPEG, поэтому вам придется сохранять рисунки в формате BMP или PCX а затем преобразовывать файлы при помощи специальных программ-конвертеров, о которых мы уже упоминали, когда рассказывали о сканировании.

Для быстрого рисования графиков, диаграмм и формул "подручными средствами" можно порекомендовать следующий способ: запускается Microsoft Word for Windows, график, диаграмма или формула создается и вставляется в документ Word'а как объект Microsoft Graph, Microsoft Drawing или Microsoft Equation, затем этот объект выделяется щелчком мыши и копируется командой Word'а Edit | Copy в буфер обмена (Clipboard). После этого запускается какая-либо программа для работы с графикой, например, Lview Pro, создается "пустой" рисунок подходящего размера, и данные из буфера обмена копируются в рисунок командой графического редактора Edit | Paste. Затем рисунок сохраняется в формате GIF. Аналогичным образом график можно "извлечь" и записать в формате GIF и из распространенной программы для работы с электронными таблицами Microsoft Excel. Заметим также, что некоторые редакторы HTML, например, Microsoft FrontPage, о котором мы расскажем ниже (стр. 75), умеют превращать документы в формате Word for Windows в HTML, автоматически извлекая все графические объекты, включенные в документ, и сохраняя их в формате GIF.

Вернемся к примеру, с которым мы расстались в разделе Ввод и редактирование текста (стр. 53). Как вы помните, в нем был маленький рисунок улыбающейся рожицы. Чтобы создать нечто подобное, запустите "рисовалку" Paintbrush из комплекта Microsoft Windows 3.1 или Paint из Windows 95. Установите параметры изображения при помощи меню Options|Image Attributes...: Units [71] - pels, Width - 30, Height - 30, Colors - Black and White. Нарисуйте физиономию и сохраните рисунок в файле face.bmp. После этого запустите одну из описанных выше программ для преобразования формата, загрузите в нее файл face.bmp, преобразуйте его в формат GIF 87a и сохраните результат в файле face.gif. Скопируйте face.gif в одну директорию с созданным вами файлом ex1.html (если вы еще не успели создать этот файл, то вернитесь к стр. 53). Сделав все это, вы можете открыть файл ex1.html в программе просмотра и убедиться, что ваш рисунок появился на ожидаемом месте.

Включая рисунок в свой документ, помните следующее:

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

Не используйте для кодировки цвета больше бит, чем это необходимо. В противном случае резко возрастает размер графического файла и появляются нежелательные эффекты, например, чисто белые участки рисунка выглядят при просмотре как грязно-серые, а у пользователей, имеющих видеокарты более низкого класса, чем ваша, рисунок может исказиться до неузнаваемости. Черно-белые штриховые рисунки, то есть рисунки, состоящие только из белых и черных (но не серых!) элементов сохраняйте как монохромные (2 цвета) Для схем, планов и чертежей обычно достаточно четырех бит (16 цветов), для полутоновых и цветных рисунков и фотографий [72] - восьми бит (256 цветов). И лишь для особо качественных рисунков и фотографий следует применять 24-битовую кодировку (True Color).

Всегда помните, что потенциальный читатель будет загружать ваш документ по сети, при этом скорость загрузки часто бывает весьма небольшой. Если пользователь вынужден ждать появления включенных в ваш документ изображений более десятка секунд, то он, скорее всего, просто прервет загрузку и не станет читать ваш документ. Очевидно, что размер файла с изображением растет с ростом размеров изображения и увеличения числа бит, кодирующих цвет пикселов. Для ориентировки следует принять. что размер файла с рисунком, вставляемым в WWW-документ, не должен превышать 30 килобайт. При желании продемонстрировать читателям большой и качественный рисунок, в документ обычно помещается его уменьшенная версия, служащая якорем для полноразмерного изображения. При этом пользователь, получив представление о содержании рисунка по его уменьшенной копии и о размере файла из предупреждения, может "щелкнуть" на ней клавишей мыши, чтобы загрузить и увидеть полноразмерный вариант. Ниже показано, как это сделать (в предположении, что в файле big_image.jpg хранится оригинальное изображение, а в small_image.gif - уменьшенная копия):

<A HREF="big_image.jpg"><IMG SRC="small_image.gif">Большая картинка (60K JPEG)</A>

Еще немного о русификации - совет WWW-авторам

В разделе книги, посвященном настройке программ просмотра для работы с русским языком (стр. 25), было сказано, что для кодировки букв русского алфавита (кириллицы) используются несколько различных кодовых таблиц. Поэтому перед помещением русскоязычного документа на WWW-сервер перекодируйте документ в указанную администратором сервера кодировку. [73]

В том же разделе книги было сказано, что некоторые программы просмотра автоматически подстраиваются под кодировку HTML-документа, если ее идентификатор указан в поле charset в заголовке ответа WWW-сервера на запрос по протоколу HTTP. К сожалению, идентификаторы для двух наиболее распространенных в WWW русских кодировок - KOI8-r и Microsoft Windows Cyrillic 1251 - не зарегистрированы International Standards Organization (ISO). Тем не менее, две наиболее популярные [74] программы просмотра - Netscape Navigator и Microsoft Internet Explorer - правильно распознают KOI8-r и windows-1251 в качестве таких идентификаторов, и поэтому их можно считать стандартами de facto.

Однако, большинство серверов не добавляют поле charset в заголовок ответа на HTTP-запрос. В результате, даже при правильно установленных в программе просмотра русских шрифтах читатель может увидеть вместо вашего русского текста странный набор символов, и тогда ему придется переключать кодировку "вручную" (напоминаем, что в Netscape 3.0 для переключения кодировки используется меню Options | Document Encoding).

Если сервер, на котором вы собираетесь разместить ваш документ, не настроен на автоматическое добавление информации об используемой кодировке, то укажите идентификатор кодировки в поле charset внутри HTML-файла. Для этого между флагами <HEAD> и </HEAD> поместите специальный флаг <META ...>, как показано ниже:

<HTML><HEAD><TITLE>

Название документа (лучше - на английском языке)

</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=имя_кодировки">
</HEAD><BODY>
...содержение документа...
</BODY></HTML>

имя_кодировки замените на KOI8-r или на windows-1251, если ваш русский текст закодирован, соответственно, в KOI8-r или Microsoft Windows Cyrillic 1251. Тем самым, вы избавите значительную часть ваших читателей от излишних хлопот с переключением кодировок. Если в вашем документе содержатся только символы таблицы ASCII (см. стр. 26), то поле charset можно либо опустить вообще, либо указать в нем имя кодировки iso-8859-1.

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

Размещение файлов на WWW-сервере

После того, как вы написали документ на HTML, подготовили все графические файлы и проверили работу документа при чтении с локального диска, можно попробовать разместить их на WWW-сервере. Проще всего для этого обратиться к администратору доступного для вас WWW-сервера. [75] Администратор возьмет на себя труд выделить на сервере необходимое для вашего документа место и сообщит вам его URL. Кроме того, администратор, вероятно, внесет гиперссылки на ваш документ в другие документы, хранящиеся на данном сервере. Например, если вы - сотрудник факультета университета, то URL вашего документа будет внесен в факультетскую базу данных по сотрудникам. Возможно также, что администратор порекомендует вам несколько подкорректировать содержание и оформление документа, например, для обеспечения единообразия стиля всех WWW-страниц, размещенных на сервере.

На тот случай если у вас есть доступ к компьютеру с операционной системой UNIX, [76] на котором установлено программное обеспечение WWW-сервера, [77] и если настройка сервера допускает самостоятельное размещение WWW-документов пользователями, мы приводим инструкции по переносу разработанного документа на сервер с персонального компьютера. Для определенности примем, что ваше пользовательское имя (login name) в системе UNIX - ivanov. Кроме того, примем, что сервер допускает размещение пользователями своих WWW-файлов в директориях $HOME/public_html [78]

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

1. Войти в UNIX-систему.

2. Создать в вашей домашней директории (home directory) поддиректорию public_html

mkdir public_html

3. Изменить атрибут доступа (access mode) созданной поддиректории на "читаемая и исполняемая для всех" (world readable and executable) при помощи команды

chmod go+rx public_html

4. Переместить все файлы, относящиеся к созданному вами WWW-документу (для нашего учебного примера это два файла: ex1.html и face.gif), с персонального компьютера на UNIX-машину в директорию public_html при помощи FTP, [79] Kermit, rcp или других доступных на вашей системе способов. [80] При этом следует перемещать файлы на языке HTML как текстовые (ASCII), а файлы с рисунками - как двоичные (binary). [81]

5. Изменить атрибуты доступа всех файлов, относящихся к документу, (в том числе и графических) на "читаемый для всех" (world readable) при помощи команд

cd public_html

chmod go+r *

Если вы проделали все шаги, описанные выше, то документ ex1.html станет доступным для внешнего мира по следующему URL:

http://host_name/~ivanov/ex1.html

где host_name - адрес вашего сервера в Internet.

Заметим, что если WWW-сервером допускается размещение файлов с документами в определенной директории, то они могут быть также размещены и в ее поддиректориях. При создании сложной структуры WWW-документов файлы обычно "раскидывают" по поддиректориям в соответствии с их назначением, например, все графические файлы помещают в поддиректорию images. При перемещении комплекса документов на сервер необходимо корректно перенести всю структуру поддиректорий [82] и не забыть установить соответствующие атрибуты доступа для всех поддиректорий и находящихся в них файлов. Если вы пока чувствуете себя со всем этим не очень уверенно, то лучше всего не рисковать и посоветоваться с администратором WWW-сервера, который наверняка посоветует вам лучший способ переноса файлов с вашего компьютера на сервер.

Программные средства, помогающие при создании и отладке WWW-документов

Выше мы рассказали о том, как написать документ на языке HTML при помощи простого текстового редактора. Однако, создание таким способом сложных и больших документов со множеством гиперсвязей, с включением большого числа рисунков и со сложным форматированием текста (например, в виде таблиц) требует весьма больших затрат труда. Для того, чтобы облегчить жизнь WWW-авторов, было разработано довольно много специальных программных средств, [83] которые можно разбить на следующие классы:

Программы-конвертеры

Конвертеры предназначены для преобразования файлов, создаваемых различными средствами подготовки текста или редакторами типа LaTEX, Microsoft Word, WordPerfect и других в формат HTML с сохранением, по возможности, форматирования текста, рисунков и т. п. Применение конвертеров особенно удобно в случае, когда необходимо преобразовать для публикации в WWW уже имеющийся документ, подготовленный в каком-либо текстовом редакторе. Коллекцию конвертеров из различных форматов в HTML можно найти, в частности, в архиве Yahoo: http://www.yahoo.com/Computers_and_Internet/Software/Internet/World_Wide_WebHTML_Converters/

Программы для проверки правильности синтаксиса HTML и действительности гиперсвязей

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

Для проверки соответствия документов стандарту синтаксиса HTML и действительности гиперссылок было разработано довольно много программ. Перечислим некоторые из них.

HTML Validation Service - интерактивный документ, предназначенный для проверки HTML-документов. Он доступен по следующему URL: http://www.webtechs.com/html-val-svc/

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

WebLint 1.017 - программа для автономной проверки соответствия синтаксиса документа стандарту языка HTML 2. Написана на языке Perl [84] и доступна по URL: ftp://ftp.cre.canon.co.uk/pub/weblint/

Webxref - программа проверки правильности ссылок, проверяющая, кроме внутренних, еще и внешние ссылки. Написана на языке Perl и доступна по адресу: http://www.sara.nl/Rick.Jansen/Web/webxref

HTML-редакторы

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

Как вы уже знаете, документ на языке HTML является "смесью" собственно текста, несущего информацию читателю, и флагов разметки, предназначенных для программы просмотра; HTML-файл приобретает "удобочитаемый" вид только при интерпретации программой просмотра. В связи этой особенностью HTML, программы для редактирования HTML-файлов делятся на два класса: 1) редакторы, позволяющие редактировать исходный код непосредственно на языке HTML, и 2) WYSIWYG-редакторы. [85] Работа с редакторами первого типа не слишком отличается от работы с простым текстовым редактором Notepad (см. стр. 50). Конечно, редакторы, специально предназначенные для работы с HTML, облегчают и автоматизируют часть работы, например, позволяют вводить наиболее распространенные флаги разметки нажатием на экранные кнопки или выбором из меню, вводить гиперссылки и размещать рисунки на странице заданным образом при помощи диалога с пользователем, переносить отредактированный файл на WWW-сервер, и многое другое. Преимуществом этого типа редакторов является полный контроль автора за использованием всех флагов разметки и возможность применения любых допустимых конструкций HTML. Работа же со вторым типом HTML-редакторов - WYSIWYG, - хотя и несколько ограничивает возможности автора, но зато существенно легче и производительней, поскольку пользователь такого редактора в процессе работы видит документ почти так, как его увидит читатель при помощи своей программы просмотра, и манипулирует не "сырым" HTML-текстом, а графическими объектами (выведенным разными шрифтами текстом, рисунками, таблицами и др.). Все же, как показывает опыт, даже при использовании WYSIWYG-редакторов знание основ HTML совершенно необходимо, что бы там ни утверждали фирмы-производители программного обеспечения.

Можно посоветовать читателю испытать работу нескольких различных HTML-редакторов и выбрать понравившийся. Прекрасный обзор по HTML-редакторам HTML Editor Reviews by Carl Davis можно прочитать по одному из следующих URL: http://homepage.interaccess.com/~cdavis/edit_rev.html, http://www.techsmith.com/community/htmlrev/

Коллекцию редакторов можно найти в Yahoo: http://www.yahoo.com/Computers_and_Internet/Software/Internet/World_Wide_WebHTML_Editors/

а также в архиве TUCOWS (см. также стр. 37) в разделе HTML editors.

Ниже приведены три программы, иногда используемые авторами данной книги. Все они работают в среде Microsoft Windows.

В "золотой" вариант программы просмотра Netscape Navigator 3.0, (так называемый Netscape Navigator Gold 3.0) фирмы Netscape Communications Corporation встроен неплохой WYSIWYG HTML-редактор. Надо, однако, сказать, что после знакомства с этим редактором на ум приходит поговорка о бочке меда с бо-о-о-льшой ложкой дегтя в виде ряда досадных программных ошибок и недостаточной продуманности некоторых из его функций. Будьте особенно осторожны при редактировании с помощью Netscape Gold HTML-файла, созданного другими программами редактирования, так как высока вероятность его испортить!

Интегрированные системы разработки и поддержки WWW-проектов

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

При увеличении числа взаимосвязанных документов трудности растут как снежный ком, грозя превратить проект из стройной структуры в настоящую мешанину файлов, в дальнейшем с трудом поддающуюся управлению. Чтобы облегчить жизнь WWW-авторам и администраторам, был создан ряд интегрированных систем разработки проектов, [87] среди которых выделяется Microsoft FrontPage 97 .

Microsoft FrontPage 97 объединяет в себе средство для управления проектом - FrontPage Explorer - и мощный HTML-редактор - FrontPage Editor. FrontPage Explorer автоматически создает для вас удобное графическое представление структуры проекта со всеми входящими в него файлами и гиперсвязями между ними, проверяет действительность гиперсвязей внутри файлов проекта и отслеживает перемещение, удаление и создание новых файлов, а также пересылает обновленные версии файлов на заданный WWW-сервер. FrontPage Editor является одним из лучших WYSIWYG HTML-редакторов из доступных на данный момент. Важным преимуществом этого редактора перед встроенным в Netscape Navigator Gold 3.0 является возможность импорта документов в форматах наиболее популярных текстовых процессоров (Microsoft Word for Windows, Word Perfect и других) а также непосредственного ввода HTML-кодов в редактируемый файл.

Версия 2.0 Microsoft FrontPage 97 уже появилась в начале 1997 года. Она является коммерческим продуктом и стоит около двух сотен долларов. Вероятно, жесткая конкуренция вскоре вынудит и Netscape Corporation выпустить аналогичное средство, так что следите за новостями. Текущая информация по Microsoft FrontPage 97 доступна по адресу: http://www.microsoft.com/frontpage/

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

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

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

Поскольку пользователи поисковых систем будут искать ваш документ по каким-то ключевым словам, важно понимать, какие слова из вашего документа будут восприниматься роботами как ключевые. К сожалению, разные программы-роботы интерпретируют текст документа совершенно по-разному. Единственным полем, обязательным для индексации, является название документа (title), хотя многие роботы читают в нем только первые 64 символа. Название документа лучше писать латинскими буквами, желательно, на английском языке. Большинство роботов также индексируют текст заголовков первого (<H1>..</H1>), а часто и второго (<H2>..</H2>) уровней. По этой причине мы советуем заключать важные заголовки в конструкции <H1>..</H1> и <H2>..</H2>, и не использовать для их оформления флаги <FONT>..</FONT>. Несколько роботов (AltaVista, InfoSeek) также читают ключевые слова, указанные в виде META-информации в головной части документа (см. далее), но этот способ пока не стал общепринятым.

Многие из роботов все же принимают во внимание не только название и заголовки, но и содержание вашего документа. Так, OpenText просто запоминает все слова, найденные в тексте документа, в своей базе данных и каждое слово рассматривает как ключевое. Другие системы статистически анализируют использование слов в вашем тексте и запоминают 50-100 наиболее часто встречающихся из них. Третьи системы запоминают, кроме заголовков, первые несколько десятков слов из вашего документа. Однако, следует иметь ввиду, что большинство поисковых систем не понимает русский язык, так что, пока не будут созданы роботы, читающие и анализирующие документы на русском языке, не следует возлагать больших надежд на то, что эти документы будут правильно проиндексированы.

Какие же советы можно дать авторам, чтобы их документы могли быть проиндексированы наиболее эффективно?

<HEAD>
<TITLE>...</TITLE>
<META NAME="description" CONTENT="
здесь поместите краткое описание вашей страницы - в том виде, в каком бы вы хотели его видеть показанным поисковыми системами">
<META NAME="keywords" CONTENT="
здесь поместите все относящиеся к документу ключевые слова (или ключевые фразы), разделенные запятыми, так, чтобы одно слово не использовалось более семи раз">
</HEAD>

Краткое описание и ключевые слова следует писать по-английски, так как большинство поисковых систем пока не понимает [89] информацию на русском языке. Длина полей CONTENT формально не должна превышать 1000 символов, но разумно - по крайней мере для раздела description - ограничиться 200 символами, т. к. поисковые системы не отображают больший объем информации.

Посоветуйтесь со своим системным администратором, следует ли зарегистрировать документ у одного или нескольких роботов. Часто эта работа делается самим системным администратором.

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

<html>
<head>
<title>EXAFS studies of the influence of impurities on
the phase transition in GeTe (in Russian,
CP-1251 character set)</title>
<meta name="description" content="The abstract of
the section talk presented at the 14th Russian Conference
on the Physics of Ferroelectrics (Ivanovo,1995). The
abstract is in Russian, CP-1251 (Windows) character set">
<meta name="keywords" content="X-ray absorption
spectroscopy, EXAFS, semiconductor solid solutions,
doping effect, ferroelectric phase transition, local environment,
germanium telluride, selenium, lead, manganese, impurity,
off-center ion">
</head>
<body>
Работа была представлена ...
</body>
</html>

[НАЧАЛО СТРАНИЦЫ]
[ПРЕДЫДУЩАЯ СТРАНИЦА][СЛЕДУЮЩАЯ СТРАНИЦА]
[ОГЛАВЛЕНИЕ][ПРЕДМЕТНЫЙ УКАЗАТЕЛЬ]

Просьба присылать замечания и предложения по адресу: www@chemnet.chem.msu.su. Последние изменения внесены: 14 Июль, 1997

(C) D.N. Rassokhin, A.I. Lebedev