Реферат: Проектирование и создание современного web-сайта

Министерство образования Российской Федерации

Самарский государственный университет

Механико-математический факультет

Кафедравысшей математики

иинформатики

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

Студента5 курса дневного отделения

Кондрахина Сергея Сергеевича

ПРОЕКТИРОВАНИЕ И СОЗДАНИЕ

СОВРЕМЕННОГО WEB-САЙТА

Допущена к защите: Научныйруководитель,

8 июня 2001 года к.ф.-м.н.,доцент

Зав.кафедрой,д.ф.-м.н., ИгнатьевВ.А.

профессор Сараев Л.А.

______________________

Оценка: ______________

Председатель ГАК

______________________

"___" __________ 2001 г.

Самара 2001 год

СОДЕРЖАНИЕ

Введение

… 3

1. СОВРЕМЕННЫЕИНТЕРНЕТ-ТЕХНОЛОГИИ

… 4

1.1. Web-дизайн ибраузеры… 4

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

1.3. Обеспечение доступности Web-страницы… 14

1.4. Представлениетекста на Web-страницах… 19

1.5. Представлениеграфики на Web-страницах… 22

1.6. Web-серверы… 25

2. ОСНОВНЫЕПРАВИЛА И ЭТАПЫ СОЗДАНИЕ САЙТА

… 35

2.1. Влияние дисплеев на Web-дизайн… 36

2.2. Стандартныеразмеры и разрешения дисплеев… 37

2.3. Альтернативныедисплеи… 38

3. ВЫБОРСТРУКТУРЫ WEB-СТРАНИЦЫ

… 41

3.1. Создание фиксированных и гибких Web-страниц… 41

3.2. Разработкакомбинированных Web-страниц… 43

3.3. Macromedia Flash… 44

3.4. Стратегияразработки Web-сайта… 49

Выводы

… 52

Литература

… 53

Приложение

… 54

Введение

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

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

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

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

Для этогонеобходимо решить следующие частные задачи:

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

– изучить программный инструментарий, применяемый дляразработки и создания Web-сайтов;

– выявить и учесть методы и способы представления наWeb-страницах различных видов информации, не препятствующие их доступности;

– ознакомиться с основными правилами и рекомендациямипо разработке и созданию Web-сайтов и неукоснительно следовать им в своей практике;

– определиться со структурой Web-страниц;

– выбрать стратегию разработки и создания Web-сайта.

1. СОВРЕМЕННЫЕИНТЕРНЕТ-ТЕХНОЛОГИИ

1.1. Web-дизайн ибраузеры

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

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

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

Браузеры Netscape Navigator и Microsoft Internet Explorer. На рынке доминируют два основных браузера: NetscapeNavigator и Microsoft Internet Explorer. Вместе они, включая все их версии,представляет примерно 90 % (или более) используемых сегодня браузеров.

Эти двабраузера конкурируют между собой за господство на рынке. Результатом их борьбыстала коллекция фирменных HTML-тегов, а также несовместимые реализацииразличных технологий (печально известный Dynamic HTML, а также JavaScript иCascading Style Sheets – каскадные таблицы стилей). С другой стороны,конкуренция между Netscape и Microsoft в целом способствовала более быстрому развитиюсреды Web.

БольшинствоWeb-авторов в своей работе ориентируются на Navigator и Internet Explorer,поскольку они занимают львиную долю рынка. Тем не менее, существует ряд другихбраузеров, которые вы можете принимать во внимание.

В версииInternet Explorer 4.0 для компьютеров Macintosh отсутствует значительная частьфункциональных возможностей версии, созданной для Windows, поэтомуиспользование ряда особых возможностей версии 4.0 может исключить из игры некоторыхпользователей.

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

Несмотряна заявления Microsoft, что DHTML поддерживается всеми платформами, он особенноненадежен на компьютерах платформы Масintosh.

Браузеры America Online.Пользователи America Online (AOL) используют один из семи возможных браузеров(в зависимости от платформы и версии программного обеспечения AOL), некоторыеиз них обеспечивают только самую минимальную поддержку HTML.

Последняяверсия America Online для PC – это версия 3.0, использует адаптированную версиюбраузера Microsoft Interne Explorer 3.0. Тем не менее, не всегда можнополностью положиться на эту версию так же, как на стандартный вариант MSInternet Explorer 3.0. (Функциональность особенно ограничена для пользователейкомпьютеров Macintosh). Многие разработчики Web не раз ужасались, увидев дизайнсвоего сайта (который великолепно работал в большинстве основных браузеров),после того как он был запущен в системе AOL и отображен одним из их браузеров.

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

Крометого, некоторые технологии, такие как Java и Cascading Style Sheets (каскадныетаблицы стилей), не доступны для пользователей Windows 3.0 (примерно 40 %пользователей AOL). Владельцы компьютеров Macintosh не смогут использоватьJavaScript и ряд других возможностей (примерно 8 % пользователей).

К счастью,создан специальный сайт в помощь тем Web-дизайнерам, которые стремятся сделатьсвои страницы интересными и доступными для пользователей AOL. Особого вниманиязаслуживает таблица браузеров, где вы найдете специальный список для каждого избраузеров (по версиям и платформам), перечень технологий и поддерживаемыхфункций, а также процент сбоев для каждого из браузеров. (Адрес сайта AOL дляWeb-дизайнеров: webmaster.info.aol.com).

WebTV. WebTV приводитв наши квартиры Web через обыкновенный телевизор с пультом дистанционногоуправления (также, по желанию, можно использовать клавиатуру). Для просмотраWeb-страниц WebTV использует собственный специализированный браузер. Оносуществляет синтаксический анализ в соответствии – со стандартом HTML 3.2, ноне предоставляет возможностей отображения фреймов, Java, JavaScript, ActiveXили любого другого формата, который требует встраиваемых приложений (за исключениемвстроенных Shockwave и RealAudio 3.0). Также создано много новых фирменныхHTML-тегов, которые используются только в WebTV.

ПосколькуWebTV выводит изображение на экран телевизора, предъявляются новые требования кхарактеристикам цвета и параметрам экрана.

Opera. Opera – этомаленький и простенький браузер, созданный норвежской компанией Opera Softwareв Осло. Этот браузер обладает исключительно малым временем загрузки иминимальными требованиями к объему диска. Достоинством Opera является полноесоответствие стандартам HTML. Неточности в написании тегов (например,пропущенные закрывающие теги, неправильное вложение и т. д.), которыепропускают более солидные браузеры, не будут правильно отображаться этимбраузером. Opera 5.0 поддерживает Java, каскадные таблицы стилей и DHTML.

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

Lynx. Lynx – этораспространяемый бесплатно браузер, обеспечивающий просмотр только текста,предлагает вам быстрый и надежный доступ в Web. Он заслужил известность какнаименьший общий знаменатель стандарта, пригодный для тестирования Web-страницыпо базовым функциональным характеристикам. Несмотря на простоту, этот браузерне устаревает. Lynx постоянно совершенствуется и модернизируется. Сейчас онобеспечивает поддержку таблиц, форм и даже JavaScript!

Людидействительно используют Lynx, поэтому не стоит удивляться, если клиент закажетразработку сайта для Lynx. Этот браузер также важен для инвалидов по зрению:они используют Lynx вместе с речевыми устройствами.

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

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

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

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

Язык разметки гипертекстовых страниц(HTML – Hypertext Markup Language) представляет собойязык, разработанный специально для создания Web-документов. Он определяетсинтаксис и размещение специальных инструкций (тегов), которые не выводятся наэкран, но указывают браузеру, как отображать содержимое документа. Он такжеиспользуется для создания ссылок на другие документы, локальные или сетевые,например, находящиеся в сети Интернет.

СтандартHTML и другие стандарты для Web разработаны под руководством консорциума W3C(World Wide Web Consortium). Стандарты, спецификации и проекты новыхпредложений можно найти на сайте www.3w.org/. В настоящее времядействует спецификация HTML 4.0, поддержка которой со стороны основныхбраузеров постоянно растет.

На практикена стандарт HTML большое влияние оказывает наличие тегов, предложенных иподдерживаемых наиболее известными браузерами, такими как Microsoft InternetExplorer и Netscape Navigator. Эти теги в данный момент могут как входить, таки не входить в состав действующей спецификации HTML.

Информациио тегах HTML Compendium (краткое руководство по HTML) созданно Ron Woodall.Компендиум содержит список тегов и их атрибутов в алфавитном порядке, а такжеобновленную информацию о поддержке каждого из них со стороны браузеров.Компендиум HTML находится на сайте www.htmlcompendium.org.

Инструментарий редактирования HTML. Документы HTML являются обычными текстовымиASCII-файлами. Это означает, что для их создания можно использовать любойтекстовый редактор, даже с минимальными возможностями. Существуют средстваредактирования, разработанные специально для написания HTML. Они позволяютэкономить время, так как содержат клавиши быстрого доступа для выполненияповторяющихся операций, например, задания начальных установок документов,таблиц или просто применения стилей к тексту. Редакторы HTML отличаются отавторского WYSIWYG-инструментария (рассматриваемого далее) тем, что требуют знанияправил составления HTML вручную, редакторы лишь упрощают и ускоряют этот процесс.

ПользователямWindows определенно следует проверить HomeSite,мощный и недорогой редактор HTML компании Allaire Corporation. В нем имеютсясредства для выделения цветами синтаксических конструкций HTML, функция FTP,контроль синтаксиса и правописания, многофайловый поиск и замещение. Крометого, он содержит специальные команды и шаблоны для создания более сложныхэлементов (фреймов, сценариев JavaScript и DHTML). Информация идемонстрационная программа для загрузки находятся по адресу httр://www.allaire.com/.

При работена компьютерах Macintosh обращают внимание на BBEdit, коммерческий HTML-редактор компании Bare Bones Software,Inc. Он действительно имеет вес среди Web-разработчиков для для компьютеровMacintosh. В его состав входят удобные и быстрые HTML-инструменты, многофайловыйпоиск и замена, встроенная FTP-функция, поддержка 13 языков программирования,построитель таблиц, контроль синтаксиса HTML и еще множество функций.Дополнительные сведения и демонстрационную программу можно найти по адресуhttp://www.bbedit.com.

Авторский инструментарий WYSIWYG. Последние годы характеризуются резким ростом рынкаавторских инструментов. HTML-редакторы класса WYSIWYG (What You See Is What YouGet – что видишь, то и получишь) имеют графические интерфейсы, которые делаютнаписание HTML больше похожим на программу редактирования текстов или разметкистраницы. Первоначальной целью этих программ было освобождение пользователей оттегов HTML, наподобие того, как программы разметки страниц защищаютразработчика от набора команд языка PostScript. Сегодня их значимость возросла,так как они повышают эффективность и уровень автоматизации производствадокументов, обеспечивая в то же время доступ к исходному тексту HTML.

Наиболеепопулярными в настоящее время WYSIWYG-редакторами являются: MacromediaDreamweaver, Golive CyberStudio (только для компьютеровMacintosh), Microsoft FrontPage, FileMaker Claris, Home Page, AdobePageMill.

Теги HTML. ДокументHTML содержит текст (содержимое страницы) и встроенные теги – инструкциями оструктуре, внешнем виде и функции содержимого. Документ HTML разделяется на двеосновные части: заголовок – head и тело – body. Заголовок содержит такиесведения о документе, как его название и методическая информация, описывающаясодержимое. В теле находится само содержим документа (то, что выводится в окнебраузера).

Каждый тег состоит из имени, за которым можетследовать список необязательных атрибутов, все они находятся внутри угловыхскобок < >. Содержимое скобок никогда не выводится в окне браузера. Имятега, как правило, представляет собой аббревиатуру его функции, что облегчаетего запоминание. Атрибуты являются свойствами, которые расширяют или уточняютфункцию тега. Как правило, имя и атрибуты внутри тега не чувствительны крегистру. Тег будет работать так же, как <bodybgcolor=white>. Однако значения определенных атрибутов могут бытьчувствительны к регистру. Это относится, в частности, к именам файлов и URL.

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

Theweather is gorgeoustoday.

Результат:The weather is gorgeous today.

Конечныйтег имеет то же имя, что и начальный, но перед ним стоит слэш (/). Его можнорассматривать как «выключатель» тега. Конечный тег никогда несодержит атрибутов.

Внекоторых случаях конечный тег не обязателен, и браузер определяет конец тегаиз контекста. Чаще всего опускают конечный тег <р> (абзац). Браузерыраньше поддерживали этот тег без соответствующего завершения, поэтому многиеавторы Web привыкли использовать краткую форму. Это разрешено не всем тегам, ине все браузеры прощают их отсутствие. Поэтому, если есть сомнения, включите втекст закрывающий тег. Это особенно важно, когда в документе вы используетекаскадные таблицы стилей.

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

Атрибуты.Атрибуты добавляются в тег для расширения или модификации его действий. Кодному тегу можно добавить несколько атрибутов. Если атрибуты тега следуютпосле имени тега, они разделяются одним или несколькими пробелами. Порядокследования не важен. Большинство атрибутов имеют значения, которые следуют зазнаком равенства (=), находящимся после имени атрибута. Длина значенийограничена 1024 символами. Значения могут быть чувствительны к регистру. Иногдазначения должны находиться в кавычках (двойных или одинарных). Правила записизначения следующие:

– еслизначение представляет собой одно слово или число и состоит только из букв(a-z), цифр (0-9) и специальных символов (точка <.> или дефис <->),то можно поместить его после знака равенства без кавычек;

– еслизначение содержит несколько слов, разделенных запятыми или пробелами, илисодержит специальные символы, отличные от точки или дефиса, тогда егонеобходимо поместить в кавычки. Например, URL требуют кавычек, потому что онисодержат символы "://". Также кавычки необходимы при задании значенийцветов с использованием формата "#rrggbb".

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

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

TheWeather is gorgeous today.

Результат:The weather is gorgeous today.

Частовстречающейся ошибкой является перекрытие тегов. Хотя часть браузеровотображают содержимое, отмеченное таким образом, многие не разрешают нарушатьправило, поэтому важно размешать теги правильно. Следующий пример показываетневерное вложение тегов (заметьте, что тег <В> закрывается передзакрытием ):

The weather isgorgeoustoday – данная информация, игнорируемаябраузерами.

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

– разрывыстрок. Символы конца строк в документе HTML игнорируются. Текст и элементыбудут переноситься до тех пор, пока в потоке текста документа не встретится тег<р> или
. Разрывы строк выводятся, если текст обозначен кактекст с заданным форматом (<рrе>);

– символытабуляции и множественные пробелы. Когда браузер встречает в документе HTMLсимвол табуляции и несколько последовательных символов пробела, он выводиттолько один пробел. Таким образом, если документ содержит: «far, far away», браузер выведет«far, far away». Дополнительные пробелы можно добавить в текстовыйпоток, используя символ неразрывного пробела (Snbsp;). Кроме того, все пробелывыводятся, если текст является форматированным (находится в тегах <рrе>);

–множественные <р>-теги. Последовательность тегов <р>, не прерываемыхтекстом, всеми браузерами интерпретируется как избыточная. Содержимое будетвыводиться так, как если бы был только один тег <р>. Большинствобраузеров выведет несколько тегов
в виде нескольких переходов нановую строку;

– нераспознаваемыетеги. Если браузер не понимает тег или тот был неверно задан, то браузер егопросто игнорирует. В зависимости от тега и браузера это может привести кразличным результатам. Либо браузер ничего не выведет, или он может отобразитьсодержимое тега как обычный текст;

– текст вкомментариях. Браузеры не выводят текст между специальными элементами <! и ->, которые используются дляобозначения комментариев. После символов начала комментария и перед символамиокончания обязательно должен находиться пробел. В сам комментарий можнопомещать практически все. Комментарии нельзя вкладывать. В Microsoft InternetExplorer имеется фирменный тег, обозначающий комментарии<com-ment>.... Однако, он не поддерживается другимибраузерами.

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

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

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

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

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

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

Средства HTML 4.0.Спецификация HTML 4.0 вводит ряд новых атрибутов и тегов, созданных специальнодля того, чтобы сделать Web-документы доступными для более широкого кругапользователей. Кратко перечислим некоторые новые возможности HTML 4.0.(Расширенный список возможностей размещен на сайте www.w3.org/WAI/References/HTML4-access,а полные спецификации данной версии – на сайтеhttp://www.w3.org/TR/REC-html40).

HTML 4.0предлагает следующие новые возможности, обеспечивающие доступность:

–дальнейшее разделение структуры документа и его внешнего представления. Информациюо стиле HTML 4.0 предлагает размещать в каскадных таблицах стилей;

–навигационная помощь, например, клавиши доступа и индексирование порядкатабуляции для доступа к элементам страницы с использованием только клавиатуры;

–рекомендации, касающиеся новой клиентской карты-изображения, объединяющейграфические и текстовые ссылки;

– новыетеги и , которые помогают речевым и другим устройстваминтерпретировать аббревиатуры и акронимы;

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

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

–улучшенный механизм создания альтернативного текста. Атрибут alt теперьобязателен для тега . Чтобы обеспечить связь с более длиннымитекстовыми пояснениями к изображениям, введен атрибут longdesc.

Длядобавления информации о любом элементе, можно использовать атрибут title.

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

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

Однако с тех пор много что изменилось, и стандартHTML потерял первоначальную стройность. Вначале Netscape добавил«улучшенные теги», которые позволили более широко управлять внешнимвидом представляемой информации. Нововведение прижилось, и все расширенияNetscape стали стандартом de facto. Потом точно также поступила Microsoft.Когда спохватились, то HTML представлял собой ужасную смесь логических и оформительскихтегов, несовместимых расширений и полностью перестал отвечать первоначальнойконцепции – представлять информацию на любом устройстве независимо от егохарактеристик по выводу информации.

Тогда была предпринята широкомасштабная стандартизация.В результате чего на свет явился стандарт HTML 3.2. Он не был революционным, алишь расставил по местам все нововведения и выработал общие рекомендации дляпроизводителей браузеров. Революционные изменения были введены в новомстандарте – HTML 4.0 или, как его стали называть, Dynamic HTML. В обращениебыли введены слои, таблицы стилей и универсальная объектная модель браузера.

В новом стандарте попытались вернуться к истокамконцепции HTML. Четвертая версия, как и первая, рекомендует создавать страничкитаким образом, чтобы они могли быть воспроизведены на любом устройстве – будьэто 21" дисплей или маленький черно-белыйэкран сотового телефона.

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

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

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

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

CSS2(Cascading Style Sheets, Level 2) – самая последняя рекомендация по каскаднымтаблицам стилей, предоставляет механизмы для улучшенной интерпретации страницнеграфическими и не визуальными устройствами. Усовершенствования включают:

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

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

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

– средствауправления для звукового вывода доставленной по Web информации;

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

Источники разработки доступных страниц

1).Официальный сайт WAI. На нем есть ряд полезных ссылок к источникам, связанным спроблемой доступности (http://www.w3.org/WAI).

2).Оченьхороший источник статей и руководств для авторов HTML расположен на сайте Фондаслепых Юрия Рубинского, который является своеобразным оружием борьбы за праваинвалидов на расширенный доступ к технологиям (http://www.уun.org/Webable).

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

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

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

Пропорциональныйшрифт – иначе «шрифт переменной ширины» для каждого символа выделяетразное количество места в зависимости от его начертания. Например, впропорциональном шрифте заглавная «W» занимает больше места в строкепо горизонтали, чем прописная «I». Такие гаринитуры, как: Times,Helvetica и Arial являются примерами пропорциональных шрифтов.

Web-браузерыдля большинства текстов на Web-странице, включая основной текст, заголовки,списки, цитаты и т. д., используют пропорциональные шрифты. Как правило,большие отрывки основного текста удобнее читать, когда они напечатаныпропорциональными шрифтами. Поскольку большинство пользователей не имеютвремени заменить шрифты, установленные по умолчанию, с большой вероятностьюможно предположить, что текст на вашей странице будет отображен шрифтом Timesразмером 10 или 12 пунктов (по умолчанию в Netscape) или Helvetica (по умолчаниюв

еще рефераты

Еще работы по программированию, базе данных

Реферат по программированию, базе данных

Информационная система складского терминала

29 Августа 2013

Реферат по программированию, базе данных

Автоматизированное Рабочее Место Отдела Кадров

29 Августа 2013

Реферат по программированию, базе данных

Разработка базы данных "Кадры"

29 Августа 2013

Реферат по программированию, базе данных

Комплекс программ для создания Web сайта

29 Августа 2013