WWW.DISSERS.RU

БЕСПЛАТНАЯ ЭЛЕКТРОННАЯ БИБЛИОТЕКА

   Добро пожаловать!


Pages:     || 2 | 3 | 4 | 5 |   ...   | 6 |
Федеральное агентство по образованию И.В. Машковцев Создание и редактирование Интернет-приложений с использованием Bluefish и Quanta Plus (ПО для создания и редактирования Интернет-приложений) Учебное пособие Москва 2008 Машковцев И.В.

М 383 Создание и редактирование Интернетприложений с использованием Bluefish и Quanta Plus (ПО для создания и редактирования Интернетприложений): Учебное пособие. – Москва: 2008. – 74 с.

Настоящее учебное пособие включает в себя теоретический и практический материал, позволяющий получить представление о работе в веб-редакторах Quanta Plus и Bluefish. В пособии даны основные понятия веб-разработки, рассмотрен интерфейс редакторов (с иллюстрациями), показаны приемы, позволяющие самостоятельно создавать простейшие веб-страницы, содержатся примеры использования инструментов, задания и материалы для самоконтроля.

Пособие ориентированно на начинающего пользователя и может использоваться как при изучении курса «информатики» в Вузе, так и в системе дополнительного образования.

И.В. Машковцев. Создание и редактирование Интернет-приложений...

Оглавление Предисловие.......................................................................................5 Введение.............................................................................................7 Глава 1. Основы работы с Quanta Plus.............................................9 1.1. Интерфейс..............................................................................................................10 1.1.1. Меню....................................................................................................................11 1.1.2. Рабочая область..................................................................................................11 1.1.3. Панели инструментов........................................................................................13 1.1.4. Служебные панели.............................................................................................1.1.5. Информационные вкладки................................................................................1.2. Первые шаги.........................................................................................1.2.1. Создание HTML-документа...............................................................................1.2.2. Открытие HTML-документа..............................................................................1.2.3. Сохранение HTML-документа..........................................................................1.3. Создание структуры HTML-документа..............................................................1.4. Форматирование текста......................................................................................1.4.1. Размер текста, начертание, цвет......................................................................1.4.2. Выравнивание.....................................................................................................1.4.3. Абзац, новая строка, непрерывный пробел.....................................................1.5. Вставка объектов, их атрибуты.........................................................................1.5.1. Вставка изображения........................................................................................1.5.2. Вставка гиперссылки.........................................................................................1.5.3. Цвет фона веб-страницы, фоновый рисунок....................................................1.6. Таблицы, списки......................................................................................................1.6.1. Вставка таблицы.................................................................................................1.6.2. Создание списков...............................................................................................1.7. Проекты..................................................................................................................1.7.1. Создание проектов.............................................................................................1.8. Фреймы....................................................................................................................1.8.1. Создание фреймовой структуры.......................................................................1.9. Шаблоны..................................................................................................................1.10. Визуальное редактирование...............................................................................Глава 2.Основы работы с Bluefish..................................................2.1. Запуск Bluefish........................................................................................................2.2. Пользовательский интерфейс..............................................................................2.2.1. Рабочая область..................................................................................................2.2.2. Меню и панели инструментов..........................................................................2.2.3. Боковая панель..................................................................................................2.2.4. Строка состояния..............................................................................................2.2.5. Меню Помощь....................................................................................................2.3. Работа с файлами и папками................................................................................2.3.1. Создание файлов................................................................................................2.3.2. Управление каталогами.....................................................................................2.3.3. Открытие файлов................................................................................................2.3.4. Сохранение файлов...........................................................................................2.3.5. Переименование файлов..................................................................................2.3.6. Удаление файлов...............................................................................................2.3.7. Закрытие файлов...............................................................................................И.В. Машковцев. Создание и редактирование Интернет-приложений...



2.3.8. Вставка файлов..................................................................................................2.3.9. Меню Редактирование.......................................................................................2.3.10. Подсветка синтаксиса......................................................................................2.3.11. Дистанционные файлы....................................................................................2.3.12. Кодировка символов........................................................................................2.4. Проекты.................................................................................................................2.5. Некоторые особенности работы в редакторе...................................................2.5.1. Автозакрытие тега..............................................................................................2.5.2. Панели инструментов HTML............................................................................2.5.3. Эскиз изображения...........................................................................................2.5.4. Настройка Панели быстрого доступа..............................................................2.5.5. Закладки.............................................................................................................2.6. Получение Bluefish.................................................................................................2.7. Пример создания веб-страницы с фреймовой структурой...............................Вопросы для самоконтроля и задания для самостоятельного выполнения.....................................................................................Глоссарий..........................................................................................Список литературы..........................................................................И.В. Машковцев. Создание и редактирование Интернет-приложений...

Предисловие В настоящем учебном пособии рассмотрены два веб-редактора для операционной системы Linux: Quanta Plus и Bluefish. Эти редакторы относятся к Свободному Программному Обеспечению (СПО). Исходные коды программ находятся на официальных сайтах для скачивания.

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

Во введении рассмотрены основные понятия веб-разработки: вебсайт, язык разметки гипертекста, его основные возможности, указаны более сложные инструменты, которые поддерживаются данными вебредакторами. Дано несколько советов по подготовке сайта к публикации.

Первая глава посвящена веб-редактору Quanta Plus.

Теоретический материал данного учебного пособия основан на Руководстве пользователя Quanta Plus (F1 при запущенном редакторе), которое является составляющей частью Центра справки KDE в разделе Веб-разработка. Рассмотрен интерфейс программы, операции с файлами и папками, инструменты создания проектов, даны инструкции по работе с редактором начинающему пользователю. Создание HTMLдокументов начинается с создания структуры элементов разметки, применения форматирования текста, вставки объектов с настройкой атрибутов несколькими вариантами, создания таблиц, списков, использования изображений, анимации, разделения веб-страницы на фреймы.

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

Вторая глава описывает интерфейс и инструментарий Bluefish.

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

Нужно заметить, что интерфейс описываемых веб-редакторов очень похож. В Bluefish так же, как и в Quanta Plus, используются проекты, расположение панели инструментов, деление ее на группы вкладок, возможность создавать пользовательские вкладки панели инструментов со своим набором часто используемых кнопок. Открытые И.В. Машковцев. Создание и редактирование Интернет-приложений...

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

Оба редактора используют подсветку синтаксиса: выделение зарезервированных слов (тегов, параметров, значений) цветом, начертанием, которое поддается настройке пользователя;





автоматический ввод и закрытие тегов; нумерацию строк (очень удобную для исправления ошибок сценариев на странице с указанием номера строки, на которой произошла ошибка).

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

Учебное пособие содержит пример создания веб-страницы и набор практических заданий для выполнения в веб-редакторах.

Для создания скриншотов (снимков экрана), описания интерфейса и инструментария редакторов использовались следующие версии:

Quanta Plus 3.5.8 и Bluefish 1.0.5. В более поздних версиях возможны:

добавление элементов интерфейса, измененная цветовая схема по умолчанию, смена пиктограмм кнопок. Снимки были сделаны в операционной системе Линукс Мастер и Легкий Линукс.

Для написания учебного пособия использовались интернет-статьи Алексея Федорчука, Сергея Супрунова и Сергея Яремчука; в переводе англоязычных материалов применялся инструмент Переводчик Google.com. Тезаурус частично заимствован из самоучителя HTML [1, стр. 21-22].

Данное учебное пособие может быть рекомендовано:

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

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

Все пожелания по улучшению учебного пособия, замечания и критику, пожалуйста, присылайте по адресу: spo_method_support@armd.ru.

И.В. Машковцев. Создание и редактирование Интернет-приложений...

Введение Интернет (World Wide Web, «Всемирная паутина») состоит из огромного, постоянно растущего количества порталов, чатов, форумов, поисковых, почтовых серверов, корпоративных и личных веб-сайтов.

Веб-сайт (от англ. website, от web – паутина и site – «место») – это одна или совокупность веб-страниц, доступных в Интернете через протоколы (правила передачи данных) HTTP/HTTPS [3]. Любой пользователь компьютера может самостоятельно создать личный веб-сайт.

Перед созданием сайта необходимо изучить основы языка разметки гипертекста HTML (HyperText Markup Language) по книгам [1,2] или в Сети [20, 21].

Гипертекст позволяет:

• задать расположение объектов на странице;

• задать цвет, размер, шрифт, начертание, выравнивание текста;

• задать цвет фона или фоновое изображение;

• создавать таблицы с различным объединением ячеек, настроить толщину и цвет границ и пр.;

• вставить в документ изображения, анимацию;

• связать HTML-документы гиперссылками;

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

Существуют более сложные способы создания сайтов – с помощью языков PHP, Python, Perl. Код веб-страницы, созданной в PHP, генерируется на сервере, работа организована с использованием баз данных. Поэтому для работы необходимо установить на компьютере виртуальный сервер, а использование HTML не требует установки дополнительного программного обеспечения, кроме веб-редактора. В данном учебном пособии будет рассматриваться работа с двумя вебредакторами, для создания веб-страниц можно использовать любой.

Также стоит рассмотреть использование каскадных таблиц стилей CSS для задания единого форматирования всему сайту внутри кода страницы или в отдельном файле.

В данном пособии будем использовать фрагменты кода языка HTML. Язык HTML представляет собой набор элементов, причем начало и конец каждого элемента обозначается специальными единицами – тегами. Теги бывают одиночными и парными. Парные теги состоят из начальных (открывающих) и конечных (закрывающих, начинающимися со знака "/"). Например, теги тела веб-страницы:

и [3, 21].

Для расширения возможностей в составе кода веб-страницы И.В. Машковцев. Создание и редактирование Интернет-приложений...

используют программы – скрипты или сценарии (чаще это Javascript).

Готовые скрипты, выполняющие определенную функцию, можно скачать в Сети.

Цвет в HTML-документе задается дюжиной зарезервированных слов или числом в шестнадцатеричной системе счисления (например, ff0000 – красный цвет).

Готовый сайт размещается на сервере, он имеет уникальный адрес (IP-адрес, например, 82.200.16.13 или доменное имя, например, tspu.edu.ru). Адрес можно зарегистрировать в поисковых системах, разместить рекламу (в виде баннеров или ссылок) на других сайтах.

Просмотр веб-страниц осуществляется специальной программой – браузером (от англ. browser — просмотрщик). Наиболее распространенными браузерами являются Microsoft Internet Explorer, Netscape Navigator, Mozilla Firefox, Opera. В каждой операционной системе имеется браузер, а также иногда можно инсталлировать дополнительные. Современные мобильные устройства позволяют установить (в качестве java-приложения) браузер Opera Mini, последняя версия (4-я на момент написания данного пособия) позволяет просматривать веб-страницы в уменьшенном виде с возможностью увеличения интересующих фрагментов и перемещения по странице.

Pages:     || 2 | 3 | 4 | 5 |   ...   | 6 |










© 2011 www.dissers.ru - «Бесплатная электронная библиотека»

Материалы этого сайта размещены для ознакомления, все права принадлежат их авторам.
Если Вы не согласны с тем, что Ваш материал размещён на этом сайте, пожалуйста, напишите нам, мы в течении 1-2 рабочих дней удалим его.