Смекни!
smekni.com

Работа учителя информатики по поддержке сайта учебного заведения (стр. 2 из 3)

Отмеченные выше два самых важных свойства HTML-текстов позволяют использовать HTML-программирование для конструирования страничек Интернета.

Любая Интернет-страница представляет собой текстовый файл в формате «Текст Windows». Расширение имени файла, содержащего текст Интернет-страницы, должен быть htm. Файл главной страницы должен называться index.htm или welcome.htm. остальные страницы сайта могут иметь произвольные имена, а пользователь будет попадать на них по ссылкам с основной страницы.

Всё содержимое Интернет-страницы заключается между тегами<HTML>…</HTML>, указывающий браузеру, что данный текст представляет собой HTML – документ и, возможно, содержит в себе теги, которые браузер должен выявить, распознать и правильно интерпретировать.

Типичная Интернет-страница состоит из двух частей: заголовка (HEAD) и тела (BODY).

Вот пример текста простейшей HTML-программы:

<HTML> начало HTML-документа

<HEAD> начало заголовка

<META http-equiv="Content-Type"

content="text/html; charset=windows-1251"> информация о документе

<TITLE>Упражнение 1</TITLE> название документа

</HEAD> конец заголовка

<BODY> начало тела

<H1>Первый HTML-документ</H1> заголовок

<HR> горизонтальная линия

<P> начало абзаца

Корова не похожа на лошадь. абзац

А лошадь не похожа на корову.

Именно это сходство

мы и берем за основу.

</P> конец абзаца

</BODY> конец тела

</HTML>конец HTML-документа

Команды языка (теги) заключаются в угловые скобки. Как правило, теги парные. Первый тег открывает описание команды, определяет ее начало, второй, отличающийся от первого наличием косой черты "/" перед ключевым словом (именем тега), закрывает его. Тег <HTML> должен открывать программу, а тег </HTML> — закрывать ее.

Между этими двумя основными тегами располагается головная часть программы (заголовок программы) и ее тело.

<HTML>

заголовок программы

тело программы

</HTML>

Заголовок HTML-документа

В этом блоке (<HEAD>... </HEAD>) описываются общие правила интерпретации HTML-документа в целом и содержится вспомогательная информация о документе.

Команда:

META http-equiv="Content-Type"

content="text/html; charset=windows-1251">

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

Название HTML-страницы

Между парой тегов <TITLE> и </TITLE> располагается имя HTML-документа. Это имя браузер использует в заголовке окна Windows, в котором показывает документ.

Тело программы

Между тегами <BODY> и </BODY> располагаются команды, следуя которым браузер выводит информацию в окно документа, например:

<H1>...</H1> -- заголовок

<HR> -- горизонтальная линия

<P>...</P> -- абзац

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

Заголовки бывают разные по значению, или как говорят, по уровню. Учебник, например, имеет название — это заголовок первого уровня. Текст в учебнике разбит на главы; названия глав — это заголовки второго уровня. Главы содержат параграфы с заголовками третьего уровня. Параграфы — пункты, обозначенные заголовками четвертого уровня.

В HTML-документе поддерживаются заголовки шести уровней при помощи конструкции

<Hn>текст заголовка</Hn>

Здесь в качестве n следует использовать одну из цифр 1-6, обозначающую уровень заголовка.

Линия — простейший графический элемент, который умеет строить браузер. Горизонтальная линия задается тегом <HR>, и этот тег не имеет парного закрывающего. Браузер, выполняя эту команду, выведет на экран горизонтальную линию:

Горизонтальные линии удобно использовать для дополнительного выделения (или разделения) элементов документа на экране.

Как правило браузер использует не красную, а пустую строку для отделения одного абзаца от другого или абзаца от других элементов документа. Задается абзац тегами <P> и </P>, между которыми помещается текст. Фактически работа тега <P> сводится к выводу перед текстовым фрагментом пустой строки. А вот парный тег </P> просто игнорируется браузером, поэтому его можно и не писать.

· Абзац выравнивается по левому краю.

· Между словами всегда помещается ровно по одному пробелу независимо от того, сколько пробелов вы поместите в HTML-программе.

· Перенос текста на новую строку происходит тогда, когда очередное слово не помещается в экранной строке, а не тогда, когда вы перешли на новую строку в HTML-программе.

«Физическое» и «логическое» форматирование текста

Все уже рассмотренные способы форматирования реализуют так называемые «физические» стили текста, когда теги явным образом указывают его вид. Однако в

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

<EM>...</EM>Шрифтовое выделение

<STRONG>...</STRONG>Особое шрифтовое выделение

<CITE>...</CITE>Цитата

<KBD>...</KBD>Ввод с клавиатуры

Авторское редактирование текста HTML. Самый простой способ, который позволяет сэкономить время при размещении на странице сколько угодно длинного фрагмента уже отформатированного текста: заключите его между тегами <PRE>...</PRE>, и браузер сохранит все пробелы и разбивки на строки, а используемый при отображении такого текста моноширинный шрифт семейства Courier обеспечит сохранение выравнивания.

Основные теги HTML

HR тег горизонтальной линии

Форматирование текста

FONT тег задания параметров шрифта.

I тег выделения текста курсивом

EM тег логического ударения

B тег выделения текста жирным шрифтом

STRONG тег усиленного выделения

BIG тег увеличения шрифта

SMALL тег уменьшения шрифта

Списки

UL тег ненумерованного списка

OL тег нумерованного списка

LI тег пункта списка

DL, DT, DD теги для задания списка определений(термин и его описание)

Объекты

IMG тег вставки изображения

EMBED тег вставки различных объектов: не-HTML документов и media-файлов...

APPLET тег вставки Java апплетов

Таблицы

TABLE тег создания таблицы

TR тег строки таблицы

TD тег столбца таблицы

Формы

FORM тег создания формы

TEXTAREA тег текстовой области

SELECT тег выпадающего меню

OPTION тег пункта выпадающего меню

INPUT тег поля формы

Размещение информации на Интернет-сайте

Сайт Лукояновского педагогического колледжа расположен по адресу http:&bsol;lukped.narod.ru. Зайти на него для дополнения материала удобно через поисковую систему Яндекс. Заходим на Яндекс.

Выбираем ссылку Народ в левой части Народа выбираем ссылку Создать свой сайт. Пишем логин и пароль.

Попадаем в мастерскую. Отдельные файлы можно загрузить. На этой странице несколько разделов: Мой дом, Мой бизнес, Общение, Кирпичики, Редактирование и управление, Мои данные.

В мастерской можно управлять файлами сайта. Для этого щелкаем на ссылку «Управление файлами и HTML редактор». Мы заходим в мастерскую управления файлами. Здесь можно выполнять стандартные операции над файлами, а именно:

· Копировать;

· Переместить;

· Удалить.

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

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

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

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

Возвращаемся назад в раздел Управление файлами, теперь видим, что News есть мы можем посмотреть. Текстовая часть есть, а рисунки отсутствуют.

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

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

Файлы на сайт можно также загружать с помощью FTP-протокола (File Transfer Protokol – протокол передачи файлов), который позволяет передавать файлы с одного компьютера на другой. Компьютеры, на которых находится информация для передачи по FTP–серверу называются FTP–серверами. Нужный нам FTP–сервер – это компьютер провайдера, который будет публиковать сайт. В данном случае провайдер предоставляет FTP – вход с собственным паролем. Чтобы перекачать файлы, нужны специальные программы: CuteFTP, Windows Commander, Far Manager. Чтобы работать с сервером провайдера, нужно настроить одну из этих программ. Для этого нужны три основные вещи: адрес FTP – сервера провайдера, имя и пароль. Далее загружаем одну из этих программ и настраиваем FTP – соединение. После настройки соединения, можно перекачивать файлы.