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

Содержание

Введение

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

1.1 Обеспечение доступности Web-страницы

1.2 Представление текста на Web-страницах

1.3 Представление графики на Web-страницах

1.4 Характеристика типового Web-сайта, его роль

1.5 Виды Web-сайтов

1.6 Типовая структура Web-сайта

1.7 Понятие Web-сайтов

1.8 Классификация Web-сайтов

1.9 Язык интертекстовой разметки

2. Проектная часть разработки web-сайта

2.1 Обоснование и выбор программного обеспечения

2.1.1 Улучшение оформления web -узлов

2.1.2 Ускорение и упрощение генерации кода

2.1.3 Средства написания кода

2.1.4 Средства создания сценариев

2.1.5 Управляемые данными web-узлы, поддерживаемые службами Windows SharePoint Services

2.1.6 Принцип наследования тегов

2.2 Информационное обеспечение и разработка интерфейсa

2.2.1 Технологическое обеспечение задачи

2.3 Реализация программного продукта

3. Экономическая часть

3.1 Расчет трудоемкости разработки программного продукта

3.2 Расчет себестоимости и цены разработки программного продукта

3.3 Методика расчета статей калькуляции

Заключение

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

Приложение



Введение

программный web текст графика

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

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

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

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

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

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

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

Актуальность. Каждый из нас уже сейчас может сделать свой вклад в развитие Internet. Для этого достаточно создать свой веб-сайт и разместить его в Сети.

Цель исследования: проанализировать принципы создания web-сайтов для построения своего профиля

Объект исследования: создание сайта

Гипотеза исследования: оформление современной web - страницы влияет на то, как будет воспринята информация пользователем.

Задачи исследования:

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

· Определить информационную составляющую.

· Проанализировать и охарактеризовать существующие web-сайты; на основе анализа выбрать и разработать оптимальную структуру

· Выбрать программные средства для реализации и размещения сайта в сети Интернет.

Методологическая основа:

Чаще всего в дипломной работе использовались материалы из работы Э. Таненбаум, Д.Уэзеролл «Компьютерные сети», 2013 год, 960 стр



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

1.1 Обеспечение доступности Web-страницы

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

Большинство дизайнеров рекомендуют разрабатывать страницы в формате 640x480, чтобы при просмотре пользователям не пришлось применять горизонтальную прокрутку. Горизонтальная прокрутка всегда затрудняет восприятие, поэтому дизайнеры традиционно ее отвергают.

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

Достойный уважения Web-дизайн включает разработку страниц, доступных для пользователей с ограниченными возможностями, в частности по зрению и слуху. Консорциум World Wide Web объявил об инициативе Web Accessibility Initiative (WAI), которая ставит целью сделать Web более доступным для всех пользователей. Однако успех данной инициативы зависит от участия в ней рядовых разработчиков, которые могут (или не могут) создать Web-сайты в соответствии с поставленными задачами.

1.2 Представление текста на Web-страницах

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

Пропорциональный шрифт - иначе «шрифт переменной ширины» для каждого символа выделяет разное количество места в зависимости от его начертания. Например, в пропорциональном шрифте заглавная «W» занимает больше места в строке по горизонтали, прописная «I». Такие гарнитуры, как: Times, Helvetica и Arial являются примерами пропорциональных шрифтов. Web-браузеры для большинства текстов на Web - странице, включая основной текст, заголовки, списки, цитаты и т.д., используют пропорциональные шрифты. Как правило, большие отрывки основного текста удобнее читать, когда они напечатаны пропорциональными шрифтами. Поскольку большинство пользователей не имеют времени заменить шрифты, установленные по умолчанию, с большой вероятностью можно предположить, что текст на вашей странице будет отображен шрифтом Times размером 10 или 12 пунктов (по умолчанию в Netscape) или Helvetica (по умолчанию в Microsoft Internet Explorer). Но это всего лишь общее правило [7, стр. 158].

Шрифт с фиксированной шириной предоставляет одинаковое место для всех символов шрифта. Заглавная «W» занимает т больше места, чем прописная «I». Примерами шрифтов фиксированной ширины являются гарнитуры Courier и Monaco. В Web-браузерах шрифты фиксированной ширины используются для отображения любого текста внутри следующих HTML-тегов: <рге>......<хтр>.

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

Обычно размер шрифта определяется в пунктах (22 пункта (пт) = 1 дюйм высоты шрифта) но, к сожалению, эти размеры не достаточно точно переводятся между платформами, Отчасти это происходит потому, что их операционные системы управляют дисплеями с различными разрешениями.

Можно выделить три гарнитуры шрифта, которые являются стандартными для представления текста на Web-страницах:

· Times New Roman - классический шрифт с засечками. Данный шрифт используется для представления на бумажных носителях больших объемов текста;

· Arial - шрифт без засечек (гуманистическая гарнитура). Данный шрифт чаще всего используется в заголовках;

· Verdana - современный шрифт, разработанный специально для отображения на мониторе компьютера.

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

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

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

Гиперссылки принято обозначать подчеркиванием. Однако в последнее время возникает тенденция использовать подчеркивание под гиперссылкой лишь при наведении на нее указателя мыши, в этом случае следует выделять гиперссылку другим по отношению к остальному тексту цвету. Выделять гиперссылки цветом желательно даже в тех случаях, когда используется подчеркивание. По материалам исследований Якоба Нильсена, пользователи быстрее определяют зрительно гиперссылки, выделенные синим цветом. Необязательно это будет используемый по умолчанию цвет #0000ff, который и породил этот стереотип - текст любого цвета в синих тонах имеет больше шанса быть идентифицированным как гиперссылка.

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

1.3 Представление графики на Web-страницах

На данный момент почти все изображения в Web, представлены в двух форматах: GIF и JPEG. Третий соперник, заслуживающий упоминания, формат PNG, борется за поддержку и внимание браузеров. Далее - краткий обзор «большой тройки» онлайновых графических форматов. Более подробная информация представлена в главах, посвященных каждому из форматов. GIF. GIF - Grafic Interchange Format можно назвать традиционным форматом файлов Web. Он был первым форматом файлов, который поддерживался Web-браузерами, и по сей день продолжает оставаться основным графическим форматом Web. Его свойства состоят в следующем:

· поддерживает не более 256 цветов (меньше можно и часто нужно);

· использует палитру цветов;

· использует сжатие без потери информации по методу LZW (который подобен применяемому в архиваторе PKZIP, и, следовательно, GIF-файлы в дальнейшем практически не сжимаются);

· поддерживает чересстрочную развертку;

· является поточным форматом, т.е. показ картинки начинается во время перекачки;

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

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

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

GIF поддерживает не больше 256 цветов, а это значит, что все изображения, которые мы сохраняем в GIF-формате, явно или неявно уменьшают количество цветов, чтобы уложиться в этот лимит (разные программы с разным успехом). А отсюда вывод - если взять красивую фотографию с плавными переходами и едва уловимыми оттенками цвета, то после преобразования все будет гораздо хуже -оттенки перестанут быть неуловимыми, и вся фотография приобретет неестественный, нереалистичный вид. Поэтому, если надо все-таки сохранить фотографию в формате GIF и передать все оттенки, то приходится идти на хитрости. Например, к фотографии можно применить какой-нибудь художественный фильтр и превратить ее в рисунок или применить тонирование. Зато нет никаких проблем с сохранением рисунков и чертежей в этом формате, они, как правило, хорошо сжимаются и не содержат много цветов. JPEG.

Вторым наиболее популярным графическим форматом в Web является JPEG - Joint Photographic Experts Group. Он содержит 24-разрядную информацию о цвете. Это 16,77 млн цветов в отличие от 256 цветов формата GIF. В JPEG используется так называемое сжатие с потерями. Это означает, что некоторая информация об изображениях в процессе сжатия отбрасывается, но в большинстве случаев ухудшение качества изображения не наносит вреда и часто даже не заметно.

Фотографии или любые изображения с плавными градациями цветов лучше всего сохранять в JPEG-формате, потому что он предлагает более высокое качество изображений, умещающихся в файл меньшего объема. Тем не менее, JPEG не является лучшим решением для графических изображений с одноцветными областями, поскольку этот формат имеет тенденцию испещрять цвета крапинками и конечный файл, как правило, будет несколько больше, чем GIF-файл для того же изображения. PNG.

Есть еще третий графический формат, конкурирующий за постоянное использование в Web. Это формат PNG - Portable Network Graphic, который, несмотря на некоторые достоинства, с 1994 г. находится более или менее в тени. Только недавно браузеры начали поддерживать PNG как встроенную графику, но PNG имеет все шансы стать очень популярным форматом в Web. Именно поэтому он включен здесь в «большую тройку». PNG может поддерживать 8-разрядные индексированные цвета, 16-разрядные полутона или 24-разрядные полноцветные изображения, используя схему сжатия без потерь. Это обеспечивает более высокое качество изображений, а иногда и меньший объем файлов по сравнению с форматом GIF. Кроме того, файлы PNG имеют некоторые замечательные функции, например, встроенное управление коэффициентом гамма, и изменяемые уровни прозрачности (это позволяет показывать рисунок фона сквозь отбрасываемые мягкие тени).

Разрешение и размер файла изображений. Поскольку изображения Web существуют только на экране дисплея, будет технически правильно измерять их разрешение в пикселях на дюйм (ppi - pixels per inch). Другая единица измерения разрешения - количество точек на дюйм (dpi - dots per inch) относится к разрешению печатных изображений и зависит от разрешения печатающего устройства.

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

Практично создавать изображения с разрешением 72 ppi (это лучший вариант для представления на экране), обращая внимание только на общие размеры в пикселях. В процессе создания графики на Web можно вообще не использовать дюймы. Важен размер изображения по сравнению с другими изображениями на странице и общего размера окна браузера. Например, многие пользователи по-прежнему используют 14-дюймо-вые дисплеи с разрешением 640x480 пикселей. Чтобы гарантировать заполнение графической заставкой всего пространства экрана, лучше сделать его шириной не более 600 пикселей (учитывая, что часть пикселей справа и слева будет использована для окна и для полосы прокрутки). Размер остальных кнопок и изображений на странице следует измерять в пикселях относительно баннера, имеющего ширину 600 пикселей.

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

1.4 Характеристика типового Web-сайта, его роль

Сайт, представляющий некоторую организацию, называется корпоративным или официальным сайтом организации. К официальному сайту предъявляются более жесткие требования в части информационного содержимого, графического дизайна, навигации, хостинга. Официальный сайт обычно имеет следующие разделы: - Новостная информация. - Нормативные документы, положения. - Направления деятельности. - Структура учреждения. - Кадровый состав. - Контактная информация (список ответственных лиц, их должности, координаты и часы приема)4. Создание web-сайта - событие, повышающее имидж субъекта экономики. Хороший сайт, вбирая в себя всю полезную информацию, является лучшей визитной субъекта экономики, работая на них в любое время суток. Безусловно, это современно и престижно. Это прекрасная возможность продемонстрировать всем свои достижения, разместить актуальную информацию для заинтересованных лиц. Это способ рассказать о своих успехах, поблагодарить спонсоров и т.д.

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

1.5 Виды web-сайтов

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

Я предлагаю вам классификацию, в основе которой лежит цель, которую преследует web-сайт. Совершенно необязательно, что в течение жизни web-сайта он не перейдет из одной категории в другую. Сайты, точно так же, как и любые другие проекты эволюционируют. Итак, в зависимости от того, какие цели преследует web-сайт он, может быть личным (персональные сайты). Как правило, таким сайтом владеет и осуществляет его поддержку один человек. Такие сайты сейчас составляют большинство, но лишь небольшая часть из них выполнена на высоком уровне [5, стр.280].

В наше время создать свой сайт в сети может каждый. Для этого даже не обязательно владеть особыми навыками, можно просто воспользоваться услугами специальных сервисов, которые позволяют легко и быстро «собрать» сайт при помощи готовых модулей. Однако подобные шаблонные сайты в большинстве случаев не отличаются оригинальностью, обладают весьма ограниченным набором возможностей и мало посещаемы. Сайты коммерческих организаций: Уже сейчас подавляющее большинство более или менее крупных компаний обладают собственным сайтом, а то и несколькими. Постоянное увеличение числа пользователей сети Интернет делает эту среду весьма привлекательной и удобной для осуществления торговли, рекламы товаров и услуг. Некоторые компании ограничиваются сайтом-визиткой, где представлена только самая важная информация в небольшом количестве. Многие фирмы обладают хорошими корпоративными сайтами с широкими возможностями, где могут быть, в том числе представлены и ассортимент товаров, возможность отправки заказов, участия в обсуждениях. Кто-то осуществляет торговлю непосредственно через интернет-магазины и доля данного рынка непрерывно увеличивается. Сайты некоммерческих организаций. Примеров подобных сайтов также великое множество. Это могут быть сайты государственных структур, спортивных клубов, университетов, политических движений. Весьма популярны в сети новостные сайты и онлайн-версии печатных СМИ. Как правило, такие сайты предполагают интерактив, и главными их задачами являются предоставление актуальной информации пользователю и организация общения на сайте.

1.6 Типовая структура web-сайта

Структура сайтов субъектов экономики разнообразна и, как правило, включает следующие разделы:

· Главная страница. Дает пользователю представление о структуре сайта. Кроме того, на главной странице размещаются новости, анонсы мероприятий, т.е. та информация, которая может интересовать различные категории:

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

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

· Фотогалерея. Содержит фотографии мероприятий.

· Успехи.

· Мероприятия (регулярно проводимые мероприятия, праздники, игры).

· Партнеры.

· Спонсоры.

· Форум, гостевая книга.

Гостевая книга - это место на сайте, где ваши посетители могут оставлять свои сообщения: отзывы на сайт, замечания, пожелания и т. д. Здесь же хранятся и ранее опубликованные сообщения. В отличие от форума, посетители гостевой книги не могут отвечать на сообщения, оставленные другими посетителями, и тем самым завязывать дискуссию или полемику по какому-то вопросу. Однако владелец сайта имеет возможность прокомментировать любое из сообщений гостевой книги. Что касается гостевых книг, то следует учитывать, что только активно обновляемый "живой" сайт пользуется авторитетом и поддержкой. Если не обеспечено развитие сайта, бессмысленно заводить гостевые книги и прочие интерактивные формы общения. Результат будет отрицательным, т.е. в гостевой книге будет накапливаться различные критические замечания, вовсе не придающие значимости Интернет-ресурсу [2 стр.134].

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

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

Для некоторых учреждений является актуальным создание раздела на иностранном языке или англоязычной версии сайта, а также поддержка контактов с зарубежными коллегами и друзьями. Англоязычная версия не обязательно должна быть копией русскоязычного сайта на английском языке, а может быть другой версией, возможно, состоящей на первых порах из одной страницы [3].



1.7 Понятие web-сайтов

Веб - сайт(англ. Website, от web - паутина и site - "место") - в компьютерной сети объединённая под одним адресом совокупность документов частного лица или организации. По умолчанию подразумевается что сайт располагается в сети Интернет. Все веб-сайты Интернета в совокупности составляют Всемирную паутину. Для прямого доступа клиентов к веб-сайтам на серверах был специально разработан протокол HTTP. Веб-сайты иначе называют Интернет-представительством человека или организации. Когда говорят "своя страничка в Интернет", то подразумевается целый веб-сайт или личная страница в составе чужого сайта. Кроме веб-сайтов в сети Интернет так же доступны WAP-сайты для мобильных телефонов. Изначально веб-сайты представляли из себя совокупности статических документов. В настоящее время большинству из них свойственна динамичность и интерактивность. Для таких случаев специалисты используют термин веб-приложение - готовый программный комплекс для решения задач веб-сайта. Веб-приложение входит в состав веб-сайта, но веб-приложение без данных сайтом является только технически. В большинстве случаев в Интернете одному веб-сайту соответствует одно доменное имя. Именно по доменным именам сайты идентифицируются в глобальной сети. Возможны иные варианты: один сайт на нескольких доменах или несколько сайтов под одним доменом. Обычно несколько доменов используют крупные сайты (веб-порталы) чтобы логически отделить разные виды предоставляемых услуг (mail.yandex.ru, news.yandex.ru, auto.yandex.ru). Нередки и случаи выделения отдельных доменов для разных стран или языков. Например, google.ru и google.fr логически являются сайтом Гугла на разных языках, но технически это разные сайты. Объединение нескольких сайтов под одним доменом характерно для бесплатных хостингов. Для идентификации сайтов в адресе после указания хоста стоит тильда и имя сайта: example.com/~my-site-name/. Аппаратные сервера для хранения веб-сайтов называются веб-серверами.

Сама услуга хранения называется веб-хостингом. Раньше каждый сайт хранился на своём собственном сервере, но с ростом Интернета технологическим улучшением серверов на одном компьютере стало возможно размещение множества сайтов (виртуальный хостинг). Сейчас сервера для хранения только одного сайта называются выделенными (англ. dedicated). Один и тот же сайт может быть доступен по разным адресам и хранится на разных серверах. Копия оригинального сайта в таком случае называется зеркалом. Существует так же понятие оффлайновая версия сайта - это копия сайта, которая может быть просмотрена на любом компьютере без подключения к компьютерной сети и использования серверного ПО. История создания сайтов Первый в мире сайт появился 6 августа 1991 года. Его создатель Тим Бернерс-Ли опубликовал на нём описание новой технологии WorldWideWeb, основанной на протоколе передачи данных HTTP, системе адресации URI и языке гипертекстовой разметки HTML. Также на сайте были описаны принципы установки и работы серверов и браузеров. Сайт стал и первым в мире интернет-каталогом, так как позже Тим Бернерс-Ли разместил на нём список ссылок на другие сайты. Все инструменты, необходимые для работы первого сайта Бернерс-Ли подготовил ещё раньше - в конце 1990 появились первый гипертекстовый браузер WorldWideWeb с функционалом веб-редактора, первый сервер на базе NeXTcube и первые веб-страницы. "Отец" веба считал, что гипертекст может служить основой для сетей обмена данными, и ему удалось претворить свою идею в жизнь [8, стр. 79].

Ещё в 1980 году Тим Бернерс-Ли создал гипертекстовое ПО Enquire, использующее для хранения данных случайные ассоциации. Затем, работая в Европейском центре ядерных исследований в Женеве (CERN), он предложил коллегам публиковать гипертекстовые документы, связанные между собой гиперссылками. Бернерс-Ли продемонстрировал возможность гипертекстового доступа к внутренним поисковику и документам, а также новостным ресурсам интернета.

В результате в мае 1991 г. в CERN был утверждён стандарт WWW. Тим Бернерс-Ли является "отцом" основополагающих технологий веба - HTTP, URI/URL и HTML, хотя их теоретические основы были заложены ещё раньше. В 40-х гг. 20-го века Ванневар Буш выдвинул идеи расширения памяти человека с помощью технических устройств, а также индексации накопленной человечеством информации для её быстрого поиска. Теодор Нельсон и ДагЭнгельбарт предложили технологию гипертекста - "ветвящегося" текста, предоставляющего читателю разные варианты чтения. Xanadu, так и не законченная гипертекстовая система Нельсона, была предназначена для хранения и поиска текста, в который введены взаимосвязи и "окна". Нельсон мечтал связать перекрёстными ссылками все тексты, созданные человечеством. В настоящее время Тим Бернерс-Ли возглавляет основанный им Консорциум Всемирной паутины (WorldWideWebConsortium), который занимается разработкой и внедрением стандартов интернета [14].

1.8 Классификация веб-сайтов

По доступности сервисов:

· Открытые - все сервисы полностью доступны для любых посетителей.

· Полуоткрытые - для доступа необходимо зарегистрироваться (обычно бесплатно).

· Закрытые - полностью закрытые служебные сайты организаций (в т.ч. корпоративные сайты), личные сайты частных лиц. Такие сайты доступны для узкого круга людей. Доступ новым людям обычно даётся через т.н. инвайты (приглашения).

По природе содержимого:

· Статические - всё содержимое заранее подготавливается. Пользователю выдаются файлы в том виде, в котором они хранятся на сервере.

· Динамические - содержимое генерируется специальными скриптами (программами) на основе других данных из любого источника.

По физическому расположению:

· Внешние сайты сети Интернет.

· Локальные сайты - доступны только в пределах локальной сети. Это могут как корпоративные сайты организаций, так как и сайты частных лиц в локальной сети провайдера.

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

· Интернет-представительства владельцев (торговля и услуги не связанные напрямую с Интернетом).

· Сайт-визитка - содержит самые общие данные о владельце сайта (организация или индивидуальный предприниматель).

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

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

Информационные ресурсы:

Тематический сайт - веб-сайт, предоставляющий исчерпывающую информацию о какой-либо теме. Тематический портал-это очень большой веб-ресурс, который предоставляет исчерпывающую информацию по определенной тематике. Порталы похожи на тематические сайты, но дополнительно содержат средства взаимодействия пользователями и позволяют пользователям общаться в рамках портала (форумы, чаты) -это среда существования пользователя Веб-сервис - обычно решает конкретную пользовательскую задачу напрямую связанную с сетью Интернет: Поисковые сервисы - например, Яндекс, Google. Почтовый сервис. Форумы. Блоговый сервис. Фотохостинг - например, Flickr, ImageShack, Panoramio, Photobucket. Хранение видео - например, YouTube, RuTube. Доска объявлений. Каталог сайтов - например, OpenDirectoryProject По отношению к посетителю: Вовлекающий сайт. Безразличный к посетителю [12].

1.9 Язык интертекстовой разметки

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

Логическая и визуальная разметки:

Различают логическую и визуальную разметки. В первом случае речь идет только о том, какую роль играет данный участок документа в его общей структуре (например, «данная строка является заголовком»). Во втором определяется, как именно будет отображаться этот элемент (например, «данную строку следует отображать жирным шрифтом»). Идея языков разметки состоит в том, что визуальное отображение документа должно автоматически получаться из логической разметки и не зависеть от его непосредственного содержания. Это упрощает автоматическую обработку документа и его отображение в различных условиях (например, один и тот же файл может по-разному отображаться на экране компьютера, мобильного телефона и на печати, поскольку свойства этих устройств вывода существенно различаются). Однако это правило часто нарушается: например, создавая документ в редакторе наподобие MS Word, пользователь может выделять заголовки жирным шрифтом, но нигде не указывать, что эта строка является заголовком.

Примеры языков разметки:

Языки разметки используются везде, где требуется вывод форматированного текста: в типографии (SGML, TeX, PostScript, PDF), пользовательских интерфейсах компьютеров (MicrosoftWord,OpenOffice, troff), Всемирной Сети (HTML, XHTML, XML, WML, VML, PGML, SVG, XBRL).

Для написания исходных текстов Википедии, её участники используют особые языки разметки:

HTML:

К 1991 году использование SGML было ограничено бизнес-программами и базами данных, а WYSIWYG-инструменты (которые сохраняли документы в проприетарных бинарных форматах) использовались для остальных программ обработки документов. Ситуация изменилась, когда сэр Тим Бернерс-Ли, узнав о SGML от своего коллеги Андерса Бергланда (англ. AndersBerglund) и других сотрудников в ЦЕРНе, использовал синтаксис SGML для создания HTML. Этот язык имел сходство с другими основанными на синтаксисе SGML языками разметки, однако начать его использование было гораздо проще даже тем разработчикам, которые никогда этого не делали. Стивен ДеРоуз (StevenDeRose) убеждал, что HTML, использующий описательную разметку (и от языка SGML в частности) -- это основной фактор в развитии Web, потому что в нем была заложена гибкость и расширяемость (а также другие факторы, включая понятие о URL и свободное использование браузерами). В наше время HTML -- наиболее привлекательный и самый часто используемый[источник не указан 1601 день] язык разметки в мире. Однако статус HTML как языка разметки оспаривается некоторыми компьютерными учеными. Их основным аргументом является то, что HTML ограничивает размещение тегов, требуя, чтобы оба тега были вложены в другие теги или в главные теги документа. Вследствие чего, эти ученые считают HTML контейнерным языком, следующим иерархической модели [9, стр. 251].

XML:

XML (расширяемый язык разметки) -- это мета-язык разметки, широко используемый в настоящее время. XML разработан консорциумом WorldWideWeb в комитете, возглавляемом Джоном Босаком (JonBosak). Основное предназначение XML -- быть более простым, чем SGML и сфокусироваться на специфичной проблеме -- документах в интернете. XML -- мета-язык как SGML, пользователям разрешается создавать любые теги, какие необходимы (отсюда «расширяемый»). Становлению XML помогли, так как каждый XML-документ мог быть написан таким же способом, как и SGML-документ, а программы и пользователи, использующие SGML, могли перейти на XML достаточно легко. Тем не менее, XML лишился многих ориентированных на людей особенностей языка SGML, упрощавших его использование (пока не расширилось количество разметки и не восстановилась читаемость и редактируемость на прежнем уровне). Другие улучшения исправляли некоторые проблемы SGML на международном уровне и делали возможным разбор документа иерархически, даже если не был доступен DTD. XML был спроектирован, в основном, для не полностью структурированной среды, например для документов и публикаций. Тем не менее, это привело к золотой середине между гибкостью и простотой, и он был быстро принят многими пользователями. В настоящее время XML широко используется для передачи данных между программами. Как HTML, он может быть охарактеризован как «контейнерный» язык.

XHTML:

Начиная с января 2000 года, все рекомендации для W3C были основаны на XML в большей степени, чем на SGML, была предложена аббревиатура XHTML (ExtensibleHyperTextMarkupLanguge -- Расширяемый Гипертекстовый Язык Разметки). Спецификации языка требовали, чтобы XHTML-документы были оформлены как XML-документы, это позволяет использовать XHTML для более четких и точных документов, используя теги от HTML. Одно из самых достойных внимания различий между HTML и XHTML -- это правило, гласящее, что все теги должны быть закрытыми: пустые теги, например, должны быть оба закрыты стандартным закрывающим тегом или специальной записью: (пробел перед «/» в закрывающем теге опционален, но часто используется, поскольку его используют некоторые пре-XML браузеры, также SGML-парсеры). Другие атрибуты в тегах должны быть в кавычках. Наконец, все теги и имена атрибутов должны быть написаны в нижнем регистре, чтобы восприниматься правильно; HTML невосприимчив к регистру.

CMS JOOMLA

Joomla! это Система Управления Содержимым (CMS), созданная той же самой получившей множество наград командой, которая принесла сегодняшнюю известность системе Mambo CMS [15].

Название Joomla! является фонетической транскрипцией слова "Jumla" из языка Суахили, что означает "все вместе" или "единое целое". Оно было выбрано, поскольку все команды мамберов оказались единодушны в желании защитить интересы создателей и сообщества, которое и является истинной причиной успеха проекта.

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

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

Название «Joomla!» фонетически идентично слову «Jumla», которое в переводе с суахили означает «все вместе» или «в целом», что отражает подход разработчиков и сообщества к развитию системы

Система управления содержанием Joomla! является ответвлением широко известной CMS Mambo. Команда независимых разработчиков отделилась от проекта Mambo по причине несогласия в экономической политике. И 16 сентября 2005 года в свет вышла первая версия Joomla!, являющаяся по сути переименованной Mambo 4.5.2.3 и включающая в себя исправления найденных на тот момент ошибок и уязвимостей.

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

WEB - СЕРВЕР APACHE

Самый распространенный Web-сервер в мире - это Apache. По данным компании Netcraft, общее число Web-узлов, работающих под его управлением, к концу 1998 г. достигло 2 млн. (55% общего числа узлов) и постоянно растет. Для сравнения: на долю серверов Microsoft приходится 25%, Netscape - 7%. Будучи бесплатной открытой программой, предназначенной для бесплатных же Unix-систем (FreeBSD, Linux и др.), Apache по функциональным возможностям и надежности не уступает коммерческим серверам, а широкие возможности конфигурирования позволяют настроить его для работы практически с любой конкретной системой. Существуют локализации сервера для различных языков, в том числе и для русского.

Исторически сложилось так, что русские тексты в Internet могут быть представлены в разных кодировках, из которых наиболее распространены koi8-r (или просто koi8) и Windows-1251: с первой работает большинство серверов и рабочих станций под управлением Unix, вторая является стандартной для всех версий Windows. Поскольку кодировка Windows-1251, естественно, применяется на подавляющем большинстве клиентских машин, доля тех, кто путешествует по русской части WWW, используя koi8, не превышает сейчас 5%. Однако в этой кодировке хранятся документы на многих Unix-серверах, в ней чаще всего передаются почтовые сообщения и практически всегда - письма в телеконференции, с ней же работают многие русскоязычные каналы IRC (кстати, аббревиатура КОИ расшифровывается как "код обмена информацией"). Чтобы решить проблемы, возникающие при несовпадении кодировок текста на сервере и клиентской машине, и был создан русский модуль Apache-RUS для Web-сервера Apache [10].

Вывод по главе 1

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

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

Большинство дизайнеров рекомендуют разрабатывать страницы в формате 640x480, чтобы при просмотре пользователям не пришлось применять горизонтальную прокрутку. Горизонтальная прокрутка всегда затрудняет восприятие, поэтому дизайнеры традиционно ее отвергают.

Достойный уважения Web-дизайн включает разработку страниц, доступных для пользователей с ограниченными возможностями, в частности по зрению и слуху. Консорциум World Wide Web объявил об инициативе Web Accessibility Initiative (WAI), которая ставит целью сделать Web более доступным для всех пользователей.

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

Пропорциональный шрифт - иначе «шрифт переменной ширины» для каждого символа выделяет разное количество места в зависимости от его начертания.

Шрифт с фиксированной шириной предоставляет одинаковое место для всех символов шрифта.

Можно выделить три гарнитуры шрифта, которые являются стандартными для представления текста на Web-страницах:

Times New Roman - классический шрифт с засечками. Данный шрифт используется для представления на бумажных носителях больших объемов текста;

Arial - шрифт без засечек (гуманистическая гарнитура). Данный шрифт чаще всего используется в заголовках;

Verdana - современный шрифт, разработанный специально для отображения на мониторе компьютера.

На данный момент почти все изображения в Web, представлены в двух форматах: GIF и JPEG. Третий соперник, заслуживающий упоминания, формат PNG, борется за поддержку и внимание браузеров.

GIF - Grafic Interchange Format можно назвать традиционным форматом файлов Web. Его свойства состоят в следующем:

· поддерживает не более 256 цветов (меньше можно и часто нужно);

· использует палитру цветов;

· использует сжатие без потери информации по методу LZW (который подобен применяемому в архиваторе PKZIP, и, следовательно, GIF-файлы в дальнейшем практически не сжимаются);

· поддерживает чересстрочную развертку;

· является поточным форматом, т.е. показ картинки начинается во время перекачки;

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

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

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

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

Вторым наиболее популярным графическим форматом в Web является JPEG - Joint Photographic Experts Group. Он содержит 24-разрядную информацию о цвете. Это 16,77 млн цветов в отличие от 256 цветов формата GIF. В JPEG используется так называемое сжатие с потерями. Это означает, что некоторая информация об изображениях в процессе сжатия отбрасывается, но в большинстве случаев ухудшение качества изображения не наносит вреда и часто даже не заметно.

Есть еще третий графический формат, конкурирующий за постоянное использование в Web. Это формат PNG - Portable Network Graphic, который, несмотря на некоторые достоинства, с 1994 г. находится более или менее в тени. Только недавно браузеры начали поддерживать PNG как встроенную графику, но PNG имеет все шансы стать очень популярным форматом в Web.



2. Проектная часть разработки web-сайта

2.1 Обоснование и выбор программного обеспечения

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

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

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

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



Процесс создание Web-страницы с помощью Adobe Dreamweaver CC

2.1.1 Улучшение оформления Web-узлов

Adobe Dreamweaver CC включает различные средства, возможности разметки и графические функции, которые ускоряют работу и позволяют создавать Web-узлы профессионального уровня.

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

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

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

Создание таблиц, используемых для разметки, и работа с ними, а также контроль разметки с точностью до пикселя.

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

2.1.2 Ускорение и упрощение генерации кода

Средства проектирования, предлагаемые Adobe Dreamweaver CC, позволяют создавать эффективные чистые HTML-файлы и могут применяться как профессионалами, так и новичками в области Web-разработки. Пользуясь преимуществами генерируемого с помощью Adobe Dreamweaver CC эталонного кода, профессионалы могут применять усовершенствованные средства написания кода и средства работы со сценариями для обеспечения интерактивных возможностей работы с Интернетом. Благодаря простоте средств написания кода с их помощью можно начать освоение HTML.

...