Методика создания первой web-страницы

Описание.

Приводится алгоритм создания и сохранения структуры папок и первой страницы сайта.

Методика.

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

Папка  name-sait.ru  является корневой папкой сайта.

Папка images предназначена для хранения графического материала, обработанного и загружаемого на страницы сайта.

Папка css  предназначена для хранения файлов стиля.

Папка pages предназначена для хранения страниц сайта, кроме главной страницы index.html.

Структура папок

2. Работа с программой   Notepad++.exe  и создание нового документа.

1. Настройка программы.

• Выбираем в главном меню программы  команду  Кодировки  и ставим переключатель в положение Кодировать в UTF-8.
• Опции (Setting …) – Настройки…  в категории  Общие  - выбираем язык интерфейса – Русcкий.
• Категория  Новый документ  - Кодировка  - UTF-8.
• Категория  Автозавершение – поставить флажки в соответствии с рис.2

                                                 рис. 2

• Далее закрыть окно Настройки.

2. В  рабочей области программы набираем текст страницы, которую сохраним под именем page1.html  в папке name-sait.ru/pages/.

   
       

Меня зовут Сергей

Я учусь в 8 классе  143 школы

                    и занимаюсь в студии "Web-дизайна” 

                     Клуба информатики ДДЮТ

                  Моя цель - научиться создавать web-страницы.

                              width="800" height="600" />

3. Сохраняем созданный файл.

-Для этого выбираем команду   Файл сохранить как… при этом открывается папка name-sait.ru. Открываем папку pages 

-В поле Тип файла    -  Все типы (All types (*.*))

-В поле  Имя файла   - пишем   page1.html  и нажимаем на кнопку Сохранить.

-В папке  images необходимо разместить картинку  korablik.jpg

В папке  pages  появится   файл    page1.html 

4.  Открываем файл  page1.html с помощью браузера и просматриваем результат.  
   Если необходимо внести изменения, редактируем страницу в блокноте, сохраняем изменения и вновь просматриваем страницу в браузере, обновив ее клавишей [F5].