58120

Создание Интернет-страниц

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

Педагогика и дидактика

Он требует терпения и знания основ «программирования» на языке html, который, по сути, языком программирования не является. Итак. Для работы нам будет достаточно программы Блокнот. И даже более того, достаточно будет использовать только меню FILE.

Русский

2014-04-22

32 KB

0 чел.

Урок 1.

Создание Интернет-  страниц

Html – язык разметки гипертекста.

Не зависимо от того, как создана Интернет страница, код html  этой страницы можно изменить.

Вообще существует 3 способа создания web-страниц:

  1.  создание странички с помощью Блокнота.
  2.  с помощью специальных html – редакторов.
  3.  с помощью специальных программ для создания страниц. (не  требуют знания html).

Рассмотрим подробнее 1 способ.

Он требует терпения и знания основ «программирования» на языке html, который, по сути, языком программирования не является.

Итак. Для работы нам будет достаточно программы Блокнот. И даже более того, достаточно будет использовать только меню FILE.

Прежде чем начать работу следует запомнить несколько правил:

  1.  никогда не пишите названия файлов русскими буквами.
  2.  желательно пользоваться буквами нижнего регистра.
  3.  никогда не забывайте закрывать парные кавычки и теги.

Начнем.

1.Откройте программу Блокнот.

2. Создайте текст:

<html>

  <head>

     <title>

     </tile>

       <body>

       </body>

  </head>

</html>

3. Сохраните файл с именем shablon.html (просмотрите содержимое файла, убедитесь, что он пуст)

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

Обратите внимание, что все теги (ключевые слова, команды, которые вы записали выше) – парные. Причем закрывающий тег – с косой чертой)

  

Подробнее о каждом:

<html> … </html> - границы документа. Благодаря этому тегу браузер распознает начало и конец вашей страницы, расположенной между этими тегами. И выводит содержимое страницы на всеобщее обозрение.

 <title> …  </title> -  название странички, которое отображается в верхней строчке окна браузера.

<head>…</head> -  заголовок документа, не название, а именно заголовок, который будет видно только тем программам, которые просматривают страницу.

 <body> … </body> - это тело документа. Все, что расположено между этими словами (текст, картинки, звуки…) отображается на странице.

Добавим на нашу первую страничку содержание.

Для этого файл должен быть открыт с помощью программы Блокнот.

  •  Примечание. Текст программы в оригинале называется ЛИСТИНГ.

Изменим данные (то есть добавим содержимое, а именно текст и фотографию или картинку)

Листинг программы изменится:

<html>

  <head>

     <title>моя первая страница</title></head>

       <body><IMG src="6.jpg">

ураааааааааааааааааааааааааааааааааааааааааааааааааааааа

</body>

 </html>

   (имя графического файла, естественно,  может быть произвольным, текст тоже)

Незнакомым  в данной записи является текст   <IMG src="6.jpg">

IMG – понятно – IMAGE. А вот  src – сокращение слова  Source. И все вместе – источник изображения.

Надеюсь, общий формат вставки картинок понятен…

Естественно, размер изображения должен быть соразмерен с размером Интернет – ресурса, то есть: при максимальном качестве изображения размер картинки должен быть минимальным, т.к. от размера картинки зависит время её загрузки на компьютере пользователя. Поэтому прежде чем «вывешивать» картинку её следует обработать с помощью известного вам графического редактора. Желательно сохранять картинку специально для WEB.

Задание 1.

Создайте страничку, содержащую текст о Вас.

Добавьте текст. И картинку, желательно Вашу фотографию.  

(данная страница будет дополняться данными и станет составляющей сайта вашего класс, который РЕАЛЬНО попадет в INTERNET)


 

А также другие работы, которые могут Вас заинтересовать

41847. ИССЛЕДОВАНИЕ ОПЕРАЦИОННЫХ УСИЛИТЕЛЕЙ И СХЕМ НА ЕГО ОСНОВЕ 119.73 KB
  Изучение принципов построения схем сумматора вычитающего устройства дифференцирующего устройства с использованием операционного усилителя. Рисунок 1 Схема электрическая принципиальная усилителя Рисунок 2 Осциллограмма суммирующего устройства. Uвх t Uвх t Рисунок 3 Осциллограмма вычитающего устройства. Uвх t Рисунок 4 Осциллограмма интегрирующего устройства.
41849. Основные характеристики и испытание интегрального цифрового компаратора 195.54 KB
  Для построения компаратора только на элементах ИНЕ запишем её в другой форме воспользовавшись формулой де Моргана Схема реализующая это выражение приведена на рис. Если необходимо чтобы при равенстве кодов на выходе компаратора была логическая 1 то к выходу схемы рис.ms10 или собрать на рабочем поле среды MS10 схему для испытания цифрового компаратора рис.
41850. Создание компьютерных публикаций на основе использования готовых шаблонов 711.14 KB
  Ход работы Publisher упрощает процесс создания публикаций предоставляя сотни профессиональных макетов для начала работы. Документ Publisher называется публикацией расширение в файловой системе . Запуск Publisher осуществляется по команде Пуск Программы Microsoft Office Microsoft Publisher 2007 щелчком мыши. Запустить программу Publisher После запуска приложения на экране появляется следующее окно.
41851. Ознакомление с основными характеристиками и испытание интегральных триггеров RS, D, T и JK 730.66 KB
  При отсутствии входных сигналов состояние триггера не изменяется а в момент подачи сигнала R = 1 триггер переключается в состояние Q = 0 в котором пребывает до поступления нового единичного сигнала на Sвход. Функционирование Ттриггера определяется уравнением Он может быть реализован например на базе двух синхронных RSтриггеров рис. С появлением фронта тактового импульса триггер Т1 первой ступени переключается в состояние противоположное состоянию триггера Т2. Но это не вызывает изменение сигналов на выходах Q и так как за счёт...
41852. Ознакомление с устройством и функционированием регистров и регистровой памяти; испытание интегрального универсального регистра сдвига 327.33 KB
  Если выводы последнего триггера сдвигающего регистра соединить с входами первого то получится кольцевой регистр сдвига называемый кольцевым счётчиком. Синтез регистра сводится к выбору типа триггеров и логических элементов И НЕ ИЛИ для реализации заданных операций.2 1 х1 х2 хп Т R S 1 Т R S 1 Рассмотрим работу параллельного регистра на RSтриггерах рис.
41853. Изучение и анализ конструкций мостов транспортных автомобилей 86.06 KB
  1 запорное кольцо подшипника; 16 полуосевая шестерня; 2 тормозная колодка; 17 болты крепления к балке заднего моста; 3 тормозной барабан; 18 подшипники ведущей шестерни; 4 шпилька крепления колеса; 19 сальник ведущей шестерни; 5 колпак колеса; 20 фланец; 6 тормозной цилиндр; 21 гайка ведущей шестерни; 7 тормозной щит; 22 кольцо грязеотражательное; 8 подшипник полуоси; 23 распорная втулка; 9 сальник полуоси; 24 регулировочное кольцо; 10 опорная чашка пружины; 25 ведущая шестерня; 11 ...
41854. Использование систем проверки орфографии и грамматики. Форматирование текста 201.77 KB
  Форматирование текста Цель: научиться использовать системы проверки орфографии и грамматики форматировать текст. Обратите внимание что в раскладке продуктов левый край ровный но текст отодвинут от левого края. Задание: Набрать следующий текст: Тесто рассыпчатое 400 г муки 200 г масла 05 стакана воды Растереть масло добавить муку воду всыпать 05 чайной ложки соли и замесить тесто. Порядок выполнения задания №2: Заголовок выровнять по центру с помощью элемента вкладки Главная шрифт полужирный вкладки Главная разрядка 3 пт Команда:...
41855. Ознакомление с устройством и функционированием счётчиков и испытание синхронного суммирующего, реверсивного и десятичного счётчиков 576.67 KB
  Между собой ячейки счётчика соединяют таким образом чтобы каждому числу импульсов соответствовали состояния 1 или 0 определенных ячеек. Каждый разряд счётчика может находиться в двух состояниях. Максимальное число N которое может быть записано в счётчике равно 2п 1 где п число разрядов счётчика.1 Условное изображение трехразрядного суммирующего счётчика показано на рис.