Размещено на http://www.allbest.ru/

Разработка сайта "Домовой"

1. Теоретическая часть

1.1 Цели, преследуемые при создании сайта

Основная задача и цель данной работы является проектирование и создание web-сайта «Домовой» в дальнейшем опираясь на разработанный процесс проекта мы будем работать:

А пока с поставленной целью в связи проработки сайта нам необходимо выполнить следующие задачи:

- собрать необходимую информацию о домовых;

- провести беседу с мастерами для получения информации;

- собрать всю информацию таким образом, чтобы привлечь к себе внимание, максимальным количеством пользователей будущего сайта и облегчить им доступ к будущему сайту;

- создать макет сайта, используя цветовую гамму и графические элементы;

- продумать и создать функциональность сайта с учетом восприятия информации пользователя;

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

- подобрать красивое и название для проекта.

- получить опыт по созданию сайта, получение новых знаний и навыков в данной сфере и деятельности.

- разработка и защита сайта

Данная работа представлена следующими частями:

- введение;

- теоретическая часть - основные терминологические понятия web-программирования;

- практическая часть - описание работы над созданием сайта;

- заключение;

- список использованных источников;

- приложения (примеры программного кода, использованного при создании сайта и скриншоты страниц сайта).

1.2 Обзор функциональности сайта

Проект «Домовой» выполняет следующие функции:

1. Отображение информации о мастерах.

2. Переход по ссылке в Интернет магазин.

3. Общение и обсуждение тем на форуме.

3. Регистрация пользователей на сайт посетителей и добавления комментариев к статьям.

4. Предоставление площадей сайта для размещения информации рекламодателей.

1.3 Основные этапы создания дизайна сайта

Выбираем фиксированную ширину своего будущего сайта: для разрешения монитора 1024?768 пикселов.

Придумываем общей вид основного дизайна: располагаем в нужной комбинации разделы. Придумываем переход от страницы к странице, рисуем предварительный эскиз главной страницы.

Выбор цветовой гаммы для дизайна: коричневый и его оттенки, так же поиграем с контрастом (цветовая модель RGB).

Создание в программе Adobe Photoshop модели сайта, модульной сетки и условное размещение элементов сайта в ней (баннер, логотип, меню с кнопками, главный раздел для входа на сайт, раздел про домовых, раздел символы и обереги, раздел сотрудничество, иллюстрации, фотография, подвал).

Разработка и рисование логотипа «Домового» в векторной графической программе Corel Draw, с последующим его переносом в основной шаблон сайта и растрированием в Adobe Photoshop.

Выбор и обработка главной фотографии для сайта (Домовенок с седыми волосами): ретушь, тонирование, обтравка, кадрирование и расположение ее в шаблоне.

Рисование контуров блоков, иллюстративных элементов (домика, рамки вокруг главного блока, баннера, кнопок меню), наполнение их цветом.

Выбор гарнитуры шрифта для оформления (OlgaCTT) и для содержания сайта (Verdana), определение размеров и нанесение основных надписей оформления: в шапке сайта, на кнопках меню, в заголовках блоков.

Наполнение цветом оставшихся бесцветных элементов шаблона.

Окончательное редактирование элементов дизайна сайта (изменение размера, расположения некоторых элементов под общий вид макета).

Фрагментирование шаблона сайта, сохранение фрагментов в отдельных файлах в формате PNG для последующей публикации в web.

Используемые при создании сайта технологии

На сайте использованы следующие web-технологии:

HTML

CSS

Базы данных MySQL

HTML - это теговый язык разметки документов. Любой документ на языке HTML представляет собой набор элементов, причём начало и конец каждого элемента обозначается специальными пометками - тегами. Элементы могут быть пустыми, то есть не содержащими никакого текста и других данных (например, тег перевода строки <br>), в таком случае закрывающий тег обычно не указывается.

Каждый HTML-документ, отвечающий спецификации HTML какой-либо версии, должен начинаться со строки объявления версии HTML <! DOCTYPE…>. Если эта строка не указана, то добиться корректного отображения документа в браузере становится труднее. На сайте используется строгий (strict) вариант DOCTYPE для HTML 4.01:

<! DOCTYPE HTML PUBLIC «- //W3C //DTD HTML 4.01 //EN»

«http://www.w3.org/TR/html4/strict.dtd»>

CSS - (Каскадные таблицы стилей)

CSS (англ. Cascading Style Sheets - каскадные таблицы стилей) - технология описания внешнего вида документа, написанного языком разметки. CSS используется создателями веб-страниц для задания цветов, шрифтов, расположения и других аспектов представления документа. Основной целью разработки CSS являлось разделение содержимого (написанного на HTML или другом языке разметки) и представления документа (написанного на CSS). Это разделение может увеличить доступность документа, предоставить большую гибкость и возможность управления его представлением, а также уменьшить сложность и повторяемость в структурном содержимом. Кроме того, CSS позволяет представлять один и тот же документ в различных стилях или методах вывода, таких как экранное представление, печать, чтение голосом.

На сайте «Домовой» используется внешняя таблица стилей, то есть отдельный файл style.css, на который сделана ссылка в документе.

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

Преимущества CSS вёрстки:

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

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

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

MySQL

MySQL - свободная система управления базами данных (СУБД). MySQL является собственностью компании Sun Microsystems, осуществляющей разработку и поддержку приложения.

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

На сайте используется MySQL версии 5.0.81. Версия MySQL 5.0 вышла 24 октября 2005 года, в этой версии значительно расширена функциональность, которая ставит MySQL в один ряд с коммерческими СУБД. Если раньше СУБД MySQL обвиняли в недостаточной поддержке стандарта SQL, то с появлением пятой версии этой популярной базы данных, появилась практически полная поддержка стандарта SQL.

Структура базы данных сайта.

Таблица pages содержит информацию о страницах сайта. Поля:

id - идентификатор страницы, первичный ключ

caption - заголовок статьи

annotation - краткая аннотация

content - содержание статьи

created - дата добавления на сайт

rubric_id - идентификатор раздела, к которому относится страница

rubrics - таблица разделов сайта

id - идентификатор раздела

caption - заголовок раздела

annotation - краткая аннотация раздела

with_comments - возможность оставлять комментарии к странице

in_list - попадают ли страницы из этого раздела в список статей

comments - комментарии к страницам

id - идентификатор комментария, первичный ключ

created - дата создания

comment - сам комментарий

user_id - идентификатор пользователя, оставившего отзыв

page_id - идентификатор страницы, к которой относится комментарий

images - изображения к статьям

id - идентификатор изображения

image - само изображение

content_type - тип изображения (image/png, image/jpeg)

users - пользователи сайта

id - идентификатор пользователя

name - имя пользователя

password - пароль

email - адрес электронной почты

created - дата регистрации

Содержание сайта. Описание его разделов

Сайт и информация на нем представлены несколькими разделами, которые находятся в главном меню:

1. Главная страница. Здесь расположена вступительная статья, повествующая об основных понятиях и проблемах тематики сайта.

2. Про домовых. В этом разделе рассказывается откуда взялись домовые, кого и когда стали считать домовыми, и как призвать домового к себе в дом, что над делать когда переезжаешь на новую квартиру, и как не обидеть домового.

3. Фото. Здесь размещены домовые и обереги сделанные своими руками.

4. В разделе Символы и обереги вы найдете нужный вам предмет и узнаете что он означает.

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

1.4 Основные понятия WEB

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

Интернет (англ. Internet) - всемирная система объединённых компьютерных сетей, построенная на использовании протокола IP и маршрутизации пакетов данных. Интернет образует глобальное информационное пространство, служит физической основой для Всемирной паутины и множества других систем (протоколов) передачи данных.

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

Несколько веб-страниц, объединенных общей темой и дизайном, а также связанных между собой ссылками, и обычно находящихся на одном веб-сервере под одним адресом (доменным именем или IP-адресом) образуют веб-сайт (от англ. website: web - «паутина», «сеть» и site - «место», букв. «место в сети»).

Браузер служит для просмотра веб-страниц их обработки, вывода и перехода от одной страницы к другой в удобной для пользователя форме, в виде текста или графической оболочки. Наиболее популярные браузеры - Internet Explorer, Mozilla Firefox, Safari, Google Chrome, Opera.

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

Протокол - это стандартизированные правила связи между компьютерами по сети. Для успешной связи, как правило, требуется «сотрудничество» множества протоколов, каждый из которых отвечает за различные аспекты связи (основные: HTTP, FTP, TCP, IP). [см. Глоссарий]

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

2. Основные технологии web-программирования

Для создания общей структуры сайта в веб-программировании используется стандартный язык разметки гипертекста - HTML (от англ. HyperText Markup Language - «язык разметки гипертекста»).

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

Гиперссылка в компьютерной терминологии - часть гипертекстового документа, ссылающаяся на другой элемент (команда, текст, заголовок, примечание, изображение) в самом документе, на другой объект (файл, директория, приложение), расположенный на локальном компьютере или в компьютерной сети, либо на элементы этого объекта.

Гиперссылка - фрагмент HTML-документа и его базовый элемент:

§ указывающий на другой файл, который может быть расположен в Интернет;

§ содержащая полный путь (URL) к этому файлу.

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

Информация на веб-странице может быть представлена в различных формах:

§ текст

§ статические и анимированные графические изображения

§ аудио

§ видео

§ апплеты

Информационно значимое содержимое веб-страницы обычно называется контентом.

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

Динамические страницы обычно обрабатывают и выводят информацию из базы данных. Наиболее популярная на данный момент технология для генерации динамических страниц: PHP.

PHP (англ. PHP: Hypertext Preprocessor) - клиент-серверный язык сценариев, созданный для генерации HTML-страниц на веб-сервере и работы с базами данных.

База данных - некое пространство, способное хранить в себе любого рода информацию в виде таблиц.

Для управления созданием и использованием баз данных разработаны специальные программные и лингвистические средства, объединенные общим названием - система управления базами данных (СУБД).

Наиболее часто используемая система управления базами данных MySQL. Это свободная клиент-серверная СУБД. Клиент-серверная СУБД располагается на сервере вместе с БД и осуществляет доступ к БД непосредственно, в монопольном режиме. Все клиентские запросы на обработку данных обрабатываются клиент-серверной СУБД централизованно. Недостаток клиент-серверных СУБД состоит в повышенных требованиях к серверу. Достоинства: потенциально более низкая загрузка локальной сети; удобство централизованного управления; удобство обеспечения таких важных характеристик как высокая надёжность, высокая доступность и высокая безопасность.

Для создания, модификации и управления данными в реляционных базах данных (от англ. relation - отношение) применяется универсальный компьютерный язык - SQL (Structured Query Language - «язык структурированных запросов»). SQL является, прежде всего, информационно-логическим языком, предназначенным для описания хранимых данных, для извлечения хранимых данных и для модификации данных. SQL не является языком программирования [4].

Для облегчения работы с базами данных разработано веб-приложение с открытым кодом, написанное на языке PHP и представляющее собой веб-интерфейс для администрирования СУБД MySQL - phpMyAdmin. Это приложение позволяет через браузер осуществлять администрирование сервера MySQL, запускать команды SQL и просматривать содержимое таблиц и баз данных. Приложение пользуется большой популярностью у веб-разработчиков, так как позволяет управлять СУБД MySQL без непосредственного ввода SQL команд, предоставляя дружественный интерфейс.

С помощью СУБД и PHP возможно создавать программы, которые позволяют добавлять, редактировать, удалять информацию на сайте без вмешательства в код через специально созданный административный интерфейс. Такие программные продукту называются система управления содержимым (контентом) (англ. Content management system, CMS). Обычно это содержимое рассматривается как неструктурированные данные предметной задачи в противоположность структурированным данным, обычно находящимися под управлением СУБД.

Для того чтобы сайт приобрел уникальность, ему необходимо создать уникальный внешний вид. Для этого существует технология описания внешнего вида документа, написанного языком разметки HTML - CSS (англ. Cascading Style Sheets - каскадные таблицы стилей).

При отображении страницы, может быть взята из различных источников:

1. Авторские стили (информация стилей, предоставляемая автором страницы) в виде:

- внешних таблиц стилей, то есть отдельного файла.css, на который делается ссылка в документе;

- встроенных стилей - блоков CSS <style></style> внутри самого HTML-документа внутри тега <header></header>;

- Inline-стилей, когда в HTML-документе информация стиля для одного элемента указывается в его атрибуте < … style=»…»>.

2. Пользовательские стили

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

3. Стиль браузера:

- стандартный стиль, используемый браузером по умолчанию для представления элементов (например, кнопки, прокрутка, формы и т.д.) [5, 10, 11, 12].

Для придания интерактивности HTML-страницам широко используется язык программирования JavaScript. Это объектно-ориентированный скриптовый язык, построенный на принципах объектно-ориентированного программирования. В основе концепции объектно-ориентированного программирования лежит понятие объектная модель документа (DOM), элементарной частицей которого является объект - субстанция, которая объединяет в себе поля (данные) и методы (выполняемые объектом действия).

DOM (от англ. Document Object Model - «объектная модель документа») - это не зависящий от платформы и языка программный интерфейс, позволяющий программам и скриптам получить доступ к содержимому HTML-документов, а также изменять содержимое, структуру и оформление таких документов.

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

Большую популярность в настоящее время среди веб-разработчиков получил jQuery - полностью бесплатный javascript фреймворк (framework) (набор готовых функций для облегчения решения типовых задач), это JavaScript-библиотека, фокусирующаяся на взаимодействии JavaScript, HTML и CSS. Помогает легко получать доступ к любому элементу DOM, обращаться к атрибутам и содержимому элементов DOM, манипулировать ими. jQuery, как правило, включается в веб-страницу как один внешний JavaScript-файл [2].

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

2.1 Краткая история WWW

Internet - это крупнейшая мировая компьютерная сеть. Сейчас Internet имеет примерно 20 миллионов пользователей более чем в 50 странах. WWW доступен в основном через Internet; но говоря WWW и Internet мы имеем ввиду не одно и то же. WWW можно отнести к внутреннему содержанию, т.е. это какой-то абстрактный мир знаний, в то время как Internet является внешней стороной глобальной сети в виде огромного количества кабелей и компьютеров.

История WWW - Мировой Информационной Паутины началась в Марте 1989, когда Tim BernersLee из Европейской Лаборатории Физики Элементарных Частиц (известной как CERN), где работал коллектив исследователей физиков, предложил новый способ обмена результатами исследований и идеями между организациями. Такой обмен был очень необходим, потому что члены этой организации работали в разных странах.

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

К концу 1990, впервые программное обеспечение WWW было установлено на ЭВМ NeXT. Теперь можно было просматривать и передавать документы гипертекста другим людям через Internet, а также появилась возможность редактировать документы гипертекста прямо на экране компьютера. Программа сначала демонстрировалась перед членами общества и на семинарах в CERN'е, а затем была показана на конференции «Гипертекст'91».

До 1992 Tim продолжал выступать со своим проектом, до тех пор пока не появились желающие продолжить работу над этой проблемой.

Сотни людей со всего мира приняли участие в разработке этого проекта, одни писали программы и документы для WWW, другие просто рассказывали людям о WWW. Группа пионеров-проектировщиков WWW даже не могла предполагать тогда, что начатое ими дело достигнет таких масштабов. Только за первых четыре месяца 1994 о WWW говорили и писали CNN, «Wall Street Journal», «Economist», «Fortune», «New York Times» и многие компьютерные издания.

Понятие web-сайта. Классификация

Информация, доступная пользователям Internet, располагается на компьютерах (Web-серверах), на которых установлено специальное программное обеспечение. Значительная часть этой информации организована в виде Web-сайтов. Каждый из них имеет свое имя (адрес) в Internet.

Web-сайт - это информация, представленная в определенном виде, которая располагается на Web-сервере и имеет свое имя (адрес). Для просмотра Web-сайтов на компьютере пользователя используются специальные программы, которые называются браузерами. В зависимости от того, какое имя (адрес) сайта мы зададим в строке «Адрес», браузер будет загружать в свое окно соответствующую информацию.

Web-сайт состоит из связанных между собой Web-страниц.

Каждая страница Web-сайта также имеет свой Internet адрес, который состоит из адреса сайта и имени файла, соответствующего данной странице. Таким образом, Web-сайт - это информационный ресурс, состоящий из связанных между собой гипертекстовых документов (Web-страниц), размещенный на Web-сервере и имеющий индивидуальный адрес. Посмотреть Web-сайт может любой человек, имеющий компьютер, подключенный к Internet.

В настоящее время во всемирной паутине размещено несколько миллионов Web-сайтов и их число постоянно растет. По принадлежности сайты подразделяются на:

Личные (персональные) сайты. Таким сайтом владеет и осуществляет его поддержку один человек. Такие сайты сейчас составляют большинство. Спектр этих сайтов весьма широк - от маленьких домашних страничек (home page), где есть немного информации о владельце и его увлечениях до очень известных и популярных ресурсов.

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

Сайты некоммерческих организаций. Разнообразные некоммерческие организации также стремятся заявить о своём существовании в сети интернет. Многообразие подобных сайтов огромно. Тут и сайты какого-нибудь регионального отделения пенсионного фонда, и сайты политических партий и общественных движений, и сайты научно-исследовательских институтов и т.д. и т.п. Весьма популярны в интернете новостные ресурсы, ресурсы, представляющие онлайновые версии различных СМИ. Для двух особых категорий сайтов некоммерческих организаций, а именно сайтов государственных и образовательных учреждений в интернете даже выделены специальные доменные зоны: .gov и .edu. Причём, в отличие от популярных доменных зон .com, .org, национальных доменных зон и т.п., попасть туда может далеко не каждый желающий. Таким образом, расположение сайта в зоне .edu, например, - это гарантия солидности образовательного учреждения.

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

Приведём условную классификацию сайтов по этим параметрам.

Простые сайты, содержащие немного информации и состоящие из нескольких страничек («сайты-визитки», домашние странички и т.п.). Основная цель их создателей и владельцев, как правило, - просто обозначить своё присутствие в интернете. Такие сайты обычно содержат лишь немного информации о владельце и совсем мало или вовсе не содержат какой-либо другой интересной пользователям сети информации.

Тематические, узконаправленные сайты. Такие сайты могут быть довольно большими и подробно освещать какой-либо вопрос, предоставляя пользователям интернета, интересующимся определённой темой, возможность получить по ней хорошую и детальную информацию. Тематический сайт может рассказывать, например, об истории Древнего Рима, об отдыхе на Канарских островах, о выращивании и разведении кроликов и т.п. Многие из тематических сайтов занимают достойное место в интернете. Однако тематические, узконаправленные сайты могут привлекать и быть интересны лишь определённой категории пользователей.

Многофункциональные сайты (порталы). Особое место в ряду интернет-сайтов занимают монстры интернета - многофункциональные и многотематические сайты-порталы. Создавать, поддерживать и обеспечивать работу таких сайтов сложно, но зато такие сайты могут привлекать практически все категории пользователей и каждому быть интересны. Сайты-порталы содержат в себе массу самой разнообразной информации и функций, на них можно узнать и свежие новости, и прогноз погоды, и прочитать гороскоп, и завести почтовый ящик, и вести блог, и создать сообщество по интересам и т.д. и т.п. Такие крупные порталы, как, например, Яндекс, Рамблер или Мэйл.ру известны практически каждому пользователю Рунета.

Что такое стиль

Это система визуальных элементов, призванная обеспечить цельность восприятия данной странички или всего сайта. Исходя из разработанной вами концепции и контента (текстового материала, готовых иллюстраций и рисунков), вы выбираете шрифты, цвет фона, способ обработки картинок, коллажей, иконок и пр. элементов. Ну а затем просто стараетесь придерживаться выбранной вами манеры исполнения элементов по ходу создания и развития сайта.

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

Основные элементы стиля сайта:

логотип;

модульность;

шрифты;

цвета;

иллюстративный ряд (приемы обработки изображений).

На данный момент можно определить как типы:

«текстовый» дизайн - определяется содержанием и концепцией автора. «Текстовый» не означает простой или примитивный. На первом уровне это означает почти полное отсутствие изображений как таковых, что значительно ускоряет загрузку страницы. А навигационные и декоративные элементы выполняются теми же «символьными» приемами. Нужно сказать, что HTML как таковой значительно расширил возможности при разверстке страниц этого типа, и теперь при помощи кода можно делать и тени, и даже изображения (хотя изображение кодом зачастую больше по «живому весу», чем аналогичное в GIFе или JPGе)… При таких разверстках следует хорошо знать классические верстальные приемы, особенности используемых шрифтов.

«полиграфический» дизайн - тот вариант, когда веб-страничка изо всех своих сил стремится имитировать печатное издание (особенно буклетные типы). Такой дизайн распространен на корпоративных сайтах, сайтах с рекламным уклоном, там, где особо необходимо образно-эмоциональное наполнение основного содержания. Ставка делается на классические дизайнерские приемы по принципу - общий дизайн, а потом нарезать и собрать… Как правило, основное впечатление пользователь получает за счет пиксельной графики.

«интерфейсный» дизайн - сейчас его еще называют usability… Стиль, призванный максимально облегчить жизнь пользователю во всех ее проявлениях, от загрузки странички (минимизирование кода и предельная оптимизация изображений) до особого, доведенного до религиозного поклонения тщательного исполнения каждого элемента. Досконально продуманная (как правило) навигация, изначально понятность пользования общей схемой сайта - такой подход к веб-дизайну вызывает только глубокое почтение и уважение. И даже если с точки зрения изобразительной эстетики на таком сайте окажется не все гладко, то с лихвой окупится остальными достоинствами.

«динамический» дизайн - в примитивном варианте бегающие по экрану, или просто шевелящиеся изображения (в основном - флеш, но сюда же можно отнести и DHTML, и какие-то штучки на Java и даже анимационный GIF). В хорошо продуманном сценарии это может быть целое произведение искусства, последовательно разворачивающее перед зрителем мысль автора или какой-то художественный образ. Интерфейсы на флешах часто поражают наше воображение в самом хорошем смысле этого слова.

«смешанные» типы - суть понятна и так. Обычно комбинация всех этих типов.

3. Перспективы развития сайта

Для дальнейшего развития сайта, а также для его продвижения во всемирной сети Интернет видится возможным выполнение следующих действий:

1. Увеличение и информативной составляющей сайта, расширение и углубление тематики.

2. Для увеличения взаимодействия с пользователем, и следовательно, его интереса к сайту, возможно проведение ряда преобразований проекта:

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

2.2. Организация рассылки на электронный адрес пользователей новостей сайта.

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

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

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

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

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

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

- решения типовых задач не должны дублировать друг друга;

- каждый функциональный блок (по возможности) должен иметь возможность установки надстроек;

- функционал сайта не должен зависеть от его дизайна (четкое разделение дизайна и кода);

- при создании системы управления сайтом следует не забывать о интересах клиента.

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

сайт дизайн контент верстка

Размещено на Allbest.ru

...