Опции ► Автоматическая настройка. Для начинающих пользователей рекомендуется включить режим Новичок, для тех, кто более-менее уверенно чувствует себя в веб-разработке – режим Уверенный, ну а для профессионалов предназначен режим Профессионал. Еще один режим, который называется Минимализм, убирает из интерфейса программы практически все вспомогательные инструменты.
Основные действия с веб-документами
Чтобы приступить к заполнению веб-страницы контентом, ее необходимо сначала создать. Чтобы просмотреть и, при необходимости – отредактировать исходный код созданного ранее веб-документа, его нужно открыть. А чтобы не потерять введенные данные, веб-страницу периодически следует сохранять. Далее мы расскажем о том, каким образом в программе Extra Hide Studio осуществляется создание, открытие и сохранение веб-документов.
Создание новой веб-страницы
Возможности программы Extra Hide Studio предусматривают создание новых веб-документов тремя способами. В первом случае создается совершено пустая страница, во втором – стандартная веб-страница, а в третьем случае можно сформировать веб-страницу на основании имеющегося в программе шаблона (причем таких шаблонов имеется несколько). Рассмотрим подробнее каждый из перечисленных способов.
Чтобы создать пустой документ, нужно выполнить команду главного меню Файл ► Создать или нажать кнопку Создать чистый документ в инструментальной панели (эта кнопка является первой слева). В результате в рабочей области появится вкладка без имени, которая будет полностью пустой (см. рис. 6.1): в данном случае вы будете формировать веб-страницу «с нуля».
Для создания стандартной веб-страницы в главном меню программы предназначена команда Файл ► Создать веб-страницу, вызываемая также нажатием комбинации клавиш Ctrl+N. Также для этого можно воспользоваться кнопкой Создать веб страницу, которая находится в инструментальной панели справа от кнопки Создать чистый документ. В результате выполнения любого из перечисленных действий в рабочей области будет создана вкладка без имени, на которой программа автоматически сгенерирует код, представленный в листинге 5.1.
Листинг 5.1. Код, сгенерированный автоматически при создании веб-страницы
Данный код содержит обязательные элементы Html-страницы – теги идентификации Html-документа, формирования заголовка и основного текста. Также он включает в себя перечень метатегов – но далеко не факт, что все они могут понадобиться. Возможно, придется удалить немалую их часть, либо внести соответствующие корректировки и дополнения – здесь уже все зависит от специфики создаваемого веб-документа.
Что касается создания нового веб-документа на основании шаблона, в программе имеется пять разных встроенных шаблонов: Стандартный дизайн, Слева вертикальное меню, Слева и справа вертикальное меню, CSS стиль и Справа вертикальное меню. Выбор подходящего варианта осуществляется с помощью соответствующей команды подменю Файл ► Создать по шаблону. Независимо от того, какой шаблон вы выбрали, в рабочей области будет создана новая вкладка, на которой отобразится соответствующий исходный код веб-страницы, автоматически сгенерированный программой. Отметим, что главное преимущество создания документов на основании шаблонов заключается в том, что уже на начальной стадии формирования веб-страницы ей будет назначен определенный дизайн.
Чаще всего из всех шаблонов используется шаблон Стандартный дизайн (документ на его основании можно создать не только с помощью соответствующей команды, но и нажатием комбинации клавиш Ctrl+D). В данном случае программа автоматически генерирует код, который представлен в листинге 5.2.
Листинг 5.2. Автоматически сгенерированный код веб-страницы стандартного дизайна
Заголовок |
Текст |
Если проанализировать данный код, то становится очевидно, что стандартный дизайн является довольно простым: по большому счету, кроме выделенного заголовка и установленного расположения данных на странице, в нем ничего особенного нет (имеющиеся метатеги могут пригодиться, а могут и нет).
Несколько более эргономичным выглядит документ, созданный на основании шаблона Слева и справа вертикальное меню. При выбора данного варианта программа генерирует исходный код, который показан в листинге 5.3.
Листинг 5.3. Автоматически сгенерированный код веб-страницы по шаблону «Слева и справа вертикальное меню»
Заголовок | ||
Меню | Текст | Меню 2 |
Можно прямо сейчас посмотреть, как будет выглядеть страница в окне Интернет-обозревателя (для этого нужно перейти на вкладку Просмотр или нажать клавишу F9) именно в данный момент (рис. 6.3).
Рис. 6.3. Так выглядит шаблон страницы при просмотре в окне Интернет-обозревателя
Как видно на рисунке, шаблон представляет собой своего рода предварительную разметку веб-страницы, на основании которой ведется ее дальнейшая разработка.
По такому же принципу создаются веб-страницы на основании шаблонов, в которых вертикальное меню расположено слева или справа.
Отметим, что вы можете отредактировать любой имеющийся в программе шаблон по своему усмотрению. Для этого выберите соответствующую команду в подменю Файл ► Редактировать шаблон. В этом же подменю находится несколько команд под одинаковым названием Пустой шаблон: с их помощью вы можете самостоятельно сформировать любой шаблон и впоследствии использовать его для создания новых веб-документов.
Открытие созданного ранее документа для просмотра и редактирования кода
Как мы уже отмечали ранее, возможности программы предусматривают не только создание новых, но и редактирование имеющихся веб-документов. Иначе говоря, вы можете забрать файл веб-страницы с удаленного сервера на свой компьютер, внести в него с помощью программы Extra Hide Studio требуемые изменения и вновь вернуть на прежнее место (на удаленный сервер).
Чтобы открыть созданный ранее файл для просмотра и редактирования исходного кода, нужно выполнить команду главного меню Файл ► Открыть, вызываемую также нажатием комбинации клавиш Ctrl+O. Кроме этого, можно воспользоваться кнопкой Открыть, находящейся в инструментальной панели. После выполнения любого из перечисленных действий на экране отобразится окно открытия документа, которое показано на рис. 6.4.
Рис. 6.4. Выбор файла для открытия
В данном окне нужно открыть каталог с требуемым файлом, выделить этот файл щелчком мыши и нажать кнопку Открыть или клавишу Enter. В результате исходный код файла отобразится в рабочей области на вкладке, название которой будет соответствовать имени файла.
Сохранение веб-документа
По мере работы над документом рекомендуется периодически сохранять вносимые в него изменения. Это позволит избежать потери данных при возникновении нештатной ситуации (программный или аппаратный сбой, внезапное отключение электроэнергии, и т.д.). Для сохранения изменений в документе предназначена команда главного меню Файл ► Сохранить, вызываемая также нажатием комбинации клавиш Ctrl+S. Кроме этого, для сохранения изменений вы можете использовать кнопку Сохранить изменения, которая находится в инструментальной панели.
Отметим, что если вы только начали работать с документом и до настоящего момента не сохраняли его в отдельном файле, то при активизации команды Файл ► Сохранить на экране откроется окно, в котором нужно будет указать путь для сохранения и имя файла. А уже впоследствии с помощью данной команды вы будете просто сохранять внесенные в документ изменения.
При необходимости вы можете сохранить изменения, выполненные в документе, в отдельном файле под другим именем. Для этого нужно в главном меню выполнить команду Файл ► Сохранить как, после чего в открывшемся окне нужно будет указать путь для сохранения и имя файла. Также для этого можно воспользоваться комбинацией клавиш Ctrl+Alt+S или нажать в инструментальной панели кнопку Сохранить как.
Если вы работаете с несколькими документами, то можно одновременно сохранять изменения сразу во всех этих файлах. Для этого в главном меню предназначена команда Файл ► Сохранить все. Также можно воспользоваться кнопкой Сохранить все открытые документы, которая находится в инструментальной панели.