Какая у сайта максимальная глубина страниц (количество щелчков кнопкой мыши, начиная с домашней страницы)?
а) 2;
б) 4;
в) 3;
г) 5.
3.HTML (HYPER TEXT MARKUP LANGUAGE) является:
а) одним из средств при создании Web-страниц;
б) системой программирования;
в) графическим редактором;
Г) системой управления базами данных.
4.Инструкция браузеру, указывающая способ отображения текста:
а) программный код;
б) тэг;
в) файл;
г) кегль.
5.Программа для создания Web-страницы с использованием языка HTML:
а) MS Word;
б) Paint;
в) Калькулятор;
г) Блокнот.
6.Web-страница (документ HTML) представляет собой:
а) текстовый файл с расширением txt или doc;
б) текстовый файл с расширением htm или html;
в) двоичный файл с расширением com или exe;
г) графический файл с расширением gif или jpg.
7.Программа для просмотра гипертекстовых страниц называется:
а) сервер;
б) протокол;
в) HTML;
г) браузер.
8.Способ организации информации на Web-сервере называется:
а) файлом;
б) гиперссылкой;
в) web-сайтом;
г) мультимедиа.
9.Гипертекст - это:
а) текст очень большого размера;
б) текст, в котором используется шрифт большого размера;
в) структурированный текст, где возможны переходы по выделенным меткам;
г) текст, в который вставлены объекты с большим объемом информации.
Какой тип изображения используется на сайте?
а) jpeg;
б) png;
в) psd
г) bmp
Практическая работа №3
СОЗДАНИЕ WEB-СТРАНИЦ учебного назначения
Работа с текстом
1. Повторение теоретических сведений. | |
2. Выполнение команд, представленных в таблице. | |
3. Выполнение практической работы. | |
4. Ответы на контрольные вопросы. | |
5. Выполнение теста. |
Цель: получить начальные сведения об HTML, ознакомиться с основами языка разметки HTML, приобрести первоначальные навыки создания web-сайтов и научиться создавать собственные web-страницы с применением форматирования на основе HTML.
Знать:
- понятие гипертекста;
- команды для работы с текстом;
- иметь представление о языке гипертекстовой разметки.
Уметь:
- разрабатывать электронное учебно-методическое пособие на основе технологии гипертекста;
- использовать теги для разметки текста;
- выполнять форматирование текста.
Формируемые компетенции: ПКНМ-7, ПКНИ-8, ПКНМ-3.
Для создания ЭУС будем использовать язык гипертекстовой разметки HTML (HyperText Markup Language).
Любая Web-страница должна начинаться с тега <HTML> и заканчиваться тегом </HTML>. Между тегами <HEAD>...</HEAD> идет заголовок, в котором устанавливаются параметры страницы. Затем между тегами <BODY>...</BODY> следует тело, содержащее информацию, публикуемую на странице.
Пример страницы:
<HTML>
<HEAD>
<TITLE> Электронный учебник </TITLE>
</HEAD>
<BODY>
Содержание Web-страницы
</BODY>
</HTML>
Теги для работы с текстом
Исходный текст | Результат |
<P> Переводит строку внутри абзаца </P> | Переводит строку внутри абзаца |
<P> Используется <BR> для перевода строки внутри абзаца </P> | Используется для перевода строки внутри абзаца |
<P ALIGN="center"> Абзац будет выровнен по центру строки</P> | Абзац будет выровнен по центру строки |
<Hx> Используется для выделения заголовков, где х – уровень заголовка от 1 до 6. <H1> Заголовок</H1> <H2>Заголовок2</H2> | Заголовок Заголовок2 |
<B> текст </B> жирное начертание текста <I> текст</I> курсивное <U>текст</U> подчеркнутое | текст текст текст |
<HR> - горизонтальная линия SIZE – длина, WIDTH – ширина, ALIGN - выравнивание линии. Например: <HR WIDTH="80%" SIZE="10" ALIGN="right"> | Текст |
1. Лебедев С.В. Web-дизайн: учебное пособие по созданию публикаций для Интернет / С.В. Лебедев. – 3-е изд., перераб. и доп. – М.: Альянс-пресс, 2005.- С. 638-642. | |
2. Леонтьев, Б.В. Web-дизайн: Тонкости, хитрости и секреты / Б.В. Леонтьев. –М.: Познавательная книга плюс, 1999. - С. 8-11. | |
3. Практикум по общей информатике: учеб.пособие / под. ред. В.П. Омельченко. – 2-е изд., перераб. и доп. – Ростов Н/Д: Феникс, 2007. –С. 310-358.: ил. – (Высшее образование) | |
4. Симонович, С.В. Специальная информатика: учебное пособие / С.В. Симонович, Г.А.Евсеев, А.Г. Алексеев. – М.: АСТ-ПРЕСС КНИГА, 2005. - С. 407-416. |
a. Создать заготовку HTML-документа (структуру): - задать заголовок документа «Задание 1» - задать цвет фона страницы – голубой. | |
b. Сохранить документ в папке лабораторная работа №1 Вашего каталога, задав в качестве имени Фамилию и расширение .html. c.Открыть документ как Web-страницу. | |
d. Добавить бегущую строку «Тольяттинский государственный университет», задав следующие атрибуты: - цвет фона бегущей строки – морской волны (aqua); - высота бегущей строки – 20 пиксель; - направление бегущей строки – слева; - режим вывода бегущей строки – альтернативное. | |
e.Добавить заголовок 1 уровня – «Пробная страница». | |
f. Добавить 2 абзаца текста используя, тэг абзаца: Цель создания данного документа – знакомство с основными тэгами HTML и приобретение навыков их использования. Пробную страницу создал (фамилия, имя, группа). | |
g.Добавить горизонтальную линию. | |
h.Сохранить изменения и просмотреть результат, выбрав в браузере команду – Обновить. | |
i. Добавить заголовок 2 уровня – «Некоторые стили форматирования». | |
j. Задать шрифт – Arial, размер – 4, цвет – зеленый. | |
k. Добавить список стилей форматирования (по образцу), начиная каждую строку с тэга разрыв строки: Этот текст жирный Этот текст наклонный Этот текст подчеркнутый Этот текст большой Этот текст маленький | |
l. Добавить горизонтальную линию, задав толщину линии в 5 пиксель. | |
m. Сохранить изменения и просмотреть результат, выбрав в браузере команду – Обновить. | |
n. Добавить заголовок 2 уровня – «Список определений». | |
o. Увеличить размер шрифта на два пункта (+2). | |
p. Добавить горизонтальную линию, сделав однотонную линию толщиной в 5 пиксель. | |
q. Изменить цвет шрифта на синий. |
1.Что такое WWW, гипертекст, гиперссылка, HTML, Ноте page (домашняя страница), Web-сайт? | |
2.Как определить код цвета, с помощью графического редактора PhotoShop? | |
3.Что такое тэг? Каких видов бывают тэги? Назначение атрибутов? Формат записи тэгов? | |
4.Опишите структуру HTML-документа? Где отображается заголовок HTML-документа? | |
5.Из каких обязательных частей состоит HTML-страница? |
Тест № 3