1.5. Программные средства для разработки

учебно-методического комплекса по дисциплине

«Разработка программных приложений»

Для разработки электронного учебно-методического комплекса по дисциплине «Разработка программных приложений» будут использованы следующие программные и инструментальные средства:

– текстовый процессор Microsoft Word 2010;

– программа для создания презентаций Microsoft PowerPoint 2010;

– стандартный текстовый редактор Notepad;

– веб-браузер Google Chrome;

– язык гипертекстовой разметки или HTML;

– каскадная таблица стилей или CSS;

– фреймворк для веб-разработки Bootstrap.

С помощью текстового процессора Microsoft Word 2010 будут составлены лекции по дисциплине «Разработка программных приложений». Затем эти лекции при помощи все того же текстового процессора Microsoft Word 2010 будут сохранены как файлы в формате .pdf, который представляет собой универсальный формат электронных документов. Преимущество формата .pdf состоит в том, что он сохраняет внешний вид изначального документа независимо от того, в какой программе был создан этот документ. Также файл в формате .pdf можно открыть с помощью любого веб-браузера в отличии, например, от файла в формате .doc.

Для создания электронного учебно-методического комплекса по дисциплине «Разработка программных приложений» было принято решение использовать язык HTML [21]. Главным преимуществом языка HTML будет то, что электронный учебно-методический комплекс, разработанный на основе этого языка, не станет запрашивать обязательного подключения компьютера, на котором производится запуск электронного учебно-методического комплекса, к интернету, то есть комплекс можно будет запускать на любом локальном компьютере. Таким образом, электронный учебно-методический комплекс будет являться автономной информационной системой, которую можно будет передавать студентам в виде файлов на носителе, например на USB-флеш-накопителе.

Для визуального оформления веб-страниц электронного учебно-методического комплекса по дисциплине «Разработка программных приложений» было принято решение использовать каскадные таблицы стилей или CSS [23]. Язык CSS необходим для того, чтобы задать шрифт, указать цвет, разместить определенные блоки информации в необходимых местах HTML-документа и придать веб-страницам желаемое визуальное оформление. CSS-стили являются мощным и практичным механизмом при верстке веб-страниц и оформления блоков, текста и ссылок и картинок [24].

Для верстки макета веб-страниц электронного учебно-методического комплекса по дисциплине «Разработка программных приложений» будет использоваться популярный фреймворк Bootstrap [29]. Данный фреймворк обладает большим количеством инструментов для быстрой и легкой верстки веб-страниц, также фреймворк имеет подробную документацию.

Для написания HTML-кода и CSS-стилей будет использоваться текстовый редактор Notepad. Данный текстовый редактор является стандартным приложением операционной системы Windows.

2. Разработка электронного учебно-методического

КОМПЛЕКСА ПО ДИСЦИПЛИНЕ

«РАЗРАБОТКА ПРОГРАММНЫХ ПРИЛОЖЕНИЙ»

2.1. Разработка макета

Первым этапом создания электронного учебно-методического комплекса по дисциплине «Разработка программных приложений» будет проектирование макета веб-страниц комплекса.

Для начала необходимо определиться с типом макета, который будет использоваться на веб-страницах. В распоряжении разработчиков имеется большое количество различные макетов, несмотря на это, их возможно объединить по некоторым ключевым особенностям: по ширине, по числу колонок, по размещению объектов на экране. Наиболее используемые типы макетов – это макеты с определенной шириной и макеты с колонками [22].

Макеты по ширине, в свою очередь, делятся на следующие типы:

– макеты с заранее установленной шириной;

– макеты с гибкой шириной;

– адаптивные макеты;

– комбинированные макеты.

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

Макет с гибкой шириной охватывает все свободное пространство окна браузера. При этом, если изменять ширину окна веб-браузера или разрешение экрана, то резиновый макет будет подстраиваться под изменяющиеся условия. Веб-страницы, использующие макет с резиновой шириной, хорошо выглядят как на смартфонах или планшетах, так и на ноутбуках или настольных компьютерах [22].

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

Комбинированный макет представляет из себя гибрид макетов с фиксированной и резиновой шириной. В комбинированном макете для отдельных объектов веб-страницы применяется разная ширина. Например, шапка и подвал в таком макете могут быть резиновыми, а область с информацией может иметь фиксированную ширину [24].

Макеты с колонками обычно создаются с двумя колонками на веб-странице. За частую в одной из колонок размещается навигация по сайту, а в другой, более широкой колонке, содержится информация. Количество колонок обусловлено только тем, какой объем информации будет представлен на сайте, и как эта информация будет организована [24].

В ходе изучения различных типов макетов было принято решение разрабатывать веб-страницы электронного учебно-методического комплекса по дисциплине «Разработка программных приложений» используя комбинированный макет.

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

Схематический макет электронного учебно-методического комплекса представлен на рисунке 2.1. Макет состоит из следующий блоков:

– горизонтальное меню с навигацией по сайту;

– вертикального меню с навигацией по сайту;

– блок с основной тематической информацией;

– подвал сайта с информацией об авторском праве.

Рисунок 2.1 – Макет веб-страницы

Макет в веб-браузере будет выглядеть следующим образом: горизонтальное меню будет растянуто на всю ширину окна веб-браузера; центральная часть макета и подвал располагаться будут по центру экрана; ширина для центральной части и подвала будет резиновой.