Таблицы и списки в HTML. Примеры.

Для оформления перечней в гипертексте определены три типа списков: без нумерации или (исп-ся <UL>), с нумерацией или (<OL>) и списки определений (<DL>).

Пример оформления ненум-го списка:

<LI> Первый элемент списка

<LI> Второй элемент списка

<LI> Последний элемент списка

</UL>

Тег <LI> отвечает за формирование элемента списка.

Списки определений формируются с помощью элемента <DL> и служат для создания глоссариев (словарей терминов) и индексов:

<DL>

<DT>Первый термин

<DD>Определение первого термина

<DT>Второй термин

<DD>Определение второго термина

</DL>

Тег <DD> отвечает за формирование элемента списка определений.

Совместно с механизмом ссылок перечни позволяют строить простые меню.

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

<TABLE> Контейнер таблицы

<CAPTION> Контейнер заголовка таблицы

Заголовок таблицы

</CAPTION>

<TR> Контейнер строки таблицы

<TH>Заголовок 1-го столбца</TH>

<TH>Заголовок 2-го столбца</TH>

. . .

</TR>

<TR>

<TD>Первая ячейка</TD> Контейнеры ячеек

<TD>Вторая ячейка</TD>

. . .

</TR>

</TABLE>

Чтобы показать в таблице рамку, применяют атрибут BORDER тега <TABLE>. Дополнительно задается заголовок таблицы - контейнер CAPTION:

<CAPTION ALIGN=выравнивание>Заголовок таблицы</CAPTION>

где параметр выравнивание принимает значения: TOP – по верху, BOTTOM– по низу.

В контейнер ячейки можно помещать не только текст, но и метки для форматирования текста (напр, <B> или <I>), списки, вложенные таблицы, а также изображения, например :

<TABLE>

<TR>

<TD>One

<TD><FONT SIZE=5>W<FONT SIZE=3>Three

</TR>

</TABLE>

Кроме этого, внутри тегов <TD> и <TH> можно осуществлять выравнивание с помощью атрибута ALIGN со значениями: LEFT (влево), RIGHT (вправо) или CENTER (центрировать). Кроме горизонтального выравнивания в клетках таблиц можно применять и вертикальное выравнивание текста. В этом случае в тегах <TD> и <TH> применяется атрибут VALIGN с выравниванием по верху (TOP), по низу (BOTTOM) и выравниванием по середине (MIDDLE).

Графика и HTML. Организация графических указателей. Примеры.

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

-Графические файлы передаются медленно.

-Поисковые системы не умеют работать с изобр-ми.

-Изображения не всегда интернациональны.

-Цветная графика не всегда хорошо отображается.

Сущ-ет множество форматов данных, исп-мых для хранения графических изображений: GIF, JPEG, РСХ, WMF и др.

GIF – один из наиболее часто используемых форматов. Его св-ва:

-сжатие данных без потерь

-поддержка прозрачного фона;

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

-поддержка 265 цветов,;

-поддержка большинством браузеров.

JPEG:Основные свойства данного формата:

-сжатие происходит "с потерями", поэтому изображение теряет некоторые (несущественные) детали;

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

-поддержка 16,7 миллионов цветов;

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

PNG хар-ся в отличии от GIF, в частности, улучшенным сжатием данных и увеличенным количеством поддерживаемых цветов.

ВМР формат широко используется операционными системами Windows и OS/2. Файлы в этом формате хранятся без сжатия и поэтому требуют много времени при загрузке. Поддерживается только программой

Microsoft Internet Explorer. Сравнение форматов GIF, JPEG и PNG показывает, что:

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

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

Формат вывода изобр-я в HTML:

Здесь SRC означает источник (SouRCe), а имя_файла - имя выводимого графического файла. Например:

BORDER- атрибут вывода рамки вокруг изображения,"0" для отключения вывода рамки. Иногда, в силу каких-либо причин, браузер не может вывести графические файлы. В этом случае вместо можно вывести некоторый альтернативный текси с пом доп-го атрибута ALT, его формат:

например:

Гиперссылки - связывание HTML- документов. Относительная и абсолютная адресация.

Ссылка (гиперссылка или Web-ссылка) является основной гипертекстовой конструкцией и связывает один Web-ресурс с другим. Ссылка состоит из двух частей. Первая часть ссылки видна на Web-странице и называется указателем ссылки (или якорем). Вторая часть ссылки, дающая инструкцию браузеру, называется адресной частью ссылки (или URL-адресом). Когда ссылка активизируется, браузер загружает документ, адрес которого определяется с помощью URL. Указателем ссылки может быть слово, группа слов или изображение. Указатели бывают двух типов – текстовые и графические. Текстовые обычно представляют собой слово или слова, подчеркнутые прямой линией. Цвет указателя регулируется разработчиком страницы и установками браузера. Например,:

Подробнее см. в главе два.

Фрагмент HTML кода данной части документа:

<P>Подробнее см. в <A href="glava2.html">главе два.</A>

URL-адрес является второй частью ссылки и представляет собой адрес ресурса, загружаемого при активизировании указателя ссылки. Задание URL-адреса может быть относительным или абсолютным. Как видно из примера выше, организация гиперссылок выполняется с помощью элемента <A>. Для создания ссылки этому элементу требуется атрибут HREF, в котором размещается URL-адрес. Элемент <A> является контейнером, поэтому закрывающий тег </A> ставится сразу же за указателем:

<A HREF=URL>указатель: текст видимый в браузере</A>

Напр: http://www.personal.gomel.by/olas/tags.html

Атрибут HREF указывает на абсолютный адрес страницы. Для облегчения работы с относ-ми указателями в HTML введен тег <BASE>. Данный тег помещается в начале док-та и содержит URL-адрес, относ-но кот-го в док-те построена вся адресация. Это указание влияет на любой нижестоящий тег, включая <A>, <IMG> и т. д. Напр, если в начале док-та помещается строка

то вся относит.адресация в дальнейшем б.исп.ть этот адрес. Так, относ.указатель на файл "images/face.gif" будет подразумевать адрес http://www.server.com/images/face.gif. Если тег <BASE> отсутствует, то относ-я адресация строится на URL-адресе текущего док-та.

Понятие web-сайта. Требования к структуре и дизайну web-сайта. Этапы создания web-сайта

Web-сайт – набор логически взаимосвязанных логических web-документов, размещенных в данном месте.

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

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

Требования к дизайну и стр-ре :

1)информация должна распространяться максимально плотно на странице..

2)использование соответствующих друг другу цветов

3)размеры фотографий не должны быть слишком большие

4)очень плохие длинные страницы

5)навигация по сайту должна быть полной, с любой страницы должен существовать переход к другой странице

6)навигация должна быть удобной

29. Информационные ресурсы. Поиск информации в Internet. Поисковые машины и каталоги. Структура информационно-поисковой системы.

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

Поиск инф-цииосущ-ся с пом инструментов:

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

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

- рейтинги,

- тематические списки ссылок,

-поисковые машины (поисковики)- программно-аппаратный комплекс, кот вкл-ет след части:

1) робот-индексировщик

2) база данных проиндексированных док-тов

3) По для ранжирования по релевантности найденных док-тов

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

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

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

-метапоисковые системы-поисковая машина без собств индексной базы. Она обращ-ся к базам др. поиск машин

-онлайновые энциклопедии и справочники.

Предыдущая 1 2 345 6 7 Следующая

Не нашли, что искали? Воспользуйтесь поиском по сайту: