Инструментальные системы разработки интернет-приложений

Описание системы на примере Instant CMS

Возможности Instant CMS

Instant CMS — система управления содержанием, написанная на языке PHP и использующая MySQL. Instant CMS является свободным программным обеспечением и включает в себя различные инструменты для изготовления веб-сайта. Важной особенностью системы является минимальный набор инструментов при начальной установке, который обогащается по мере необходимости.

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

Характеристики Instant CMS:

• — полностью основанный на БД движок с использованием PHP/MySQL;
• — модуль безопасности для многоуровневой аутентификации пользователей/администраторов;
• — полностью настраиваемые схемы расположения элементов;
• — закачка изображений при помощи браузера в собственную библиотеку — для последующего использования с любого места сайта;
• — Форум/Опросы/ для эффективной обратной связи;

Возможности администрирования:

• — возможность создавать неограниченное количество страниц;
• — четкая организация структуры сайта;
• — для каждой динамической страницы можно создать свое описание и ключевые слова в целях повышения рейтинга в поисковых системах;
• — возможность ограничить доступ к определенным разделам сайта только для зарегистрированных пользователей;
• — секции новостей, продукции или услуг легко редактируемы и управляемы;
• — полностью настраиваемые схемы расположения элементов по областям, что позволяет сделать оригинальный дизайн;
• — закачка изображений при помощи браузера в вашу собственную библиотеку — для последующего использования с любого места сайта;
• — опросы и голосования для эффективной обратной связи;
• — возможность создания не одной, а нескольких форм обратной связи для каждого контакта;
• — библиотека изображений позволит хранить все GIFи JPEG-файлы под рукой для лёгкого доступа;
• — менеджер рассылки новостей. Можно выбрать более чем 360 служб рассылки новостей по всему миру;
• — выбор из 3 визуальных редакторов, что упрощает редактирование материалов до уровня редактирования текста в программе Word;
• — экономное использование места на сервере за счет использование базы данных MYSQL;

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

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

Отталкиваясь от простоты и надежности данной системы, мною для реализации дипломного проекта была выбрана Instant CMS.

Рисунок 2 — Внешний вид Instant CMS.

Описание Adobe Photoshop CS

Adobe Photoshop — многофункциональный графический редактор, разработанный и распространяемый фирмой Adobe Systems. В основном, работает с растровыми изображениям, однако имеет некоторые векторные инструменты. Продукт является лидером рынка в области коммерческих средств редактирования растровых изображений, и наиболее известным продуктом фирмы Adobe.

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

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

При помощи команды View — New guide (Показать-Новые направляющие) можно разметить страницу в соответствии с модульной сеткой. Это позволяет добиться точного совпадения размеров эскиза и конечного документа. Кроме того, можно воспользоваться уже готовыми сетками, разработанными под разные разрешения мониторов. Как правило, такие сетки предлагаются авторами совершенно бесплатно.

Фон страницы может быть однотонным, для этого при помощи команды Paint Bucket Tool (Заливка) с установленным значением Foreground (Фоновый цвет) следует заполнить пространство документа выбранным цветом. Кроме того, фоном может служить какое-либо изображение или же узор. Узором пространство макета также заполняется при помощи команды Paint Bucket Tool, но с установленным значением Pattern (Узор).

Теперь можно приступать к созданию элементов страницы. Начинают обычно с «шапки» — верхнего блока, в котором содержится название сайта. Цвет и форма «шапки» могут быть произвольными, например можно сделать «шапку» прямоугольной или со скругленными углами, в цвет фона или же контрастной. «Шапка» выполняется во всю ширину документа, ее высота — строго фиксирована.

Создать необходимое прямоугольное выделение можно при помощи инструмента Rectangular Marquee Tool (Прямоугольное выделение). Изменяя параметр Feather этого инструмента можно задать необходимое скругление для углов.

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

Отдельным шагом можно выделить создание кнопок и иконок для дизайна сайта. В зависимости от идеи дизайна, они могут быть строгими деловыми или же, наоборот, веселыми. Кнопки, как правило, создаются при помощи все того же Rectangular Marquee Tool. Задать кнопкам другую, непрямоугольную форму, можно с помощью инструмента Pen Tool (Перо). С помощью Pen Tool можно создавать и различные иконки произвольной формы.

Надписи на кнопках и иконках выполняются при помощи инструмента Horizontal Type Tool (Горизонтальный текст) или Vertical Type Tool (Вертикальный текст). В настройках инструмента можно задать любую необходимую гарнитуру шрифта и его размер, задать выравнивание текста.

Для дальнейшей работы над дизайном сайта, готовый шаблон необходимо разрезать на части. Это нужно для того, чтобы поместить шаблон в ячейки таблицы при html-верстке страницы. Разрезать шаблон следует с помощью инструмента Slice Tool (Раскройка). Кусочки изображения (slices) по размерам должны соответствовать элементам будущей html-страницы.

С помощью команды Save for Web&Devices необходимо сохранить разрезанное изображение. В диалоговом окне следует выбрать тип файлов HTML&images и сохранить файл с именем «index.htm» или «index.html». Теперь шаблон дизайна сайта состоит из файла index. html и каталога images, в котором находятся нарезанные кусочки макета. С помощью «Блокнота» или любого html-редактора файл index. html редактируется при необходимости.

Дизайн сайта в Photoshop лучше всего «собирать» как конструктор. Для этого разные элементы удобно размещать на разных слоях, которые при необходимости можно перемещать, объединять, скрывать и т. д.

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

Плагины в Adobe Photoshop — это специальные надстройки, которые дополняют редактор новыми функциями или же модифицируют уже имеющиеся. При помощи плагинов визуальные эффекты для дизайна сайта в фотошопе также можно создать всего одним кликом.

Как изменить дизайн сайта?

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

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