При сохранении файла обязательно пользуйтесь функцией «Сохранить как…»

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

Программы компоновки Web-страниц

Программы компоновки Web-страниц позволяют создавать Web-страницы

практически таким же образом, как программы компоновки страниц, подобные PageMaker и QuarkXPress, позволяют компоновать и печатать бумажные докумен- ты. Хотя на рынке имеются десятки программ компоновки Web-страниц, тремя наиболее популярными приложениями для создания Web-страниц являются GoLive от Adobe, Dreamweaver от Macromedia и FrontPage от Microsoft.

Глава 1. Основы языка HTML 3 3





Работая с программой компоновки Web-страниц, такой как GoLive, вы откры —

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

страницу, программа генерирует HTML-код за вас. Преимуществом работы с программой компоновки Web-страниц является то, что в процессе создания Web- страницы вы видите, как она выглядит в Web-браузере. На рис. 1.7 показана Web-страница в процессе разработки в среде Macromedia Dreamweaver.

Недостаток работы с программами компоновки Web-страниц состоит в том, что они выполняют все HTML-кодирование за вас. Хотя это их свойство может

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

делать программа. Предположим, например, что вы захотите добавить в свою

Web-страницу определенную функцию, а в программе компоновки нет кнопки, с

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

а вполне можно убрать.

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





3 4 Глава 1. Основы языка HTML





Работа с относительными и абсолютными адресами файлов

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

сэкономить немало времени и усилий, используя в ссылках на файлы в HTML — дескрипторах относительные адреса.

Когда посетитель сайта щелкает на гиперссылке, Web-браузер использует ад —

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

либо относительный (relative), либо абсолютный (absolute) адрес. Предположим,

например, что у вас есть графический файл с именем ciock. jpg, который нахо —

дится в папке Foider B, и что Foider_B, в свою очередь, находится в папке

Folder_ A (CM. рИС. 1.8).



Относительный адрес состоит из имен папок, которые необходимы браузеру, чтобы добраться до файла, начиная с местонахождения Web-страницы с гиперс —

сылкой, указывающей на внешний файл. Например, если файл ciock. jpg нахо —

дится в папке Foider_B (как показано на рис. 1.8), а Web-страница, ссылающая —

ся на ciock. jpg, находится в папке Foider_A, относительным адресом

ciock. jpg на данной Web-странице будет Foider B/ciock. jpg. Иными словами,

текущая папка содержит папку Foider B, которая, в свою очередь, содержит

Глава 1. Основы языка HTML 35





файл ciock. jpg. В приведенном ниже дескрипторе использован атрибут

src (от source — источник) с относительным адресом:







Относительный адрес дает Web-браузеру указание начинать поиск файла внут —

ри папки, содержащей текущий HTML-документ. Например, пусть HTML-доку- мент, содержащий рисунок в дескрипторе в предыдущем примере, нахо —

дится в папке idx_foider. Тогда относительный адрес в атрибуте src

подразумевает, что папка Foider_A находится в папке idx foider.

Абсолютные адреса, с другой стороны, указывают местонахождение файла, на — чиная с верхнего уровня иерархии папок и двигаясь вниз через все промежуточ — ные папки к файлу — безотносительно местонахождению текущего Web-докумен — та. Абсолютные адреса всегда начинаются с косой черты (/), что отличает их от относительных адресов.

Предположим, например, что файл ciock. jpg находится на диске D В папке

Foider B, которая расположена в рамках папки Foider A. Чтобы задать абсолют- ный адрес, вы должны сообщить браузеру, где искать файл, начиная с диска, на котором находится содержащая файл папка. В следующем коде показан абсолют — ный адрес файла ciock. jpg из данного примера:





Использование абсолютных адресов затрудняет перенос файлов Web-сайта с локального диска на Web-сервер или с одного Web-сервера на другой. Например,

для того, чтобы успешно пользоваться относительными адресами, вам нужно все —

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

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

Загрузка и установка персонального Web-сервера

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

не подключаясь к Internet или Web-серверу. Просто введите путь к. html-файлу

(файлу Web-страницы) в виде File:// в адресной строке Web-браузера. Таким образом, если вы сохраните Web-страницу с именем TestPage. htm в корневой папке диска с, вы сможете отобразить страницу в Web —

браузере, введя File://C:/MyWebs/TestPage. htm.

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

Internet, вам нужен Web-сервер. Кроме того, как вы узнаете из глав 10, 11 и 12, Web-сервер также необходим, если вы хотите запускать на выполнение серверные

3 6 Глава 1. Основы языка HTML





сценарии (программы, которые запускает и выполняет Web-сервер от имени ва — шей Web-страницы). Если вы работаете под управлением одной из операцион — ных систем Windows (Windows 95, 98, Me, NT или ХР), вы можете установить персональный Web-сервер (Personal Web Server — PWS) на своем персональном

компьютере или сетевой рабочей станции бесплатно. После того, как вы устано — вите PWS и подключитесь к Internet, другие пользователи World Wide Web смогут просматривать Web-страницы, которые вы опубликуете на своей машине. Поми — мо этого, с помощью Web-сервера вы сможете тестировать Web-страницы, кото —

рые посылают на сервер введенную в формы информацию, и страницы с сервер —

ными сценариями, реализованными, например, на РНР или Active Server Pages (о

которых мы расскажем в главах Ши И).





Если у вас есть компакт-диск с дистрибутивом Windows 98, вставьте его в привод и пропустите описанную ниже процедуру выгрузки; PWS находится в папке

\Add-Ons\PWS\ на Windows 98 CD. В противном случае вам потребуется устано — вить PWS из пакета дополнений Windows NT 4 Option Pack, который можно выгру — зить из Web-сайта Microsoft, выполнив следующие действия:

1. Если у вас нет постоянного соединения с Internet, с помощью модема устано- вите соединение по коммутируемой линии через своего Internet-провайдера.

2. Откройте Web-браузер и наберите в адресной строке следующий URL —

адрес http://www. microsoft. com/msdownload/ntoptionpack/askwiz. asp;

затем нажмите ENTER.

3. На странице Windows NT 4 Option Pack щелкните на гиперссылке Option 1.

Ваш браузер, в свою очередь, отобразит Web-страницу Download Step 2, где вы сможете выбрать операционную систему, для которой вы хотите загру — зить программу загрузки пакета NT 4 Option Pack.

4. На странице Download Step 2 с помощью выпадающего меню выберите

свою операционную систему. За исключением случаев, когда вы устанавли — ваете PWS на рабочей станции NT или NT-сервере, выбирайте опцию Windows 95. Для рабочей станции NT выберите NT Workstation, а для NT-сер — вера вместо PWS установите Internet Information Server (IIS). Затем щелкните на кнопке Next (Далее). Браузер отобразит Web-страницу Download Step 3.

5. На странице Download Step 3 щелкните на гиперссылке download. exe, нахо- дящейся вблизи нижнего правого угла Web-страницы. Windows, в свою очередь, выведет на экран диалоговое окно File Download (Загрузка файла).

6. В диалоговом окне File Download щелкните на переключателе Save This Program to Disk (Сохранить программу на диске) и затем на кнопке ОК. Windows выведет на экран диалоговое окно Save As (Сохранить как…).

7. В диалоговом окне Save As в выпадающем списке справа от поля Save In

(Сохранить в…) выберите папку, в которой вы хотите сохранить файл-про —

грамму downfoad. exe, например, папку C:\My Download Files; затем щелкните на кнопке Save (Сохранить).

Глава 1. Основы языка HTML 37





8. В среде Windows с помощью Проводника откройте папку, в которой вы со — хранили файл download. exe. Запустите приложение на выполнение. Сразу же после запуска download. exe выведет на экран лицензионное соглашение на пакет дополнений Windows NT 4 Option Pack.

9. Внимательно прочтите лицензионное соглашение и щелкните на кнопке Yes, чтобы продолжить установку. Программа выгрузки, в свою очередь, выведет на экран диалоговое окно Download Options (Выбор типа загрузки).

10. В диалоговом окне Download Options щелкните на переключателе Download

Only (Только загрузка) и затем на Next. Программа выгрузки выведет на эк —

ран окно Language and CPU/Operating System Options (Выбор языка и процес — сора/операционной системы).

11. В окне Language and CPU/Operating System выберите язык и процессор/опе — рационную систему; затем щелкните на Next. Далее программа выгрузки выведет на экран окно Installation Options (Выбор типа установки).

12. В окне Installation Options щелкните на переключателе Full Installation (Пол — ная установка) и затем на Next. Программа выгрузки выведет на экран окно Save In Folder (Сохранить в папке).

13. В окне Save In Folder введите папку, в которую программа выгрузки должна будет сохранить файлы пакета NT 4 Option Pack (например, C:\PWSSetupFiles). Затем щелкните на Next. Программа выгрузки выведет на

экран диалоговое окно Download Location (Местонахождение сайта загрузки)

со списком сайтов, из которых можно выгрузить пакет NT 4 Option Pack.

14. В диалоговом окне Download Location выберите ближайший к вам (геогра — фически) сайт для выгрузки (если в списке присутствует более одного сай — та). Затем щелкните на Next. Программа выгрузки предоставит вам серти — фикат безопасности выбранного сайта. Щелкните на Yes, чтобы принять

сертификат и завершить загрузку NT 4 Option Pack.



После выполнения шага 14, программа выгрузки выгрузит пакет NT 4 Option Pack из выбранного вами сайта и сохранит его файлы в папке, введенной вами при выполнении шага 13.

Перед тем, как вы сможете запустить PWS, вы должны установить это прило — жение на своем компьютере. Вне зависимости от того, выгрузили ли вы NT 4

Option Pack или пользуетесь компакт-диском дистрибутива Windows 98, выпол — ните следующие действия для установки PWS:

1. Запустите на выполнение программу setup. ex e — либо с компакт-диска

Windows 98 (x:\Add-Ons\Pws\setup. exe, где х — буквенное обозначение привода для чтения компакт-дисков) или из папки, имя которой вы ввели

в шаге 13 вышеописанной процедуры выгрузки.

2. В первом окне программы установки щелкните на кнопке Next (Далее).

Программа setup. ex e выведет на экран лицензионное соглашение конеч — ного пользователя PWS. Внимательно прочтите соглашение и щелкните на Accept (Принять) для продолжения установки. Программа установки, в свою

38 ‘ Глава 1. Основы языка HTML





очередь, выведет на экран диалоговое окно Installation Options (Выбор типа установки) либо Select Components (Выбор компонентов). (Какое из диалого — вых окон откроет программа, значения не имеет и зависит от того, заме — няете ли вы более старую версию PWS на новую (переустанавливаете теку- щую версию) или устанавливаете Web-сервер впервые.)

3. В диалоговом окне Installation Options пибо Select Components щелкните на кнопке Next для принятия типа установки по умолчанию.

После завершения шага 3 программа установки произведет установку про — граммного обеспечения PWS и предложит перезагрузить компьютер. При пере — загрузке компьютера Windows загрузит и запустит PWS. Поэтому, увидев рабочий

стол Windows, обратите внимание на системную панель справа от панели задач Window: на ней появится пиктограмма PWS. Приведенный ниже практикум по — кажет, как работать с Web-сервером, и научит вас публиковать свои Web-страни — цы в корпоративной локальной сети и/или в среде Internet.



Работа с персональным Web-сервером

и публикация Web-страниц



Установив персональный Web-сервер (PWS), как было описано в предыдущем

практикуме, вы должны научиться запускать и останавливать Web-сервер и опре — делять местонахождение домашнего каталога Web-сервера. Все это делается с по — мощью диспетчера PWS (Personal Web Manager), открыть который можно разны — ми способами в зависимости от вашей операционной системы.

Самый простой способ запустить диспетчер PWS — выполнить двойной щелчок на пиктограмме программы в системном лотке Windows (справа от строки состояния Windows). Или же, в Windows 98, выберите Start | Programs | Microsoft Personal Web Server (Пуск | Программы | Microsoft Personal Web Server) и затем Personal Web Manager.

После запуска диспетчер PWS выведет на экран главное (Main) окно програм — мы, которое содержит имя вашего Web-сервера и домашний каталог сервера, ана — логично показанному на рис. 1.9.

Диспетчер PWS отображает имя вашего Web-сервера синим шрифтом в верх — ней части окна. Любой из пользователей, работающих на вашей рабочей стан- ции или на другой рабочей станции в вашей локальной сети может с помощью имени Web-сервера просматривать Web-страницы на вашем PWS. (Изменить имя своего Web-сервера можно, просто поменяв имя своего компьютера на закладке Идентификация в диалоговом окне Сеть панели управления.) Главное окно дис — петчера PWS показывает также корневую папку PWS — синим шрифтом сразу же под именем вашего Web-сервера.

Глава 1. Основы языка HTML 39







Зная имя Web-сервера и домашний каталог, вы готовы к публикации своих

Web-страниц. Предположим, например, что именем вашего компьютера (и, сле —

довательно, вашего PWS) является konrad, а домашним каталогом сервера —

C:\WebShare\wwwroot. ЕСЛИ ВЫ поместите Web-СТранИЦу, например, TestPage. htm,

в папку C:\webshare\wwwroot на вашем компьютере, вы (и любой пользователь

рабочей станции, подключенной к вашей локальной сети) сможет вывести Web —

страницу на экран, набрав в адресной строке браузера http://konrad/

TestPage. htm И нажав ENTER.

Теперь предположим, что вы создали папку в домашнем (корневом) каталоге своего Web-сервера, скажем, HTDOCS, а затем поместили в эту папку Web-стра- ницу, например TestPage2.htm. Именем пути ДЛЯ TestPage2.htm будет

c:\WebShare\wwwroot\htdocs\TestPage2.htm. Однако, работая С браузером, ДЛЯ

отображения этой страницы вы бы набрали в адресной строке браузера следую —

щий URL-адрес: http://konrad/htdocs/TestPage2.htm.

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

сети, вы можете разрешить доступ к своим Web-страницам и любым другим ком —

пьютерам через Internet. Для этого вам потребуется подключить ваш компьютер

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

свой компьютер (и Web-сервер) к Internet.

Если ваш Internet-провайдер не присвоил вашему компьютеру статический IP — адрес, вы можете узнать свой текущий IP-адрес, запустив утилиту ipconfig. exe. ipconfig. exe запускается в командной строке MS-DOS. Чтобы начать сеанс MS —

DOS, выберите Start | Run (Пуск | Выполнить…). Windows, в свою очередь, отобра —

зит диалоговое окно Run (Запуск программы). В окне Run в поле Open (Открыть:)

4 0 Глава 1. Основы языка HTML





наберите command. com. Затем нажмите ENTER или щелкните на кнопке ОК. В

командной строке MS-DOS наберите ipconfig. exe и нажмите ENTER. Утилита

ipconfig выведет ваш IP-адрес сразу же перед маской подсети (Subnet Mask), как показано на рис. 1.10.







(Windows-версию ipconfig. exe можно выполнить, войдя в Start | Run (Пуск | Выполнить…) и набрав в поле Open (Открыть:) окна Run строку winipcfg. exe.) Зная

IP-адрес компьютера, замените IP-адресом имя Web-сервера, чтобы к Web-стра —

ницам сервера можно было обращаться через Internet. Например, если IP-адрес

компьютера — 24.234.31.218, то, чтобы получить доступ к Web-страницам из вы —

шеприведенного примера из Internet, вам потребуется воспользоваться одним из следующих адресов:



http://24.234.31.218/TestPage. htm

http://24.234.31.218/HTDocs/TestPage2.htm

Определив IP-адрес компьютера, вы можете предоставить этот адрес другим людям. Однако следует иметь в виду, что, если ваш Internet-провайдер не при — своит вашему компьютеру статический, постоянный IP-адрес, IP-адрес будет ме — няться всякий раз, когда вы отключаетесь и вновь подключаетесь к Internet. Бо — лее того, IP-адрес может измениться (о чем вы не будете знать), даже если у вас имеется постоянное подключение к Internet. Если IP-адрес вашего Web-сервера изменится, у пользователей, которые будут пытаться просматривать ваши Web- страницы с использованием старого IP-адреса, ничего не выйдет — даже несмот —

ря на то что PWS будет работать, а ваш компьютер будет подключен к Internet.

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

к Internet через коммутируемое соединение по обычной телефонной линии — для этого нужно подключение через ISDN, DSL или модем для физической ли — нии. Получив статический IP-адрес, вы должны ввести этот адрес в диалоговое окно TCP/IP Properties (Свойства TCP/IP) на своем компьютере. Для этого необ — ходимо выполнить следующие действия:

Глава 1. Основы языка HTML 41





1. Выберите Start | Settings (Пуск | Настройка), затем Control Panel (Панель управ — ления). Windows, в свою очередь, откроет панель управления.

2. В окне панели управления выполните двойной щелчок на пиктограмме

Network (Сеть). Windows откроет диалоговое окно Network (Сеть).

3. На вкладке Configuration (Конфигурация) диалогового окна Network выберите компонент TCP/IP из числа установленных. (Если на вашей машине уста- новлена операционная система Windows NT, протокол TCP/IP будет нахо —

диться на вкладке Protocols (Протоколы) диалогового окна Network.) Затем щелкните на кнопке Properties (Свойства). Windows должна открыть диало- говое окно TCP/IP Properties (Свойства: TCP/IP).

4. На вкладке Address (IP-адрес) щелкните на переключателе Specify An IP

Address (Указать IP-адрес явным образом). Затем введите IP-адрес и маску подсети, назначенные вам Internet-провайдером.

Выполнив шаг 4, щелкните на кнопке ОК в нижней части диалогового окна TCP/IP Properties, а затем на кнопке ОК в нижней части диалогового окна Network. После этого Windows обновит установки системы и предложит перезагрузить компьютер. После перезагрузки компьютера и восстановления подключения к

Internet PWS будет постоянно доступным по одному и тому же (статическому) IP-адресу.

Имея статический IP-адрес, вы затем сможете приобрести доменное имя —

либо через своего же Internet-провайдера, либо у регистратора доменных имен,

например, VeriSign (http://www. NetSoi. com). Приобретя доменное имя, напри —

мер, MyWebServer. com, попросите своего Internet-провайдера связать доменное имя с вашим статическим IP-адресом на сервере доменных имен (Domain Name Server — DNS) провайдера. Теперь, когда доменное имя указывает на ваш компь — ютер, любой из пользователей Internet сможет просмотреть Web-страницы на ва — шем PWS с помощью либо соответствующего IP-адреса (как было показано выше), либо обращаясь к Web-серверу с помощью вновь приобретенного домен — ного имени, как показано ниже:

http://www. MyWebserver. com/TestPage. htm

http://www. MyWebserver. com/HTDocs/TestPage2.htm



Если вы подключаетесь к Internet по коммутируемой линии или не хотите платить за статический IP-адрес и использовать один из своих компьютеров в качестве Web-сервера, ваш Internet-провайдер может разместить разработанный Web-сайт на собственном сервере. Многие провайдеры предлагают 5—10 Мб (или больше) Web-пространства, предоставление которых входит в плату за подключе —

ние к Internet. Свяжитесь со своим провайдером или регистратором доменных имен (например, VeriSign), чтобы узнать о предоставляемых ими услугах хостинга Web-сайтов. Если ваш сайт будет размещен на сервере Internet-провайдера или другой компании, вы просто скопируете Web-страницы, которые хотите опубли — ковать, в иерархию папок Web-сайта на жестком диске компании, предоставив — шей хостинг, вместо корневого каталога PWS (и подкаталогов корневого каталога)

на локальном жестком диске.

4 2 Глава 1. Основы языка HTML





Обратите внимание, что после установки PWS Windows автоматически запус —

кает Web-сервер всякий раз, когда вы перезапускаете компьютер. Чтобы остано — вить Web-сервер, щелкните на кнопке Stop под именем Web-сервера в верхней части главного окна диспетчера PWS. (После остановки PWS будет находиться в