Поиск по ключевым словам в поисковом каталоге
Поможем в ✍️ написании учебной работы
Поможем с курсовой, контрольной, дипломной, рефератом, отчетом по практике, научно-исследовательской и любой другой работой

В таблице приведены запросы к поисковому серверу Yandex. Для каждого номера укажите количество страниц, которые найдёт поисковый сервер по каждому запросу.

 

Вид запроса Количество страниц
1 Принтеры&сканеры&продажа  
2 Принтеры&продажа  
3 Принтеры | продажа  
4 Принтеры | сканеры | продажа  

Поиск информации, используя разные поисковые системы.

Осуществите поиск ответов на следующие вопросы в разных поисковых системах. Результат оформить в таблице, указав количество найденных документов:

· найдите официальный сайт вашей любимой музыкальной группы;

· найдите сайт, посвящённый компьютерной технике и комплектующим;

· издателя и разработчика игры «Братья пилоты»;

· в каком году и где родился Мишель Нострадамус;

 

Вид запроса Yandex Rambler Google
Вопрос        

4. Используя одну из поисковых систем найти ответы на следующие вопросы:

a. Понятие информационные технологии?

b. Что такое модем?

c. Классификация компьютерных сетей

d. Виды информации

e. Понятие гипертекста

f. Форматы графических файлов

g. Виды компьютеров

 

6. Контрольные вопросы:

1. Что такое компьютерная сеть? Чем отличается локальная сеть от глобальной сети?

2. Как предоставить общий доступ папке и как его отменить?

3. Как сделать информацию общим ресурсом с правом её изменения?

4. Какие существуют способы поиска информации в сети интернет?

5. Назовите примеры поисковых систем.

6. Укажите правила формирования запросов в поисковой системе.

Содержание отчета

Отчет должен быть выполнен в соответствии с Общими требованиями к оформлению документов учебной деятельности обучающихся. Отчет должен содержать следующие разделы:

1. Наименование работы.

2. Цель работы.

3. Конечные результаты выполненной работы в виде скриншотов.

4. Ответы на контрольные вопросы.

5. Вывод.

Список источников, рекомендуемых для выполнения практической работы

Построение диаграмм декомпозиции в нотации IDEF0 [Электронный ресурс]. – Режим доступа https://lektsii.org/2-2959.html (дата обращения 31.01.2019)



Практическое занятие №28. Создание веб-страниц по средствам HTML.

1. Цель работы:

Познакомиться с процессом создания вец-страницы по средствам HTML в редакторе Блокнот.

Пояснения к работе

Обучающийся выполняет работу по заданию.

При выполнении практической работы обучающийся должен

уметь создавать Web-страницу;

знать записывать код Web-страницы.

Теоретические сведения

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

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

HTML–код страницы помещается внутрь контейнера <HTML></HTML>. Без этих тэгов браузер не в состоянии определить формат документа и правильно его интерпретировать. Web-страница разделяется на две логические части: заголовок и содержание.

Заголовок Web-страницы заключается в контейнер <HEAD></HEAD> и содержит название документа и справочную информацию о странице (например, тип кодировки), которая используется браузером для ее правильного отображения.

Название Web-страницы содержится в контейнере <TITLE></TITLE> и отображается при ее просмотре в строке заголовка браузера.

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

В качестве расширения файла Web-страницы можно также использовать html.

Задания

Создать Web-страницу, выполняя следующие задания:

Задание 1. Создание структуры Web-страницы.

Задание 2. Форматирование текста.

Задание 3. Вставка изображений.

Задание 4. Гиперссылки на Web-страницах

Задание 5. Списки на Web-страницах

Порядок выполнения работы

Задание 1. Создание структуры Web-страницы.

Приступим к созданию титульной Web-страницы сайта. Для этого используем привычный и достаточно удобный для этих целей текстовый редактор Блокнот.

Открыть окно текстового редактора Блокнот.

HTML–код страницы помещается внутрь контейнера <HTML></HTML>.

Заголовок Web-страницы заключается в контейнер <HEAD></HEAD>

Название Web-страницы содержится в контейнере <TITLE></TITLE> Назовем нашу Web-страницу “Компьютер”:

<HEAD>

<ТIТLE>Компьютер</ТIТLЕ>

</HEAD>

Основное содержание страницы помещается в контейнер <BODY></BODY> Поместим для начала на страницу текст “Все о компьютере”:

<BODY>

Все о компьютере

</BODY>

Созданную Web-страницу необходимо сохранить в виде файла. Принято называть титульный файл сайта, т.е. тот который первый загружается в браузер, именем index.htm. Рекомендуется создать для размещения сайта специальную папку и сохранять все файлы разрабатываемого сайта в этой папке.

Необходимо различать имя файла index.htm, т.е. имя под которым Web-страница хранится в файловой системе, и собственно имя Web-страницы “Компьютер”, которая высвечивается в верхней строке окна браузера и, в первую очередь анализируется поисковыми системами. Имя Web-страницы должно в максимальной степени соответствовать ее содержанию.

В окне приложения Блокнот ввести HTML–код Web-страницы. Сохранить файл под именем index.htm в папку сайта. Загрузить этот файл в окно браузера для просмотра.

<HTML>

<HEAD>

<TITLE> Компьютер </TITLE>

</HEAD>

<BODY>

Все о компьютере

</BODY>

</HTML>

Задание 2. Форматирование текста.

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

Размер шрифта для имеющихся в тексте заголовков задается тэгами от <Н1> (самый крупный) до <Н6> (самый мелкий). Заголовок страницы целесообразно выделить самым крупным шрифтом:

<Н1>Все о компьютере</Н1>

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

Задать тип выравнивания заголовка для тэга заголовка позволяет атрибут ALIGN, которому требуется присвоить определенное значение. Выравнивание по правой границе окна реализуется с помощью ALIGN="right", а по центру — ALIGN="center".

<Н1 ALIGN="center">Bce о компьютере</Н1>

С помощью тэга FONT и его атрибутов можно задать параметры форматирования шрифта любого фрагмента текста. Атрибут FACE позволяет задать гарнитуру шрифта (напри- мер, FACE="Arial"), атрибут SIZE — размер шрифта (например, SIZE=4), атрибут COLOR— цвет шрифта (например, COLOR="blue").

Значение атрибута COLOR можно задать либо названием цвета (например, "red", "green", "blue" и т.д.), либо его шестнадцатеричным значением. Шестнадцатеричное представление цвета использует RGB формат "RRGGBB", где две первые шестнадцатеричные цифры задают интенсивность красного (red), две следующие — интенсивность зеленого (green) и две последние — интенсивность синего (blue) цветов. Минимальная интенсивность цвета задается шестнадцатеричным числом 00, а максимальная – FF. Легко догадаться, что синему цвету будет соответствовать значение "#OOOOFF".

Таким образом, задать синий цвет заголовка можно с помощью тэга FONT С атрибутом COLOR:

FONT COLOR="blue">

<H1 ALIGN="center">Bce о компьютере </H1>

</FONT>

Заголовок целесообразно отделить от остального содержания страницы горизонтальной линией с помощью одиночного тэга <HR>.

Разделение текста на абзацы производится с помощью контейнера <P></P>. При просмотре в браузере абзацы отделяются друг от друга интервалами. Для каждого абзаца можно задать определенный тип выравнивания.

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

<P ALIGN="left">Ha этом сайта вы сможете получить различную информацию о компьютере, его программном обеспечении и ценах на компьютерные комплектующие.</Р>

<Р ALIGN="right"> Tepминологический словарь познакомит вас с компьютерными терминами, а также вы сможете заполнить анкету.</Р>

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

В окне приложения Блокнот в контейнер <BODY> вставьте последовательность тэгов и просмотрите результат в браузере.

<FONT COLOR="blue">

<H1 ALIGN="center"> Bce о компьютере </H1>

</ FONT >

<HR>

<P ALIGN="left">Ha этом сайта вы сможете получить различную информацию о компьютере, его программном обеспечении и ценах на компьютерные комплектующие. </Р>

<P ALIGN="right"> Tepминологический словарь познакомит вас с компьютерными терминами, а также вы сможете заполнить анкету.</Р>

Задание 3. Вставка изображений.

На Web-страницах могут размещаться графические файлы трех форматов — GIF, JPG и BMP. Если рисунок сохранен в другом формате, то его необходимо предварительно преобразовать в один из выше указанных форматов с помощью графического редактора. Для этих целей можно использовать редактор Photo Editor, который входит в пакет Microsoft Office.

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

Для вставки изображения используется тэг <IMG> с атрибутом SRC, который указывает на место хранения файла на локальном компьютере или в Интернете. Если графический файл находится на локальном компьютере в том же каталоге, что и файл Web- страницы, то в качестве значения атрибута SRC достаточно указать только имя файла:

<IMG SRC="computer.gif">

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

<IMG SRC="C:\computer\computer.gif">

Если файл находится на удаленном сервере в Интернете, то должен быть указан URL- адрес этого файла. Например:

<IMG SRC="http://www.server.ru/computer.gif">

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

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

<IMG SRC="computer.gif" ALT="Компьютер">

Расположить рисунок относительно текста различным образом позволяет атрибут ALIGN тэга <IMG>, который может принимать пять различных значений: TOP (верх), MIDDLE (середина), BOTTON (низ), LEFT (слева) и RIGHT (справа).

Для того чтобы рисунок располагался по правому краю текста, тэг вставки изображения должен принять следующий вид:

<IMG SRC="computer.gif" ALT="Компьютер" ALIGN="right">

В окне приложения Блокнот в контейнер <BODY> вставьте перед абзацами текста тэг вставки изображения, просмотрите результат в браузере.

<IMG SRC="computer.gif" ALT="Компьютер " ALIGN="right">

Задание 4. Гиперссылки на Web-страницах

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

Для создания гиперсвязей между титульной страницей и другими страницами сайта необходимо, прежде всего, создать заготовки Web-страниц. Такие “пустые” страницы должны иметь заголовок, но могут пока не иметь содержания. Все создаваемые страницы необходимо сохранить в виде файлов в папке сайта.

Каждая страница будет содержать следующий HTML-код:

<HTML>

<HEAD>

<TITLE>Заголовок страницы</ТITLЕ>

</HEAD>

<BODY>

</BODY>

</HTML>

Создать пустые страницы “Программы”, “Словарь”, “Комплектующие” и “Анкета”. Сохранить их в файлах с именами software.htm, glossary.htm, hardware.htm и anketa.htm в каталоге сайта.

Гиперссылка состоит из двух частей: указателя ссылки и адресной части ссылки. Указатель ссылки — это то, что мы видим на Web-странице (текст или рисунок), обычно выделенный синим цветом и подчеркиванием. Активизация гиперссылки вызывает переход на другую страницу.

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

Абсолютный адрес документа, находящегося на локальном компьютере, будет включать в себя путь к файлу и имя файла, например:

С:/Web-сайт/filename.htm

Абсолютный адрес документа, находящегося на удаленном компьютере в Интернете, будет включать имя сервера Интернета, путь к файлу и имя файла, например:

http://www.host.ru/Web-сайт/filename.htm

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

Гиперссылка на Web-странице существует в форме указателя ссылки, щелчок по которому обеспечивает переход на Web-страницу, указанную в адресной части ссылки.

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

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

Панель навигации будет представлять собой абзац, выровненный по центру, в котором указатели гиперссылок разделены пробелами (&nbsp):

<Р ALIGN= "center"> [Программы] &nbsp [Словарь] &nbsp [Комплектующие] &nbsp [Анкета] </Р>

Теперь для каждой гиперссылки определим адрес перехода. Для этого используется контейнер гиперссылки <A></A> с атрибутом HREF, значением которого является URL– адрес документа на локальном компьютере или в Интернете. Контейнер должен содержать указатель гиперссылки:

<A HREF="URL">Указатель гиперссылки</А>

Вставьте в титульную страницу код, создающий панель навигации:

<P ALIGN="center">

[<A HREF="software .htm"> Программы </A>] &nbsp [<A HREF="glossary.htm"> Словарь </A>] &nbsp

[<A HREF="hardware.htm"> Комплектующие </A>]&nbsp [<A HREF="anketa.htm"> Анкета </A>]

</P>


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

Задание 5. Списки на Web-страницах

Довольно часто при размещении текста на Web-страницах удобно использовать списки, в различных вариантах:

нумерованные списки, когда элементы списка идентифицируются с помощью чисел;

маркированные списки (в HTML их принято называть ненумерованными), когда элементы списка идентифицируются с помощью специальных символов (маркеров);

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

На странице “Программы” разместим информацию об основных типах программного обеспечения компьютера в форме вложенного списка.

Сначала создадим основной нумерованный список основных категорий программного обеспечения. Список располагается внутри контейнера <OL></OL>, а каждый элемент списка определяется тэгом <LI>. С помощью атрибута TYPE тэга <OL> можно задать тип нумерации: арабские цифры (по умолчанию), " I " (римские цифры), "а" (прописные буквы) и др.

Откройте в Блокноте файл software.htm, введите заголовок Программное обеспечение и добавьте следующий HTML-код, задающий список:

<OL>

<LI>Системные программы

<LI>Прикладные программы

<LI>Системы программирования

</OL>

Создадим теперь вложенный ненумерованный список, для одного из элементов основного списка. Список располагается внутри контейнера <UL>, а каждый элемент списка определяется также тэгом <LI>. С помощью атрибута TYPE тэга <UL> можно задать вид маркера списка: "disc" (диск), "square" (квадрат) или "circle" (окружность).

Добавьте HTML-код, задающий вложенный список для элемента <LI> Прикладные программы:

<OL>

<LI>СИСТЕМНЫЕ ПРОГРАММЫ

<LI>ПРИКЛАДНЫЕ ПРОГРАММЫ

<UL TYPE="SQUARE">

<LI > ТЕКСТОВЫЕ РЕДАКТОРЫ;

<LI> ГРАФИЧЕСКИЕ РЕДАКТОРЫ;

<LI>ЭЛЕКТРОННЫЕ ТАБЛИЦЫ;

<LI>СИСТЕМЫ УПРАВЛЕНИЯ БАЗАМИ ДАННЫХ.

</UL>

<LI>СИСТЕМЫ ПРОГРАММИРОВАНИЯ


</OL>

Cтраницу “словарь” мы представим в виде словаря компьютерных терминов.

Для этого используем контейнер списка определений <DL></DL>. Внутри него текст оформляется в виде термина, который выделяется непарным тегом <DT> и определения, которое следует за тегом <DD>.

Откройте в Блокноте файл glossary.htm, введите заголовок Компьютерные термины и добавьте следующий HTML-код, задающий список определений:

<DL>

<DT>Процессор

<DD>Центральное устройство компьютера, производящее обработку информации в двоичном коде

<DT>Оперативная память

<DD>Устройство, в котором хранятся программы и данные

</DL>

6. Контрольные вопросы:

1. Назовите теги, используемые для названия Web-страцы, заголовка, основного содержания.

2. Как посмотреть созданную страницы в браузере?

3. Опишите, как добавить картинку на Web-страницу

Содержание отчета

Отчет должен быть выполнен в соответствии с Общими требованиями к оформлению документов учебной деятельности обучающихся. Отчет должен содержать следующие разделы:

 

1. Наименование работы.

 

2. Цель работы.

 

3. Конечные результаты выполненной работы в виде скриншотов.

 

4. Ответы на контрольные вопросы.

 

5. Вывод.

Дата: 2019-04-23, просмотров: 248.