- Добавить в Избранное
-
Сделать стартовой
 
Содержание
Глава 1- 18
Как создаются Web-страницы
Основные принципы работы с Dreamweaver
Начинаем с текста
Рисунки,звуки,фильмы
Таблицы
Работа с Web-сайтом
Фреймы
Табличный дизайн
Использование шаблонов
Каскадные таблицы стилей
Свободно позиционируемые элементы
Анимация элементов Web-страниц
Использование сценариев
Метатегн и серверные директивы
Введение в серверное программирование
Формы
Простейшие серверные приложения
Создание интерактивных сайтов
На заметку
Установите на своем сайте нашу кнопку:

Вебмастеру - портал о редакторе Macromedia Dreamweaver MX. Создание сайтов.


    1  2  3  4  5  6  7  8  9  10    
Абсолютные и относительные интернет - адреса
А поговорим мы об интернет-адресах. Точнее, о разных способах задания интернет-адресов.
Снова откройте главную страницу сайта default.htm . Поместите текстовый курсор на слово " Macromedia " в первом абзаце (если помните, это гипер­ссылка, указывающая на сайт фирмы). В поле ввода Link редактора свойств вы увидите следующее:
http://www.macromedia.com
Это Web -адрес сайта Macromedia . Теперь давайте рассмотрим еще один интернет-адрес, на этот раз воображаемый:
http://www.somesite.ru/folderl/folder2/page.html
Этот адрес указывает на файл page.html , находящийся на сервере http://www.somesite.ru в папке / folderl / folder 2. Как видите, все основные части интернет-адреса здесь присутствуют. В результате адрес указывает прямо на нужный файл. Такой интернет-адрес называется абсолютным.
Теперь переместим текстовый курсор на первую строку списка ("о моих увлечениях"). В поле ввода Link мы увидим следующее:
HTMLs /Passions.htm .
Этот адрес также указывает на нужный файл, но не непосредственно, а относительно какого-то другого файла, а именно относительно адреса главной страницы нашего сайта. Такой адрес называется относительным.
Относительные интернет-адреса могут быть заданы относительно файла и корневой папки сайта. Проиллюстрируем это на примере. Откройте страницу About.htm и щелкните мышью по фотографии Ивана Ивановича, чтобы ее выделить. В поле ввода Src вы увидите:
../ Pics/Ivanov.gif
Этот интернет-адрес указан относительно файла Web -страницы. Две точки в начале обозначают ссылку на папку верхнего уровня.
А вот так будет выглядеть адрес, указанный относительно корневой папки сайта:
/ Pics / Ivanov.gif
Способ задания относительных интернет-адресов выбирается с помощью раскрывающегося списка Relative To диалогового окна Select File : пункт Document задает адрес относительно файла, а пункт Site Root — относительно корневой папки сайта. В таком случае в поле ввода URL появляется результирующий интернет-адрес.
Как вы уже поняли, абсолютный интернет-адрес применяется, если нужный файл находится на другом сайте. Внутри сайта используются относительные адреса: они значительно компактнее и не создают лишней путаницы.
Но какой способ задания относительных адресов выбрать? Это зависит от того, где находится файл, на который вы хотите сослаться. Если он располагается в той же папке, что и файл текущей страницы, или в одной из подпапок этой папки, лучше задать адрес относительно файла, т. к. он будет компактнее. Если же нужный файл находится в другой папке, не вложенной в ту, где расположен файл текущей страницы, лучше задать адрес относительно корневой папки.
Проиллюстрируем вышесказанное на примере. Предположим, есть сайт с такой физической структурой:
< Корневая папка >
default.htm
folderl
pagel.htm
folder2
page 2.htm
folder 3
page 3.htm
И предположим, что нужно разместить на странице page1.htm ссылки на страницы page2.htm и page3.htm . В таком случае правильно заданные интернет-адреса будут выглядеть следующим образом:
folder2/page2.htm
/folder3/page3.htm
т. е. адреса задаются относительно файла — для page2.htm и относительно корневой папки — для page3.htm . Если же мы поступим наоборот:
/folderl/folder2/page2.htm
../folder3/page3.htm
то смотрите сами, насколько громоздкими и запутанными стали адреса. И еще. Если вы собираетесь публиковать сайт на Web -сервере, можете зада­вать относительные адреса как от файла, так и от корневой папки сайта. Но если ваш сайт будет существовать только в виде локальной копии (например, чисто учебный сайт, который никогда не будет опубликован в Сети, или сайт-прототип, предварительная версия), задавайте относительные ад­реса только от файла страницы. Адреса, заданные относительно корневой папки сайта, будут работать только под управлением программы Web -сервера; операционная система вашего компьютера просто не сможет их найти, поскольку будет отсчитывать адреса от корневой папки диска. Для примера давайте сравним два наших интернет-адреса:
/f older 3/page3 htm
.. /f older3/page3.htm
Предположим также, что локальная копия сайта находится в папке
c :\ Projects \ Sites \ Samplel
Первый интернет-адрес задан относительно корневой папки сайта. Операционная система, однако, будет отсчитывать его от корневой папки диска, и результирующий путь будет таков:
c:\Folder3\page3.htm
что не соответствует действительности. Поэтому вы не сможете перейти на данную страницу, щелкнув по гиперссылке — операционная система не найдет этот файл, и Web -обозреватель выдаст сообщение об ошибке. В то же время, второй интернет-адрес, заданный относительно файла страницы, будет интерпретирован правильно:
c:\Projects\Sites\Samplel\Folder3\page3.htm
и операционная система без труда найдет нужный файл.
Проверка правильности ссылок и HTML - кода
Теперьто, спросите вы, можно публиковать сайт? Нет, еще рано. Потерпите — осталось совсем чуть-чуть! Вот проверим корректность HTML -кода и гиперссылок — и опубликуем сайт в Сети.
При разработке Web -страниц в их HTML -коде постепенно накапливаются ошибки, для удаления которых в Dreamweaver существует функция "чистки" кода, рассмотренная нами в главе 3. Однако не все ошибки кода могут быть таким образом выявлены и исправлены. Скорее, функция "чистки" служит для оптимизации кода путем удаления и совмещения тегов, которые могут быть удалены и совмещены без ущерба для Web -страницы. Однако многие ошибки (в частности, типичные ошибки начинающего Web -дизайнера) Dreamweaver "вычистить" не может — чтобы их исправить, требуется вмешательство самого Web -дизайнера.
Но чтобы исправить код, нужно знать, что исправлять. И в этом Dreamweaver снова вам поможет.
Внимание!
Из - за ошибки Dreamweaver при проверке не может прочитать файлы , пути доступа к которым содержат русские буквы . Поэтому лучше всего помещать файлы ваших сайтов в папки , чьи имена состоят только из английских букв и цифр .
Итак, проверим правильность HTML - кода. Закройте все открытые окна документов, чтобы они вам не мешали. Выберите пункт Reports в меню Site панели Site . На экране появится диалоговое окно Reports .
Большую часть этого окна занимает иерархический список Select Reports , позволяющий выбрать данные, включаемые в отчет. Он состоит из двух "ветвей": Workflow и HTML Reports . Параметры, предлагаемые первой "ветвью", нужны для рабочей группы, так что мы сосредоточимся на второй "ветви", предлагающей нам задать параметры отчета по HTML . Это "дерево" содержит следующие пункты:
Combinable Nested Font Tags — включает поиск вложенных тегов < font >, которые могут быть безболезненно объединены;
Accessibility - - включает проверку на корректность задания различных элементов страницы (все ли таблицы имеют заголовок, задана ли правильная кодировка и т. п.);
Missing Alt Text — включает поиск незаполненных атрибутов alt тегов
Redundant Nested Tags — включает поиск ненужных вложенных тегов;
Removable Empty Tags — включает поиск пустых тегов, которые могут быть безболезненно удалены;
Untitled Documents — включает поиск Web -страниц без названия (без тега < TITLE >).
Каждый из этих пунктов представляет собой флажок, который вы можете установить или сбросить.
Раскрывающийся список Report On позволяет задать, по каким страницам сайта будет выводиться отчет. Здесь доступны четыре пункта:
Current Document — по странице, открытой в активном окне документа;
Entire Local Site — по всему сайту;
Selected
Files in Site — по всем страницам, выделенным в списке файлов;
Folder — по всем страницам, содержащимся в какой-либо папке.
Если вы выбрали последний пункт, ниже раскрывающегося списка Report On появится поле ввода, где вы должны будете ввести путь к нужной папке. Вы также можете щелкнуть мышью по значку папки справа от этого поля ввода и выбрать нужную папку в появившемся на экране диалоговом окне.
Задав необходимые параметры, нажмите кнопку Run . Через некоторое вре­мя Dreamweaver выведет панель Site Reports .
В списке, находящемся в этой панели, перечислены все найденные ошибки в HTML -коде. Вы можете выбрать любую из них. Дважды щелкнув по нужному пункту списка, вы откроете файл, в котором найдена ошибка; при этом окно документа откроется в режиме показа HTML -кода, причем ошибочный фрагмент будет выделен. Чтобы получить сведения о найденной ошибке, нажмите кнопку More Info (с изображением восклицательного знака) — откроется окно справки Dreamweaver с нужными сведениями. А, нажав кнопку Save Report (с изображением дискеты), вы можете сохранить этот отчет в файле формата XML .
Исправьте найденные Dreamweaver ошибки, после чего закройте все окна документов, не забыв сохранить их содержимое. Не годится, чтобы наш сайт, даже и первый, содержал на своих страницах ошибки. Закройте па­нель Site Reports . Можете сделать это без сохранения.
Проверим теперь корректность гиперссылок.
Но что может случиться с гиперссылками? А случиться может, например, следующее. Предположим, вы поместили на свою Web -страницу гипер­ссылку, указывающую на другую страницу (неважно, принадлежит она тому же сайту или совсем другому). Теперь переименуйте или удалите файл той страницы, на которую указывает гиперссылка. Что получится, если посетитель вашего сайта щелкнет по такой гиперссылке? Web -сервер не сможет ее найти и отправит Web -обозревателю, запросившему несуществующую страницу, сообщение об ошибке. (Это так называемая "ошибка 404", печально известная ошибка, чей код равен 404. Да вы и сами, наверное, не раз с ней сталкивались.) А гипересылка, указывающая на несуществующий файл, на­зывается "оборванной" 'или "мертвой".
Конечно, Dreamweaver делает все, чтобы не допустить появления "оборван­ных" ссылок. Но, как говорится, и на старуху бывает проруха. Поэтому в него включены мощные средства выявления некорректных интернет-адресов, будь то адрес Web -страницы, изображения или файла архива.
Проверить корректность гиперссылок можно как на отдельной странице, так и во всем сайте. Чтобы проверить гиперссылки на отдельной странице сайта, сначала откройте ее. После этого выберите пункт Check Links подменю Check Page меню File главного окна или нажмите комбинацию клавиш < Shift >+< F8>. Если вы хотите проверить ссылки на всех страницах сайта, просто выберите пункт Entire Site подменю Check Links контекстного меню панели Site . Также вы можете использовать пункт Check Links Sitewide меню Site панели или комбинацию клавиш < Ctrl >+< F8>. В любом случае после этого на экране появится панель Link Checker .
В верхней части этой панели находится раскрывающий список Show , где можно выбрать, что будет показано в списке, занимающем панель. В этом списке доступны три пункта:
Broken Links — "оборванные"гиперссылки;
External Links "внешние" ссылки, т. е. ссылки, указывающие на другие сайты;
Orphaned Files файлы-"сироты", т. е. файлы, на которые не указывает ни одна гиперссылка. В списке таких файлов должен быть только один пункт — default.htm (наша главная страница).
Как видите, каждый пункт списка содержит адрес страницы, на которой была найдена ссылка, и саму гиперссылку. Щелкнув по любой позиции это­го списка, вы откроете соответствующую Web -страницу в окне документа, причем подсвечена будет как раз выбранная гиперссылка. Нажав кнопку Save Report (с изображением дискеты), вы сможете сохранить этот список в виде обычного текстового файла.
Также Dreamweaver предлагает мощное средство быстрой замены одной гиперссылки на другую по всему сайту. Это может быть полезно, если вы собираетесь изменить один адрес на другой, но не помните, на каких страни­цах он был указан. Для этого выберите пункт Change Links Sitewide в меню Site панели. На экране появится диалоговое окно Change Link Sitewide .
В поле ввода Change All Links To введите адрес, который вы хотите заменить, в поле ввода Into Links To — адрес, на который вы меняете, и нажмите кнопку ОК. Dreamweaver выведет на экран уже знакомое вам окно Update Files ; вам будет нужно только щелкнуть кнопку Update .
    1  2  3  4  5  6  7  8  9  10   Вверх
Copyright©  Бронников М.В 2004г.
Все вопросы комментарии направляйте по адресу SWMR@narod.ru 
  Akavita
Хостинг от uCoz