Первая страница
Наша команда
Контакты
О нас

    Головна сторінка



Поняття про мову розмітки гіпертексту мову html

Скачати 57.59 Kb.

Поняття про мову розмітки гіпертексту мову html




Скачати 57.59 Kb.
Дата конвертації07.06.2017
Розмір57.59 Kb.
ТипУрок


Урок 1 - 2

Тема: Поняття про мову розмітки гіпертексту – мову HTML.
Гіперте́кст (англ. Hypertext) - текст для перегляду на комп'ютері, який містить зв'язки з іншими документами («гіперзв'язки» чи «гіперпосилання»); читач має змогу перейти до пов'язаних документів безпосередньо з вихідного (первинного) тексту, активувавши посилання.
Мо́ва розмі́тки - штучна мова, що використовує набір анотацій до тексту, що надає інструкції стосовно структури тексту чи його відображення.


Мета: Дати поняття про мову гіпертекстової розмітки, познайомити з тегами мови, засобами створення HTML-документів, тегами форматування символів.

Обладнання: дошка, проектор, таблиці.

ПЛАН УРОКУ



1. Організація класу до занять.

2. Мотивація вивчення теми.
Форматува́ння (formatting) - процедура створення структур порожньої файлової системи вказаного типу - розподіл доріжок магнітного диска (дискети, твердого диска) чи іншого носія інформації (наприклад, SSD чи флеш-накопичувача) на фізичні чи логічні записи, що виконується перед першим використанням диска.
Мотива́ція (з лат. movere) - спонукання до дії; динамічний процес фізіологічного та психологічного плану, керуючий поведінкою людини, який визначає її організованість, активність і стійкість; здатність людини діяльно задовольняти свої потреби.

Для зручності читання інформації на Web-сторінці подаю не у вигляді суцільного тексту, а поділяю на різні структурні елементи – окремі рядки, абзаци, списки, таблиці, малюнки, гіперпосилання та ін. Щоб Web-сторінка виглядала однаково при перегляді користувачами в різних частинах Землі за допомогою різних броузерів, її готую у спеціальний спосіб.

Бра́узер, також веб-переглядач (англ. browser МФА: [ˈbraʊ̯zɚ] - переглядач) - програмне забезпечення для комп'ютера або іншого електронного пристрою, як правило, під'єднаного до Інтернету, що дає можливість користувачеві взаємодіяти з текстом, малюнками або іншою інформацією на гіпертекстовій веб-сторінці.
Гіперпосила́ння (або просто посилання чи ланка, пóклик) - активний (виділеним кольором) текст, зображення чи кнопка на веб-сторінці, натиснення на яку (активізація гіперпосилання) викликає перехід на іншу сторінку чи іншу частину поточної сторінки.
Кори́стува́ч - той, хто користується чим-небудь - майном, землею, комп'ютером тощо.

Завдання уроку.


  1. Поняття про мову гіпертекстової розмітки;

  2. Структурні теги;

  3. Оформлення тексту у Web-документі;

  4. Теги форматування символів;

3. Вивчення нового матеріалу.

а. Призначення мови й основні поняття. Різні структурні елементи Web-сторінки позначають відповідними операторами, які називаються тегами. При одержанні Web-сторінки із сервера броузер аналізує її. Він знаходить у ній теги, що вказують, якого типу елемент треба відобразити, і виводить фрагмент Web-сторінки на екран.

Сукупність тегів і правил їх використання називається мовою HTML – мова розмітки гіпертексту.

Фрагмент (лат. fragmentum - уламок, шматок, скалка) - яка-небудь частина цілого.
Матеріа́л - речовина, або суміш речовин, первинний предмет праці, який використовують для виготовлення виробу (основний матеріал), або які сприяють якимось діям. У останньому випадку уточнюють, що це допоміжний, чи витратний матеріал.
HTML (англ. HyperText Markup Language - Мова розмітки гіпертекстових документів) - стандартна мова розмітки веб-сторінок в Інтернеті. Більшість веб-сторінок створюються за допомогою мови HTML (або XHTML).

Файл даних, фрагменти якого розмічені тегами мови HTML, називається HTML-документом.

Ім’я такого файла звичайно має розширення .htm чи .html. HTML-документ, поміщений на Web-сервер є Web-сторінкою, яка переглядається за допомогою Web-браузера. Тому, навчившись створювати HTML-документи, ми зможемо робити власні Web-сторінки.

HTML-документ складається з фрагментів тексту у вигляді ASCII-коду й тегів. Теги записуються символами ASII, які беруться в кутові дужки (знаки “<” менше та “>” більше). Таким чином, HTML-документ є звичайним ASII-файлом, і створювати його можна за допомогою найпростішого текстового редактора.

Веб-се́рвер (англ. Web Server) - це сервер, що приймає HTTP-запити від клієнтів, зазвичай веб-браузерів, видає їм HTTP-відповіді, зазвичай разом з HTML-сторінкою, зображенням, файлом, медіа-потоком або іншими даними.
Найпростіші (лат. Protozoa, від дав.-гр. πρῶτος «перший» і ζῷα, форми множини ζῷον - «жива істота») - парафілетична або поліфілетична група одноклітинних або колоніальних еукаріотів, які мають гетеротрофний тип живлення.
Си́мвол (англ. symbol символ) - знак, сутність, яка позначає іншу сутність.
Текстовий редактор - комп'ютерна програма-застосунок, призначена для створення й зміни текстових файлів (вставки, видалення та копіювання тексту, заміни змісту, сортування рядків), а також їх перегляду на моніторі, виводу на друк, пошуку фрагментів тексту тощо.

Наприклад, при використанні редактора Блокнот треба ввести вміст HTML-документа, а при збереженні вибрати команду ФайлСохранить. У вікні Сохранение, що відкрилося, встановити значення Все файлы в полі Тип файла, а в імені обов’язково вказати розширення .html.

Завдяки цьому файл буде відображатися у вигляді значка броузера, який встановлено на даному комп’ютері. Подвійне клацання на значку відкриває HTML - документ у браузері для перегляду. Наприклад, до поля імені файла можна ввести його назву index.html, як показано на малюнку.

b. Теги. Структура HTML - документа. Вище було сказано, що тег – це вказівка браузеру, як відображати фрагмент документа. Тег завжди починається символом “<” і закінчується символом “>”. Між цими символами вказується ім’я тега. В імені малі й великі літери не розрізняються.

Документа́ція - сукупність офіційно визнаних, взаємопов'язаних та складених у визначеній формі документів, які містять передбачувану інформацію про виріб, процес або діяльність даного підприємства. Відповідно до області застосування Документа́цій поділяється на бухгалтерську, конструкторську, нормативну, технічну, товарну, тощо.
Велика літера (заголовна буква) - термін у галузі поліграфічного оформлення і виконання видань та орфографії. Визначає розмір і форму літери.

Теги бувають двох видів – одинарні й парні.

Одинарний тег ставиться перед фрагментом тексту, яким він керує. Наприклад, запис <br> Зошит

означає, що слово „Зошит” відображається з нового рядка.

Парні теги складаються з двох частин – початкової та завершальної. Початкова частина вказує точку документа, з якої починається дія команди, а завершальна – точку її закінчення. Завершальна частина відрізняється від початкової наявністю символу „/” (похила риска) перед ім’ям команди. Наприклад, запис <b> Синій олівець b> означає, що текст „Синій олівець” відображається напівжирним шрифтом.

Найпростіша сторінка має такий вигляд. Текст можна набирати в блокноті так як показано на малюнку.




Якщо файл зберегти як показано вище, то даний текстовий документ можна відкрити за допомогою браузера.

Те́кстовий файл - форма подання послідовності символів у комп'ютері, де кожен символ із задіяного набору символів кодується одним байтом чи послідовністю двох, трьох і т. д. байтів. На відміну від терміна «текстовий формат», що характеризує вміст даних, термін «текстовий файл» стосується файлу та характеризує його як контейнер, який зберігає такі дані.
Найпростіша сторінка має такий вигляд:


Зверніть увагу, що текст який знаходиться між тегами (<title> Заголовок документа) надає назву вікну. Текст, таблиці, зображення, відео тощо потрібно прописувати між тегами .

У будь-якому місці HTML - документа можна помістити коментар. Це текст, який служить для пояснень розробника Web - сторінки та не відображається на екрані під час перегляду Web - сторінки у браузері. Текст коментарю поміщається в парний тег .
с. Форматування абзаців і символів. Щоб текст сторінки не відображався суцільним текстом, використовують такі одинарні теги:

- початок абзацу (текст після тега починається з нового абзацу);


- початок нового рядка (текст після тега починається з нового рядка);


- горизонтальна лінія (у рядку, де розміщено тег, відображається горизонтальна лінія).
Програміст, також програмник[Джерело?] - фахівець, що займається програмуванням, виконує розробку програмного забезпечення (в простіших випадках - окремих програм) для програмованих пристроїв, які, як правило містять один чи більше CPU.
Горизо́нт, або о́брій, виднокра́й, небокра́й, видноко́ло (від дав.-гр. ὁρίζων - «те, що обмежує») - уявна лінія торкання небосхилу і земної поверхні. Розрізняють видимий горизонт та істинний горизонт. Кут між площиною істинного горизонту і напрямком на видимий горизонт називають нахилом горизонту (синоніми: пониження горизонту, депресія горизонту).

При використанні тега

спочатку вставляється порожній рядок. Далі текст виводиться з початку нового рядка. Якщо вжито тег
, то порожній рядок не вставляється.

Перед деякими фрагментами тексту можуть розміщатися заголовки. Вони виділяються більшим шрифтом. HTML має теги для задання величини заголовків (шість рівнів). Найкрупнішим шрифтом виділяються заголовки першого рівня, а найдрібнішим – шостого.

Текст заголовка визначається парним тегом



, де n – номер рівня.

Наприклад, фрагмент HTML-документа



Ласкаво просимо!

відображається як заголовок першого рівня.

Абзаци й заголовки можна вирівнювати по центру, лівому чи правому краю. Для цього в імені команди в початковій частині тега вказується параметр ALIGN (вирівняти) й після знака «=» (дорівнює) одне з наступних значень:

CENTER – по центру;

LEFT – по лівому краю;

RIGHT – по правому краю.

Наприклад, фрагмент HTML-документа



Заходьте ще! Відображається як текст „Заходьте ще!”, який притиснуто до правого краю.

Якщо в тексті HTML - документа існують додаткові пробіли між словами, то при виводі в браузері вони можуть вилучатися. Щоб зберегти пробіли при відображенні, треба вказати парний тег

. Він позначає попередньо відформотований текст, тобто текст, що відображається шрифтом фіксованої ширини із збереженням усіх пробілів. Часто цей тег використовується для виведення тексту у вигляді таблиці.

Теги форматування символів

Тег

Призначення

текст

Напівжирний

текст

Курсив

текст

Підкреслений

d. Списки і таблиці. Якщо у Web - документі треба перераховувати дані, то їх виводять у вигляді списку. Найчастіше використовуються списки таких типів:


  • Ненумеровані (маркіровані) – відображаються у вигляді послідовності позначених елементів, позначаються тегом
    ;

  • Нумеровані – відображаються у вигляді списку, елементи якого мають послідовні номери, позначаються тегом
    ;

  • Словник визначень – відображається у вигляді термінів і їх визначень, позначається тегом
    .
    Озна́чення, ви́значення чи дефіні́ція (від лат. definitio) - роз'яснення чи витлумачення значення (сенсу) терміну чи поняття. Слід зауважити, що означення завжди стосується символів, оскільки тільки символи мають сенс що його покликане роз'яснити означення.


Перед кожним елементом ненумерованого й нумерованого списків вказується одинарний тег
  • . У списку типу словника визначень перед кожним терміном вказується одинарний тег
    , а перед його визначенням – тег
    .

    Початок і закінчення ненумерованого списку позначено парним тегом

    , а перед кожним елементом списку одинарний тег
  • (наприклад,
  • інформатика).
    Елеме́нт (лат. elementum - стихія, первинна речовина) - нерозкладний (у даній системі) компонент складних тіл, матеріальних систем, теоретичних побудов; будь-який об'єкт, пов'язаний певними відношеннями з іншими об'єктами в єдиний комплекс.
    Інформа́тика (рос. информатика, англ. informatics, information science; нім. Informatik f) - теоретична та прикладна (технічна, технологічна) дисципліна, що вивчає структуру і загальні властивості інформації, а також методи і (технічні) засоби її створення, перетворення, зберігання, передачі та використання в різних галузях людської діяльності.



    Словник визначень обмежено парним тегом
    . У ньому кожний термін починається одинарним тегом
    , а його пояснення – тегом
    . Наприклад, у словнику визначень використовується термін Інформатика та його визначення:

    Інформатика

    Мені подобається створювати додатки в Access

    4. Домашнє завдання. Вивчити конспект.



  • Скачати 57.59 Kb.

  • Мета
  • 1. Організація класу до занять. 2. Мотивація
  • 3. Вивчення нового матеріалу .
  • 4. Домашнє завдання. Вивчити конспект.