Инфоурок Информатика Другие методич. материалыИнструкционная карта к первой практической работе "Создание первой страницы сайта", проводимая в рамках темы: Создание сайта при помощи языка гипертекстовой разметки HTML

Инструкционная карта к первой практической работе "Создание первой страницы сайта", проводимая в рамках темы: Создание сайта при помощи языка гипертекстовой разметки HTML.

Скачать материал

СОЗДАНИЕ САЙТА ПРИ ПОМОЩИ ЯЗЫКА РАЗМЕТКИ ГИПЕРТЕКСТА HTML

(практические работы)

Чегодаева Анастасия Владимировна

преподаватель информатики и информационных технологий в профессиональной деятельности, БПОУ ВО «Кадуйский энергетический колледж»

высшее образование

 

Практическая работа № 1. «Создание первой страницы сайта»

 

Цель: познакомиться с основными тегами языка разметки гипертекста HTML и создать первую страницу сайта.

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

 

  1. Определитесь с темой сайта и его структурой.
  2. Изучите дополнительную информацию к практической работе № 1 (расположена ниже).
  3. На Рабочем столе создайте папку и назовите её «Proekt».

В этой папке вы будете располагать не только страницы сайта, но и всё то, что будет располагаться на этих страницах (картинки, фотографии, анимация, видео и др.).

Всем страницам сайта выбирайте имена на английском языке с расширением htm.

  1. Откройте программу Блокнот (Пуск → Все программы  → Стандартные → Блокнот).            
  2. Напишите Html-код первой страницы вашего сайта по аналогии с приведенным ниже примером (см. дополнительную информацию к ПР № 1  ниже).

Пример Html-кода страницы «Компьютерные сети» (см. рис.)

 

                   

выглядит так:

<HTML>

<HEAD><TITLE>Компьютерные сети</TITLE></HEAD>

<h1 ALIGN=Center>Компьютерные сети</h1>

<BODY>

&#160;&#160;&#160;&#160;&#160;&#160;Компьютерная сеть это объединение нескольких ЭВМ для совместного решения информационных вычислительных, учебных задач.<br>

&#160;&#160;&#160;&#160;&#160;&#160;Сети ЭВМ породили новые технологии обработки информации - сетевые технологии. …<br>

&#160;&#160;&#160;&#160;&#160;&#160;Простейшим видом сети являются одноранговые сети, обеспечивающие связь персональных компьютеров конечных пользователей и позволяющие совместно использовать дисководы, принтеры и файлы. … <br>

&#160;&#160;&#160;&#160;&#160;&#160;Сейчас наиболее популярной является технология обработки информации в сети, которая получила название клиент-сервер.<br>

</BODY>

</HTML>

  1. Сохраните первую страницу в папке «Proekt» под именем Str1.htm (обратите внимание на расширение, которое вы вводите сами).

Для просмотра и корректировки страницы необходимо зайти в папку «Proekt» → открыть файл Str1.htm с помощью вашего браузера.

Если необходимо отредактировать web-страницу, то откройте Str1.htm с помощью программы Блокнот: правый клик мыши по файлу → Открыть с помощьюБлокнот.

  1. Напишите  Html-код второй страницы сайта по аналогии с первой страницей.
  2. Сохраните вторую страницу в папке «Proekt» под  именем Str2.htm.
  3. Создайте остальные страницы сайта по аналогии с первой и второй страницами, сохраняя их в папке «Proekt» под именами Str3.htm, Str4.htm, Str5.htm и т. д. соответственно.
  4. Покажите выполненную работу преподавателю.

 

Дополнительная информация к практической работке № 1:

 

1. Чтобы на Web-странице текст располагался с красной строки следует использовать символ &#160; (смотрите выше пример html-код страницы).

2. Для задания принудительного перевода строки служит тег <BR>, который не имеет соответствующего закрывающего тега.   В отличие от тега <P> при использовании тега <BR> не будет образована пустая строка.

3. Для задания размера шрифта имеющимся в тексте заголовкам используют теги <H1>, <H2>, <H3>, <H4>, <H5> и <H6>. Эти теги требуют соответствующего закрывающего тега. Заголовок с номером 1 (<H1>)  является самым крупным (заголовок верхнего уровня), а заголовок  с номером 6 (<H6>) - самым мелким.  

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

4. Чтобы размер заголовка был больше размера основного текста необходимо этот заголовок  заключить в контейнер <h1></h1> .

5. Кроме того, обычно заголовки располагаются по центру страницы.  Для этого тег <h1> следует использовать с параметром горизонтального выравнивания ALIGN.

Например: <h1 ALIGN=Center>Компьютерные сети</h1>.

 

 

Просмотрено: 0%
Просмотрено: 0%
Скачать материал
Скачать материал "Инструкционная карта к первой практической работе "Создание первой страницы сайта", проводимая в рамках темы: Создание сайта при помощи языка гипертекстовой разметки HTML"

Методические разработки к Вашему уроку:

Получите новую специальность за 3 месяца

Микробиолог

Получите профессию

HR-менеджер

за 6 месяцев

Пройти курс

Рабочие листы
к вашим урокам

Скачать

Краткое описание документа:

Практическая работа № 1. «Создание первой страницы сайта» Цель: познакомиться с основными тегами языка разметки гипертекста HTML и создать первую страницу сайта. Оборудование: компьютер, браузер, инструкционная карта практической работы.

Скачать материал

Найдите материал к любому уроку, указав свой предмет (категорию), класс, учебник и тему:

6 743 237 материалов в базе

Материал подходит для УМК

Скачать материал

Другие материалы

Практическая работа "Графическое представление табличных данных в ЭТ
  • Учебник: «Информатика (изд. "БИНОМ. Лаборатория знаний")», Угринович Н.Д.
  • Тема: 4.3. Построение диаграмм и графиков в электронных таблицах
  • 12.01.2023
  • 485
  • 15
«Информатика (изд.

Вам будут интересны эти курсы:

Оставьте свой комментарий

Авторизуйтесь, чтобы задавать вопросы.

  • Скачать материал
    • 12.01.2023 130
    • DOCX 113 кбайт
    • Оцените материал:
  • Настоящий материал опубликован пользователем Чегодаева Анастасия Владимировна. Инфоурок является информационным посредником и предоставляет пользователям возможность размещать на сайте методические материалы. Всю ответственность за опубликованные материалы, содержащиеся в них сведения, а также за соблюдение авторских прав несут пользователи, загрузившие материал на сайт

    Если Вы считаете, что материал нарушает авторские права либо по каким-то другим причинам должен быть удален с сайта, Вы можете оставить жалобу на материал.

    Удалить материал
  • Автор материала

    • На сайте: 3 года и 9 месяцев
    • Подписчики: 0
    • Всего просмотров: 6162
    • Всего материалов: 15

Ваша скидка на курсы

40%
Скидка для нового слушателя. Войдите на сайт, чтобы применить скидку к любому курсу
Курсы со скидкой

Мини-курс

Управление репутацией и клиентским опытом

2 ч.

780 руб. 390 руб.
Подать заявку О курсе

Мини-курс

Эффективное управление запасами

4 ч.

780 руб. 390 руб.
Подать заявку О курсе

Мини-курс

Стратегии карьерного роста и развития

10 ч.

1180 руб. 590 руб.
Подать заявку О курсе