Челябинский техникум текстильной и легкой промышленности
Практическое занятие №
Тема: Создание WEB – документов и их размещение в Internet
Продолжительность 4 часа Вопросы (задачи), подлежащие исследованию. 1.1. Структура документа HTML 1.2. Элементы HTML 1.3. Гипертекстовые ссылки 1.4. WEB-графика и создание описания фреймов 1.5. Форматирование текста 1.6. Списки 1.7. Интерактивные WEB – документы 1.8. Публикация WEB – документов 2. Краткие теоретические или справочно-информационные материалы. 2.1. Всемирная паутина (World Wide Web - WWW) является глобальной распределенной гипертекстовой и мультимедийной информационной системой. Она позволяет связать в одном документе разнородную информацию, хранящуюся на разных компьютерах. Гипертекстовые документы, с которыми работает WWW, называются Web-страницами. Гипертекст – это документ, который наряду с обычной текстовой и графической информацией содержит ссылки на другие документы, включая и мультимедийные (графические, звуковые и видео). Ссылку можно узнать по виду курсора мыши. Когда ссылка оказывается в фокусе мыши, курсор мыши принимает вид кисти руки с указующим перстом. 2.2. Для создания гипертекстовых документов используется язык HTML, который позволяет задать необходимую разметку текста и встроить в него необходимые ссылки. 2.3. Для работы с WWW используются специальные программы-клиенты, называемые навигаторами, обозревателями или броузерами. Помимо просмотра Web-страниц при работе с WWW, обозреватели дают возможность пользоваться и другими сервисами Internet (посылать электронные письма абонентам сети, получать файлы с анонимного FTP и др.). Одной из таких программ является рассматриваемый ниже обозреватель Internet Explorer 5.0.
Рекомендации студентам по подготовке к лабораторной работе с указанием литературы. При подготовке к выполнению лабораторной работы необходимо изучить следующие вопросы: 3.1..Технология Создания WEB - документов 3.2. Применение языка HTML. 3.3. Публикация WEB - документов. 3.4. Источники 3.4.1. Симонович С.В. Информатика. Базовый курс. Учебник для ВУЗов. Изд-во «Питер». СПб 2005. 3.4.2. Иванов М.И, Уткин Ю.Г.. Информатика. Учебное пособие М.: Изд-во «Альтаир» МГАВТ, 2004. 3.4.3. Карабутов Н.Н. Создание интегрированных документов в Microsoft Office: введение в анализ данных и подготовку документов Учебное пособие. Из-во «Солон» 2005г. Описание лабораторного оборудования. 4.1.. Персональный компьютер – ПЭВМ. 4.2..Программное обеспечение: OC Windows, браузера INTERNET EXPLORER, сеть INTERNET. 5. Краткое содержание работы, выполняемой студентами в ходе занятия. 5.1. Ввод HTML – кода WEB – страницы. 5.2. Загрузка файла в окно браузера INTERNEN EXPLORER для просмотра. 5.3. Ввод дополнений в контейнер <BODY>. 5.4. Вставка изображения и обтекающий его текст. 5.5. Выполнение аналогичного самостоятельно задания: 5.6. Создание кода панели навигации. 5.7. Создание кода задающего список 5.8. Создание кода текстового поля для ввода данных 5.9. Самостоятельно оформление страницы. Порядок проведения работы. 6.1. Открыть окно текстого редактора Блокнота – Ввести HTML – код WEB – страницы <HTML> <HEAD> <TITLE> ЧТТЛП</TITLE> </HEAD> <Body> Давайте знакомиться – Челябинский техникум текстильной и легкой промышленности </Body> </HITL> 6.2. Сохранить файл под именем INDEX.HTM в вашей папке 6.3. Загрузить этот файл в окно браузера INTERNEN EXPLORER для просмотра. Дать команду Файл - Открыть. 6.4. В созданный файл ввести дополнение контейнер <BODY>. Для этого, с использованием контекстного меню вызвать программный код “Просмотр в виде HTML” <H1 ALIGN = “center”> <FONT COLOR = “blue”> Давайте знакомиться –
Челябинский техникум текстильной и легкой промышленности </FONT> </H1> <HR> </Body> 6.5. Вызвать редактор Paint, задайте атрибуты рисунка 400х300 и с использованием инструментов редактора создайте изображение эмблемы с именем com.bmp в Вашей папке. 6.6. Вызвать “Блокнот” и ввести в созданный файл INDEX.HTM изменения и дополнения в контейнер <Body> для тега вставки изображения и обтекающий его текст. Просмотреть результат в браузере <IMG SRC = “com.bmp” ALT = “Эмблема” ALIGN = “right”> Челябинский техникум легкой промышленности был создан в 1956 году распоряжением Совета Министров РСФСР № 218-р от 12.06.1956 г. Традиционно техникум осуществляет подготовку по специальностям: Технология текстильных изделий (специализация Технология трикотажа), Конструирование, моделирование и технология швейных изделий. Специальности Технология текстильных изделий (специализация Технология трикотажа) и Конструирование, моделирование и технология изделий из кожи (обувное производство) являются уникальными, подготовкой по ним занимаются лишь несколько учебных заведений в России. В техникуме работают 2 заслуженных учителя РФ, 1 кандидат наук, 6 преподавателей награждены знаком «Почетный работник среднего профессионального образования Российской Федерации». 77% штатных преподавателей имеют высшую и первую категории. В 2002 году техникум вошел в число 20 лучших техникумов России. 6.7. Выполните самостоятельно задания: 6.7.1. Получите бегущую строку “Давайте знакомиться - Компьютер” с использованием тегов: <marquee> </marquee > 6.7.2..Измените размер (Н3) и цвет (Red) для текста. 6.7.3. Измените цвет фона. 6.8. С использованием «Блокнот» создать пустые страницы «Специальности», «Студсовет», «Анкета» и сохранить их в файлах с именами, spets.htm, student.htm, anketa.htm в Вашей папке. Каждая страница будет содержать следующий HTML – код, например software.htm <HTML> <HEAD> <TITLE> Специальности </TITLE> </HEAD> <BODY> </BODY> </HTML> 6.9. С использованием “Блокнот” вставить в файл Index.htm код, создающий панель навигации.Просмотреть в IE <P ALIGN = “CENTER”> [<A HREF = “spets.htm”> Специальности </A>] [<A HREF = “student.htm”> Студсовет </A>] [<A HREF = “anketa.htm”>анкета </A>] </P> 6.10. Открыть в блокноте файл spets.htm и добавить следующий HTML – код, задающий список
<UL> <LI> Технология текстильных изделий (специализация Технология трикотажа) <LI> Конструирование, моделирование и технология швейных изделий <LI>Коммерция (по отраслям) </UL> 6.11. Добавить HTML код, задающий вложенный список для элемента <LI>. Товароведение и экспертиза качества потребительских товаров. Швея Продавец непродовольственных товаров <UL> <LI> Товароведение и экспертиза качества потребительских товаров <LI> Швея <LI> Продавец непродовольственных товаров <LI> </UL> 6.12. Открыть в Блокноте файл student.htm и добавить следующий HTML – код, задающий список <DL> <DT> Студсовет <DD>Форма самоуправления <DT>Студсовет общежития. <DD>. Форма самоуправления в общежитии 6.13. Открыть в блокноте файл anketa.htm и добавить следующий HTML – код, создающий текстовые поля для ввода данных. Просмотреть страницу в браузере. <FORM> Пожалуйста, введите ваше имя: <BR> <INPUT TYPE = “TEXT” NAME = “name” SIZE = 30><BR> E-mail: <BR> <INPUT TYPE = “TEXT” NAME = “E-mail” SIZE = 30> </FORM> 6.14. Добавить HTML – код, создающий группу!!!получателей!!! для выбора одного варианта. Просмотреть страницу в браузере. Укажите к какой социальной группе Вы себя относите: <BR> <INPUT TYPE = “radio” NAME = “group” VALUE = “schoolboy”> учащийся <BR> <INPUT TYPE = “radio” NAME = “group” VALUE = “student”> студент <BR> <INPUT TYPE = “radio” NAME = “group” VALUE = “teacher”> учитель <BR> 6.15. Добавить HTML – код, создающий кнопки. Просмотра страниц в браузере <INPUT TYPE = “submit” VALUE = “Отправить”> <INPUT TYPE = “reset” VALUE = “Очистить”> 6.16. Самостоятельно оформите страницу 6.16.1. Сделать подпись 6.16.2. Произвести вставку рисунка 6.16.3. Оформить фон страницы. Техника безопасности. При выполнении лабораторной работы необходимо строго соблюдать меры безопасности, для чего: 7.1. Включать электропитание ПК только по команде преподавателя (с разрешения преподавателя); 7.2. Строго соблюдать последовательность включения и выключения ПК; ИБП. 7.3. Категорически запрещается: 7.3.1. производить вскрытие системных блоков;
7.3.2. отключение и подключение интерфейсных кабелей и кабелей питания как во время работы, так и при отключенном напряжении; 7.3.3. производить несанкционированные действия с элементами системы ввода (мышь, клавиатура); 7.3.4. Делать перестановки оборудования на рабочем месте
Воспользуйтесь поиском по сайту: ©2015 - 2024 megalektsii.ru Все авторские права принадлежат авторам лекционных материалов. Обратная связь с нами...
|