Практическая работа:

Рассмотрим, как создаются Web-сайты на примере разработки тематического сайта “Компьютер”. Сначала необходимо разработать проект сайта. Пусть сайт состоит из пяти страниц:

“Компьютер” (титульная страница);

“Программы” (содержит классификацию программного обеспечения);

“Словарь” (содержит компьютерные термины);

“Комплектующие” (цены на устройства компьютера);

“Анкета” (анкета для посетителей сайта).

  1. Создайте папку внутри своей папки с именем “сайт_ПК”;

  2. Заготовьте “пустую” страницу и сохраните её с именем index.htm в папке “сайт_ПК”:

    3. <HTML>

    <HEAD>

    <TITLE> … </TITLE>

    </HEAD>

    <BODY>

    …

    </BODY>

    </HTML>

  3. Копируйте данный файл в ту же папку (4 раза) с именами software.htm; glossary.htm; hardware.htm; anketa.htm.

  4. Введите в строку название страницы (у каждого файла) соответствующие названия:

    5. index.htm: Компьютер (<TITLE> Компьютер </TITLE>;

    software.htm: Программное обеспечение;

    glossary.htm: Словарь;

    hardware.htm: Комплектующие ПК;

    anketa.htm: Анкета.

  5. Загрузите на выполнение каждый из файлов и понаблюдайте изменения в строке заголовка браузера.

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

  7. Установите знак комментария в контейнеры заголовка и строки заголовка страницы, сохраните изменения и посмотрите реакцию браузера; затем всё восстановите обратно. (<!HEAD> <!TITLE> Компьютер<!</TITLE> <!/HEAD>);

    8. (<!HEAD Компьютер>).

  8. Если будет выход в Интернет, то на сайте Ошибка! Закладка не определена. ознакомтесь с Web-сайтами участников московских конкурсов ученических проектов (можно скопировать наиболее понравившуюся Web-страничку в отдельную папку вашей папки).

  9. Заполните контейнер тела страницы index.htm данным текстом:

    10. Всё о компьютере

    На этом сайте Вы сможете получить различную информацию о компьютере, его программном обеспечении и ценах на компьютерные комплектующие.

    Терминологический словарь познакомит Вас с компьютерными терминами, а также Вы сможете заполнить анкету.

  10. Сохраните изменения в файле и запустите его в браузере. Влияет ли отбитие абзацев в тексте на его представление в браузере?

  11. Заключите каждый абзац в контейнер <p> … </p>, посмотрите что изменилось в браузере. Каково назначение данного контейнера?

[вернуться к оглавлению урока]

[ответ]