Разработка сайта на cms «joomla»

ДИПЛОМНАЯ РАБОТА НА ТЕМУ

РАЗРАБОТКА САЙТА НА CMS «JOOMLA»













Москва, 2015 г.




Содержание

Глава 1. Постановка задачи                                                                 
	1.1. Обзор существующих CMS. «Joomla»
	1.2. Обзор существующих CMS. «Drupal»
	1.3. Обзор существующих CMS. «WordPress»
	1.4. Достоинства и недостатки каждой CMS
Глава 2. Установка CMS «Joomla»
2.1. Установка и настройка локального сервера XAMPP
2.2. Установка CMS «Joomla» на локальный сервер XAMPP
2.3. Заключительный шаг установки
2.4. Заключение
Глава 3. Принципы разработки дизайна сайта с использованием графического редактора
3.1. 	О программном продукте Adobe Photoshop
3.2. 	Шаблон Adobe Photoshop для дальнейшей разработки сайта
3.3 . 	Заключение
Глава 4. Верстка шаблона 
4.1. Язык гипертекстовой разметки HTML
4.2. Каскадные таблицы стилей CSS
4.3. Гипертекстовый процессор PHP
4.4. Разработка шаблона под CMS «Joomla»
4.5. Заключение
Глава 5. Средство публикации сайта в Интернете
5.1. О хостингах
5.2. Сравнение хостингов
5.3. Заключение


Глава 6. Экономическая часть 
6.1. Характеристика проекта
6.2. Расчет норм времени по стадиям проектирования
6.3. Определение поправочных коэффициентов по стадиям проекта 
6.4. Расчет общей трудоемкости работ и численности разработчиков
Глава 7. Используемая литература






















Глава 1. Постановка задачи

Задача: создание сайта с помощью CMS «Joomla».
     Требования: структура сайта должна быть понятной, позволять посетителю сайта с легкостью найти нужную опубликованную информацию.
     Навигация сайта должна быть представлена в виде меню, обеспечивающее понятный доступ к страницам сайта.
     Сайт должен выглядеть одинаково в популярных веб-браузерах, таких как Internet Explorer, Opera, Firefox, Safari, Google Chrome.
     Сайт должен корректно отображаться для посетителей, у которых разрешение экрана 1000х800 и выше.
     Дизайн сайта должен быть выполнен в единой цветовой схеме, без включения таких элементов, которые бы не сочетались с этой цветовой схемой по цвету.
     У материалов на сайте должны отсутствовать стилистические и грамматические ошибки.
     
     1.1. Обзор существующих CMS. «Joomla»
     
     CMS «Joomla» - это система управления контентом, написанная на языке PHP и использующая в качестве хранилища содержания базу данных MySQL. «Joomla» является свободным программным обеспечением, защищённым лицензией GPL. Одной из главных особенностей «Joomla» является относительная простота управления при практически безграничных возможностях и гибкости при изготовлении сайтов. Название «Joomla» фонетически идентично слову «Jumla», которое в переводе означает «все вместе» или «единое целое», что отражает подход разработчиков и сообщества к развитию системы. Это название было выбрано сообществом среди многих, прошло проверку профессионалами маркетинга, и было решено, что «Joomla» - это самый удачный выбор.
     Система управления содержанием «Joomla» является ответвлением широко известной CMS «Mambo». Команда независимых разработчиков отделилась от проекта Mambo по причине несогласия в экономической политике. 16 сентября 2005 года в свет вышла первая версия «Joomla», являющаяся по сути переименованной Mambo и включающая в себя исправления найденных на тот момент ошибок и уязвимостей.
     CMS «Joomla» включает в себя различные инструменты для изготовления web-сайта. Важной особенностью системы является минимальный набор инструментов при начальной установке, который обогащается по мере необходимости. Это снижает загромождение административной панели ненужными элементами, а также снижает нагрузку на сервер и экономит пространство на хостинге.
     
     1.2. Обзор существующих CMS. «Drupal»
     
     CMS «Drupal» - система управления содержимым, используемая также как каркас для веб-приложений, написанная на языке PHP и использующая в качестве хранилища данных реляционную базу данных (поддерживаются MySQL, PostgreSQL и другие). «Drupal» является свободным программным обеспечением, защищённым лицензией GPL, и развивается усилиями энтузиастов со всего мира.
     CMS получила множество наград. Эта система является победителем конкурса «Best open source applications 2010» в категории «Лучшая система управления web-контентом», трижды - в 2007, 2008 и 2009 годах - получила награду Webware 100, которая присуждается лучшим на сегодня сайтам, сервисам и приложениям Сети.
     Архитектура CMS «Drupal» позволяет применять ее для построения различных типов сайтов - от блогов и новостных сайтов до информационных архивов или социальных сетей. Имеющуюся по умолчанию функциональность можно увеличивать подключением дополнительных расширений - «модулей» в терминологии «Drupal». 
     «Drupal» имеет модульную архитектуру с компактным ядром, предоставляющим API, к которому могут обращаться модули. Стандартный набор модулей включает такие функции, как новостная лента, блог, форум, загрузка файлов, сборщик новостей, голосования, поиск и другие. Дизайн сайта меняется также посредством специальных модулей - «тем оформления».
     
     1.3. Обзор существующих CMS. «WordPress»
     
     CMS «WordPress» - система управления содержимым сайта с открытым исходным кодом, распространяемая под GNU GPL. Написана на PHP, в качестве базы данных использует MySQL. Сфера применения - от блогов до достаточно сложных новостных ресурсов и интернет-магазинов. Встроенная система «тем» и «плагинов» вместе с удачной архитектурой позволяет конструировать практически любые проекты.
     CMS получила несколько наград:
    • 2007 год - победа на Open Source CMS Award;
    • 2009 год - признана лучшей на Open Source CMS Award;
    • 2010 год - победа в категории «Зал славы CMS» на Open Source Awards;
    • 2011 год - признана открытым веб-приложением года на ежегодном конкурсе The Critters.
     
1.4. Достоинства и недостатки каждой CMS

Достоинства «Joomla»
Недостатки «Joomla»
Абсолютно бесплатный доступ, что очень важно особенно для начинающих веб-мастеров, а также таких пользователей, которые в силу причин не хотят платить за обслуживание;

открытый системный код, который позволяет при необходимости и наличии определенных навыков изменять в том числе и сам движок;

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

гибкость. При помощи одного и того же шаблона всегда можно сменить вид целого модуля или его компонента без исправления кода движка. Все такие изменения затем сохраняются в готовом шаблоне, однако их создание и применение требует знания PHP, CSS и JS;

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

довольно долгая загрузка страниц сайта, созданного на данной CMS именно вследствие наличия лишнего кода;

недостаточно понятная панель администрирования, опять же создающая сложности начинающим веб-мастерам. Если нет возможности получить консультацию, то лучше будет выбрать более простую систему управления.
Достоинства Drupal
Недостатки Drupal
«Drupal» обладает всеми возможностями, необходимыми для эффективного управления содержимым сайта. Базовая комплектация «Drupal» содержит все основные инструменты, которые могут потребоваться для полноценного функционирования сайта, – RSS-каналы, регистрация пользователей, настройка макета страницы, управление меню, системное администрирование;

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

создавать контент в «Drupal» очень просто. Система позволяет создавать пользовательские списки, организовывать контент через URL, создавать ассоциированный контент и контент по умолчанию. Это значительно облегчает организацию, поиск и повторное использование контента;

более 7000 расширений «Drupal» позволяют вам добавлять новые возможности в ваш проект. Расширения бесплатны для скачивания и использования, и вы можете использовать любое их количество, расширяя, тем самым, функциональность своего сайта.
«Drupal» весьма мощная и функциональная система, но из-за своей сложности и, следовательно, высокой кривой обучаемости она не такая дружественная к пользователю, как некоторые другие CMS. Такие системы, как «WordPress» и «Joomla» могут оказаться более удобными для конечного пользователя, но они значительно проигрывают в мощности «Drupal»;

в случае эксплуатационных качеств «Drupal» уступает «WordPress» по двум аспектам — масштабируемость и скорость загрузки страниц. Также у «Drupal» отсутствует обратная совместимость. Это означает, что если вы привыкли к другой системе управления контентом, то «Drupal» может показаться вам не совсем верным выбором;

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

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

для того чтобы создавать собственные уникальные шаблоны, необходимо обладать знаниями в области CSS;

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

система часто обновляется, что является неудобством при администрировании сайта.





















Глава 2. Установка CMS «Joomla»

2.1. Установка и настройка локального сервера XAMPP

	Для начала работы нам понадобится локальный сервер XAMPP, скачать его можно с официального сайта - https://www.apachefriends.org/ru/index.html (рис. 1). При работе в операционной системе Mac OS X, необходимо выбрать соответствующую версию.



Рис. 1. Официальный сайт

     Открываем скачанный образ диска и запускаем установщик. В окне установщика вплоть до того, как сервер начнет устанавливаться, жмем «Next». Сервер по умолчанию установится в папку «Программы». Давайте рассмотрим структуру сервера, а вернее наиболее важные папки и файлы, показанные на рис. 2.:
     
Рис. 2. Структура сервера

* «xamppfiles» – папка, в которой находятся панель администрирования сервера phpMyAdmin версии 4.2.7.1, гипертекстовый процессор PHP версии 5.5.15, веб-сервер Apache версии 2.4.10 и высокоуровневый интерпретируемый динамический язык программирования общего назначения Perl версии 7.0.42;
* «etc» - папка, в которой находятся важные конфигурационные файлы Apache и PHP. Чаще используются опытными веб-мастерами;
* «htdocs» - папка, в которой будет храниться наш веб-сайт;
* «manager-osx» - конфигуратор веб-сервера, без которого веб-сайт не сможет функционировать.
   Теперь настроим наш веб-сервер. Для этого откроем конфигуратор «manager-osx», перейдем на вкладку «Manage Servers» (рис. 3).


Рис. 3. Мониторинг серверов

* «MySQL Database» - показывает, запущен ли сервер баз данных;
* «ProFTPD» - показывает, запущен ли сервер FTP (протокол передачи файлов);
* «Apache Web Server» - показывает, запущен ли веб-сервер Apache.












   Проверим конфигурацию серверов MySQL и Apache. Для этого выберем нужный и нажмем «Configure». Порт у MySQL должен иметь значение «3306», а порт у Apache – «80» (рис. 4 и 5). Если все введено правильно – идем дальше.

Рис. 4. Конфигурация MySQL


Рис. 5. Конфигурация Apache


   Для того, чтобы начать разрабатывать веб-сайт, надо запустить эти два сервера. Чтобы это сделать, надо выбрать каждый левой кнопкой мыши и нажать «Start», перейти на вкладку «Welcome» и нажать «Go To Application». Откроется веб-браузер с нашей серверной страничкой (рис. 6), где нужно будет выбрать язык. Здесь надо выбрать английский (English).

Рис. 6. Начальная серверная страничка

	









     После выбора языка откроется главная страница сервера (рис. 7). 

Рис. 7. Главная страница веб-сервера
	
	Здесь нам понадобится страница «phpMyAdmin», она же панель администрирования сервером. Необходимо будет создать новую базу данных, в которой будут храниться компоненты CMS «Joomla». Если сервер при переходе в панель просит ввести логин и пароль, то по умолчанию они всегда будут root. Панель администрирования показана на рис. 8:

Рис. 8. Панель администрирования phpMyAdmin

	На вкладке «Базы данных» теперь нужно ввести название базы, установить сравнение на «utf8_general_ci». Результат показан на рис. 9. Чтобы сохранить результат, надо нажать на кнопку «Создать».

Рис. 9. Создание базы данных

2.2. Установка CMS «Joomla» на локальный сервер XAMPP

	Теперь установим CMS «Joomla» на веб-сервер. Скачать последнюю версию можно с сайта http://joomla.ru/. Распаковываем скачанный архив с папкой, папку переименовываем в «joomla» и переносим в папку «htdocs» нашего локального веб-сервера. Окончательная структура сервера вместе с CMS показана на рис. 10:

Рис. 10. Окончательная структура сервера с CMS

	Перейдем в веб-браузере по адресу – localhost/joomla, откроется установщик CMS. В поля формы вводим данные – название сайта, электронный адрес администратора, логин и пароль администратора. Так как мы разрабатываем сайт на локальном сервере, то в качестве логина и пароля опять же можно использовать root. Итог показан на рис. 11. Если вы ввели все данные на первой странице, жмем «Далее». 

Рис. 11. Установщик CMS «Joomla»

     На второй вкладке «Конфигурация БД» (рис. 12) нужно настроить подключение к базе данных. Тип базы данных выбираем «MySQL», имя сервера базы данных оставляем неизменным, то есть «localhost». Имя пользователя – это имя пользователя баз данных, здесь снова вводим root, потому что как я уже говорил, мы работаем на локальном веб-сервере. На данном этапе пароль не вводим, иначе наша CMS не установится. После введения данных жмем «Далее».

Рис. 12. Настройка подключения к базе данных

	На вкладке «Обзор» (рис. 13) можно увидеть свою настроенную конфигурацию, которую можно выслать на ваш электронный адрес, введенный при настройке, если возле опции «Отправить конфигурацию сайта на e-mail» выставить флажок на «Да». У опции «Установка демо-данных» выставляем флажок на «Нет», жмем «Установка».

Рис. 13. Вкладка «Обзор»

	После того, как наша CMS установится (рис.  14), нужно будет удалить директорию «Installation», поэтому жмем на соответствующую кнопку. Если система выдала ошибку, удаляем папку «Installation» вручную, которая находится в корневой папке «Joomla» (см. рис. 10).

Рис. 14. Успешная установка CMS «Joomla»

2.3.  Заключительный шаг установки 

	После того, как папка «Installation» будет удалена, надо в веб-браузере перейти по адресу localhost/joomla/administrator/. Откроется форма входа в панель администратора CMS «Joomla» (рис. 15). В открывшихся окнах вводим логин и пароль, указанные нами в установщике CMS (см. рис. 11) и жмем «Войти».

Рис. 15. Форма входа в панель администратора

2.4. Заключение

     В результате проделанной работы нами был установлен сервер ХАМРР и CMS «Joomla».
     
     
     
     
     
     
     
     
     


     
Глава 3. Принципы разработки дизайна сайта с использованием графического редактора
     
     3.1. О программном продукте Adobe Photoshop
     
     Adobe Photoshop – многофункциональный графический редактор, разработанный и распространяемый фирмой Adobe Systems. В основном работает с растровыми изображениями, однако имеет некоторые векторные инструменты. Продукт является лидером рынка в области коммерческих средств редактирования растровых изображений, и наиболее известным продуктом фирмы Adobe. Часто эту программу называют просто Photoshop, на жаргоне российских пользователей – «шоп». В настоящее время Photoshop доступен на платформах OS X, Windows, в мобильных системах iOS и Android. Также существует версия Photoshop Express для Windows Phone 8 и 8.1. Сейчас в США идёт бета-тестирование стриминговой версии продукта для Chrome OS. Ранние версии редактора были портированы под SGI IRIX, но официальная поддержка была прекращена, начиная с третьей версии продукта. Для версий 8.0 и CS6 возможен запуск под Linux с помощью альтернативы Windows API – Wine.

     рис. 16. Adobe Photoshop CS6
     
     Несмотря на то, что изначально программа была разработана как редактор изображений для полиграфии, в данное время она широко используется и в веб-дизайне. В более ранней версии была включена специальная программа для этих целей – Adobe ImageReady, которая была исключена из версии CS3 за счёт интеграции её функций в сам Photoshop, а также включения в линейку программных продуктов Adobe Fireworks, перешедшего в собственность Adobe после приобретения компании Macromedia.
     Photoshop тесно связан с другими программами для обработки медиафайлов, анимации и другого творчества. Совместно с такими программами, как Adobe ImageReady (программа упразднена в версии CS3), Adobe Illustrator, Adobe Premiere, Adobe After Effects и Adobe Encore DVD, он может использоваться для создания профессиональных DVD, обеспечивает средства нелинейного монтажа и создания таких спецэффектов, как фоны, текстуры и т. д. для телевидения, кинематографа и всемирной паутины. Photoshop также прижился в кругах разработчиков компьютерных игр.
     Основной формат Photoshop, PSD, может быть экспортирован и импортирован всеми программными продуктами, перечисленными выше. Photoshop CS поддерживает создание меню для DVD. Совместно с Adobe Encore DVD, Photoshop позволяет создавать меню или кнопки DVD. Photoshop CS3 в версии Extended поддерживает также работу с трёхмерными слоями.
     Из-за высокой популярности Photoshop поддержка специфического для неё формата PSD была реализована во многих графических программах, таких как Adobe Fireworks, Photo-Paint, WinImages, GIMP, PaintShop Pro и других.
     
     



     
     
     
     
     
     
     
     
     
     
     
     
    
Глава 4. Верстка шаблона
     
4.1. Язык гипертекстовой разметки HTML

     HTML (англ. HyperText Markup Language – «язык гипертекстовой разметки») – стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц содержат описание разметки на языке HTML. Язык HTML интерпретируется браузерами и отображается в виде документа в удобной для человека форме.
     Язык HTML является приложением SGML – стандартного обобщённого языка разметки и соответствует международному стандарту ISO 8879.
     Язык XHTML является более строгим вариантом HTML, он следует всем ограничениям XML и, фактически, XHTML можно воспринимать как приложение языка XML к области разметки гипертекста.
     Во всемирной паутине HTML-страницы, как правило, передаются браузерам от сервера по протоколам HTTP или HTTPS, в виде простого текста или с использованием шифрования.
     Любой документ на языке HTML представляет собой набор элементов, причём начало и конец каждого элемента обозначается специальными пометками – тегами. Элементы могут быть пустыми, то есть не содержащими никакого текста и других данных (например, тег перевода строки 
). В этом случае обычно не указывается закрывающий тег. Кроме того, элементы могут иметь атрибуты, определяющие какие-либо их свойства (например, размер шрифта для элемента font). Атрибуты указываются в открывающем теге. 


     Вот примеры фрагментов HTML-документа: 

    Текст между двумя тегами — открывающим        и закрывающим.

   Здесь элемент содержит атрибут href, то есть гиперссылку.

     А вот пример пустого элемента: 


     Регистр, в котором набрано имя элемента и имена атрибутов, в HTML значения не имеет (в отличие от XHTML). Элементы могут быть вложенными. Например, следующий код:
     
    
    
    
    
    
    
    
Этот текст будет полужирным, а этот -  ещё и курсивным
    
    
     
даст такой результат: Этот текст будет полужирным, а этот — ещё и курсивным.




     Кроме элементов, в HTML-документах есть и сущности – «специальные символы». Сущности начинаются с символа амперсанда и имеют вид &имя; или &#NNNN;, где NNNN — код символа в Юникоде в десятичной системе счисления.
     Например, © – знак авторского права ©. Как правило, сущности используются для представления символов, отсутствующих в кодировке документа, или же для представления «специальных» символов: & –  амперсанда (&), < – символа «меньше» (<) и > – символа «больше» (>), которые некорректно записывать «обычным» образом, из-за их особого значения в HTML.
     Каждый HTML-документ, отвечающий спецификации HTML какой-либо версии, должен начинаться со строки объявления версии HTML , которая обычно выглядит примерно так:
     

     
     Если эта строка не указана, то добиться корректного отображения документа в браузере становится труднее. 
     Далее обозначается начало и конец документа тегами  и  соответственно. Внутри этих тегов должны находиться теги заголовка () и тела () документа.
     
     
     
     
     
     
     
     
4.2. Каскадные таблицы стилей CSS
     
     CSS (англ. Cascading Style Sheets – каскадные таблицы стилей) – формальный язык описания внешнего вида документа, написанного с использованием языка разметки.
     Преимущественно используется как средство описания, оформления внешнего вида веб-страниц, написанных с помощью языков разметки HTML и XHTML, но может также применяться к любым XML-документам, например, к SVG или XUL.
     CSS используется создателями веб-страниц для задания цветов, шрифтов, расположения отдельных блоков и других аспектов представления внешнего вида этих веб-страниц. Основной целью разработки CSS являлось разделение описания логической структуры веб-страницы (которое производится с помощью HTML или других языков разметки) от описания внешнего вида этой веб-страницы (которое теперь производится с помощью формального языка CSS). Такое разделение может увеличить доступность документа, предоставить большую гибкость и возможность управления его представлением, а также уменьшить сложность и повторяемость в структурном содержимом. Кроме того, CSS позволяет представлять один и тот же документ в различных стилях или методах вывода, таких как экранное представление, печатное представление, чтение голосом, или при выводе устройствами, использующими шрифт Брайля.
     Подключить таблицу стилей нужно написанием одной лишь строчкой кода в документе HTML, внутри тегов :
     

     
где style.css – имя файла каскадных таблиц стилей. Расширение у файла принято обозначать как .css.
	В первом случае подключения таблицы CSS к документу (см. выше) каждое правило CSS из таблицы стилей имеет две основные части – селектор и блок объявлений. Селектор, расположенный в левой части правила, определяет, на какие части документа распространяется правило. Блок объявлений располагается в правой части правила. Он помещается в фигурные скобки, и, в свою очередь, состоит из одного или более объявлений, разделённых знаком «;». Каждое объявление представляет собой сочетание свойства CSS и значения, разделённых знаком ": ". Селекторы могут группироваться в одной строке через запятую. В таком случае свойство применяется к каждому из них. Примеры:

	селектор, селектор {
  		свойство: значение;
 	    свойство: значение;
  		свойство: значение;
     }
     
     Универсальный селектор:
     
     * {
        margin: 0; 
        padding: 0; 
     }
     
     Селектор элементов:
     
     p {
        font-family: arial, helvetica, sans-serif; 
     
     Селектор классов:
     
     .note {
        color: red; 
        background-color: yellow; 
        font-weight: bold; 
     }
     
     Селектор идентификаторов:
     
     #paragraph1 {
         margin: 0px; 
     }
     
     Селектор потомков (контекстный селектор): 
     
     div#paragraph1 p.note {
        color: red; 
     }
     
     Селектор дочерних элементов:
     
     p.note > b {
        color: green 
     }
     
     Основное отличие между классами элементов и идентификаторами элементов в том, что в документе какой-нибудь класс может быть присвоен сразу нескольким элементам, а идентификатор — только одному. Также отличие в том, что могут существовать множественные классы (когда класс элемента состоит из нескольких слов, разделённых пробелами). Для идентификаторов такое невозможно.
     Важно отметить следующее отличие идентификатора от класса: идентификаторы широко используются в JavaScript для нахождения уникального элемента в документе.
     Имена классов и идентификаторов, в отличие от названий тегов и их атрибутов, чувствительны к регистру ввода букв.
     Свойства классов и идентификаторов задаются с помощью соответствующих селекторов. Причём может быть задано как свойство класса в целом (в таком случае селектор начинается с «.»), или свойство идентификатора самого по себе (в таком случае селектор начинается с «#»), так и свойство какого-нибудь элемента этого класса или с этим идентификатором.
     В CSS помимо классов, задаваемых автором страницы, существует также ограниченный набор так называемых псевдоклассов, описывающих вид гиперссылок с определённым состоянием в документе, вид элемента, на котором находится фокус ввода, а также вид элементов, являющихся первыми дочерними элементами других элементов. Также в CSS существует четыре так называемых псевдоэлемента: первая буква, первая строка, применение специальных стилей до и после элемента.
     До появления CSS оформление веб-страниц осуществлялось исключительно средствами HTML, непосредственно внутри содержимого документа. Однако с появлением CSS стало возможным принципиальное разделение содержания и представления документа. За счёт этого нововведения стало возможным лёгкое применение единого стиля оформления для массы схожих документов, а также быстрое изменение этого оформления.
     
Преимущества
Недостатки
Несколько дизайнов страницы для разных устройств просмотра. Например, на экране дизайн будет рассчитан на большую ширину, во время печати меню не будет выводиться, а на КПК и сотовом телефоне меню будет следовать за содержимым;

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

простота последующего изменения дизайна. Не нужно править каждую страницу, а лишь изменить CSS-файл;

    дополнительные возможности оформления. Например, с помощью CSS-вёрстки можно сделать блок текста, который остальной текст будет обтекать (например для меню) или сделать так, чтобы меню было всегда видно при прокрутке страницы.
Различное отображение вёрстки в различных браузерах (особенно устаревших), которые по-разному интерпретируют одни и те же данные CSS;

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




4.3 . Гипертекстовый процессор PHP

   PHP (англ. PHP: Hypertext Preprocessor – «PHP: препроцессор гипертекста») – скриптовый язык программирования общего назначения, интенсивно применяемый для разработки веб-приложений. В настоящее время поддерживается подавляющим большинством хостинг-провайдеров и является одним из лидеров среди языков программирования, применяющихся для создания динамических веб-сайтов.
   Язык и его интерпретатор разрабатываются группой энтузиастов в рамках проекта с открытым кодом. Проект распространяется под собственной лицензией, несовместимой с GNU GPL.
     В области веб-программирования, в частности серверная часть, PHP — один из популярных сценарных языков благодаря простоте, скорости выполнения, богатой функциональности, кроссплатформенности и распространению исходных кодов на основе лицензии PHP.
     Популярность в области построения веб-сайтов определяется наличием большого набора встроенных средств для разработки веб-приложений.
     Интерпретатор PHP имеет специальный конфигурационный файл – php.ini, содержащий множество настроек, изменение которых влияет на поведение интерпретатора. Имеется возможность отключить использование ряда функций, изменить ограничения на используемую скриптом оперативную память, время выполнения, объём загружаемых файлов, настроить журналирование ошибок, работу с сессиями и почтовыми сервисами, подключить дополнительные расширения, а также многое другое. Возможно дробление большого конфигурационного файла на части. Например, широко распространена практика вынесения настроек расширений в отдельные файлы. Параметры интерпретатора могут быть переопределены в файлах конфигурации HTTP-сервера (например, .htaccess в Apache) или в самом скрипте во время выполнения при помощи команды ini_set.
	PHP имеет несколько пасхальных яиц (шуток). Передача специальных GET-параметров любому php-скрипту приводит к выводу различных изображений.
	Например:

	любой_сценарий.php?=PHPE9568F36-D428-11d2-A769-00AA001ACF42

введя это значение в адресную строку браузера можно увидеть различные изображения, в зависимости от версии интерпретатора:
* фотография Thies Arntzen (версии 4.1.2, 4.2.2);
* фотография таксы (владелец Stig Bakken) (версии 4.3.2, 4.3.3, 4.3.8 — 4.3.10);
* фотография чёрного терьера (владелец Zeev Suraski) (версии 4.3.11, 4.4.0 — 4.4.4, 5.1.0, 5.1.2);
* фотография кролика (версии 4.3.1, 5.0.0, 5.0.3);
* искажённый логотип PHP (версии 5.1.3 — 5.2.13);
* фотография игрушечного синего слона с надписью PHP (начиная с версии 5.3.0).
	Синтаксис PHP подобен синтаксису языка Си. Некоторые элементы, такие как ассоциативные массивы и цикл foreach, заимствованы из Perl.	
     Для работы программы не требуется описывать какие-либо переменные, используемые модули и т. п. Любая программа может начинаться непосредственно с оператора PHP.
     Простейшая программа Hello world на PHP выглядит следующим образом:
     
     

     Также возможен более короткий вариант вывода строки:
     
     

     Открывающий тег вида . Всё, что находится вне ограничителей, выводится без изменений. В основном это используется для вставки PHP-кода в HTML-документ, например, так:

	
  	
     	 
  	 
   	
     	 
   	
	

	PHP является языком программирования с динамической типизацией, не требующим указания типа при объявлении переменных, равно как и самого объявления переменных. Преобразования между скалярными типами зачастую осуществляются неявно без дополнительных усилий.
     К скалярным типам данных относятся:
* целый тип (integer);
* вещественный тип данных (float, double);
* логический тип (boolean);
* строковый тип (string);
* специальный тип NULL.
	К нескалярным типам относятся:
* «ресурс» (resource);
* массив (array);
* объект (object).
	К псевдотипам относятся: 
* mixed один или несколько необязательных параметров;
* number число (integer либо float);
* callback (string или анонимная функция);
* void отсутствие параметров.




4.4. Разработка шаблона под CMS «Joomla»

	Для разработки шаблона с нуля под CMS будет использоваться макет, показанный на рисунке 17:


Pис. 17. Макет сайта





     При разработке шаблона будеи использоваться блочная верстка при помощи тегов 
, которые будут точно позиционировать элементы сайта на экране. Стиль оформления блоков будет задаваться в каскадных таблицах стилей CSS.
     Изменив только каскадную таблицу стилей CSS, можно будет полностью сменить дизайн сайта. При этом, можно изменить положение блоков, а не только их оформление, вовсе не внося каких-либо изменений в код страницы. Созданный подобным образом код значительно меньше по объему и логичнее по своей структуре, его проще читать и редактировать. Подобного рода шаблоны хорошо воспринимаются поисковыми машинами. 
     Шаблон будет иметь фиксированную ширину 950 пикселей и трехколоночную схему размещения элементов с возможностью сворачивания колонок при отсутствии в них контента.
     В самой CMS «Joomla» необходимо создать небольшой контент из нескольких статей, чтобы иметь возможность полноценно отрабатывать новый шаблон на движке.
     Следует разделить исходный скриншот сайта на блоки. Прежде чем писать код, необходимо разобраться с назначением каждого блока, чтобы определиться, в каких позициях будут выводится модули, где будет располагаться компонент  контента, какие блоки будут иметь фиксированные размеры, какие будут сворачиваться.
     
     
     
     
     
     
     
     
     
     

Рис. 18. Схематическая блоковая разметка шаблона









* Блок «logo». В этом бл.......................