Основи HTML, мова гіпертекстової розмітки Hyper Text Markup Language. Мова розмітки гіпертекстових сторінок HTML

I. Основні відомості проHTML.

Останніми роками розробки для Інтернету еволюціонували від статичних сторінок до динамічних інформаційних систем. Нещодавно створення сучасних Web-сторінок не вимагало практично нічого, крім досконалого володіння мовою розмітки гіпертексту (Hypertext Markup Language, HTML).

HTMLє простою мовою обробки текстів; цією мовою за допомогою набору тегів (tags) створюється документ, який можна переглядати спеціальною програмою переглядуWeb (browser).

HTML - не мова програмування тому, як C++ чи Visual Basic; він більше нагадує засоби форматування документів із використанням керуючих послідовностей. Кодування на HTML часто порівнюють зі створенням документа у форматі Microsoft Word шляхом набивання кодів форматування безпосередньо в Notepad. Очевидно, що функціональність цього вкрай мала.

Під гіпертекстовим документомрозуміють документ, що містить посилання інший документ. Реалізовано все це через протокол передачі гіпертексту HTTP(Hyper Text Transfer Protocol).

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

Гіпертекстові документи створюються на базі мови HTML (Hyper Text Markup Language)Ця мова дуже проста, керуючі коди її, які, власне, і компілюються браузером для відображення на екрані, складаються з тексту ASCII. Посилання, списки, заголовки, картинки та форми називаються елементами мови HTML.

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

HTML дозволяє формувати різну гіпертекстову інформацію на основі структурованих документів.

Оглядач визначає сформовані посилання і через протокол передачі гіпертексту HTTP відкриває доступ до вашого документа іншим користувачам Internet. Зрозуміло, для успішної реалізації цього необхідний софт, повністю сумісний з WWW і підтримує HTML.

ІІ. Опис HTML

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

Гіпертекстова мова надає лише інформацію для читання. Це означає, що редагувати Web-сторінки може лише той, хто їх створив, а чи не простий користувач Мережі.

Самий головний елемент гіпертекстової мови- це посилання. У світовій мережі ви просто натискаєте на посилання і миттєво опиняєтеся в іншій точці земної кулі на вибраній вами сторінці.

Теги.

Тег- оформлена одиниця HTML-коду.

Тег HTML складається з наступних один за одним у певному порядку елементів:

  • лівої кутової дужки< (такого же, как "меньше чем" символа)
  • необов'язкового слеша /, який означає, що тег є кінцевим тегом, що закриває деяку структуру. Таким чином, у цьому контексті Ви можете читати символ /, як кінець...
  • імені тега, наприклад TITLE або PRE
  • необов'язкових, якщо навіть тег може мати їх, атрибутів. Тег може бути без атрибутів або супроводжуватися одним або декількома атрибутами, наприклад ALIGN=CENTER
  • правої кутової дужки > (такий самий, як символу "більше ніж").

Більшість тегів мають відкриваючий елемент<> і закриває. Між ними й перебувають коди, які розпізнає Web-браузер

У таких випадках два теги та частина документа, відокремлена ними, утворюють блок, званий HTML елементом. Деякі теги, наприклад


, є елементами HTML власними силами, і їм відповідний кінцевий тег неправильний.

Для кожного тега визначається безліч можливих атрибутів. Більшість тегів допускає один або кілька атрибутів, проте атрибутів може і не бути. Специфікація атрибутускладається з розташованих у наступному порядку:

  • імені атрибута, наприклад WIDTH
  • знак рівності (=)
  • значення атрибута, яке задається рядком символів, наприклад "80".

Завжди корисно укласти значення атрибуту в лапки, використовуючи або одинарні ("80"), або подвійні лапки ("80"). Рядок у лапках не повинен містити такі ж лапки всередині себе. Так, якщо дата укладена в подвійні лапки, використовуйте одинарні лапки для подальшого укладання в лапки, і навпаки. Ви також можете опустити лапки для значень атрибутів, які складаються лише з наступних символів:

  • символів англійського алфавіту (A – Z, a – z)
  • цифр (0 - 9)
  • проміжків часу
  • дефісів (-)

У 1989 році гіпертекст представляв нову багатообіцяючу технологію, яка мала відносно велику кількість реалізацій, з одного боку, а з іншого боку, робилися спроби побудувати формальні моделі гіпертекстових систем, які мали швидше описовий характер і були навіяні успіхом реляційного підходу до опису даних.

HTML – це мова гіпертекстової розмітки, яка використовується для кодування документів. Мова HTML є набором команд, відповідно до яких браузер відображає вміст документа, команди HTML не відображаються. У мові HTML реалізовано механізм гіпертекстових посилань, який забезпечує зв'язок одного документа з іншими. Ці документи можуть бути на тому ж сервері, що й сторінка, з якої на них робиться посилання, а можуть бути розміщені на іншому сервері.

Ідея HTML – приклад надзвичайно вдалого вирішення проблеми побудови гіпертекстової системи за допомогою спеціального засобу управління відображенням.

Найбільш ефективною формою організації гіпертексту було визнано контекстні гіпертекстові посилання, крім того, було визнано розподіл на посилання, асоційовані з усім документом загалом і з окремими його частинами.


Всі документи HTML мають ту саму структуру, що визначається фіксованим набором тегів структури. Документ HTML завжди повинен починатися з тега< HTML >і закінчуватися відповідним закриваючим тегом (). Усередині документа виділяються два основні розділи: розділ заголовків і тіло документа, що йдуть саме в такому порядку. Розділ заголовків містить інформацію, що описує документ в цілому, та обмежується тегами<НЕАD>і. Зокрема, розділ заголовків має містити загальний заголовок документа, обмежений парним тегом<ТITLE>.

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

< TITLE >Заголовок документа< /TITLE >

Текст документу

HTML елементи.

Для парних тегів область впливу визначається частиною документа між тегом, що відкриває і закриває. Така частина документа розглядається як елемент мови HTML. Так, можна говорити про «елемент BODY», що включає тег, основний зміст документа та закриваючий тег. Весь HTML документ. можна розглядати як "елемент HTML.". Для непарних тегів елемент збігається з тегом, що його визначає.

Більшість елементів мови HTML. описує частини змісту документа та поміщається між тегами . і, тобто внутрішньо структурного елемента BODY. Такі елементи ділять на блокові та текстові. Блокові елементи належать до частин тексту рівня абзацу. Текстові елементи описують властивості окремих фраз і ще більше дрібних частин тексту.

Тепер можна сформулювати правила вкладання елементів.

Елементи не повинні перетинатись. Іншими словами, якщо тег, що відкриває, розташовується всередині елемента, то і відповідний закриває тег повинен розташовуватися всередині цього ж елемента.

Блокові елементи можуть містити вкладені блокові та текстові елементи.

Текстові елементи можуть містити вкладені текстові елементи.

Текстові елементи не можуть містити вкладені блокові елементи.

Функціональні блокові елементи.

У більшості документів основними функціональними елементами є заголовки та абзаци. Мова HTML. підтримує шість рівнів заголовків. Вони задаються за допомогою парних тегів від<Н1>до<Н6>. При відображенні Web-документи ються за допомогою таким чином; тегом (документа на екрані комп'ютера ці елементи відображаються за допомогою шрифтів різного розміру).

Звичайні абзаци задаються за допомогою парного тега<Р>. Мова HTML. не містить засобів для створення абзацного відступу ("червоного рядка"), тому при відображенні на екрані комп'ютера абзаци розділяються порожнім рядком. Закриваючий тегсприймається як необов'язковий. Очевидно, що він стоїть перед тегом, який задає початок чергового абзацу документа. Наприклад:

Заголовок

<Р>Перший абзац<Р>Другий абзац

Заголовок другого рівня

Наслідком наявності спеціального тега, що визначає абзац, є той факт, що звичайного символу кінця рядка, що вводиться натисканням клавіші ENTER, для створення абзацного відступу недостатньо. Мова HTML. розглядає символи кінця рядка та прогалини особливим чином. Будь-яка послідовність; що складається тільки з пробілів та символів кінця рядка, при відображенні документа розглядається як одиночний пробіл. Це зокрема означає, що символ кінця рядка навіть не здійснює переходу на новий рядок (для цієї мети використовується текстовий елемент, що задається непарним тегом
.

Як обмежувач абзаців може також використовуватися горизонтальна лінійка. Цей елемент задається непарним тегом


. Під час відображення документа на екрані лінійка розділяє частини тексту один від одного. Її довжина та товщина задається атрибутами тега
.


Цей тег створює горизонтальну лінійку шириною 10 пікселів, що займає половину ширини вікна і розташовану праворуч.


Створення сайтів – одна з широко доступних можливостей сучасної Інтернет-індустрії. Власне створення сайтів у принципі не набагато складніше за створення особистих електронних скриньок та електронних візиток.

Для створення сайту насамперед необхідний сервер, підключений до Інтернету, на якому можна розмішати необхідні гіпертексти. Крім того, потрібна реєстрація імені сайга у провайдера, який обслуговує обраний сервер.

В Інтернеті можна знайти провайдерів, які пропонують безкоштовне відкриття сайтів на своїх серверах. Безкоштовні сайти можна відкрити на вітчизняних серверах narod.ru, boom.ru, hotmail.ru та на зарубіжних серверах, наприклад geocities.com, tripod.com.

На вказаних серверах можна зареєструвати доменні імена:

<имя>. narod.ru

ім'я>.boom.ru,

Приклади зареєстрованих доменних імен:

wdu.da.ru-сайт електронного університету;

wduniv.newmail.ru – сайт розподіленого університету.

Після реєстрації доменного імені сайту на ньому можна розміщувати гіпертексти. Розміщення гіпертекстів на сайті проводиться за допомогою спеціальних програм, що дозволяють створювати, редагувати, накопичувати та копіювати різні гіпертексти. Відразу після розміщення першої (головної) гіпертекстової сторінки її інформація може читатися за допомогою браузера в будь-якій країні з будь-якого комп'ютера, підключеного до Інтернету. Для цього у вікні браузера вказується адреса сайту в Інтернеті. Наприклад: http://bak.boom.ru

Усі файли повинні бути гіпертекстами, записаними у форматі HTML і мають ідентифікатори виду<имя>.html.

HTML – це мова розмітки гіпертекстів (hypertext markup language).

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

За допомогою зазначених засобів та програм в Інтернеті можуть бути створені найрізноманітніші інформаційні сайти та системи - особисті сайти, фірмові сайти, електронні газети, журнали, електронні книги, енциклопедії, а також електронні архіви та бібліотеки.

Різниця між сайтами полягає в обсязі інформації, їх структурі та процедурах оновлення. Загалом для сайтів в Інтернет, як і для будь-якої організації, можна говорити про життєві цикли їх створення, розвитку, модернізації та ліквідації.

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

Структура сайтів може бути найрізноманітнішою. Найпростіша структура – ​​це головна сторінка з посиланнями на набір текстів. Ці посилання можуть бути в тексті головної сторінки або виділятися в змісті на її початку.

Кожна сторінка сайту може бути забезпечена назвою, яка з'являється на верхньому рядку екрана під час завантаження сайту браузером.

Крім того, на головній сторінці сайту можна вказати список ключових слів для пошукових систем.

Пошукові системи щотижня переглядають усі сервери в мережі Інтернет і записують адреси всіх знайдених сайтів та гіпертекстів разом із виділеними в них ключовими словами. З цих причин не пізніше ніж через тиждень будь-яка інформація, опублікована в Інтернеті, може бути знайдена ключовими словами, що містяться в них.

HyperTextMarkupLanguage (HTML) - мова розмітки гіпертексту - призначена для написання гіпертекстових документів, що публікуються в WorldWideWeb.

Гіпертекстовий документ - це текстовий файл, що має спеціальні мітки, які називаються тегами, які згодом упізнаються браузером і використовуються ним для відображення вмісту файлу на екрані комп'ютера.

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

Структура HTML-документа

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

HTML-документ складається з двох частин: заголовок (head) та тіла (body), розташованих у наступному порядку:

Заголовок документа

Тіло документа

Найчастіше в заголовок документа включають парний тег ... , Що визначає назву документа Багато програм перегляду використовують його як заголовок вікна, в якому виводять документ. Програми, що індексують документи в Інтернеті, використовують назву для ідентифікації сторінки. Хороша назва має бути досить довгою для того, щоб можна було коректно вказати відповідну сторінку, і в той же час вона повинна бути розміщена в заголовку вікна. Назва документа вписується між тегами, що відкривають і закривають.

Тіло документа є обов'язковим елементом, тому що в ньому міститься весь матеріал документа. Тіло документа розміщується між тегами і

. Все, що розміщено між цими тегами, інтерпретується браузером відповідно до правил мови HTML, що дозволяють коректно відображати сторінку на екрані монітора.

Текст HTML розділяється на абзаци за допомогою тега<р>. Він розміщується на початку кожного абзацу, і програма перегляду, зустрічаючи його, відокремлює абзаци один від одного порожнім рядком. Використання тега, що закриваєне обов'язково.

Якщо потрібно розірвати текст, перенісши його залишок на новий рядок, при цьому, не виділяючи нового абзацу, використовується тег розриву рядка
. Він змушує програму перегляду виводити символи, що стоять після нього, з нового рядка. На відміну від тега абзацу, тег
не додає пустий рядок. Цей тег не має парного тега, що закриває.

Мова HTML підтримує логічне і фізичне форматування вмісту документа. Логічне форматування вказує призначення цього фрагмента тексту, а фізичне форматування задає його зовнішній вигляд.

У разі використання логічного форматування тексту браузером виділяються різні частини тексту відповідно до структури документа. Щоб відобразити назву, використовується один із тегів заголовка. Заголовки у типовому документі поділяються за рівнями. Мова HTML дозволяє задати шість рівнів заголовків: h1 (заголовок першого рівня), h2, h3, h4, h5 та h6. Заголовок першого рівня зазвичай має більший розмір і насиченість порівняно з заголовком другого рівня. Приклад використання тегів заголовків:

l. Назва глави

l.l. Назва розділу

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

Тег вставляє зображення в документ, якби воно було одним великим символом. Приклад застосування тега:

Для створення гіпертекстового посилання використовується пара тегів<а>... . Фрагмент тексту, зображення або інший об'єкт, розташований між цими тегами, відображається у вікні браузера як гіпертекстове посилання. Активація такого об'єкта призводить до завантаження у вікно браузера нового документа або відображення іншої частини поточної Web-сторінки. Гіпертекстове посилання формується за допомогою виразу:

Href тут є обов'язковим атрибутом, значення якого є URL-адреса запитуваного ресурсу. Лапки у заданні значення атрибуту href не є обов'язковими. Якщо задається посилання на документ на іншому сервері, то вид гіперпосилання такий:

<а href = "http://www.school.donetsk.ua/11.jpg">Світлина 11-А

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

Ми випустили нову книгу «Контент-маркетинг у соціальних мережах: Як засісти в голову передплатників та закохати їх у свій бренд».

Підписатися

НTML – це мова гіпертекстової розмітки.

Мова використовується для організації веб-сторінок. Проведемо аналогію. Ви купуєте газету. У ній надруковано кілька статей. Кожна стаття має назву, в ній є фотографії. А текст набирається кількома шпальтами. Це – структура газетної сторінки.

На сайті все відбувається так само. Щоб зробити правильну структуру статті – контенту – потрібно використовувати мову розмітки тексту.

Для чого потрібний HTML

Мова HTML потрібна, щоб повідомити браузеру, як потрібно відобразити сторінку на екрані.

Мова поширена повсюдно. Це універсальний засіб для оформлення контенту на сторінці. Його використання можливе у будь-якому браузері. Якщо писати код мовою програмування - потрібно знати якісь особливості, оператори, типи даних тощо.

HTML складається з набору тегів - команд та атрибутів - властивостей. Їх легко запам'ятати, і завжди можна знайти довідкові матеріали.

Що таке HTML-код

Код – це команди браузеру, як слід відобразити сторінку. Є структура, яка має дотримуватися завжди. Наприклад, наявність тільки одного заголовка H1 на сторінці, основна інформація міститься в розділі і т.д.

У мові є три інструменти.

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

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

Структура HTML-коду на сторінці

Ми говорили, що структура у будь-якого html-документа завжди одна й та сама. Далі перерахуємо обов'язкові елементи.

  1. !- Вказує, що у документі використовується HTML.
  2. ...- у цей тег міститься весь код сторінки. Все, що в ньому не вміщено, не розпізнається браузером і не відображається.
  3. ...- парний тег, в нього міститься технічна інформація, наприклад, про кодування документа.
    1. ...- це заголовок сторінки, він міститься всередині розділу head. Будь-яка сторінка повинна мати свою унікальну назву.
    2. - Це службова інформація. Вона підключає до сторінки окремі стилі - css і т.д. Не відображається користувачеві.
  4. ...

    - Тіло сторінки. Вся основна інформація полягає у цьому тегу.
    1. ...- гіперпосилання.
    2. - Зображення.
    3. ...- Жирний текст.
    4. ...- Курсив.

Елементів всередині body може бути необмежену кількість.

Наприклад, ось так виглядає частина коду сторінки одного із записів нашого блогу.

Що частіше використовувати теги, то швидше вони запам'ятовуються. Завжди можна знайти довідник із усіма тегами, атрибутами та їх значеннями.

МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ

СХІДНОУКРАЇНСЬКИЙ НАЦІОНАЛЬНИЙ УНІВЕРСИТЕТ

імені Володимира Даля

Кафедра комп'ютерних наук

З дисципліни

Комп'ютерний дизайн та мультимедія

Студент Болдакова І.В.

1. Вступ

3.1 HTML-редактори

4. Створення сайту за допомогою CMS Joomla 1.5.7

Література

1. Вступ

World Wide Web – глобальна комп'ютерна мережа на сьогоднішній день містить мільйони сайтів, на яких розміщена різноманітна інформація. Люди отримують доступом до цієї інформації у вигляді використання технології Internet. Для навігації в WWW використовуються спеціальні програми - Web-браузери, які суттєво полегшують подорож безкрайніми просторами WWW. Вся інформація в Web-браузері відображається у вигляді Web-сторінок.

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

Користувачеві приємно відвідувати ті Web-сторінки, які мають стильне оформлення, не обтяжені надмірно графікою та анімацією, швидко завантажуються та правильно відображаються у вікні Web-браузера.

Створити Web-сторінку непросто, але, напевно, кожна людина хотіла б спробувати себе в ролі дизайнера. І я, в даному випадку, не виняток, тому й обрала таку тему для своєї курсової роботи.

У своєму рефераті я зробила спробу розібратися в тому, що необхідно знати та вміти для створення Web-сторінки, яке програмне забезпечення є інструментом створення Web-сторінок і як його ефективно використовувати.

Також у цій роботі мною розглянуті основи мови програмування Web-сторінок - HTML, що є загальноприйнятим стандартом WWW. Це дасть нам можливість ознайомитися зі структурою Web-сторінки та прийомами її правильного оформлення. А за допомогою CMS Joomla ми розглянемо створення сайту.

2. Розглянемо мову гіпертекстової розмітки HTML

Web-сторінки можуть існувати в будь-якому форматі, але як стандарт прийнятий Hyper Text Markup Language- мова розмітки гіпертекстів, призначена для створення форматованого тексту, насиченого зображеннями, звуком, анімацією, відеокліпами та гіпертекстовими посиланнями на інші документи.

Можна працювати на Web без знання мови HTML, оскільки тексти HTML можуть створюватися різними спеціальними редакторами та конвертерами. Але писати безпосередньо на HTML неважко. Можливо, це навіть легше, ніж вивчати HTML-редактор або конвертер, які часто обмежені у своїх можливостях, містять помилки або проводять поганий HTML-код, який не працює на різних платформах.

Мова HTML існує у кількох варіантах і продовжує розвиватися, але конструкції HTML швидше за все будуть використовуватись і надалі. Вивчаючи HTML і пізнаючи його глибше, створюючи документ на початку вивчення HTML і розширюючи його наскільки це можливо, ми маємо можливість створювати Web-сторінки, які можна переглянути багатьма браузерами Web, як, і у майбутньому. Це не виключає можливості використання інших методів, наприклад, метод розширених можливостей, який надається Opera, Google Chrome, Internet Explorer або іншими браузерами.

Робота з HTML - це спосіб засвоїти особливості створення документів у стандартизованій мові, використовуючи розширення тільки якщо це дійсно необхідно.

HTML було ратифіковано World Wide Web Consortium. Він підтримується усіма браузерами.

Оскільки HTML-документи записуються в ASCI I-форматі, то для її створення може бути використаний будь-який текстовий редактор.

Зазвичай HTML-документ - це файл із розширенням.html або. htm, у якому текст розмічений HTML-тегами (англ. tag - спеціальні вбудовані вказівки). Засобами HTML задаються синтаксис та розміщення тегів, відповідно до яких браузер відображає вміст веб-документа. Текст самих тегів Веб-браузером не відображається.

Усі теги починаються символом "<" и заканчиваются символом ">". Зазвичай є пара тегів - стартовий (відкриваючий) і завершальний (закриваючий) тег (схоже на дужки, що відкриваються і закриваються в математиці), між якими міститься інформація, що розмічується:

Інформація

Тут стартовим тегом є тег

А завершальним –

. Завершальний тег відрізнятиметься від стартового лише тим, що в нього перед текстом у дужках<>стоїть символ " / (Слеш).

Браузер, який читає HTML-документ, відображає його у вікні, використовуючи структуру HTML-тегів. У кожному HTML-документі повинні бути присутні три головні частини:

A) Оголошення HTML;

B) Заголовна частина;

C) Тіло документа .

A) Оголошення HTML

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

B) Заголовна частина.

і. Між цими тегами міститься інформація про документ (назва, ключові слова для пошуку, опис тощо). Однак найбільш важливою є назва документа, яку ми бачимо у верхньому рядку вікна браузера та у списках "Вибране (BookMark)". Спеціальні програми-спайдери пошукових систем використовують назву документа для побудови баз даних. Для того, щоб дати назву своєму HTML-документу, текст поміщається між тегами. і.

Моя перша сторінка

C) Тіло документа.

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

Моя перша сторінка ..........

Тепер ми можемо написати HTML-код нашої сторінки:

Моя перша сторінка Тут будуть мої сторінки!

У розділі BODY усі символи табуляції та кінця рядків браузером ігноруються та ніяк не впливають на відображення сторінки. Тому переклад рядка у вихідному тексті HTML-документа не призведе до початку нового рядка у тексті, що відображається оглядачем за відсутності спеціальних тегів. Це правило дуже важливо пам'ятати і не забувати ставити розділяючі рядки теги, інакше текст не матиме абзаців, і він стане нечитаним.

Для початку нового рядка використовується тег
(скор. від англ. break – перервати). Цей тег призводить до відображення браузером подальшого тексту з початку наступного рядка. Тег, що закриває для нього, не використовується. Він зручний, якщо потрібно з якогось місця писати з нового рядка без початку нового абзацу, наприклад, у вірші. Повторне його використання дозволяє вставити один або кілька порожніх рядків, відсунувши наступний фрагмент сторінки вниз.

Суцільний текст без проміжків читається не дуже легко, його незручно переглядати та знаходити потрібні місця. Розбитий на абзаци текст сприймається набагато швидше. Для початку нового абзацу використовується тег

(англ. paragraph – абзац). Цей тег, крім початку нового рядка, вставляє один порожній рядок. Але багаторазове повторення

На відміну від
, не призведе до появи кількох порожніх рядків, залишиться той самий порожній рядок.

Усередині дужок тега, крім його назви, можуть розміщуватися також атрибути (англ. atributes - атрибути). Вони відокремлюються від назви і між собою пробілами (одним або декількома), а пишуться у вигляді ім'я_атрибута ="значенняЯкщо значення не містить пробілів, то лапки можуть бути опущені, але так робити не рекомендується.

Може містити атрибут ALIGN, що визначає вирівнювання абзацу. За промовчанням абзац вирівняно ліворуч ALIGN="left". Можливі також вирівнювання вправо ALIGN="right" та по центру ALIGN="center". При використанні атрибутів, після форматованого тексту слід використовувати тег, що закриває

. Якщо його немає, то новий тег

означає закриття попереднього, відповідно вкладені

Неможливі. Вирівняти текст по центру можна також тегом

.

Тепер ми можемо помістити на нашу Web-сторінку певний текст із різним вирівнюванням:

Моя перша сторінка

Тут будуть мої особисті сторінки!

На них Ви зможете знайти: - розповідь про мене та про мої захоплення; - мої фотографії.

З однієї з моїх сторінок можна буде
надіслати мені електронного листа.

3. Інструментарій для створення Web-сторінок

3.1 HTML-редактори

Кожен вибирає свій інструмент для створення веб-сторінок. Це може бути MS FrontPage або Macromedia DreamWeaver, Allaire HomeSite або 1st Page. А хтось користується простим текстовим редактором, наприклад, Блокнотом (Notepad).

Текстові редактори можна використовувати тільки для створення невеликих сторінок, так як у них є багато мінусів: не підтримуються проекти, відсутня "підсвічування" тексту. Загалом працювати вкрай незручно.

Основним недоліком MS FrontPage є те, що він генерує дуже великий HTML-код (занадто багато зайвого), тому сторінки виходять більшими, що позначається на швидкості завантаження. Більше того, при створенні Web-сторінок у цьому редакторі бачиш одне, а у вікні браузера зовсім інше. Сторінки виходять якимись кривими, тому для створення якісних Web-сторінок рекомендується використовувати пакети, які будуть розглянуті нижче.

Почнемо ми із популярного Macromedia DreamWeaver. Компанія Macromedia вважається лідером у виробництві програм для створення веб-сайтів, а також законодавцем моди в цій галузі.