(З прикладами)
Обов'язкова структура документаПочнемо з найпростішого HTML документа, що містить тільки простий текст Hello world. У HTML файлі вмісту обов'язково повинен передувати розділ HEAD, який мінімально може складатися з двох конструкцій. Тоді код HTML можна представити так:
Приклад hello.html:
Hello Hello worldНасправді ж, в точності, цей документ має наступну структуру:
Приклад hello2.html:
Hello Hello worldТобто, за винятком першого рядка, весь файл є HTML елемент який містить HEAD елемент, (що включає TITLE елемент) і BODY елемент, з простим текстом в якості вмісту.
Таким чином, при відсутності тегів HTML, HEAD, і TITLE броузер сам вставить їх у потрібні місця. Тому Ваш документ завжди буде містити HEAD і BODY.
Рекомендована структура документаНа додаток до обов'язкової структурі настійно рекомендується вставляти різні структурні деталі. Існують спеціальні рекомендації на різних сайтах, і Ви повинні уважно вивчити відповідні документи.
Тут же ми просто підкреслимо, що кожен HTML документ повинен містити основну інформацію про його походження. Приватні рекомендації можуть уточнити в деталях форму подання цієї інформації.
Якщо Ви прагнете до того, щоб люди відшукали Ваш документ за відповідними зв'язків, важливість надання інформації про його походження стає очевидною. Коли користувач знайде Ваш документ за допомогою, наприклад, пошукового ресурсу AltaVista, він, найімовірніше, захоче дізнатися, до якого виду належить документ. Тому кожен файл HTML повинен надавати саму основну інформацію (або зв'язку до інформації) про його походження і природу. Наприклад, у зборах кнігоподобних документів, розділених на малі файли, кожен файл повинен містити, принаймні, зв'язок до "першій сторінці" "книги" (Home page).
Про походження документа повинна бути представлена, принаймні, наступна інформація:
Автор документа, що має унікальне ім'я. При цьому повинна бути задана зв'язок з домашньою сторінкою автора. Якщо у документа декілька авторів, визначте їх усіх, а також роль кожного з них, наприклад, провідного автора, редактора, чинного спонсора, а також осіб, формально відповідають за документ. Дата створення документа або його останньої модифікації, або і та і інша. Запропонована дата повинна бути зрозуміла у всьому світі; зокрема, назва місяця краще писати словом, а не цифрою. Контекст документа і його статус, наприклад: частина офіційної документації компанії про один з її продуктів, або частину особистої інформації про хобі автора, або щось інше. Адреса (URL) документа. Така інформація часто надмірна, однак вона може бути дуже корисною, коли комусь потрібна копія саме того документа, який він знайшов. Краще не покладатися на броузер (і користувача), додають таку інформацію, коли зроблена копія документа.Наступний приклад представляє один із способів заповнення такої інформації. Вивчіть підходящі для названих цілей приватні рекомендації, перш ніж адаптувати їх або ж подивіться інший заслуговує уваги стиль.
Приклад skel.html:
A sample HTML documentA sample HTML documentThis is a sample HTML document examplifying a suggested way of divsenting basic origin information. Jukka Korpela, Jukka.Korpela @ hut.fi
This document belongs to the context ofLearning HTML 3.2 by .. / .. / examples
The URL for this document ishttp: / / www.hut.fi/ ~ jkorpela/HTML3.2/skel.html
Created: December 5, 1996 Інформація про документ - розділ HEAD
Як вже згадувалося, є дві обов'язкові структури в HTML 3.2, і вони повинні бути написані в наступному порядку:
структура(У якій Ви теоретично повинні мати фрагмент HTML 3.2 Final замість HTML 3.2)
елемент TITLE, наприклад Introduction to General AbsurdityБільшість броузерів не помітить, якщо Ви опустіть це, але цього вимагають специфікації HTML 3.2. Також є й більш важлива причина для того, щоб включити їх:
! DOCTYPE - оголошення, яке є визначенням типу документа (document type definition - DTD) в метамови SGML, і яке при обробці документа зрозуміло типовому броузеру SGML. Більш того, завдання версії HTML, використане в документі, корисно вивчають код HTML, і, нарешті, це також може бути необхідно броузерам і редакторам WWW. Назва документа в елементі TITLE функціонально використовується броузерами та іншими програмами. Воно зазвичай виводиться на екран у гарячому списку, служить повертається засобом пошуку і т.д.Формально елемент TITLE є (принаймні, якщо слідувати цьому буквально) частиною елемента HEAD, тоді як оголошення! DOCTYPE передує всім конструкціям HTML.
Необов'язково, але елемент HEAD може містити такі елементи на додаток до елемента TITLE:
елемент ISINDEX (все ще рідко використовується) елемент BASE, що задає точний базовий адресу посилань на URL елемент META, що дає різну метаінформацію, наприклад дату закінчення терміну документа елемент LINK, який також задає метаінформацію, але вже про зв'язки документа з іншими документами елементи STYLE і SCRIPT . Очікується, що в майбутньому це будуть дуже важливі елементи, але зараз вони ще не використовуються (так як стандартизація знаходиться в стадії розвитку). Організація змісту - заголовки (headings), абзаци (paragraphs), списки (lists) і т.п.Як правило, Ваш документ складається з частин, які, у свою чергу, теж діляться на частини і т.д. У HTML такий поділ робиться з використанням заголовків різного рівня. Частини самого нижнього рівня в цій ієрархії складаються з одного або декількох абзаців. На додаток до простих абзаців і деяким спеціальним видам абзаців HTML 3.2 підтримує списки і таблиці, які можна уявити, як подібні абзаців. Внутрішня структура абзаців і подібних до них елементів складається з тегів текстового рівня, які ми наводимо далі.
Теги для вираження головних структурних особливостей, так звані теги блокового рівня, є наступними:
заголовки різних рівнів: H1, H2, H3, H4, H5, H6 теги рівня абзацу: простий абзац: P цитування, що представляється як окремий абзац: BLOCKQUOTE адресу автора інформації - окремий абзац: ADDRESS елемент, який зберігає компонування рядків і прогалин попередньо відформатованого тексту, PRE списки: простий невпорядкований список: UL, LI стислий список, що розміщуються одним рядком образів: MENU, LI список малих образів: DIR, LI упорядкований список: OL, LI дефінітивний список (список міток): DL, DT, DD таблиці: TABLE, CAPTION, TR, TH, TD роздільники документа на частини, які можуть мати властивості своєї власної компонування (наприклад, центрування): DIV, CENTER зміна теми: HR наповнення форм: FORM, ISINDEX.Рекомендований підхід для написання HTML документа:
Записати заголовок для всього документа і для нього використовувати H1 елемент з атрибутом ALIGN = CENTER. Розділити документ на головні частини, записати відповідні назви для них, використовуючи H1 з ALIGN = LEFT. При цьому і в подальшому намагайтеся уникати поділу на більш, ніж сім частин. Якщо необхідно, розділіть головну частину на менші частини із заголовками H2, і, якщо необхідно, розділіть кожну з цих подчастей на частині рівня нижче цього із заголовками H3. Уникайте використання заголовків H4 і, особливо, заголовків H5 і H6, так як вони виводяться на екран маленьким шрифтом, від чого документ стає складним для розуміння. (Якщо Ви все-таки хочете використовувати H4, спробуйте розділити документ на ще менші частини.) Якщо у Вас є розділ, скажімо, із заголовком H2 включає заголовки H3, уникайте вставки тексту між заголовком H2 і першим заголовком H3. Вставка такого тексту може бути допустима, якщо тільки він містить дуже короткі статті, такі як: загальна орієнтовна інформація, деякі позначки про розподіл або девіз. Довгий "бездомний" текст створює незручність для читача, який не знаємо Ваших намірів. Тому використовуйте підрозділи із заголовками відповідного рівня і з текстом типу "Вступні зауваження", "Загальне" або "Підсумки". Розділіть менші частини вищезгаданої структури на абзаци або подібні абзаців блоки (іменовані списки або таблиці), як описано нижче. Зауважте, що в HTML Ви повинні точно позначити поділ на абзаци елементами HTML: появи порожнього рядка не змусить параграф перерватися. У межах абзацу використовуйте елементи текстового рівня, нормальну розмітку фраз, щоб відрізняти спеціальні текстові сегменти від звичайного тексту, наприклад, помістіть в лапки виведений комп'ютером текст або підкресліть ключові слова. Додайте зв'язку і, якщо це потрібно, зображення або інший ілюстративний матеріал.Що стосується рівня абзаців, тут є багато варіантів. Нижче наводимо кілька практичних порад для вибору відповідного варіанту:
Для абзаців звичайного тексту використовуйте елемент P. Якщо текст в абзаці взято з деякого джерела, що поміщена в лапки цитата, використовуйте елемент BLOCKQUOTE або, якщо це програмний код, комп'ютерний лістинг (висновок) або деякий інший текст, для якого не підходить просте відділення його порожніми рядками, використовуйте елемент PRE. В останньому випадку, якщо шрифт одного типу не підходить (наприклад, для поетичного тексту), використовуйте BLOCKQUOTE і додайте елемент BR до кожного рядка. В особливому випадку, коли абзац представляє інформацію про автора (тобто - про Вас), використовуйте елемент ADDRESS. Для наповненою образами інформації, яка логічно складається з окремих видів образів, використовуйте різні елементи. Наприклад,: Для спіcкових образів, де порядок не важливий, наприклад, список інгредієнтів у рецепті, використовуйте елемент UL, або елемент MENU (для списку малих образів), або елемент DIR (для великого списку малих образів, придатного для подання до многостолбцовом форматі) . Для подання списку малих образів можна використовувати також інші можливості. Для списків образів, де важливий порядок і його необхідно точно реалізувати, і таких, як послідовність команд, яка повинна суворо дотримуватися, використовуйте елемент OL. Для списку образів з короткими назвами або тегами, наприклад, список визначень термінів або скорочень, використовуйте елемент DL. Однак, як варіант можна розглянути використання елемента TABLE для подання дефінітивних списків.Зауважимо, що зазвичай представлення образів з використанням елементів MENU і DIR подібно поданням UL елементів. Також варто враховувати, що подання за допомогою елемента DL може бути дуже незручним. Тому перегляньте, будь ласка, окремий файл Приклади різних списковий елементів в HTML, щоб вибрати яке уявлення списків буде кращим у Вашому додатку.
Елементи UL, MENU, DIR, OL і DL - формують прості списки й не мають таких структурних особливостей, як CAPTION в елементі TABLE. Тому бажано мати певний тип заголовка або пояснення перед списком, оформлене у вигляді окремого абзацу.
Для табульований інформації використовуйте звичайний елемент TABLE, однак для окремих випадків розгляньте можливості, що надаються елементами PRE і DL.Зауважимо, що елемент абзацу P не може бути вкладеним, тобто Ви не можете використовувати елемент P для створення подабзаца. Але різні Спискові елементи ефективно реалізують наповнену образами структуру, яка по суті відповідає подабзацному поділу. Більш того, Спискові елементи можуть бути вкладеними.
Розмітка тексту - виділення шрифту, цитування, код і т.п. Логічна розмітка у порівнянні з фізичноюІснує два головних класу текстової розмітки: логічна і фізична. Логічна розмітка показує роль текстового сегмента, наприклад, велике значення в порівнянні зі звичайним текстом або те, що даний сегмент є цитатою. Фізична розмітка пов'язана з поданням тексту в спеціальній манері, наприклад, з використанням шрифтів або спеціального виду підкреслення.
Перевага повинна віддаватися логічної розмітки. Використовуйте фізичну розмітку тільки, якщо це дійсно відповідає вимогам представлення тексту. Наприклад, для сильного виділення використовуйте елемент STRONG, а не B, в припущенні, що різні Web броузери реалізують підкреслення кращим чином для того оточення, в якому вони встановлені.
Таблиця стилів також буде корисна для використання. Наприклад, комусь захочеться все програмні коди представляти на жовтому фоні і великим шрифтом, в той час як хтось інший вважатиме за краще зовсім інші методи для виділення їх у звичайному тексті. Такі операції будуть виконуватися багато простіше, якщо постійно буде використовуватися логічна розмітка.
На додаток до більшої гнучкості при поданні тексту різними броузерами логічна розмітка має таке перевагу в порівнянні з фізичної: все більша кількість комп'ютерних програм отримують інформацію з HTML документів для різних цілей. Для такої роботи краще мати "індикатори" логічної розмітки, що виділяють, наприклад, певний текст, як більш важливий, або цитовані розділи.
Як логічна, так і фізична розмітки робляться з використанням елементів HTML з початковим і кінцевим тегами. Елементи розмітки не повинні перекриватися. Наприклад, наступний запис буде помилкою:
This has some bold and italic text.З іншого боку, елементи розмітки можуть бути вкладеними. Краще відобразити подібні структури наступним чином:
Приклад nest.html:
This is italic text which contains underlined text within in whereas this is normal underlined text.Агенти з обмеженим набором шрифтів можуть мати труднощі у поданні розмітки тексту.
Елементи фрази (логічна розмітка тексту)Для виделеніятекста існує два фразових елемента - EM і STRONG, де STRONG використовується для більш сильного виділення.
Уникайте виділення занадто великих частин тексту, так як підкреслюючи всі, Ви не підкреслюєте нічого! (Увійшовши в приказку студент, який підкреслює всі у своїй книзі, не розуміє самої ідеї підкреслення.)
На жаль, не існує "де-виділяє" елемента фрази, що позначає менш важливий текст. Якщо Вам дійсно це необхідно, можна використовувати елемент SMALL. Однак, якщо менш важливий текст об'ємний, краще його винести в окремий документ, зв'язок з яким вказати в головному документі. Особа, яка послідує за такими зв'язків, зацікавившись текстом, ймовірно, краще побачити нормальний текст, і тому немає необхідності в якому-небудь "де-підкресленні"
Елемент DFN також може розглядатися, як спеціальний вид підкреслення, проте, логічно він позначає, що цей термін має визначення. Це, в принципі, дуже корисний елемент, однак, на жаль багато броузери, включаючи Netscape, підтримують його не ефективно.
Елемент VAR показує, що частина тексту (зазвичай слово) є змінною, тобто текстом, який може бути замінений різними виразами.
Наступні фразові елементи задають різні види посилань та цитування:
| CITE | цитування (назва книги, чи статті, або - еквівалент) |
| CODE | код програми або - еквівалент (наприклад, HTML) |
| SAMP | сервісні повідомлення комп'ютера (висновок з програми, скрипти, команди і т.п.) |
| KBD | текст, який повинен друкуватися на клавіатурі користувача; зазвичай використовується для інструкцій. |
Дивіться також зауваження та приклади з питань відображення розмітки.
Шрифтові елементи (font elements) - фізична розмітка текстуШрифтові елементи це:
| TT | "Телетайпних" текст, тобто текст одного розміру |
| I | курсив |
| B | виділення |
| U | підкреслення |
| STRIKE | закреслений текст |
| BIG | великий шрифт |
| SMALL | малий шрифт |
| SUB | підрядковий текст |
| SUP | надрядковий текст. |
Зауважимо: SUB і SUP можуть бути віднесені до розмітки фразового рівня, як згадувалося вище; SMALL може бути використаний для де-підкреслення.
Елементи FONT і BASEFONT пропонують багато можливостей для завдання розмірів шрифту в порівнянні з BIG і SMALL. Проте уникайте надмірного використання фізичної розмітки.
Відображення розміткиУ Вас може з'явитися бажання поглянути на окремий файл, щоб отримати візуальне уявлення про різні елементах розмітки на Вашому броузері. Однак не думайте, що відображення, яке Ви побачите, є універсальним або вірним.
Наприклад, деякі броузери (візьмемо Internet Explorer) відображають TT (і CODE) як шрифт, значно менший, ніж звичайний текст, і ця диспропорція зберігається, коли змінюються розміри шрифту. Більш того, Internet Explorer відтворює VAR як моно (monospaced) шрифт, в той час як більшість графічних броузерів використовує курсив (italic). З іншого боку, в Netscape, розміри шрифту можна спеціально встановлювати, а за умовчанням для TT і VAR використовуються одні і ті ж шрифти, проте "одні й ті ж" означає технічний розмір в точках - на практиці Шрифт фіксованої ширини виглядають більше, ніж нормальний пропорційний шрифт!
Таким чином, уникайте зв'язуватися з розмірами шрифту; використовуйте фразова розмітку та інші структурні елементи і дозвольте користувачам, якщо їм не подобаються розміри шрифту в Вашому тексті, визначати шрифти в їх власних броузерах як їм подобається.
У наступній таблиці зроблена спроба дати уявлення про діапазон можливостей браузерів. Вона являє відображення елементів розмітки в Netscape Navigator, Microsoft Internet Explorer і Lynx. Зауважимо, що існують варіації навіть у межах кожної з цих програм - залежно від версії, платформи, конфігурації системи або власної користувача конфігурації, - такий розкид відповідає дійсності. Таким чином, дані таблиці можуть бути, але не обов'язково мають місце в дійсності.
| елемент | Netscape | Internet Explorer | Lynx |
| EM | курсив | курсив | підкреслений |
| DFN | звичайний текст | курсив | звичайний (однорозмірних) |
| CODE | однорозмірних | малий однорозмірних | звичайний (однорозмірних) |
| SAMP | однорозмірних | малий однорозмірних | звичайний (однорозмірних) |
| KBD | однорозмірних | малий однорозмірних | звичайний (однорозмірних) |
| VAR | курсив | малий однорозмірних | звичайний (однорозмірних) |
| CITE | курсив | курсив | підкреслений |
| TT | однорозмірних | малий однорозмірних | звичайний (однорозмірних) |
| I | курсив | курсив | підкреслений |
| B | посилений | посилений | підкреслений |
| U | звичайний текст | підкреслений | підкреслений |
| STRIKE | закреслення | закреслення | текст між [DEL: і: DEL] |
| BIG | більший, ніж звичайний | більший, ніж звичайний | звичайний текст |
| SMALL | менший, ніж звичайний | трохи менший, ніж звичайний | звичайний текст |
| SUB | опущений, трохи менший | опущений | звичайний текст |
| SUP | піднятий, трохи більший | піднятий | звичайний текст |
Дані таблиці відносяться до невложенним елементам. Вкладеність текстових елементів може підвищити наочність відображення.
Представлення взаємодії з комп'ютеромДля представлення взаємодії людини з комп'ютером на текстової чи іншій основі можуть використовуватися такі підходи:
комп'ютерний висновок (підказки, звичайний висновок або повідомлення про помилки) в межах SAMP елементів загальні терміни, що описують введення користувача - всередині VAR елементів дійсний для користувача введення в межах KBD елементів цитований комп'ютерний програмний код (джерело), що реалізовується в межах CODE елементів.У всіх підходах повинні братися до уваги принципи поділу в межах рядка і використання пропусків і символів табуляції, що може вимагати вставки BR елементів або використання PRE елементів. Зауважимо, що логічна розмітка дозволена в PRE елементах (хоча це, можливо, не найкраще її використання).
Наступний приклад ілюструє підхід у контексті запровадження в мову програмування Perl.
Приклад interact.html:
The following Perl script prints out its input so that each line begins with a running line number:
#! / Usr / bin / perl $ line = 1; while (& amplt & ampgt) {print $ line + +, "", $ _;}The scalar variable $ line is of course the line counter.
The loop construct is of the form
while (& amplt & ampgt) {
process one line of input}
Assuming that you have written this script (the simpler version of it) into a file named lines, you could test it using a command of the form
. / Lines datafile
In particular, using the script as input to itself, you would do as follows (the details of system output vary from one system to another):
Зауваження наприклад:
тут не використовувалася вкладеність текстових розміток. програмний код міг би бути представлений тільки в межах PRE елемента без додаткового використання всередині ще й CODE елемента, однак те, що код вкладений в CODE елемент, який в свою чергу вкладений всередину PRE елемента, не завдасть шкоди і може бути навіть корисно в броузерах, які для різних цілей використовують Шрифт фіксованої ширини. аналогічно, використання SAMP і KBD в наведеному прикладі може означати, що введення користувача представляється відмінно від комп'ютерного виводу. Використовуючи таблицю стилів, Ви могли б навіть специфікувати шрифт, колір, фон та інші властивості для цих логічно різних елементів. Управління розміщеннямПо-перше, сформуйте правильну структуру Вашого документа. Потім, якщо необхідно, перегляньте розміщення документа. Врахуйте, що різні броузери використовують різні розміщення, і навіть одні й ті ж броузери можуть показувати одні й ті ж документи по-різному в різних середовищах. Наприклад, коли користувач змінює розмір вікна свого Netscape, розміщення може радикально змінитися.
Таким чином, на Web немає такого поняття, як конкретне розміщення документа. Як автор Ви не можете жорстко ставити розміщення, а тільки деяким чином впливати на нього. Наступні зауваження та інформація відносяться до властивостей HTML, орієнтованим на забезпечення розміщення документа. Читайте матеріал, пам'ятаючи про це.
Деякі HTML елементи мають необов'язкові атрибути, які можуть бути використані для впливу на спосіб представлення елементів. Зверніться до детального опису індивідуальних HTML тегів, щоб побачити можливості тегів і прочитати зауваження про них.
В окремих випадках вам може знадобитися центрувати частини тексту, щоб відрізнить їх від звичайного тексту. Для цього можна використовувати атрибут ALIGN = CENTER в таких елементах, як P або DIV (або окремий елемент CENTER).
Якщо Ви бажаєте візуально відокремити основні частини Вашого документа один від одного, Ви можете використовувати HR елемент. Зазвичай він представляється у вигляді горизонтальної рисою у всю ширину екрану. Але використовуйте HR на додаток до засобів структурування, а не як їх заміна.
Що стосується питань формату, таких як переклад рядка або запобігання перекладу рядка, дивіться Поділ на рядки і використання пропусків і символів табуляції. Вище також обговорювалися і питання шрифтів.
Зв'язкиЗв'язки (часто звані гіперзв'язками) є особливістю, яка виправдовує наявність частини HT в абревіатурі HTML (HyperText Markup Language - Мова розмітки гіпертексту).
Технічно зв'язку специфіковані використанням A-елементів (anchor - якір), і ці питання обговорено в описі тега A. Тут ми представляємо тільки базисну ідею, дуже простий приклад і кілька практичних зауважень.
Зв'язок - це пряме з'єднання окремих точок у документі з іншими точками в тому ж самому або інших документах. У HTML термінології точки часто називають anchors (якір).
Існують два кінці зв'язку (якоря): зв'язок здійснюється від однієї точки до іншої. Остання, звана метою (target) зв'язку, часто є початком документа.
У найпростіших випадках Ви створюєте зв'язок від однієї точки Вашого документа до іншого документу (вашому власному або написаним кимось ще). У Вас є можливість вирішити, які слова будуть діяти, як видиме уявлення зв'язку, тобто фрази, які відрізняються від решти документа, і, крім того, Вам необхідно знати Web адреса - URL (Uniforme Resource Locator, уніформний локатор ресурсу) цього документа. У цьому випадку Ви зможете об'єднати інформацію за допомогою відповідного A-елемента. Наприклад:
I work at HUT.Це виводиться броузером в наступному вигляді:
I work at HUT.
Зв'язаний текст, тут - абревіатура HUT, діє, як зв'язок до Web документом, який пояснює це скорочення і дає інформацію про нього. Відображення тексту зв'язку можливо по-різному - текст зв'язку може бути підкреслено, забарвлений або виділений у тексті якимось іншим чином. Користувач (читач) може дізнатися, як зв'язку відображені в кожному окремому оточенні.
Хоча технічно зв'язку створити легко, часто відбувається не правильне використання їх. Ось деякі практичні поради:
Уникайте надмірного зв'язування. Якщо кожне слово в Вашому документі - зв'язок - читач не знає який же зв'язок корисна. Коли Ви використовуєте скорочення або технічний термін, який не пояснюється в Вашому документі, спробуйте знайти придатний, що дає пояснення документ, на який можна встановити зв'язок. Чи робити це в кожному випадку, залежить від обставин. Коли згадується особа або організація, бажано встановити зв'язки на особисту домашню сторінку або домашню сторінку організації (якщо це можливо). Коли Ви посилаєтеся на документ, вкажіть зв'язок до нього, якщо інформація доступна на Web (або, принаймні, приведіть бібліографічну довідку про нього). Якщо у Вас є інформація, яку Ви хочете зробити доступною через Web, але яка менш важлива (для більшості читачів, принаймні), чим Ваш головний документ, створіть окремий HTML файл (або групу файлів), і введіть розділ в головному документі, наприклад, Додаткова інформація, проставивши відповідні зв'язки. Якщо Вам потрібно вказати зв'язку з однієї точки до кількох документів (наприклад, коли Ви згадуєте комп'ютерну програму, Вам треба прив'язати до неї короткий опис, повне керівництво, FTP сайт - для завантаження і т.д.), створіть невеликий файл, що містить ці зв'язки з відповідними поясненнями і дайте зв'язок на нього. Спробуйте зробити текст зв'язку коротким, але містким. Користувачі зазвичай очікують, що отримають більше інформації по темі, де є зв'язок. Якщо цього не відбувається, надайте їм відповідні пояснення. Зокрема, коли Ви створюєте зв'язок з FTP, даючи URL вказівку на місце розташування двійкового файлу, зробіть це чітко в тексті, щоб було зрозуміло, що означає вибір зв'язку з цим. Зв'язуйтеся тільки з дійсно потрібною інформацією. Намагайтеся встановити зв'язок з короткими, написаними зрозумілою мовою документами, які містять подальші зв'язки до більш детальної, технічної інформації. Наприклад, в документах, написаних для великої аудиторії, уникайте зв'язування зі стандартами ISO або RFC документами. Зображення, формули і т.п.Підтримка зображень в HTML - шлях у світ графіки. Створення та маніпулювання зображеннями, графічними форматами та іншим графічним матеріалом не є частиною HTML. Зокрема, HTML специфікації не оголошують яких-небудь вимог або обмежень на графічні формати, підтримувані Web браузерами.
Припустимо, що ми маємо деякі графічні зображення в деякому форматі. Існують два різні способи його використання в Web документі. Ви можете або вказати зв'язок до нього, або вставити його в Ваш документ. У першому випадку Ви використовуєте якір (A-елемент); в іншому випадку елемент IMG. У першому випадку, коли користувач розглядає Ваш документ, він бачить символьну фразу, що діє, як зв'язок, і активізація зв'язку з цим змушує зображення з'явитися на екрані, або в тому ж самому вікні, або в іншому, в залежності від броузера і його установок. В іншому випадку, вставлене зображення є частиною Вашого документа; коли користувач звертається до Вашого документу, зображення завантажується разом з ним і виводиться, як його частину.
В обох випадках користувач побачить зображення, якщо тільки броузер підтримує спеціальний графічний формат. Найбільш підтримувані формати - GIF і JPEG. Найчастіше - це єдині формати, підтримувані для вставляються зображень. Для пов'язаних образів підтримка форматів звичайно ширше (вона може включати, наприклад, PostScript, PDF, PNG) і може розширюватися інсталяцією нових просмотровщик і розширень, які додаються до броузерам. Існує варіант, коли пов'язані образи так втілюються на броузері, що броузер нічого не знає про графічному форматі файлів, але знає, як запустити окрему програму, яка покаже ці зображення.
Як варіант, можливе об'єднання зв'язування і вставки зображень: Ви можете створити документ, що містить зображення, яке діє, як зв'язок до іншого зображенню. Тобто, наприклад, вставлене зображення є малою, подібної штампик, версією зображення, на яке вказує зв'язок.
Посилання на графічні об'єкти звичайно допускається без спеціальних дозволів. Але при використанні авторських малюнків, фотографій і т.п. - Автор повинен згадуватися. (Дивіться Закони Web FAQ.) Однак, деякі зображення настільки прості, що копірайт просто не потрібен. Крім того, є велика кількість колекцій зображень і серед них - колекції загального користування.
Для ілюстрації зв'язування із зображенням і впровадження зображень давайте розглянемо GIF зображення, яке розташоване за адресою - images/referat/25851-1.gif. Звернемося до нього таким чином:
Приклад sae.html:
Liisa Sarakontu has drawn a picture of Siamesealgae eater.Тепер, так як автор дозволив використовувати його зображення, уявімо файл в іншому вигляді:
Приклад sae-2.html:
The Siamese algae eater (Crossocheilus siamensis) is often mixed up with another algae eating fish, the "false Siamensis" (Garra taeniata or Epalzeorhynchus sp.). Below you can see drawings of them by Liisa Sarakontu.Проблема правильного використання графічних зображень в HTML документі дуже важка і багатоаспектна, але ми спробуємо розповісти і про це. Читачам, які знають фінський, пропонуємо прочитати документ Kuvien kдytцstд viestinnдssд yleensд ja Webissд erityisesti.
У HTML 3.2 немає загальної підтримки подання математичних формул. Тому що робота з цього питання знаходиться в стадії розвитку, для ознайомлення подивіться документ W3C по Математичної розмітці. При необхідності Ви можете використовувати деяке програмне забезпечення (наприклад, TeX), щоб оформити формули, як зображення, наприклад, у форматі PostScript, і, використовуючи тег IMG, вставити його в Ваш документ, або тег A, щоб створити зв'язок до нього. Останній спосіб більш кращий, особливо для великих формул. Якщо користувачеві хочеться читати текст не відволікаючись, то поглянути на формулу (зображення) він зможе, коли захоче. Більш того, він зможе побачити її в окремому вікні екрану.