Разработка технологии создания web-сайта

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

СОДЕРЖАНИЕ

Введение

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

1.1. Web-страницы и web-сайты

1.2. Язык разметки гипертекстовых страниц HTML

1.3. Web браузеры

1.4. Таблица стилей CSS

2. Технологическая часть

2.1. Инструкция по исполнению сайта

2.2. Web-дизайн

2.3. Структура сайта

2.4. Оформление сайта

3. Часть оснащения

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

5. Техника безопасности

Заключение

Список использованной литературы



Введение

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

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

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

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

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

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

World Wide Web (WWW) - интеллектуальное достижение человечества в эпоху высоких технологий. На сегодняшний день WWW содержит миллионы сайтов, на которых размещена всевозможная информация. Люди получают доступ к этой информации посредством использования технологии Internet. Для навигации в WWW используются специальные программы - Web-браузеры, которые существенно облегчают пользование ресурсами WWW. Вся информация в Web-браузере отображается в виде Web-страниц, которые являются основным элементом байтов WWW.

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

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

Цель данной дипломной работы - разработать технологию создания web-сайта посредством языка гипертекстовой разметки html.



1. ТЕОРЕТИЧЕСКАЯ ЧАСТЬ

1.1 Web-страницы и web-сайты

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

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

Веб-сайт выполняет следующие основные задачи:

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

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

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

поддержка клиентов.

Типы веб-сайтов

Рекламные веб-сайты

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

Веб-сайты-продавцы

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

Веб-сайты-"альтруисты"

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

Веб-сайты для поддержки

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

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

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

Гипертекстовый документ

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

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

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

Гипертекстовые документы создаются на базе языка HTML (HyperText Markup Language). Этот язык весьма прост, однако способен реализовать крупные логические конструкции (абзацы, списки, таблицы, формы, фреймы). Позволяет с легкостью подключать графические файлы, различные стили оформления отдельных элементов или всего документа, а также скрипты - специальные исполняемые модули (аналоги макросов).

Web-обозреватель

Web-обозреватель, или браузер (от англ, browse -"просматривать") - это специальное приложение, позволяющее просматривать Web-страницыИнтернета: читать гипертекст, воспроизводить гипермедиа (движущееся изображение и звук), соединяться с другими компьютерами и посылать запросы на загрузку документа Web. Наиболее популярными браузерами на данный момент являютсяInternet Explorer компании Microsoft и Netscape Navigatorкомпании Sun Microsystems.

Адрес URL

Адрес URL (Uniform Resource Locator - Универсальный указатель ресурса) - это строка символов, обозначающая документ или ресурс, запрашиваемы: пользователем Всемирной паутины. Чтобы получить доступ к нужному ресурсу или документу, достаточно ввести его адрес URL в поле ввода браузеpa. Формат адресов URL стандартизирован, поэтому он распознается всеми программами просмотра. Структура адреса URL имеет следующий вид:

<Тип ресурса или протокол>://<Имя в Интернете>/<Путь доступа>,

где <тип ресурса или протокол> определяет метод доступа к ресурсу, например, http или ftp.

<имя в Интернете> представляет собой сетевое имя компьютера, на котором находятся искомые данные.

И, наконец, <путь доступа> может обозначать полное имя файла, порт, с которым необходимо соединиться либо текст, по которому должен происходить поиск в базе данных. Например, адрес URL для русскоязычной Web-страницы, посвященной информации о продуктах Microsoft Office XP, выглядит следующим образом:

http://www.microsoft.com/rus/officexp/ .

1.2 Язык гипертекстовой разметки HTML

HTML (от англ. HyperText Markup Language - «язык гипертекстовой разметки»;) - стандартный язык разметки документов во Всемирной паутине. Большинство веб-страниц содержат описание разметки на языке HTML (или XHTML). Язык HTML интерпретируется браузерами и отображается в виде документа в удобной для человека форме.

Язык HTML является приложением («частным случаем») SGML (стандартного обобщённого языка разметки) и соответствует международному стандарту ISO 8879.

Язык XHTML является более строгим вариантом HTML, он следует всем ограничениям XML и, фактически, XHTML можно воспринимать как приложение языка XML к области разметки гипертекста.

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

Изначально язык HTML был задуман и создан как средство структурирования и форматирования документов без их привязки к средствам воспроизведения (отображения). В идеале, текст с разметкой HTML должен был без стилистических и структурных искажений воспроизводиться на оборудовании с различной технической оснащённостью (цветной экран современного компьютера, монохромный экран органайзера, ограниченный по размерам экран мобильного телефона или устройства и программы голосового воспроизведения текстов). Однако современное применение HTML очень далеко от его изначальной задачи. Например, тег <TABLE> предназначен для создания в документах таблиц, но часто используется и для оформления размещения элементов на странице. С течением времени основная идея платформонезависимости языка HTML была принесена в жертву современным потребностям в мультимедийном и графическом оформлении.

1.3 Web-браузеры

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

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

Основные функции браузера

Основное предназначение браузера - отображать веб-ресурсы. Для этого на сервер отправляется запрос, а результат выводится в окне браузера. Под ресурсами в основном подразумеваются HTML-документы, однако это также может быть PDF-файл, картинка или иное содержание. Расположение ресурса определяется с помощью URI (унифицированного идентификатора ресурсов).

То, каким образом браузер обрабатывает и отображает HTML-файлы, определено спецификациями HTML и CSS. Они разрабатываются Консорциумом W3C, который внедряет стандарты для Интернета.

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

Пользовательские интерфейсы разных браузеров имеют много общего. Основные элементы интерфейса браузера перечислены ниже.

· Адресная строка для ввода URI

· Кнопки навигации "Назад" и "Вперед"

· Закладки

· Кнопки обновления и остановки загрузки страницы

· Кнопка "Домой" для перехода на главную страницу

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

Структура верхнего уровня

Ниже перечислены основные компоненты браузера.

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

2. Механизм браузера - управляет взаимодействием интерфейса и модуля отображения.

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

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

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

6. Интерпретатор JavaScript - используется для синтаксического анализа и выполнения кода JavaScript.

7. Хранилище данных - необходимо для сохраняемости процессов. Браузер сохраняет на жесткий диск данные различных типов, например файлы cookie. В новой спецификации HTML (HTML5) имеется определение термина "веб-база данных": это полноценная (хотя и облегченная) браузерная база данных.

Каскадные (многоуровневые) таблицы стилей - cascading style sheets (CSS) - это мощный стандарт на основе текстового формата, определяющий представление данных в броузере.

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

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

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

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

CSS предполагает 3 типа таблиц стилей - встроенные, внедренные (внутренние) и связанные (внешние).

Существует три метода для применения таблицы стилей к документу HTML:

· Встроенный (Inline). Этот метод позволяет взять любой тег HTML и добавить к нему стиль. Использование встроенного метода предоставляет максимальный контроль над всеми свойствами Web-страницы. Предположим, вы хотите задать внешний вид отдельного абзаца. Вы можете просто добавить атрибут style к тегу абзаца, и броузер отобразит этот абзац с помощью параметров стиля, добавленного в код.

· Внедренный (Embedded). Внедрение позволяет контролировать всю страницу HTML. При использовании тега <style>, помещенного внутри раздела <head> страницы HTML, в код вставляются детализированные атрибуты стиля, которые будут применяться ко всей странице.

· Связанный (Linked или External). Связанная таблица стилей - мощный инструмент, который позволяет создавать образцы стилей (master styles), которые можно затем применять ко всему узлу. Основной документ таблицы стилей (расширение .css) создается Web-дизайнером. Этот документ содержит стили, которые будут едиными для всего Web-узла (неважно, содержит одну страницу или тысячи страниц). Любая страница, связанная с этим документом, будет использовать указанные стили.

1.4 Таблица стилей CSS

Правила построения CSS

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

селектор, селектор {

свойство: значение;

свойство: значение;

свойство: значение;

}

В четвёртом случае подключения таблицы CSS к документу (см. список) правило CSS (являющееся значением атрибута style тега, на который оно действует) представляет собой перечень объявлений («свойство CSS : значение»), разделённых знаком «;».

Пример таблицы стилей

Пример таблицы стилей (в таком виде она может быть либо размещена в отдельном файле .css, либо же обрамлена тегами <style> и размещена в «шапке» той самой веб-страницы, на которую она действует):

p {

font-family: Garamond, serif;

}

h2 {

font-size: 110 %;

color: red;

background: white;

}

.note {

color: red;

background: yellow;

font-weight: bold;

}

p#paragraph1 {

margin: 0;

}

a:hover {

text-decoration: none;

}

#news p {

color: blue;

}

[type="button"] {

background-color: green;

}

Здесь приведено семь правил CSS с селекторами p, h2, .note, p#paragraph1, a:hover, #news p и [type="button"].

1. Первое правило присвоено HTML-элементу p (абзацу) - назначен стиль. Абзацы будут отображаться шрифтом Garamond, или, если такой шрифт недоступен, каким-либо другим шрифтом с засечками («serif»).

2. Второе правило присвоено HTML-элементу h2 (заголовку второго уровня). Заголовок второго уровня будет отображаться красным на белом фоне с увеличенным кеглем.

3. Третье правило будет применено к любому элементу, атрибут class которого равен 'note'. Например, к параграфу: <p class="note">Этот абзац будет выведен полужирным шрифтом красного цвета на желтом фоне.</p>

4. Четвёртое правило будет применяться только к элементу p, атрибут id которого равен paragraph1. Такой элемент не будет иметь внешних отступов (margin).

5. Пятое правило определяет стиль hover для элементов a - гиперссылок. По умолчанию, в большинстве браузеров текст элементов a подчеркивается. Это правило уберёт подчеркивание, когда указатель мыши находится над этими элементами.

6. Шестое правило, применяется для элементов p, которые находятся внутри КАКОГО-ЛИБО элемента с атрибутом id, равным «news» (#news p - это типичный случай селектора потомков, см. 5-й пункт списка выше).

7. Седьмое правило применяется для всех элементов, у которых атрибут type равен button. Например, это правило будет применено к элементу <input type="button"> (обычная кнопка), изменив его цвет фона на зеленый.

CSS-вёрстка

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

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

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

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

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

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

Недостатки:

· Различное отображение вёрстки в различных браузерах (особенно устаревших), которые по-разному интерпретируют одни и те же данные CSS.

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



2. ТЕХНОЛОГИЧЕСКАЯ ЧАСТЬ

2.1 Инструкция по исполнению сайта

Для создания моего мы я поделила его на 4 части

1. “logo”

2. “menu”

3. “content”

4. “footer”

Создаем первый html документ и называем его index.html

И начинаем создавать наш сайт

<!doctype>

<html>

<head>

<title>Sharq Telecom</title>

</head>

<frameset rows="150,*,110" border="0">

<frame src="logo.html">

<frameset cols="200,*">

<frame src="menu.html">

<frame src="content.html" name="content">

</frameset>

<frame src="footer.html">

</frameset>

</html>

Затем создаем следующий html документ и назовем menu.html

<!doctype>

<html>

<head><title>Sharq Telecom</title>

<base target="content">

</head>

<body bgcolor="#999" text="#fff" alink="#FF6600" link="#FFCC00" vlink="#fff">

<b><i><a href="content.html">Главная</a><br />

<br />

<a href="5.html">О компании</a><br />

<br />

<a href="6.html">Миссия компании </a><br />

<br />

<a href="2.html">Интернет</a><br />

<br />

<a href="3.html">Телефония</a><br />

<br />

<a href="4.html">Хостинг</a><br />

<br />

</span>

</body>

</html>

Далее мы создаем content.html

<!doctype>

<html>

<head><title>Sharq Telecom</title>

</head>

<body bgcolor="#999" text="#fff">

<img src="img/13651697112.jpg" width="50%" align="left" hspace="20" vspace="20"><p>&nbsp;</p>

<p align="justify"><font size="4"><b><i>Компания "Sharq Telekom"</i>

</b> начала свою деятельность в июле 2003 года. Сегодня является одним из ведущих операторов сетей передачи данных в Узбекистане. Компания располагает необходимым техническим потенциалом для оказания услуг на современном уровне и реализации новых проектов. </font></p>

<p align="justify"><font size="4">С наступлением эры информационных и коммуникационных технологий каждый из нас стоит на пороге вхождения в мировое информационное сообщество и на этом фоне вполне естественным является желание компании "Sharq Telekom" соответствовать самым высоким требованиям, предъявляемым нашими клиентами. </font>

</p>

</body>

</html>

Далее идет 5.html:

<!doctype>

<html>

<head><title>Sharq Telecom</title>

</head>

<body bgcolor="#999" text="#fff">

<img src="img/abstract-grey-swash-colour-size-7920-6373_medium.jpg" align="left" width="50%" hspace="20" vspace="20"><p>&nbsp;</p>

<p align="center"><font size="5" color="#FF9933"><b><i>Информация о компании "Sharq Telekom"</i></b>

</font></p>

<p>

</b>Мы стремительно развиваемся и модернизируем имеющееся оборудование, а также закупаем новое, улучшаем сервис, набираемся опыта, чтобы на должном уровне предоставлять услуги Интернет и удовлетворять потребности наших клиентов.</font></p>

</font></p>

<p>

</b>Компания осуществляет постоянный мониторинг всех систем связи. Служба технической поддержки действует круглосуточно. </font></p>

</body>

</html>

Далее создаем 6.html

<!doctype>

<html>

<head><title>Sharq Telecom</title>

<base target="content">

</head>

<body bgcolor="#999" text="#fff" alink="#FF6600" link="#FFCC00" vlink="#fff">

<b><i><font size="5" color="#FF9933">Миссия компании </font><br /></b></i>

<p><font size="4">

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

</p>

<p>

Исключительный комфорт

</p>

<p>

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

</p>

<p>

Искренняя забота о жителях

</p>

<p>

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

</p>

<p>

Высокие технологии

</p>

<p>

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

</p>

<p>

Непрерывная ответственность

</p>

<p>

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

</font><p/>

</body>

</html>

Дальше 2.html

<!doctype>

<html>

<head><title>Sharq Telecom</title>

</head>

<body bgcolor="#999" text="#fff">

<p>&nbsp;</p>

<p align="center"><font size="5" color="#FF9933"><b><i>Интернет от "Sharq Telekom"</i>

</b>

</font></p>

<p align="justify"><font size="3">Основным направлением деятельности компании "Sharq Telekom" является предоставление Интернет-услуг для <font color="#FF9933"> физических</font> и <font color="#FF9933">юридических</font> лиц.

</font></p>

<p align="justify"><font size="3">В успешном ведении бизнеса и постоянном прогрессе компании в современном мире большую роль играет качественный интернет. Интернет провайдер "Sharq Telekom" предлагает высокоскоростное подключение к сети Интернет для Вашего офиса.

</font></p>

<p align="justify"><font size="3">Для Вас предоставлены следующие <font color="#FF9933">тарифы: </font>с ограниченным трафиком, с неограниченным трафиком, Unlimited с негарантированной скоростью, тарифы для доступа по TAS-IX. Представленные <font color="#FF9933">тарифные планы </font> позволят выбрать Вам оптимальный вариант для Вашей компании. Помимо тарифных планов в разделе помещена информация о дополнительных услугах (ссылается на ) компании, связанных с подключением к сети интернет для юридических лиц. </font></p>

<p align="justify"><font size="3"><font color="#FF9933">Sharq Stream </font>- услуга передачи данных в сети Интернет для физических лиц по технологии ADSL с использованием существующей телефонной линии абонента. Доступ в Интернет по технологии ADSL предоставляется по существующей телефонной линии, с высокой скоростью. При этом телефон остается свободным, что делает данную услугу гораздо более привлекательной для населения, чем подключение к Интернет по технологии dial-up или по выделенной линии.

</font></p>

<p align="justify"><font size="3">Скорость на организуемом канале при стандартных характеристиках телефонного кабеля Абонента устанавливается в зависимости от выбранного Абонентом тарифного плана. Sharq Streamпредоставляется по адресу, указанному абонентом в Договоре, при подключении на услугу и являющемуся адресом регистрации (прописки) абонента, согласно его паспортным данным. В случае изменения абонентом тарифного плана или отсутствия сессий в течение месяца, перенос неизрасходованного предоплаченного трафика на следующий месяц не осуществляется.

</font></p>

<p align="justify"><font size="3">Предлагаем Вам более подробно ознакомиться с условиями подключения и тарифными планами услуги <font color="#FF9933">Sharq Stream!</font> </font></p>

</body>

</html>

Далее 3.html

<!doctype>

<html>

<head><title>Sharq Telecom</title>

</head>

<body bgcolor="#999" text="#fff">

<p>&nbsp;</p>

<p align="center"><font size="5" color="#FF9933"><b><i>Услуги телефонии от "Sharq Telekom"</i></b>

</font></p>

<p align="justify"><font size="3">Надежная телефонная связь обеспечивает бесперебойную и быструю работу любого современного офиса. Компания "Sharq Telekom" предлагает Вам различные решения по предоставлению качественного доступа к телефонной сети, в зависимости от местонахождения Вашего офиса, имеющихся коммуникаций и потребностей в сфере телекоммуникаций.</p>

<p align="justify"><font size="3">

перечень услуг нашей компании входит:

<ul> <li>ISDN-телефония;</li>

<li>NGN-телефония;</li>

<li>местная, междугородная и международная связь;</li>

<li>многоканальный номер;</li>

<li>корпоративный PIN-код.</li>

</ul>

</font></p><font size="3">Традиционная телефония от "Sharq Telekom"

<ul> <li>Наша компания осуществляет предоставление услуг традиционной телефонии.</li>

<li>В нашем распоряжении находится своя цифровая АТС с присвоенной нумерацией начинающейся на 113.</li>

<li>Предоставление номеров в данный момент возможно только в зоне действия АТС 244 и при наличии у абонента прямого провода от 244 АТС.</li>

<li>При подключении нашего номера мы предоставляем нелимитированный по времени и доступ к звонкам по городу Ташкент.</li>

</ul>

</font>

<p><font size="3">Дополнительные услуги телефонии</font></p>

<p><font size="3"> Многоканальный номер

</font></p>

<p><font size="3">Использование многоканального номера позволяет одновременно обслуживать несколько входящих вызовов. При этом дозвон осуществляется на единый номер, а нагрузка распределяется между определенным количеством оконечных устройств, которые находятся в офисе Клиента.

</font></p>

<p><font size="3">Услуга удобна для офисов крупных компаний и организаций информационно-справочных служб, на номера которых поступает значительное количество телефонных звонков клиентов. Вашим клиентам надо запомнить только один телефонный номер, который не изменится даже в случае переезда Вашего офиса на другой адрес!

</font></p>

<p><font size="3">Абонентская плата за каждый дополнительный канал составляет 8 $/месяц.</font></p>

<p><font size="3"> Корпоративный PIN-код

</font></p>

<p><font size="3">Услуга корпоративного PIN-кода представляет собой универсальное средство доступа к междугородней и международной связи как для юридических так и для физических лиц. Условием использования данной услуги является наличие у клиента номера телефона городской АТС и телефонного аппарата, обладающего возможностью тонального набора номера.

</font></p>

<p><font size="3">Удобство данной услуги заключается в следующем:

<ul> <li>постоянный неповторимый ПИН-код, который выдаётся нами после подписания договора на обслуживание;</li>

<li> возможность пополнять баланс любой суммой денег; </li>

<li>возможность доступа к международной связи даже при условии закрытого выхода на межгород (восьмерка) со стороны ГТС с АТС любого типа и сотовых телефонов. При этом любой звонок клиента тарифицируется ГТС как местный звонок.</li>

<li>первые 6 секунд связи не тарифицируются</li>

<li>круглосуточная служба технической поддержки клиентов</li></ul>

</font></p><font size="3">Для подключения данной услуги Абоненту необходимо заключить Договор в нашем офисе, внести первоначальный платеж в размере не менее 5000 сум. После этого клиенту выдается секретный ПИН-код и Абонент может осуществлять междугородние и международные звонки по выгодным тарифам до тех пор пока имеются деньги на счету.</font>

<p><font size="3"> В последующем Абонент вносит платежи, необходимые для поддержания положительного баланса, путем перечисления средств через банк на расчетный счет. Абонент имеет возможность следить за состоянием счета, просматривая произведенные звонки, длительность, стоимость разговора самостоятельно в личном кабинете.

</font></p>

<p><font size="3">Для получения более подробной информации по условиям предоставления услуги обращайтесь в отдел продаж. </font>

</p>

</body>

</html>

Далее 4.html

<!doctype>

<html>

<head><title>Sharq Telecom</title>

</head>

<body bgcolor="#999" text="#fff">

<img src="img/istock_000005946607medium.jpg" width="50%" align="left" hspace="20" vspace="20"><p>&nbsp;</p>

<p align="center"><font size="5" color="#FF9933"><b><i>Услуги телефонии от "Sharq Telekom"</i></b>

</font></p><p>

Создание собственных web-ресурсов стало необходимостью многих компаний. Размещение различных web-ресурсов значительно распространяет известность о Вашей компании и, как следствие служит хорошей почвой для развития Вашего бизнеса.</p>

<p>

Компания "Sharq Telekom" поможет разместить и поддерживать Ваши web-ресурсы. Мы предлагаем следующие типы размещения:

<ul>

<li>виртуальный хостинг;</li>

<li>VDS / VPS;</li>

<li>collocation.</li>

</ul>

</body>

</html>

Затем создаем верхний заголовок и бегущую строку и называем html документ logo.html

<!doctype>

<html>

<head><title>Sharq Telecom</title>

</head>

<body background="img/images.jpg" text="#fff">

<table width="100%">

<tr>

<td width="12%" align="right"><img src="img/STlogo360.png" width="100"></td>

<td width="28%"><h1>Sharq <br />Telecom</h1></td>

<td width="60%">

<img src="img/1.png" align="right" height="100" width="200">

<h4 align="right">Телефон для справок

<br />

( +998 71 ) 113 - 00 00

</h4>

</td>

</tr>

</table>

<marquee><font size="5" color="#FFB140"><b>Уважаемые абоненты!

Уведомляем вас о переходе АТС 253/280, 251/215, 216/217, 242/249/227 на новую биллинговую систему 19 февраля 2014 г.</b></font>

</marquee>

</body>

</html>

И последний html документ назовем footer.html в нем находится нижняя часть нижний заголовок и выглядит оно так:

<!doctype>

<html>

<head><title>Sharq Telecom</title>

</head>

<body background="img/images.jpg" text="#fff">

<table width="100%">

<tr>

<td width="10%"><b> </b><br />

<br />

</td>

<td width="30%"><b>Наш адрес в Ташкенте:</b><br />

<br />Проспект Навои, Д.6

</td>

<td width="30%"><b>Телефоны:</b>(+998 71) 113-00 00

<br />Розничные услуги: 113-00 01

<br />Корпоративные услуги: 113-00 02

<br />Отдел продаж: 113-00 03

</td>

<td width="30%"><b> Факс: </b>(998 71) 113-13 02

<br /><br />

</td>

</tr>

</table>

</body>

</html>

Теперь я хочу дать информацию какие теги, атрибуты я использовала во всех html документах:

Элемент <!DOCTYPE>

Элемент <!DOCTYPE> предназначен для указания типа текущего документа - DTD (document type definition, описание типа документа). Это необходимо, чтобы браузер понимал, как следует интерпретировать текущую веб-страницу, поскольку HTML существует в нескольких версиях, кроме того, имеется XHTML (EXtensible HyperText Markup Language, расширенный язык разметки гипертекста), похожий на HTML, но различающийся с ним по синтаксису. Чтобы браузер «не путался» и понимал, согласно какому стандарту отображать веб-страницу и необходимо в первой строке кода задавать <!DOCTYPE>.

Тег <HTML>

Тег <html> является контейнером, который заключает в себе все содержимое веб-страницы, включая теги <head> и <body>. Открывающий и закрывающий теги <html> в документе необязательны, но хороший стиль диктует непременное их использование. Как правило, тег <html> идет в документе вторым, после определения типа документа (Document Type Definition, DTD), устанавливаемого через элемент <!DOCTYPE>. Закрывающий тег <html> должен всегда стоять в документе последним.

Атрибуты

Title - Добавляет всплывающую подсказку на веб-страницу.

Manifest - Указывает файл манифеста, необходимый для создания оффлайнового приложения.

Xmlns - Указывает пространство имен для XHTML-документов.

Тег <HEAD>

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

Содержимое тега <head> не отображается напрямую на веб-странице, за исключением тега <title> устанавливающего заголовок окна веб-страницы.

Внутри контейнера <head> допускается размещать следующие элементы: <base>, <basefont>, <bgsound>, <link>, <meta>, <script>, <style>, <title>.

Тег <FRAMESET>

Определяет структуру фреймов на веб-странице. Фреймы разделяют окно браузера на отдельные области, расположенные вплотную друг к другу. В каждую из таких областей загружается самостоятельная веб-страница определяемая с помощью тега <frame>. С помощью фреймов веб-страница делится на два или более документа, которые обычно содержат навигацию по сайту и его контент. Механизм фреймов позволяет открывать документ в одном фрейме, по ссылке, нажатой в совершенно другом фрейме. Тег <frameset> заменяет собой элемент <body> на веб-странице. Допустимо использовать вложенную структуру элементов, это позволяет разбить один фрейм на две и более области.

АТРИБУТ <ROWS>

Задает высоту или пропорции фреймов в структуре <frameset> в виде строк. Если создаются несколько строк, то для атрибута rows необходимо установить определенное значение. Для этого используется три варианта:

1. размер в пикселах;

2. размер в процентах от доступной ширины фрейма;

3. символ звездочки (*), который обозначает всю свободную ширину, оставшуюся после указания размеров в пикселах или процентах.

Удобство использования атрибута rows совместно со значением * состоит в том, что фрейм можно определить в нижней части окна браузера. Когда требуется создать равномерную сетку фреймов, используйте в теге <frameset> одновременно атрибуты rows и cols. Для более сложной структуры необходимо вкладывать один тег <frameset> внутрь другого.

АТРИБУТ <COLS>

Задает размеры или пропорции колонок фреймов в структуре <frameset>. Если создаются несколько колонок, то для атрибута cols необходимо установить определенное значение. Для этого используется три варианта:

1. размер в пикселах;

2. размер в процентах от доступной ширины фрейма;

3. символ звездочки (*), который обозначает всю свободную ширину, оставшуюся после указания размеров в пикселах или процентах.

Используйте значение в пикселах, когда требуется установить размер фрейма заданной ширины. Это особенно полезно для отображения содержания заданных размеров, например, изображения. Проценты удобно применять для пропорционального разделения фреймов, в этом случае, независимо от размера окна браузера пропорции будут сохраняться, главное, чтобы суммарная ширина колонок равнялась 100%. Если значения не составляют в сумме 100%, браузер отобразит фреймы, но ширина их будет установлена не точно. Наконец, если требуется отвести оставшееся место под фрейм, то используется символ звездочки. В этом случае браузер вычисляет ширину фрейма, когда размеры для остальных фреймов уже установлены. Допускается смешивать отдельные типы значения, перечисляя их через запятую. Тогда работа по расчету нужной ширины выпадает на долю браузера.

Атрибут SRC

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

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

Тег <BASE>

Элемент <base> определен внутри контейнера <head> и инструктирует браузер относительно полного базового адреса текущего документа. Тег <base> предназначен для документов, в которых используется относительный адрес и эти документы могут переноситься в другую папку или даже на другой компьютер без потери связи. Браузер ищет тег <base>, определяет полный адрес документа и корректно загружает его. Например, если адрес документа указан как <base href="http://www.megasite.ru/hzchd/">, то при добавлении рисунков достаточно использовать относительный адрес <img src="images/labuda.gif">. При этом полный путь к изображению будет http://www.megasite.ru/hzchd/images/labuda.gif, что позволяет браузеру всегда находить графический файл, независимо от того, где находится текущая веб-страница. Также можно применять и иерархическую систему пути с двумя точками. Так, если изображение добавляется как <img src="../images/labuda.gif">, то полный путь к файлу будет http://www.megasite.ru/images/labuda.gif.

Второе применение тега <base> - задание целевого окна для всех ссылок на текущей странице.

Атрибут TARGET

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

ТЕГ <BODY>

Элемент <body> предназначен для хранения содержания веб-страницы (контента), отображаемого в окне браузера. Информацию, которую следует выводить в документе, следует располагать именно внутри контейнера <body>. К такой информации относится текст, изображения, теги, скрипты JavaScript и т.д.

Тег <body> также применяется для определения цветов ссылок и текста на веб-странице. Подобная практика в HTML 4 осуждается и взамен для указания цветовой схемы рекомендуется использовать стили, применяя их к селектору BODY. Тем не менее, большинство атрибутов до сих пор поддерживается разными браузерами.

Открывающий и закрывающий теги <body> на веб-странице не являются обязательными, однако хорошим стилем считается их использование, чтобы определить начало и конец HTML-документа.

Атрибуты

ALINK-Устанавливает цвет активной ссылки.

BACKGROUND-Задает фоновый рисунок на веб-странице.

BGCOLOR-Цвет фона веб-страницы

BGPROPERTIES-Определяет, прокручивать фон совместно с текстом или нет.

BOTTOMMARGIN-Отступ от нижнего края окна браузера до контента.

LEFTMARGIN-Отступ по горизонтали от левого края окна браузера до контента.

LINK-Цвет ссылок на веб-странице

RIGHTMARGIN-Отступ от правого края окна браузера до контента.

SCROLL-Устанавливает, отображать полосы прокрутки или нет.

TEXT-Цвет текста в документе.

TOPMARGIN-Отступ от верхнего края окна браузера до контента.

VLINK-Цвет посещенных ссылок.

Тег <B>

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

Тег <I>

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

Атрибут HREF

Задает адрес документа, на который следует перейти. Поскольку в качестве адреса ссылки может использоваться документ любого типа, то результат перехода по ссылке зависит от конечного файла. Так, архивы (файлы с расширением zip или rar) будут сохраняться на локальный диск. По умолчанию новый документ загружается в текущее окно браузера, однако это свойство можно изменить с помощью атрибута target.

Тег <A>

Тег <a> является одним из важных элементов HTML и предназначен для создания ссылок. В зависимости от присутствия атрибутов name или href тег <a> устанавливает ссылку или якорь. Якорем называется закладка внутри страницы, которую можно указать в качестве цели ссылки. При использовании ссылки, которая указывает на якорь, происходит переход к закладке внутри веб-страницы.

Для создания ссылки необходимо сообщить браузеру, что является ссылкой, а также указать адрес документа, на который следует сделать ссылку. В качестве значения атрибута href используется адрес документа (URL, Universal Resource Locator, универсальный указатель ресурсов), на который происходит переход. Адрес ссылки может быть абсолютным и относительным. Абсолютные адреса работают везде и всюду независимо от имени сайта или веб-страницы, где прописана ссылка. Относительные ссылки, как следует из их названия, построены относительно текущего документа или корня сайта.

Тег <BR>

Тег <br> устанавливает перевод строки в том месте, где этот тег находится. В отличие от тега абзаца <p>, использование тега <br> не добавляет пустой отступ перед строкой. Если текст, в котором используется перевод строки, обтекает плавающий элемент, то с помощью атрибута clear тега <br> можно сделать так, чтобы следующая строка начиналась ниже элемента.

...