Узнайте о создании ссылок и навигации в Dreamweaver, а также об абсолютных путях, путях относительно документа и путях относительно корня сайта.
После настройки сайта Dreamweaver для хранения документов вашего веб-сайта и создания HTML-страниц вам потребуется создать связи между документами.
Dreamweaver предоставляет несколько способов создания ссылок на документы, изображения, мультимедийные файлы или загружаемое программное обеспечение. Вы можете создавать ссылки на любой текст или изображение в любом месте документа, включая текст или изображения в заголовке, списке, таблице, абсолютно позиционированном элементе (AP-элемент) или фрейме.
Существует несколько различных способов создания связей и управления ими. Некоторые веб-дизайнеры предпочитают создавать ссылки на несуществующие страницы или файлы в процессе работы, в то время как другие сначала создают все файлы и страницы, а затем добавляют ссылки. Еще один способ управления ссылками — создание страниц-заглушек, в которых вы добавляете и тестируете ссылки перед завершением всех страниц сайта.
Абсолютные, относительные от документа и относительные от корня сайта пути
Понимание пути к файлу между документом, из которого вы создаете ссылку, и документом или ресурсом, на который вы ссылаетесь, является ключевым для создания ссылок.
Каждая веб-страница имеет уникальный адрес, называемый универсальным указателем ресурса (URL). Однако при создании локальной ссылки (ссылки от одного документа к другому на том же сайте) обычно не указывают полный URL документа, на который ссылаются; вместо этого указывают относительный путь от текущего документа или от корневой папки сайта.
Существует три типа ссылочных путей.
Абсолютные пути (например, http://www.adobe.com/ru/support/dreamweaver/contents.html).
Пути относительно документа (например, dreamweaver/contents.html).
Пути относительно корня сайта (например, /support/dreamweaver/contents.html).
С помощью Dreamweaver можно легко выбрать тип пути к документу, который будет создан для ваших ссылок.
Лучше всего использовать предпочитаемый вами тип ссылок, с которыми вам комфортнее всего работать: пути относительно корня сайта или документа. Переход по ссылкам (в отличие от ввода путей) гарантирует правильность указания пути.
Абсолютные пути
Абсолютные пути предоставляют полный URL связанного документа, включая протокол для использования (обычно http:// для веб-страниц), например, http://www.adobe.com/support/dreamweaver/contents.html. Для изображений полный URL-адрес должен выглядеть следующим образом: http://www.adobe.com/ru/support/dreamweaver/images/image1.jpg.
Абсолютный путь необходимо использовать для ссылки на документ или ресурс на другом сервере. Также можно использовать абсолютные пути для локальных ссылок (на документы того же сайта), но этот подход не рекомендуется — если вы переместите сайт в другой домен, все ваши локальные ссылки с абсолютными путями перестанут работать. Использование относительных путей для локальных ссылок также обеспечивает большую гибкость, если потребуется перемещать файлы внутри сайта.
При вставке изображений (не ссылок) можно использовать абсолютный путь к изображению на удаленном сервере (то есть к изображению, которое недоступно на локальном жестком диске).
Пути относительно документа
Пути относительно документа обычно лучше всего подходят для локальных ссылок на большинстве веб-сайтов.Они особенно полезны, когда текущий документ и связанный документ или ресурс находятся в одной папке и, вероятно, останутся вместе. Также можно использовать путь относительно документа для ссылки на документ или ресурс в другой папке, указав путь через иерархию папок от текущего документа к связанному документу.
Основная идея относительных от документа путей заключается в том, чтобы опустить часть абсолютного пути, которая одинакова для текущего документа и связанного документа или ресурса, предоставив только ту часть пути, которая отличается.
Предположим, ваш сайт имеет следующую структуру.
Для ссылки от contents.html на hours.html (оба в одной папке) используйте относительный путь hours.html.
Для ссылки от contents.html на tips.html (в подпапке resources) используйте относительный путь resources/tips.html. При каждой косой черте (/) вы спускаетесь на один уровень в иерархии папок.
Для ссылки от contents.html на index.html (в родительской папке, на один уровень выше contents.html) используйте относительный путь ../index.html. Две точки и косая черта (../) поднимают вас на один уровень в иерархии папок.
Для ссылки от contents.html на catalog.html (в другой подпапке родительской папки) используйте относительный путь ../products/catalog.html. Здесь ../ переводит вас в родительскую папку, а products/ — в подпапку products.
Когда вы перемещаете файлы как группу — например, когда вы перемещаете целую папку, чтобы все файлы внутри этой папки сохраняли одинаковые относительные пути друг к другу — вам не нужно обновлять относительные ссылки документа между этими файлами. Однако когда вы перемещаете отдельный файл, который содержит относительные ссылки документа, или отдельный файл, на который указывает относительная ссылка документа, вам нужно обновить эти ссылки. (Если вы перемещаете или переименовываете файлы с помощью панели «Файлы», Dreamweaver автоматически обновляет все соответствующие ссылки.)
Пути относительно корня сайта
Пути относительно корня сайта описывают путь от корневой папки сайта к документу. Вы можете захотеть использовать эти пути, если работаете с крупным веб-сайтом, который использует несколько серверов, или один сервер, на котором размещено несколько сайтов. Однако если вы не знакомы с этим типом пути, возможно, стоит придерживаться относительных путей документа.
Путь относительно корня сайта начинается с ведущей косой черты, которая обозначает корневую папку сайта. Например, /support/tips.html это путь относительно корня сайта к файлу (tips.html) в подпапке support корневой папки сайта.
Путь относительно корня сайта часто является лучшим способом указать ссылки, если вы часто перемещаете HTML-файлы из одной папки в другую на вашем веб-сайте. Когда вы перемещаете документ, который содержит ссылки относительно корня сайта, вам не нужно изменять ссылки, поскольку ссылки относятся к корню сайта, а не к самому документу; например, если ваши HTML-файлы используют ссылки относительно корня сайта для зависимых файлов (таких как изображения), то если вы перемещаете HTML-файл, его ссылки на зависимые файлы остаются действительными.
Однако когда вы перемещаете или переименовываете документы, на которые указывают ссылки относительно корня сайта, вы должны обновить эти ссылки, даже если пути документов относительно друг друга не изменились. Например, если вы перемещаете папку, вы должны обновить все ссылки относительно корня сайта к файлам в этой папке. (Если вы переместите или переименуете панель «Файлы», Dreamweaver обновляет все соответствующие ссылки автоматически.)
Создание красивых веб-сайтов в Dreamweaver
Создавайте дизайн, пишите код и управляйте динамическими веб-сайтами с помощью многофункционального инструмента.
