Разработка Web-страницы средствами языка HTML

Автор работы: Пользователь скрыл имя, 29 Марта 2014 в 14:23, контрольная работа

Краткое описание

Задание. Используя основные тэги языка HTML, разработать Web-страницу, содержащую сведения об авторе-разработчике. Страница должна содержать сведения об авторе сайта (включая, по-возможности, его фото, краткую биографию, сведения о месте работы и профессии). Для оформления страницы использовать: фон, текст, заголовки различных уровней, горизонтальную линию, бегущую строку, нумерованный или маркированный списки, графическое изображение.

Скачать в ZIP архиве (3.97 Мб) Сколько стоит заказать работу?
Вложенные файлы: 1 файл

Контрольная.doc

— 5.04 Мб (Скачать файл)

Министерство образования республики Беларусь

 

Учреждение образования «Гомельский государственный

технический университет имени П. О. Сухого»

 

 

 

 

 

 

 

 

Кафедра «Информатика»

 

 

 

 

 

 

КОНТРОЛЬНАЯ РАБОТА

 

по курсу «Компьютерные информационные технологии»

 

 

 

 

 

 

 

 

 

 

Выполнил студент

гр. ЗМГ-21 Пахомова С. В.

Проверил преподаватель

_____________________

 

 

 

 

 

 

 

 

Гомель, 2013/2014уч.год 

Тема №1. «Разработка Web-страницы средствами языка HTML».

Задание. Используя основные тэги языка HTML, разработать Web-страницу, содержащую сведения об авторе-разработчике. Страница должна содержать сведения об авторе сайта (включая, по-возможности, его фото, краткую биографию, сведения о месте работы и профессии). Для оформления страницы использовать: фон, текст, заголовки различных уровней, горизонтальную линию, бегущую строку, нумерованный или маркированный списки, графическое изображение.

Отчет о создании Web-страницы должен содержать:

  • распечатку созданной Web-страницы:

  • распечатку HTML-документа созданной Web-страницы:

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

<head><!--Заголовочная  часть документа -->

<title> Авторская  страница</title><!--заголовок документа -->

</head><!--Конец  заголовочной части документа -->

<body bgcolor= "0011cc" > <!--Определение цвета фона  документа -->

<IMG src="100_1866.jpg"width="500" height="420"align="left"><!--Добавление графического объекта -->

<!--Основной  текст документа -->

<p><CENTER><FONT color="magenta" hr size=5 ><H1><U><I>Пахомова  Светлана Валентиновна  </I></U></H1></FONT></CENTER></body>

<hr size=10 color="ffff00" noshade><!--Горизонтальная линия -->

<CENTER><FONT color="fffbcf"><H2><I>Моя автобиография </I></H2></FONT></CENTER>

<hr size=10 color="white" noshade>                        

<h2>

<FONT color="aqua"><p>Я ,Пахомова Светлана Валентиновна родилась 3 марта 1995 года, в городе Жлобине .Гомельской области.

<p>В 2001 году  пошла в первый класс в гимназию  №1.г Жлобина. Окончила школу  в 2012 год.

<p> В 2012 году  поступила в ГГТУ.им Сухого  на специальность экономист –  маркетолог.

<p>На данный  момент нигде не работаю.

<p>Незамужем.

<p> Мой адрес:  Гомельская область.

г .Жлобин. ул.Урицкого 72 .кв.7

 

</p>

</body>

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

 

Тема №2. «Разработка Web-сайта средствами программы Front Page».

 

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

Сайт должен представлять собой разветвленную 3-х уровневую структуру и содержать не менее 6-и Web-страниц, включая домашнюю страницу и страницу автора – разработчика, созданную при выполнении задания по теме №1.

Домашняя страница должна отражать:

  • полное название организации;
  • основные направления деятельности;
  • структуру организации.

Остальные страницы должны отражать сведения о подразделениях и делах, входящих в структуру организации:

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

Со всех страниц сайта должны быть ссылки на домашнюю страницу и на предыдущую (родительскую). В оформлении Web-страниц кроме текста должны присутствовать следующие элементы:

  • графические изображения (фото, рисунки, объекты WordArt, автофигуры);
  • нумерованные и маркированные списки;
  • горизонтальные линии, бегущие строки;
  • гиперссылки (текстовые и графические);
  • диаграммы;
  • фон страниц (в виде цвета или рисунка).

Отчет о создании Web-сайта должен содержать:

  1. Описание структуры Web-сайта 

 

 

  1. Распечатку логической структуры Web-сайта

  1. Описание процесса создания основных элементов Web-страниц (текста, списков, графических изображений, гиперссылок и т.п.).

Для создания и редактирования Web – страниц обычно используется встроенный редактор режима просмотра страницы.

Для создания пустой страницы достаточно щелкнуть по кнопке Новая страница (New Page)   на панели инструментов Стандартная, после чего откроется чистая Web – страница. Допускается одновременное открытие нескольких страниц, переключение между которыми осуществляется через меню Окна.

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

Ввод и редактирование текста в режиме просмотра страницы осуществляется практически также как и в текстовом процессоре Word .

Вид шрифта и его размер можно выбирать при помощи раскрывающихся списков, окна которых расположены на панели Форматирование

 . Если воспользоваться командой Формат → Шрифт, то можно кроме этого выбрать стиль шрифта, его цвет и различные эффекты его изображения.

Выделение текста производится перетаскиванием мыши или путем использования клавиш со стрелками при нажатой клавише <Shift>.

Выделив часть документа, над ней можно производить стандартные операции редактирования – либо выбором команд из меню, либо при помощи кнопок на панели инструментов Форматирование, либо с помощью команд контекстного меню, открываемого правой кнопкой мыши на объекте. В частности,  для перемещения или копирования текста или графических объектов можно использовать буфер обмена(Clipboard), применяя команды Вырезать (Cut), Копировать (Copy) и Вставить (Paste).

Выравнивание абзаца, в конце которого при наборе нажимается  клавиша  <Enter>  (он при этом помечается символом ¶) можно осуществить по левому краю, по центру или по правому краю. Можно ввести код конца строки, не создавая нового абзаца: для этого нужно нажать сочетание клавиш <Shift> <Enter> . Код конца строки при показе непечатаемых символов изображается в виде  8.

Создание горизонтальной линии. Для этого нужно выполнить следующие действия:

    1. Поставить курсор в то место, где должна пройти линия.
    2. Выполнить команду Вставка → Горизонтальная строка (Insert → Horizontal Line).
    3. Для редактирования свойств созданной линии дважды щелкнуть на ней (или открыть контекстное меню и выбрать в нем команду Свойства горизонтальной линии (Horizontal Lines Properties).

В открывшемся диалоговом окне можно задать: ширину или высоту в пикселах или % от ширины окна, цвет, расположение (выравнивание).

 

Использование заголовков. Заголовки являются очень эффективным и часто используемым средством структуризации Web – страницы. На Web – странице может быть до шести уровней заголовков: от Уровня 1 – самого крупного, до Уровня 6 – самого мелкого. Заголовком может быть любой текст, и их можно использовать в любом порядке. Но лучше использовать заголовки по их прямому назначению, учитывая, что все браузеры отображают заголовки более высоких уровней как "более значимые".

Для создания заголовка нужно щелкнуть на тексте или абзаце, который будет служить заголовком, а затем раскрыть список Стили на панели Форматирование и из шести уровней заголовков в списке выбрать требуемый

 

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

        1. Установить курсор туда, где будет начало бегущей строки.
        2. Выполнить команду Вставка → Компонент → Бегущая строка (Insert  →Component → Marquee).
        3. В открывшемся диалоговом окне установить свойства бегущей строки:
    • текст (Text) строки:
    • направление перемещения текста: влево (Left) или вправо (Right);
    • ширину (Width) и высоту (Height) строки в пикселах или % от ширины окна;
    • цвет фона (Background color);
    • стиль написания текста;
    • число повторений и др.
  1. Щелкнуть по кнопке ОК, после чего текст бегущей строки будет помещен на страницу.

Чтобы посмотреть, как строка будет выглядеть в окне браузера нужно:

    • либо открыть страницу в каком – либо браузере;
    • либо открыть страницу в режиме  предварительного просмотра.

Для редактирования свойств бегущей строки нужно дважды щелкнуть на ней или, открыв контекстное меню, выбрать пункт Свойства бегущей строки (Marquee Properties).

FrontPage дает возможность использовать два вида списков:

    • маркированный (bulleted list); перед каждым объектом (абзацем) помещается маркер – символ определенного вида;
    • нумерованный (numbered list); перед каждым объектом помещается его порядковый номер.

Список можно создать как перед вводом данных, так и после него. Каждый объект в списке является отдельным абзацем.

Если текст, который нужно преобразовать в список, уже введен, то нужно выделить абзацы текста и нажать на одну из кнопок   : нумерованный список или маркированный, соответственно.

Список можно создать и непосредственно при вводе текста. Для этого:

  1. В начале новой строки нужно щелкнуть по одной из указанных кнопок. При этом в начале строки появится маркер, и она станет первой строкой списка.
  2. Ввести текст первой строки нажать клавишу <Enter> для перехода к следующей. Ввести текст второй строки списка и вновь нажать <Enter>. Повторять эту процедуру до тех пор, пока не будет введен весь список.
  3. По окончании ввода списка либо дважды нажать <Enter>, либо использовать сочетание <Shift> <Enter>.

Чтобы добавить новый элемент в список, нужно поместить точку вставки в начало строки и ввести текст. Новый текст помещается перед существующим. Для перемещения существующего текста на следующую строку нужно нажать <Enter>. Если список нумерованный, то все его элементы, расположенные ниже точки вставки, будут автоматически перенумерованы.

Для добавления нового элемента в конец существующего списка нужно поместить точку вставки в конец последнего элемента и нажать <Enter>.

Для удаления элемента списка нужно выделить его и нажать < Del>  или выполнить команду Правка → Удалить (Edit →Delete).

Для того чтобы изменить параметры существующего списка, форму маркера, стиль списка и т.д., нужно выполнить команду Формат → Маркеры и номера (Format → Bullets and Numbering) или выполнить команду Свойства списка (List Properties) из контекстного меню списка  в открывшемся диалоговом окне установить нужные параметры.

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

Для вставки в Web – страницу графического объекта нужно выполнить команду Вставка → Рисунок →  Клип Арт (Insert Picture Clip Art) -  если рисунок будет выбран из готового набора рисунков или Вставка → Рисунок →  Из файла (Insert  →Picture  → File) - если рисунок находится в файле) или Вставка → Рисунок →  Видео (Insert  →Picture  →Video).

Размеры рисунка можно изменять, но увеличивать рисунок средствами FrontPage не рекомендуется из-за потери качества изображения (лучше это сделать в графическом редакторе, а затем внедрить рисунок заново).

 

Таблицы - удобное средство представления и упорядочения информации на Web-странице. Frontpage обладает обширными возможностями создания и обработки таблиц

Для создания таблиц предназначены кнопка - Вставить таблицу (Insert Table) на панели инструментов Стандартная, предоставляющая доступ к прототипу таблицы для определения количества строк и столбцов, и команда Таблица → Вставить → Таблица (Insert → Table → Table), при вызове которой открывается диалоговое окно Вставить таблицу (Insert Table) , а также инструмент Рисование таблицы (Draw Table). Это окно содержит элементы для указания размера и способа расположения таблицы. Однажды созданную таблицу можно модифицировать с помощью команд меню Таблица (Table), которые позволяют обрабатывать как таблицу в целом, так и ее отдельные ячейки. Для работы с таблицами также предназначена панель инструментов Таблицы (Tables).

Web - страницы любого Web-узла содержат гиперссылки. Они и являются наиболее удобным и эффективным средством "путешествия" по Web-узлу или WWW.

В гиперссылку может быть включен любой объект (текст или графическое изображение), находящийся на странице. Гиперссылка – это связь, ведущая с одной Web – страницы на другую страницу, картинку, адрес электронной почты или файл, расположенные где–то в WWW. Гиперссылка может быть локальной, т.е. указывать на ресурс, находящийся внутри  текущего Web – узла, или внешней, указывающей на любой ресурс, находящейся в WWW где угодно. При выполнении щелчка на гиперссылке браузеру указывается связанный с этой гиперссылкой URL-адрес ресурса, и он осуществляет переход к нему.

Информация о работе Разработка Web-страницы средствами языка HTML