Веб-Самоделкин. Как самому создать сайт быстро и профессионально

Текст добавлен: 5 октября 2016, 00:43

Текст книги "Веб-Самоделкин. Как самому создать сайт быстро и профессионально"

Автор книги: Алексей Гладкий

Жанры:

Интернет

сообщить о нарушении

Текущая страница: 8 (всего у книги 17 страниц) [доступный отрывок для чтения: 8 страниц]

Назад к карточке книги

Назначение и функциональные возможности программы

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

Основные функциональные возможности программы можно сформулировать следующим образом.

• Формирование и редактирование любых веб-страниц со вставкой всех необходимых элементов (текст, графические объекты, таблицы, анимационные эффекты, и др.).

• Создание файлов и документов на основании шаблона, настройку которого пользователь может выполнить самостоятельно.

• Открытие файла с автоматической перекодировкой для внесения и последующего сохранения необходимых изменений.

• Изменение кодировки документа, что позволяет успешно работать с файлами, созданными под управлением не только Windows, но и других операционных систем.

• Ведение разнообразной работы с текстовыми данными.

• Автоматические формирование и ведение журнала недавно открываемых документов, что позволяет быстро вернуться к работе с любым из них.

• Быстрый и удобный поиск данных в соответствии с предварительно заданными параметрами.

• Использование разных вариантов представлений текущего документа.

• Формирование и администрирование веб-страниц с помощью технологий не только языка HTML, но и языка РНР, а также с применением Java-технологий.

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

Пользовательский интерфейс и инструментарий программы

После запуска программы на экране отображается ее пользовательский интерфейс, который показан на рис. 4.1.

Рис. 4.1. Интерфейс программы HtmlPad

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

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

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

Справа от инструментальной панели находится панель со вкладками. Каждая вкладка содержит инструменты, предназначенные для выполнения соответствующих действий с текущим документом. Отметим, что такой подход практикуется во многих HTML-редакторах (вспомним хотя бы программу CatsHtml, с которой мы познакомились в предыдущей главе).

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

Кстати

Если в данный момент открыто несколько документов в разных рабочих окнах, то для выбора этих документов используйте соответствующие вкладки, которые находятся внизу интерфейса. Поскольку на рис. 4.1 открыто только одно рабочее окно, то и вкладка тоже одна – она называется Document.html (по имени файла документа).

Вдоль левого края рабочего окна (на рис. 4.1 это окно называется Document1.html) расположена инструментальная панель, кнопки которой предназначены для выполнения ряда полезных действий в данном окне. Например, с помощью соответствующих кнопок вы можете включить режим просмотра текущего документа в окне Интернет-обозревателя, переключать режим редактирования и режим просмотра, управлять отображением номеров строк и непечатаемых символов (пробелов, знаков табуляции и т.п.), осуществлять быструю навигацию по рабочему окну, и т. д. Названия кнопок инструментальной панели рабочего окна отображаются в виде всплывающих подсказок при подведении к ним указателя мыши.

Содержимое левой части интерфейса программы зависит от того, какая вкладка открыта в ней в данный момент. Левая часть интерфейса содержит пять вкладок, выбор которых осуществляется слева внизу. На этих вкладках изображены соответствующие значки, а их названия отображаются в виде всплывающей подсказки при подведении указателя мыши. На рис. 4.1 в левой части интерфейса программы открыта вкладка Менеджер файлов(эта вкладка открывается по умолчанию при каждом запуске программы).

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

Настройка программы и подготовка ее к работе

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

Для перехода в режим настройки параметров программы предназначена команда главного меню Сервис ► Параметры. При активизации данной команды на экране открывается окно, изображенное на рис. 4.2.

Рис. 4.2. Настойка параметров программы

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

В разделе Запуск, содержимое которого показано на рис. 4.2, осуществляется настройка параметров запуска программы. Иначе говоря, здесь вы можете определить, каким образом программа должна вести себя сразу после ее запуска. Например, она может автоматически сразу после запуска создать файл того типа, который вы укажете в настройках. Для этого нужно установить флажок Создавать новый файл указанного типа– в результате станет доступным для редактирования расположенный ниже переключатель. Если он установлен в положение Пустой файл, то в находящемся справа раскрывающемся списке нужно выбрать тип файла, который будет создан (например, HTML-документ, текстовый файл, XML-документ, Java-приложение, и т.д.). Отметим, что по умолчанию программа после запуска автоматически создает пустой HTML-документ (на рис. 4.1 этот документ имеет название Document1.html).

Однако программа может создать после запуска не только пустой документ указанного типа, но и документ на основании шаблона. Дело в том, что в программе имеется набор шаблонов для создания разных документов. Чтобы документ на основании подходящего шаблона создавался автоматически сразу после запуска программы, нужно установить переключатель в положение По шаблону, и в расположенном справа раскрывающемся списке выбрать требуемый шаблон ( Стандартный документ HTML, Словарь терминов, Вопрос-ответ, Форма отправки сообщения, Пустой скрипт РНР, и др.). Если, например, вы выберете в данном поле значение Стандартный документ HTML, то после запуска программы в ее рабочем окне будет автоматически сгенерирован следующий код (рис. 4.3).

Рис. 4.3. Создание стандартного HTML-документа

В нижней части раздела Запусксодержится три флажка: Активизировать диалог создания файла, Активизировать диалог открытия файлаи Активизировать диалог советов дня(см. рис. 4.2). Принцип их действия одинаков: если флажок установлен, то при запуске программы на экране отобразится соответствующее окно. Это позволит вам сразу приступить к созданию нового файла, открытию существующего файла либо к просмотре полезных советов. По умолчанию все три флажка сняты.

Раздел Главное окнопредназначен для настройки главного окна программы. Он включает в себя два подраздела – Элементыи Панель файлов.

Подраздел Элементысодержит перечисленные ниже флажки.

• Стандартная панель кнопок.

• Служебная панель вкладышей.

• Панель вкладышей с кнопками быстрой вставки.

• Панель вкладышей открытых файлов.

• Панель состояния.

Эти флажки предназначены для управления соответствующими элементами интерфейса программы. По умолчанию установлены все флажки.

Содержимое подраздела Панель файловпоказано на рис. 4.4.

Рис. 4.4. Настройка программы, подраздел «Панель файлов»

В данном подразделе осуществляется настройка отображения вкладок, которые появляются внизу интерфейса при открытии файлов (на рис. 4.3 имеется одна такая вкладка, она называется document1.html). В поле Месторасположение панелииз раскрывающегося списка выбирается место, где будут отображаться названия вкладок. Возможен выбор одного из двух вариантов: Снизу (над статус строкой)или Сверху (под панелью кнопок). По умолчанию в данном поле выбрано значение Снизу (над статус строкой).

ПРИМЕЧАНИЕ

В программе Html.pad статус строкой называется элемент, известный больше под названием «строка состояния» и находящийся вдоль нижнего края интерфейса.

В разделе Диалогиосуществляется настройка представления диалоговых окон, с которыми периодически приходится работать в программе. Содержимое данного раздела показано на рис. 4.5.

Рис. 4.5. Настройка программы, раздел «Диалоги»

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

В поле Вид файлов и папокможно настроить отображение содержимого окна открытия файлов. Из раскрывающегося списка выбирается один из следующих вариантов: Крупные значки, Мелкие значки, Список(данный вариант предлагается использовать по умолчанию) или Таблица. Все эти варианты представления данных хорошо знакомы любому пользователю Windows.

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

В области настроек Диалог сохранения файловосуществляется настройка окна сохранения файлов. Это делается таким же образом, как и настройка окна открытия файлов.

В разделе Файлы, содержимое которого изображено на рис. 4.6, осуществляется настройка работы с файлами и документами.

Рис. 4.6. Настройка работы с файлами и документами

В программе реализована возможность автоматического ведения журнала документов, с которыми велась работа. Это позволяет при необходимости быстро вернуться к работе с любым из этих документов. Журнал ведется в подменю Файл ► Недавние файлы, и по умолчанию может включать в себя до 10 позиций. Однако вы можете изменить количество документов, включаемых в журнал: для этого нужно в разделе настройки Файлыввести требуемое значение в поле Количество файлов в журнале. Если в данном разделе установлен флажок Очищать журнал при запуске программы, то после каждого запуска программы этот журнал будет пустым (все позиции из него будут удалены автоматически при запуске программы). По умолчанию данный параметр отключен.

Возможности программы предусматривают сохранение документов в разных кодировках. Выбор кодировки осуществляется из раскрывающегося списка в поле Сохранять в кодировке. Возможные варианты – В текущей кодировке(данное значение предлагается использовать по умолчанию), В исходной кодировке файлаи В кодировке Windows.

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

Как видно на рис. 4.6, раздел Файлысодержит один подраздел – Просмотр. В данном подразделе выполняется настройка режима просмотра документов в Интернет-обозревателе. Флажки При просмотре во встроенном в программу браузереи При просмотре во внешнем браузеренаходятся в трех областях – Сохранять документ, Открывать временный HTML-файли Имитация работы сервера. Путем установки/снятия данных флажков вы указываете, какие действия должны выполняться при просмотре текущего документа в окне Интернет-обозревателя.

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

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

Все изменения, выполненные в окне настройки параметров программы, вступают в силу только после нажатия в данном окне кнопки Обновить. С помощью кнопки Отменитьосуществляется выход из данного режима без сохранения выполненных изменений. Обе эти кнопки доступны во всех разделах окна настройки.

Создание, открытие и сохранение документов

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

Чтобы создать новый документ, нужно выполнить команду главного меню Файл ► Создать, которая вызывается также нажатием комбинации клавиш Ctrl+N. Также для этого можно воспользоваться кнопкой Создать новый файл, которая находится в инструментальной панели (напомним, что названия кнопок инструментальных панелей отображаются в виде всплывающих подсказок при подведении к ним указателя мыши). При выполнении любого из перечисленных действий на экране отображается окно открытия файла, которое представлено на рис. 4.7.

Рис. 4.7. Создание нового документа

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

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

Чтобы открыть созданный ранее документ для просмотра и редактирования, нужно в главном меню программы выполнить команду Файл ► Открыть, вызываемую также нажатием комбинации клавиш Ctrl+O. Также для этого можно воспользоваться кнопкой Открыть файл, которая находится в инструментальной панели. При выполнении любого из перечисленных действий на экране отображается окно, в котором нужно щелчком мыши выделить открываемый файл и нажать кнопку Открыть.

По мере работы над документом рекомендуется периодически сохранять вносимые в него изменения. Это позволит избежать потери данных при возникновении нештатной ситуации (программный или аппаратный сбой, внезапное отключение электроэнергии, и т.д.). Для сохранения изменений в документе предназначена команда главного меню Файл ► Сохранить, вызываемая также нажатием комбинации клавиш Ctrl+S. Кроме этого, для сохранения изменений вы можете использовать кнопку Сохранить файл, которая находится в инструментальной панели.

Отметим, что если вы только начали работать с документом и до настоящего момента не сохраняли его в отдельном файле, то при активизации команды Файл ► Сохранитьна экране откроется окно, в котором нужно будет указать путь для сохранения и имя файла. А уже впоследствии с помощью данной команды вы будете просто сохранять внесенные в документ изменения.

Если вы работаете с несколькими документами, то можно одновременно сохранять изменения сразу во всех этих файлах. Для этого в главном меню предназначена команда Файл ► Сохранить все. Также можно воспользоваться кнопкой Сохранить все файлы, которая находится в инструментальной панели.

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

Поиск и замена данных

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

Чтобы приступить к поиску данных, нужно в главном меню программы выполнить команду Поиск ► Найти, которая вызывается также нажатием комбинации клавиш Ctrl+F. Также можно воспользоваться кнопкой Найти в тексте, которая расположена в панели инструментов (напомним, что названия кнопок инструментальных панелей отображаются в виде всплывающей подсказки при подведении к ним указателя мыши). При выполнении любого из перечисленных действий на экране отображается окно настройки параметров поиска, изображенное на рис. 4.8.

Рис. 4.8. Настройка параметров поиска

В данном окне в поле Образецнужно ввести фрагмент текста или программного кода, который требуется найти. Например, на рис. ► .8 в данном поле введено значение

, следовательно – данный тег будет являться объектом поиска.

Под полем Образецс помощью соответствующих параметров можно выполнить дополнительную настройку поиска. Если установлен флажок Только слово целиком, то объектом поиска будет являться только целое слово или текстовый фрагмент, введенный в поле Образец. Иначе говоря, если в поле Образецвведено значение Автомобиль, то такое слова, как Авто, при установленном данном флажке в процессе поиска будут игнорироваться.

Если необходимо, чтобы в процессе поиска учитывался регистр символов (прописные или строчные), то установите флажок С учетом регистра. В этом случае, если в поле Образецвведено слово Авто, то слово автопри поиске будет проигнорировано.

С помощью переключателя Направлениевы можете задать направление поиска относительно текущего положения курсора. Если этот переключатель установлен в положение Вверх, то поиск будет вестись от курсора к началу документа, а при выборе положения Вниз– от курсора к концу документа.

Чтобы начать поиск в соответствии с установленными параметрами, нажмите в данном окне кнопку Найти. В этом случае будет найден первый результат, отвечающий критериям поиска, а чтобы найти следующий, нужно будет повторить поиск. Чтобы найти сразу все соответствующие условиям поиска результаты, нажмите кнопку Найти все.

Кнопка Закрытьпредназначена для выхода из данного режима без выполнения поиска.

Чтобы повторить поиск в соответствии с установленными ранее параметрами, выполните команды главного меню Поиск ► Найти далеелибо нажмите клавишу F3.

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

Для перехода в режим настройки параметров замены выполните команду главного меню Поиск ► Заменитьлибо нажмите комбинацию клавиш Ctrl+H. Также для этого можно воспользоваться кнопкой Заменить в тексте, которая находится в инструментальной панели. При выполнении любого из перечисленных действий на экране отобразится окно, изображенное на рис. ► .9.

Рис. ► .9. Настройка параметров замены

В данном окне в поле Найтинужно ввести слово или текстовый фрагмент, который является объектом поиска, а в поле Заменить– слово или текстовый фрагмент, которым нужно заменить объект поиска. Вы можете осуществлять поиск и замену как во всем документе, так и в предварительно выделенном текстовом фрагменте. Требуемый вариант указывается с помощью переключателя Заменить в. Отметим, что значение Выделенномстановится доступным только в том случае, если в документе был выделен какой-либо фрагмент.

Чтобы выполнить замену в соответствии с установленными параметрами, нужно нажать в данном окне кнопку Заменить(в этом случае будет найден и заменен первый результат поиска) или Заменить все(в этом случае будут одновременно найдены и заменены все объекты поиска).

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

ПРИМЕЧАНИЕ

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

Чтобы быстро перейти к строке, выполните команду главного меню Поиск ► Перейти к строке,либо нажмите комбинацию клавиш Ctrl+G. При этом на экране откроется окно, которое показано на рис. ► .10.