Вы находитесь на странице: 1из 9

Оформление Web-сайта в сети Internet №6

Цель работы:
1. Изучить организацию Web-сайта;
2. Изучить применение языка HTML для создания Web-страниц;
3. Создать Web-страницу средствами языка HTML согласно выданному
преподавателем образцу.
Виды Web-сайтов в сети Internet
Правильная организация информации на Web-узле часто не менее важна, чем
сама информация. Под организацией понимается размещение сведений на одну и ту
же тему в одном и том же месте. Разработчики разделяют на следующие структуры
организации информации:
1. иерархическая или древовидная;
2. линейная структура;
3. линейная последовательность с альтернативами;
4. линейная последовательность с переходами;
5. линейная последовательность с ответвлениями;
6. табличная структура;
7. смешанная структура;
8. чистая Web (а-ля Web).
1. Иерархическая или древовидная структура применяется очень часто, потому
что подобная структура наиболее приемлема для Web-узлов. Основной вопрос,
который приходится решать разработчикам – это глубина и широта дерева.
Исследования показали, что широта дерева должна быть от шести до восьми
вариантов, в таком случае пользователь легко может держать их в памяти. Слишком
малый выбор вариантов может свидетельствовать о том, что создан лишний уровень.

Рисунок 1− Иерархическая или древовидная структура Web –сайта


2.Линейная структура связывает страничку с другой в цепочку, что очень удобно
для показа слайдов или презентации.
Рисунок 2− Линейная последовательность с переходами
3. Линейная последовательность с альтернативами характеризуется серией
вопросов, отвечая на которые «да» или «нет», вы переходите к следующему узлу.
Создается ощущение взаимодействие с узлом, привлекает гораздо больше, чем
линейная структура.

Рисунок 3− Линейная последовательность с альтернативами


4. Линейная последовательность с переходами применяется в анкетах. При
работе с ней отвечающий может пропустить ненужные вопросы и при этом не
потерять общее направление.

Рисунок 4− Линейная последовательность с переходами


5. Линейная последовательность с ответвлениями подходит для предоставления
информации, у которой есть полезные дополнения.

Рисунок 5− Линейная последовательность с ответвлениями


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

Рисунок 6− Табличная структура


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

Рисунок 7− Смешанная структура Web – сайта


8. Чистая Web (а-ля Web), т.е. сплетение ссылок без какой бы то ни было ясной
организации.

Рисунок 8− Чистая Web (а-ля Web)


HTML-код
1.html
/
/
<!DOCTYPE html>

<html>
<head>
<title>Фреймы</title>
<meta charset="UTF-8">
</head>
<frameset rows="10%,*">
<frame src="2.html">
<frameset cols="25%,75%">
<frame src="3.html">
<frame src="4.html" name="content">
</frameset>
</frameset>
</html>
  
2.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>css</title>
<style>
h1{text-align: center;}
</style>
</head>
<body bgcolor="#e0e0ab" text="#752e69">
<h1>Сайт составила Логвиненко М.С. МФ-4-5</h1>
</body>
</html>
  
3.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>css</title>
<style>
</style>
</head>
<body bgcolor="#b2bbff" text="#112cf5" link="blue" alink="red"
vlink="purple">
<ul type="square">
<li><a href=" 4.html" target="content">Главная страница</a></li>
<li><a href="https://xn--80aaafltebbc3auk2aepkhr3ewjpa.xn--
p1ai/podzemnyiy-robot/" target="content">Сылка на сайт</a></li>
<li><a href=" 5.html" target="content">Роботы в нашей жизни</a></li>
<li><a href=" 7.html" target="content">Таблица характеристик</a></li>
</ul>
</body>
</html>
  
4.html
<!DOCTYPE html>
<html>
<head>
<title>РОБОТИЗАЦИЯ</title>
<style>
h1,h3{text-align: center;color:#fc0341 ;}
h4,h5{text-align:left;color:#7a0321 ;}
p{text-align: justify;}
</style>
</head>
<body BACKGROUND="http://iliya.prihod.ru/files/2013/06/hq-
wallpapers_ru_abstraction3d_33909_1920x1200-1024x640.jpg"
link="blue" alink="red" vlink="purple">
<h1>РОБОТИЗАЦИЯ В ГОРНОДОБЫВАЮЩЕЙ
ПРОМЫШЛЕННОСТИ</h1>
<P> Подземный робот «Геоход» – аппарат, движущийся в породном
массиве с использованием геосреды, используя принцип
«ввинчивание» в геосреду.
<P> Подземный робот «Геоход» предназначен для быстрой
прокладки тоннелей под землей. Для создания напорного усилия он
использует саму твердую среду.
<P> Подземный робот «Геоход» может двигаться по любой
траектории пространства, в т.ч. идти наклонно.
<P> Подземный робот «Геоход» заменяет три вида техники,
используемые для прокладки тоннелей и добычи полезных
ископаемых – для разрушения породы, ее удаления, а также
закрепления выработанного пространства.
</body>
</html>
  
5.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>css</title>
<style>
p{ text-indent: 20px; text-align: justify;}
</style>
</head>
<body BACKGROUND="http://iliya.prihod.ru/files/2013/06/hq-
wallpapers_ru_abstraction3d_33909_1920x1200-1024x640.jpg">
<P>Роботы постепенно занимают все больше и больше места в нашей
жизни и уже стали неотъемлемой частью человеческой
повседневности.
<P>Они помогают человеку во всех отраслях его жизни, начиная от
домашних дел и заканчивая помощью на производстве.
<P>Роботизированные безлюдные решения на производствах
приобретают сегодня все большую актуальность хотя бы потому, что
вредное влияние на здоровье человека сводится к минимуму.
Прибавим сюда понимание того, что полный цикл обработки и
монтажа осуществляется быстрее, без перерывов на перекур и без
ошибок, свойственных любому производству, где вместо робота
действует живой человек. Человеческий фактор, после настройки
роботов и запуска технологического процесса, практически
исключается.
<P>Горнодобывающая промышленность постоянно сталкивается с
двумя потребностями это безопасность человека и повышение
производительности в шахтах.</body>
</html>
  
6.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>css</title>
<style>
p{ text-indent: 30px; text-align: justify;}
</style>
</head>
<body >
<ol>
<li>
<p>Многофункциональный самоходный дорожный агрегат,
включающий укладчик подушки дорожного полотна, укладчик
дорожных плит, содержащий вакуумную камеру с вакуум-зацепами,
при этом агрегат снабжен участком формирования дорожного
фрагмента из дорожных плит по ширине формируемой дороги,
причем этот участок снабжен манипулятором с захватами в виде
вакуумных присосок и транспортирующими элементами, а укладчик
дорожных плит на подушку дорожного полотна выполнен в виде
мостового крана, снабженного захватом, выполненным в виде ряда
вакуумных присосок, закрепленных на подвижной в вертикальной
плоскости траверсе, для перемещения и укладки сформированного
дорожного фрагмента.</p>
</li>
<li>
<p>Агрегат по п.1, отличающийся тем, что вакуумная присоска
мостового крана разделена на несколько автономно работающих
зон.</p>
</li>
<li>
<p>Агрегат по п.1, отличающийся тем, что укладчик подушки
дорожного полотна выполнен в виде ряда виброкатков и
расположенных сразу за ними навесного бункера щебня крупной
фракции и навесного бункера щебня мелкой фракции, при этом
агрегат снабжен средствами непрерывной подачи крупного и мелкого
щебня в зону формирования подушки дорожного полотна, причем
бункеры щебня крупной и мелкой фракций выполнены с
возможностью изменения угла наклона в поперечной плоскости.</p>
</li>
<li>
<p>Агрегат по п.3, отличающийся тем, что он снабжен навесной
рамой, а виброкатки расположены в шахматном порядке и связаны с
навесной рамы посредством цепей, снабженных на концах
резиновыми гасителями колебаний.</p>
</li>
<li>
<p>Агрегат по п.1, отличающийся тем, что он снабжен конвейером
для подачи поддонов с плитами, при этом его входное окно
расположено в задней центральной зоне рамы агрегата таким
образом, чтобы обеспечить свободный доступ с платформ
автомобилей для перегрузки поддонов с плитами на конвейер подачи
поддонов, причем средства непрерывной подачи крупного и мелкого
щебня в зону формирования подушки дорожного полотна снабжены
подающими транспортерами, расположенными в задней зоне агрегата
с обеих сторон от конвейера для подачи поддонов с плитами.</p>
</li>
<li>
<p><a href="https://yandex.ru/patents/doc/RU2485241C1_20130620"
target="_self"> и т.д.</a></p>
</li>
</ol>
</body>
</html>
RU2485241C1 - МНОГОФУНКЦИОНАЛЬНЫЙ
САМОХОДНЫЙ..yandex.ru
  
7.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>css</title>
<style>
p{ text-indent: 30px; text-align: justify;}
</style>
</head>
<body BACKGROUND="http://iliya.prihod.ru/files/2013/06/hq-
wallpapers_ru_abstraction3d_33909_1920x1200-1024x640.jpg">
<table border="2px" >
<tr align="center">
<th width="200">Характеристики:</th>
<th width="100">Подземный робот «Геоход»</th>
<th width="100">Проходческий щит ПЩМ-3,2</th>
</tr>
<tr>
<td >Диаметр проводимой выработки в проходке, м</td>
<td >3,2</td>
<td >3,2</td>
</tr>
<tr>
<td>Площадь сечения в проходке, м2;</td>
<td>8,04</td>
<td>8,04</td>
</tr>
<tr>
<td>Скорость проходки, м/час</td>
<td>От 4 до 6</td>
<td>0,8</td>
</tr>
<tr>
<td>Длина, мм</td>
<td>4480</td>
<td>Не более 5050</td>
</tr>
<tr>
<td>Угол наклона проводимой выработки, °</td>
<td>±25</td>
<td>±20</td>
</tr>
<tr>
<td>Масса, т</td>
<td>19</td>
<td>45</td>
</tr>
<tr>
<td>Установленная мощность, кВт</td>
<td>411</td>
<td>305</td>
</tr>
</table>
</body>
</html>

Рисунок 1−Изображение страницы 1

Рисунок 2− Изображение страницы 2

Рисунок 3− Изображение страницы 3

Рисунок 4− Изображение страницы 4

Вывод: в ходе выполнения лабораторной работы рассмотрели организацию Web-


сайта, изучили применение языка HTML для создания Web-страниц и создали Web-
страницу средствами языка HTML.