Обзор существующих средств разработки.
Когда впервые в 1959 г. на конференции UNESCO по обработки информации г. Стречи предложил режим разделения времени при решении задач на компьютерах - с этого момента принято отсчитывать начало интерактивных вычислений и, следовательно, исследование человеко - машинного интерфейса. По мере роста мощности компьютеров росли и затраты на диалоговую компоненту программного обеспечения. Вопрос эффективности использования машин обострился во время стремительного выхода на рынок рабочих станций, объединивших интерактивность с графикой. Термин эффективность с тех пор изменил свое значение - если раньше он отражал такие характеристики как процессорное время и объем занимаемой памяти, то теперь под ним понимают простоту разработки, легкость сопровождения и удобство работы с программой. Поэтому затраты на исследование и разработку пользовательского интерфейса являются оправданными.
Разработка любого прикладного программного обеспечения, как правило, подразумевает создание пользовательского интерфейса. Поскольку большинство современных пользовательских интерфейсов основываются на аналогичных идеях (активное использование "мышки", ориентированность на объекты, графика и т. д. - имитация процессов и явлений, возможность использования алгоритмов, знакомых каждому человеку из его обыденной жизни), то существует возможность и необходимость разработки вспомогательного программного обеспечения, предназначенного для создания такого рода "стандартных" интерфейсов, точнее их базисов.
С другой стороны, много - и разнообразие аппаратных и системных платформ, на которых должно будет работать это программное обеспечение, требует его переносимости на уровне исходного кода. Вышеизложенные требования логически приводят к идее переносимого унифицированного программного инструментария для создания пользовательских интерфейсов или, если рассматривать конечный прикладной программный продукт, системы (модуля, блока), которая ведает (заведует, заправляет, обслуживает, управляет) интерфейсом с пользователем.
Можно проклассифицировать такие инструментарии (User Interface tools) согласно схеме:
· Текстовые экранные системы (curse, ncurse, etc).
· Графические экранные системы.
· Многооконные системы (WMS):
· символьно-ориентированные (текстовые);
· графические;
· UI toolkits
· традиционные;
· объектно-ориентированные;
· UIDS - User Interface Development System - система разработки пользовательского интерфейса (инструментарий);
· UIMS - User Interface Management System - система (управления) пользовательского интерфейса (программный модуль - составная часть конечного продукта в совокупности с соответствующей UIDS);
· UIDE - User Interface Development Environment - среда разработки пользовательского интерфейса.
Эта схема не претендует на систематическую классификацию, скорее - это просто перечисление.
В настоящее время большие усилия прикладываются к разработке методов и созданию инструментальных средств в рамках систем, получивших название UIMS - User Interface Management System.
Если же говорить не про классификацию, а про сами средства разработки, на современном рынке программного обеспечения необходимо выделить следующие продукты.
Embarcadero RAD PHP.
Macromedia Dream Viewer.
NetBeans.
CMS Joomla.
CMS Rumba.
CMS Danneo.
1C битрикс.
Выбор и обоснование оптимальной среды разработки
Выбор средства разработки Web-сайта одна из основных задач, возникающих на первоначальном этапе создания любого Интернет-ресурса. Инструмент разработки должен оптимально соответствовать задачам, что позволит в дальнейшем избавиться от множества проблем. В этом номере КИ представляем обзор продуктов Microsoft, предназначенных для разработки и поддержки Web-сайтов.
Предпочтение того или иного инструмента разработки сайта в значительной степени зависит от задач, которые будут решаться с помощью создаваемого Web-ресурса. Условно разделим все сайты на две категории:
· Малофункциональные Web-сайты домашние странички или сайты-визитные карточки небольших фирм. Как правило, основу таких Web-сайтов составляют статичные html-файлы, возможности интерактивного взаимодействия с посетителями не используются или применяются стандартные сервисы (гостевые книги, формы отправки сообщения на e-mail). Поддержка таких Web-сайтов не вызывает затруднений, а их посещаемость невелика.
· Многофункциональные Web-сайты корпоративные сайты, порталы, сайты электронной коммерции. Посетителям этих Web-сайтов предоставляются широкие возможности: доступ к каталогам данных, заказы товаров, виртуальное общение (форумы, чаты), формирование собственных профилей и выбор содержимого страниц по своим интересам. Для реализации подобных сайтов применяется множество различных Web-технологий, их разработка и сопровождение осуществляется уже не одним Web-мастером, а командой Web-разработчиков в течение всего времени существования Web-сайта. Соответственно, возрастают требования к средствам разработки.
Выбор средства разработки будем проводить, отталкиваясь от поставленной задачи и уровня подготовки разработчика.
Embarcadero RAD PHP.
Интегрированная среда разработки веб-приложений на языке программирования PHP, разработанная компанией CodeGear, до июля 2008 года являвшейся подразделением Borland. Основная идея создания этой IDE — визуальное программирование в стиле Delphi, но на PHP и JavaScript. Содержит библиотеку VCL for PHP, содержащую более чем 70 визуальных компонентов. Среда поддерживает базы данных MySQL, Oracle, Microsoft SQL Server, PostgreSQL, InterBase, DB2, Informix, Sybase ASA, Sybase ASE.
Базовые возможности:
§ визуальный редактор форм;
§ дизайнер HTML и поддержка шаблонов;
§ PHP-profiler;
§ интегрированный отладчик PHP;
§ возможность создания собственных компонентов;
§ возможность интеграции с Delphi;
§ Data Explorer и Data Viewer;
§ встроенный HTTP-сервер Apache;
§ события PHP и события JavaScript;
§ поддержка AJAX;
§ множество примеров в стандартной поставке.
До появления Delphi for PHP торговая марка Delphi ассоциировалась исключительно с языком программирования Object Pascal и его потомком Delphi.
С сентября 2010 года Delphi for php выходит под названием RadPhp XE, разрабатывается компанией Embarcadero.
Довольно перспективная среда разработки, возможностей среды неограниченны, подходит для крупномасштабных проектов.
Что особенно радует так это поддержка технологии smarty, что позволяет разрабатывать логику приложения независимо от разработки дизайна проекта, легкость работы с MySQL, MSSQL.(мое сугубо личное мнение).
Из отрицательных качеств продукта хотелось бы отметить относительно большое количество ошибок в библиотеке VCL for PHP, что приводит иногда к непредсказуемым последствиям.
Dreamweaver — WYSIWYG HTML-редактор от компании Adobe. Изначально разработан и поддерживался компанией Macromedia, вплоть до 8-й версии (2005 год). Следующие версии, начиная с Dreamweaver CS3 (2007), выпускает Adobe. Богатый инструментарий, открытость приложения для всевозможных настроек, удобный интерфейс и другие особенности сделали Dreamweaver одним из наиболее популярных HTML-редакторов в мире. Недостатком считается добавление «лишнего» кода.
CMS Joomla.
Система управления содержимым, написанная на языках PHP и JavaScript, использующая в качестве хранилища базу данных MySQL. Является свободным программным обеспечением, распространяемым под лицензией GNU GPL.
CMS Joomla включает в себя различные инструменты для разработки веб-сайта. Важной особенностью системы является минимальный набор инструментов при начальной установке, который дополняется по мере необходимости. Это снижает загромождение административной панели ненужными элементами, а также снижает нагрузку на сервер и экономит место на хостинге.
Joomla позволяет отображать интерфейс фронтальной и административной части на любом языке. Каталог расширений содержит множество языковых пакетов, которые устанавливаются штатными средствами администрирования. Доступны пакеты русского, украинского и ещё некоторых языков стран СНГ.
NetBeans. CMS Rumba. CMS Danneo. 1C битрикс.
Описание вышеперечисленных средств разработки приводиться не будут. Т. к для разработки проекта требуется дополнительное обучение разработчика.
Вывод: Для разработки web - проекта выберем CMS Joomla? Т. к данный продукт обладает всем необходимым функционалом для разработки соответствующего проекта. И в случае нехватки средств функционал может быть легко дополнен.
Общие принципы проектирования сайта.
Создание страниц независящих от разрешения
Резиновый макет получается, если у основного контейнера не задавать ширину вообще (по умолчанию будет 100%) или задать ширину в процентах. Другими словами, не учитывая границы и отступы, сайт, имеющий ширину 100% будет занимать всю видимую часть экрана, не создавая горизонтальной полосы прокрутки.
Примером такого макета можут служить . Он уменьшается по ширине до 755 пикселей до того, как появляется горизонтальная полоса прокрутки, но и при этом она не требуется для просмотра основного содержимого страниц. Фактически, сайт замечательно смотрится вплоть до ширины в 560 пикселей, дальше элементы дизайна уже начинают перекрываться, пропадать или сваливаться вниз. Большинство резиновых макетов имеют такие ограничения и, как я видел, некорректно ведут себя на мобильных устройствах, пока не отключены стили вообще или не применена специальная таблица стилей для мобильных устройств.
Плюсы резинового макета.
При грамотной верстке резиновый макет позволяет достичь большой универсальности в отображении, независимо от ширины окна пользовательского клиента. На практике это встречается довольно редко, но, теоретически, если все делать правильно, то такое возможно.
Резиновый макет совпадает с макетом, применяемым броузером по умолчанию, то позволяет считать его правильным. Но можно ли считать желание разработчика сделать «идеологически правильный» сайт плюсом относительно удобства его использования? Я думаю, что можно;
Резиновый макет сайта позволяет использовать доступное разрешение экрана по максимуму. Большая часть содержания страницы будет «над линией сгиба» (т. е. видимой без дополнительной прокрутки страницы).
Рассмотрим минусы такого макета.
Слишком много доступного для чтения текста страницы и его острое желание заполнить все доступное место может служить во вред удобству пользователей. Слишком много текста может «давить» на пользователя и делать сайт перегруженным или хаотичным. выполнять свою роль, если текст на сайте был значительно увеличен при неизменном отношении высоты строки текста к его размеру (в данном случае получается, что текст «разреживается», и его очень трудно воспринимать). Однако, стоит заметить, что при наличии хорошего дизайна эта проблема возникает только при очень сильном увеличении текста;
У пользователей с небольшими мониторами (640*480 пикселей, также стоит не забывать про мобильные устройства) возникнет горизонтальная полоса прокрутки на сайте. Хотя и это очень нечастая проблема.
Сайт, шириной в 760 пикселей может смотреться довольно неприглядно (слишком узко) на мониторах с большим разрешением экрана;
Небольшая ширина основного контейнера может ограничивать разумное количество столбцов при верстке, но это может быть также и плюсом, потому что заставляет создавать сайт, учитывая такие жесткие рамки (т. е. особо много излишеств и дизайнерских приемов нельзя будет применить, потому что таковы наложенные ограничения).
Расположение текста
Расположению текста на сайте должно уделяться как можно больше внимания. Ведь пользователь приходит на сайт за определенной информацией, и если она представлена в текстовом формате, необходимо сделать все возможное, чтобы он смог прочитать ее и понять. Аудитория сети Интернет представляет собой огромное множество людей, и найти подход к каждому пользователю ресурса невозможно, поэтому существует ряд специальных правил и советов по вопросу расположения текста на странице, соблюдая их, создатель сможет получить грамотную структуру текста на странице, позволяющую посетителям без проблем находить всю интересующую информацию.
Стоит помнить, что люди ищут разную информацию, кому-то интересны поверхностные данные и основные определения по теме, а кто-то нуждается в подробных и точных описаниях по конкретному вопросу искомой темы. Поэтому перед помещением текста на сайт, его необходимо разбить на смысловые части, выделив при этом ключевые моменты. Каждую смысловую часть располагают в отдельном абзаце или подзаголовке, начинаться она должна со слов, определяющих ее суть, потому что первоначально пользователь просто пробегает глазами по тексту, и если он не находит сути информации в течение первых секунд, страница считается не актуальной. Отлично, если абзацы вы отделите друг от друга пустой строкой, используете не слишком мелкий шрифт. Цвет надписей и фон страницы тоже играет роль. Идеально разместить текст на белом фоне, а цвет для шрифта выбрать темный.
При размещении информации стоит придерживаться принципа "от общего к более специализированному", в начале страницы необходимо указать основные моменты по теме, продвигаясь дальше желательно конкретизировать некоторые вопросы, рассматривая частные случаи, разнообразные вопросы, раскрывающие суть, и так далее, при этом нельзя забывать о делении текста на смысловые части.
Важно, чтобы статья содержала как можно больше полезной структурированной информации и как можно меньше лишнего текста, так как размеры статьи желательно строго ограничивать параметрами страницы, потому что пользователю не удобно пролистывать мышкой слишком длинную страницу в поисках необходимой информации. Не зря оптимальным размером статьи для веб-формата является символов.
Если все подготовленные вами данные не умещаются на одну страницу, лучше создать несколько ссылок и разместить тексты в другой части сайта. Размещать текст желательно по центру, так чтобы его ширина была не слишком маленькой и не слишком большой, многие располагают навигационные данные с левого или правого края.
Акцентирование внимания пользователя на ключевых моментах статьи
Подготавливая материал для размещения на web-странице, необходимо найти ключевые моменты текста, такие на которых необходимо заострять внимание посетителей. На странице такие наиболее важные части необходимо выделять, чтобы человек сумел уловить суть, не читая всего содержимого.
Существует довольно много методов акцентирования внимания, и то, какой выберите вы для себя, зависит в первую очередь от дизайна сайта. Ключевые моменты должны начинаться с ключевых слов, это позволит пользователям быстрее ориентироваться в тексте, находя именно то, что они искали. Ключевые слова лучше всего как-нибудь выделять, это можно делать с помощью изменения цвета или шрифта. При этом, если в тексте используется большое количество ключевых фраз и они располагаются близко друг к другу, лучше всего выделять только наиболее важные, иначе данные не будут восприниматься как полная информация. Ключевые фразы и слова можно сделать активной ссылкой, которая будет вести на страницу с более подробным описанием, так пользователь сможет сам выбрать - ознакомиться ему только с общей информацией или же перейти к детальному изучению вопроса.
Ключевые моменты статьи могут обводиться рамочкой, выделяться с помощью шрифта, цвета, подчеркивания и так далее. Главное, чтобы при просмотре страницы в браузере они действительно каким-нибудь образом отличались от основного текста. При этом нельзя допускать, чтобы выделенная область читалась хуже, чем основной текст или отвлекала от него внимание.
Методы ускорения загрузки страниц
Встречается множество сайтов с неоптимизированными изображениями. Сюда входят картинки для статей, логотипы, изображения кнопок и т. д. Одним словом вся графика используемая на сайте. Оптимизировав все изображения, мы можем значительно ускорить загрузку своего сайта за счет уменьшения принимаемой информации. Ко всему этому на данный момент поисковики начали учитывать уровень оптимизации, и при равных условиях выше позиции в выдаче займет тот сайт, который сильнее оптимизирован, поэтому стоит отнестись к этому очень серьезно.
Хочу заметить, что иногда оптимизированные изображения могут менять свой тип, например с gif на png. В этом случае вам нужно будет изменить путь к картинке, указав в конце вместо старого расширения новое. В случае статей, то проще будет заново добавить изображение. Если же картинка являлась элементом темы (шаблона), то придется изменить путь к ней в таблице стилей используемой темы, но зачастую эти изображения не приходится оптимизировать, так как над этим уже позаботились разработчики, но бывают и исключения.
Разработка сайта.
Главная страница.
Главная страница сайта спроектирована в виде блога.
Мотивация: Выбор такого подхода направлен на максимальную динамичность и интерактивность. Т. к пользователь, начиная работать с сайтом, в большинстве случаев открывает первой именно главную страницу, и при добавлении каких либо статей либо материалов администратором, сразу видит новый(добавленный) материал. Следить за обновлением информации на сайте становиться проще, т. к нет необходимости регистрировать подписки на различные сервисы сайта.
С точки зрения администратора сопровождение сайта становиться более простым, удобным и приятным. Т. к нет необходимости для каждой статьи создавать дополнительный пункт меню, либо ссылку. Достаточно просто добавить материал в категорию статей, средствами административной панели.
Разработка навигации сайта.
Навигация на сайте организована средствами главного и верхнего меню.
Оба вышеупомянутых меню организованны средствами одного модуля, и при добавлении пункта в главное меню соответствующий пункт меню добавляется в верхнее меню. Данную возможность предоставляет нам CMS Joomla 1.6 по средствам модульной архитектуры продукта.
Так же предусмотрена возможность ведения статистики просмотров материалов сайта.
Даная возможность организованна средствами модуля «Самое читаемое».
Создана исключительно для более комфортной работы пользователя.
Структура сайта.
Для удобочитаемости структура сайта представлена в виде древовидной структуры.
Сайт
Главная страница
CMS Joomla
Embarcadero RAD PHP
Dreamweaver
Выбор средства разработки
О сайте
Denwer
Фотогалерея
Дополнительные модули.
Данный продукт направлен, прежде всего, на расширяемость и динамичность. Это обусловлено в первую очередь высокими требованиями к данному сайту. Т. к. множество современных сайтов имеют огромное количество возможностей, расширяющих функционал сайта и делающих его более привлекательным для пользователя. Для того чтобы конкурировать, на современном рынке информационных технологий, с другими сайтами, данный продукт должен претерпеть множество изменений, так же необходимо дополнить возможностями современных популярных продуктов.
Исходя, из всего вышесказанного разработчиком было принято решение дополнить функционал такими средствами как:
Авторизация на сайте
Статистика пользователей
Фотогалерея
Галерея имеет минимальное количество возможностей для просмотра изображений, такий как «Следующее изображение», «Предыдущее изображение» «Режим просмотра слайд шоу» и д. р.
Из положительных особенностей модуля хотелось бы отметить быструю загрузку страницы за счет уменьшения принятого трафика, т. к пользователь имеет возможность загрузки желаемого количества изображений.
Загрузка большого изображения происходит только по команде пользователя, сами же изображения представлены небольшими эскизами, созданными на основе реальных изображений. Это значительно снижает оббьем принимаемой информации, что влечет за собой увеличение скорости загрузки страницы и сайта в целом.
Проектирование поиска на сайте.
Современный сайт, в особенности предоставляющий пользователь большое количество информации, должен обладать функциями поиска интересующей информации.
В данном сайте поиск организован в виде отдельного модуля и есть возможность, при необходимости, легко заменить либо настроить уже существующий модуль, при этом структура и ядро сайта это ни как не затронет.
Данный модуль имеет довольно гибкие возможности по поиску информации.
Для демонстрации был произведен поиск по слову “php” результаты поиска и варианты настройки можно увидеть на соответствующем скриншоте.
