Задания "Разработка HTML сайтов для начинающих" 8 класс

8 класс

Задание № 1. Создание простейшего файла HTML

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

2. Запустите программу Блокнот (Notepad).

3. Наберите в окне программы простейший файл HTML.

<HTML>

<HEAD>

<TITLE>Учебный файл HTML</TITLE>

</HEAD>

<BODY>

Расписание занятий на вторник

</BODY>

</HTML>

4. Сохраните файл под именем RASP.HTML (обязательно укажите тип файла

HTML при сохранении) в личной папке.

5. Для просмотра Web-страницы используйте любую программу браузера

(Internet Explorer, Opera, Mozilla Firefox или другую). Для этого, не покидая

программу Блокнот (сверните окно на панель задач), откройте личную папку

и двойным кликом по файлу RASP.HTML откройте окно браузера.

На экране вы увидите результат работы.

Задание № 2. Управление расположением текста на экране

1. При необходимости откройте текст Web-страницы в Блокноте (1 щелчок

правой клавишей мыши по файлу RASP.HTML, в контекстном меню выбрать

команду Открыть с помощью... и выбрать программу Блокнот). При

необходимости открыть файл в браузере – двойной клик по значку файла

левой клавишей мыши.

2. Внести изменения в файл RASP.HTML, расположив слова Расписание,

занятий, на вторник на разных строках.

Практические работы по HTML

<HTML>

<HEAD>

<TITLE>Учебный файл HTML</TITLE>

</HEAD>

<BODY>

Расписание

занятий

на вторник

</BODY>

</HTML>

3. Сохраните текст с внесенными изменениями в файле RASP.HTML (меню

Файл |Сохранить). Если у вас уже отображается Web-страница, то вам

достаточно переключиться на панели задач на программу браузера и

обновить эту страницу (кнопка ). Изменилось ли отображение текста на

экране? Не удивляйтесь тому, что внешний вид вашей Web-страницы не

изменился. Не забывайте каждый раз сохранять текст Web-страницы при ее

корректировке в программе Блокнот и обновлять страницу при ее просмотре

в программе браузера.

Задание № 3. Некоторые специальные команды форматирования текста

Существуют специальные команды, выполняющие перевод строки и

задающие начало нового абзаца. Кроме того существует команда,

запрещающая программе браузера изменять каким-либо образом изменять

форматирование текста и позволяет точно воспроизвести на экране заданный

фрагмент текстового файла. Тег перевода строки отделяет строку от

последующего текста или графики. Тег абзаца тоже отделяет строку, но

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

являются одноэлементными, тег – двойной, т.е. требуется закрывающий

тег.

1. Внесите изменения в файл RASP.HTML

<HTML>

<HEAD>

<TITLE>Учебный файл HTML</TITLE>

</HEAD>

<BODY>

Расписание

занятий

на вторник

</BODY>

</HTML>

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

программу браузера, обновите Web-страницу. Как изменилось отображение

текста на экране?

Задание № 4. Выделение фрагментов текста

1. Внести изменения в текст файла RASP.HTML

<HTML>

<HEAD>

<TITLE>Учебный файл HTML</TITLE>

</HEAD>

<BODY>

Расписание

занятий

на вторник

</BODY>

</HTML>

2. Посмотрите полученную Web-страницу.

Возможно использование комбинированных выделений текста.

Расписание занятий на вторник

Но при этом необходимо помнить следующее правило использования

комбинированных тегов:

<Тег_1><Тег_2> ... </Тег_2></Тег_1> – правильная запись.

<Тег_1><Тег_2> ... </Тег_1></Тег_2> – ошибочная запись.

Обратите внимание на «вложенность» тегов, она напоминает «вложенность»

скобок.

Задание № 5. Задание размеров символов Web-страницы

Существует два способа управления размером текста, отображаемого

браузером:

использование стилей заголовка,

задание размера шрифта основного документа или размера текущего

шрифта.

Используется шесть тегов заголовков: от <H1> до <H6> (тег двойной, т.е.

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

параметрами настройки браузера.

1. Внесите изменения в файл RASP.HTMLСтраница 4 из 16

Практические работы по HTML

<HTML>

<HEAD>

<TITLE>Учебный файл HTML</TITLE>

</HEAD>

<BODY>

<H1>Расписание</H1>

занятий на вторник

</BODY>

</HTML>

2. Просмотрите свою Web-страницу.

Задание № 6. Установка размера текущего шрифта

Тег шрифта позволяет задавать размер текущего шрифта в

отдельных местах текста в

диапазоне от 1 до 7.

1. Внесите изменения в текст RASP.HTML

<HTML>

<HEAD>

<TITLE>Учебный файл HTML</TITLE>

</HEAD>

<BODY>

Расписание

занятий на вторник

</BODY>

</HTML>

2. Самостоятельно измените размер текста «занятий на вторник», используя

тег .

3. Измените оформление текста HTML-документа, используя тег выделения

фрагментов и тег перевода строки и абзаца.

Задание № 7. Установка гарнитуры и цвета шрифта

Тег предоставляет возможности управления гарнитурой, цветом и

размером текста.

Изменение гарнитуры текста выполняется простым добавлением к тегу

атрибута

FACE. Например, для отображения текста шрифтом Arial необходимо

записать:

<TD>10 класс</TD> </TR>

<TR><TD>11 класс</TD> </TR>

</TABLE>

</CENTER>

</BODY>

</HTML>

2. Сохраните файл RASP.HTML

3. Просмотрите полученную Web-страницу.

Задание № 8. Создание ссылки на другой HTML-документ

1. Внесите изменения в файл 5.HTML так, чтобы в конце страницы была

ссылка на

головную страницу Расписание занятий 5 классов (RASP.HTML). В качестве

ссылки

используйте графический файл (HOME.GIF) следующим образом:

...

</TABLE>

</CENTER>

2. Просмотрите полученную Web-страницу.

В качестве ссылки выступает рисунок –

стрелка

Задание № 9. Самостоятельное итоговое задание

Разработайте Web-страницы, рассказывающие о вашем классе. На головной

странице разместите рассказ о классе, классном руководителе. Рассказы об

учениках разместите на отдельных Web-страницах. Укажите ссылки на

страницы учеников с головной Web-страницы. Не забудьте разместить

ссылки возврата на головную страницу.

Как подготовить хорошую Web-страницу

1. Следует обратить внимание на простоту и логичность расположения

информации на ваших страницах. Один из способов сделать информацию

более легкой для восприятия – оставить на странице достаточно свободного

места, не содержащего ни текста, ни рисунков. Страница, содержащая много

информации, только отпугнет посетителя.

2. Постарайтесь представить информацию в виде списков или таблиц так,

чтобы можно было достаточно легко найти важные сведения.

3. Не размещайте одно изображение сразу за другим. Попробуйте

распределить их по документу, оставив достаточно свободного пространства.

4. Информация должна размещаться частями, легкими для восприятия.

Обратите внимание на длину абзацев. Если абзац слишком длинный,

разбейте его на несколько небольших абзацев.

5. Если Web-страница имеет большой объем, то, возможно, вам следует

вставить ссылки, позволяющие пользователю быстро перемещаться между

частями одного документа. Иногда имеет смысл вместо одного длинного

документа подготовить одну страницу, содержащую перечень тем, каждую

из которых раскрыть на отдельной Web-странице, и установить ссылки на

соответствующие Web-страницы.

6. Использование графики может дополнительно привлечь пользователей. Но

необходимо помнить о времени загрузки вашей страницы, которое

определяется количеством и объемом графической информации. Красивая

картинка не произведет никакого впечатления, ели для того, чтобы ее

увидеть, придется долго ждать, пока она загрузится.

Скачать материал

Задания "Разработка HTML сайтов для начинающих" 8 класс

Информатика - еще материалы к урокам:

Предметы

Похожие материалы