Лекція 1: Загальні відомості про HTML, принципи створення Web-сайту
· Зміна іміджу та підняття престижу компанії;
· Просування торгової марки;
· Доступність інформації про продукцію і ціни для клієнтів;
· Підтримка дилерської мережі, доступність інформації про продукцію і ціни для дилерів;
· Прямий продаж продукції в Internet, організація Web-магазину;
· Доступність внутрішньої інформації для співробітників, що працюють поза офісом.
Інший варіант - створення Web-сайту наукової або загальноосвітньої організації, не займається комерцією в Internet, а розповсюджує інформацію. У цьому випадку мова піде про збір, переробки та розміщення на Web-сайті великих масивів даних з організацією пошуку і доступу до них.
І останній розглянутий варіант - коли ви вважаєте за необхідне розмістити в Internet свою особисту сторінку. Для того, щоб правильно відповісти на поставлені питання, необхідно сформувати категорії користувачів, на які розрахований Web-вузол. Виходячи з їх психології, повинна будуватися інформаційна структура, яка буде залучати та утримувати клієнтів. Надалі всі питання про доцільність будь-яких дій, пов'язаних з Web-вузлом, повинні розглядатися відповідно до того, як відреагують на них відвідувачі, і наскільки вони будуть сприяти досягненню головної мети. Після того, як сформульовані цілі та визначені категорії користувачів, необхідно розподілити підготовлену інформацію по Web-документам, продумати зв'язку між ними і передбачити додаткові навігаційні можливості, наприклад, пошукову систему по вмісту Web-вузла.
Типова структура Web-сайту фірми зазвичай представлена так:
Інформація про компанію. Слід розповісти про цілі і діловому образі фірми, її історії і т.д. Покажіть, яку вигоду отримають клієнти від співпраці саме з вами, а не з іншими компаніями.
Інформація про продукцію і послуги. Розмістіть на Web-сторінці фотографії або малюнки своєї продукції. Опишіть її властивості та переваги, наведіть приклади використання. Якщо є паперовий каталог продукції, то можна перенести його структуру та зміст в Web-вузол. Це полегшить створення і подальше оновлення електронного варіанту каталогу. Якщо планується прийом замовлень на продукцію або послуги через Internet, то потрібно розмістити тут бланк замовлення, який буде надходити по електронній пошті.
Інформаційна підтримка. У цьому розділі публікується додаткова технічна інформація, актуальні питання, поради щодо усунення несправностей і т.п.
Новини. Проінформуйте клієнтів про нові товари та послуги, що надаються фірмою, опублікуйте прес-релізи і т.п.
Зворотній зв'язок. Повідомте, як з вами можна зв'язатися, де ви знаходитесь. Помістіть форму для відкликання, гостьову книгу, адреси електронної пошти, на які клієнт може відправити запит, і т.п.
При наповненні Web-сайту завжди потрібно пам'ятати два принципи: унікальність і достовірність опублікованих матеріалів. Унікальність є першочерговою вимогою до змісту. У WWW вже може існувати чимало сторінок зі схожими матеріалами. Ваш Web-сайт повинен чимось відрізнятися від серверів з аналогічною тематикою, хоча б для того, щоб привернути до себе увагу. Наявність унікальних матеріалів на вашій сторінці збільшить її відвідуваність. Для того, щоб створити унікальний інформаційний ресурс, не обов'язково винаходити щось принципово нове, можна по-іншому оформити вже існуючі ресурси, але при цьому не змушувати клієнта витрачати багато часу на їх пошук. Перевірити ж ресурси на унікальність можна за допомогою пошукових серверів. Що стосується авторитетності, то все залежить від того, наскільки ретельно ви підберете інформацію, перевірите її і будете своєчасно оновлювати. При створенні Web-сайту необхідно пам'ятати, що складові його окремі документи повинні бути об'єднані загальним стилем оформлення і засобами навігації. Єдиний стиль оформлення - один з показників, що відрізняють професійний Web-вузол від аматорського. Завдяки одноманітно зробленим документами користувачі будуть відрізняти ваш Web-вузол від інших і запам'ятають його. Це не означає, що документи повинні бути схожі один на одного як дві краплі води, але загальна ідея, єдиний стиль, повинні бути присутніми неодмінно.
Те ж відноситься і до засобів навігації по сторінках. Не варто розраховувати, що відвідувач знає структуру Web-вузла так само добре, як ви. Він повинен без зусиль розуміти, де він знаходиться зараз і як можна потрапити в будь-яке інше місце. Необхідно передбачити можливість переходу до першого документа, програмою пошуку або до схеми Web-вузла.
Крім того, єдність стилю дозволяє використовувати шаблони - сторінки, що містять тільки загальні елементи оформлення та навігації (без інформаційного наповнення). З їх допомогою можна швидко та ефективно створювати нові сторінки і розподіляти роботу з їх створення між кількома людьми. При використанні шаблону для отримання готової сторінки достатньо лише внести до нього необхідну інформацію. Послідовність, логічність, сталість - ось необхідні якості гарного Web-вузла. Значно спростять роботу з формування і зміни стилю вашого Web-вузла каскадні таблиці стилів, що з'явилися в HTML 4.0. Про деякі їхні можливості йтиметься нижче, а повністю їм присвячена окрема глава. Після того, як визначені цілі, задана структура і зібрана текстова та графічна інформація, необхідно розробити зовнішній вигляд Web-вузла. Він також залежить від тих цілей, які необхідно досягти. Спектр можливих рішень тут дуже широкий: від перегляду вже існуючих сторінок і створення подібних, до звернення за допомогою до професійних дизайнерів і художників. У той же час, необхідно пам'ятати про деяких вже сформованих правилах побудови Web-документів, з яких складається Web-вузол.
Структура. На сьогодні подання про структуру документа досить устоялося. Web-документ повинен містити в собі наступні розділи: заголовок, назва компанії, навігаційну панель, власне зміст, контактну інформацію, дату і час оновлення, авторські права і статус документа.
Логотип. Створюючи Web-сторінку, необхідно подбати про те, щоб назва фірми завжди було присутнє на екрані. Для цього на початку кожного Web-документа звичайно міститься барвисто оформлений логотип фірми. Крім того, назва компанії повинне бути присутнім і у вихідних даних до всіх документів.
Навігаційна панель. Одним з найбільш важливих розділів Web-документа є навігаційна панель або панелі управління. WWW завоювала весь світ багато в чому завдяки тому, що гіпертекстові посилання забезпечують повну зв'язність публікованих матеріалів. Але ці ж посилання таять у собі небезпеку занурення в повний хаос, коли, пройшовши ланцюжок з трьох-чотирьох документів, ви вже не зможете повернутися назад, заплутавшись у великій кількості посилань. Ваш Web-сайт повинен забезпечувати користувачеві ясні і інтуїтивно зрозумілі навігаційні маршрути.
Численні дослідження показали, що відвідувачі Web-серверів дуже нетерплячі і далі, ніж на два рівні документів, заглиблюватися у зміст сервера не хочуть. Тому, створюючи Web-вузол великого обсягу, слід передбачити проміжні документи, які зазвичай перебувають на першому-другому рівнях, від яких будь-яка інформація знаходиться не далі, ніж у двох переходах. Навігаційна панель вашого Web-вузла має бути присутня у кожному документі. У першу чергу, вона повинна включати в себе напрямні посилання типу "Вперед" - "Назад" ("Наступний" - "Попередній"), що вказують на сусідні документи в структурі Web-вузла. Далі від панелі управління обов'язково повинні йти посилання на всі великі розділи Web-вузла - так звані розділи першого рівня. І, нарешті, користувач завжди повинен мати можливість миттєво повернутися на головну сторінку Web-вузла. Крім посилань слід вказати шлях до локальної пошукової системи і індексу.
Зміст. Перш за все, слід зазначити, що зміст Web-документів повинне повною мірою відповідати всім вимогам, які висуваються до звичайних газетним або журнальних публікацій: граматична і орфографічна коректність, точність і достовірність пропонованих матеріалів, і багато іншого. Крім того, з'являється цілий ряд специфічних вимог, яким повинен задовольняти Web-документ.
Часто виникає питання про розміри документа: яке число сторінок є оптимальним? Відповідь на перший погляд може здатися дивним: одна екранна сторінка або взагалі ніяких обмежень. Численні дослідження показали, що користувачі не люблять працювати з смугами прокрутки браузерів. Найбільше їм подобаються документи, які розміщуються на одній екранній сторінці. Так і в WWW - ви жодним чином не зможете дати користувачеві більше інформації, ніж у концентрованому викладі на одній сторінці. Якщо все-таки ви не укладаєтеся в ці рамки, створіть ще один документ. Одна екранна сторінка виявилася придатною мірою подання інформації. Якщо розмір документа перевищує одну сторінку, то в більшості випадків він може бути поділений на декілька логічних частин, кожна з яких буде займати не більше однієї сторінки. Якщо ж логічного поділу інформації провести не вдається, то необхідно переробити стиль викладу, а може бути, і самі матеріали. Зараз виробилося єдину думку, що Web-сервер необхідно будувати на основі одноекранний документів. Є тільки два виключення з цього правила. Воно не поширюється на статті, що публікуються в WWW, і друге виняток - анкетні форми, які, природно, не можна розривати.
Графіка. При розробці Web-сторінки потрібно дуже уважно вибирати оптимальне співвідношення графічних і текстових матеріалів. Одна гарна картинка може замінити тисячу рядків тексту, але і завантажуватися з мережі вона буде в тисячу разів довше. Тому графікою потрібно користуватися обережно. Можна виходити з того, що графіки на сторінці повинно бути трохи менше, ніж хочеться Web-майстру. Користувачам може просто не вистачити терпіння, і вони закриють документ ще до того, як він повністю завантажиться. Затримка відгуку системи викликає у користувача роздратування. Всі розуміють, як важко зараз йдуть справи з канальною інфраструктурою в Internet. Тому час затримки зростає залежно від часу доби, за різними оцінками до 15-60 секунд. Тепер уявіть, що у клієнта тільки модем на 19200 біт / с. Більшого на російських телефонних лініях досягти дуже важко. Тоді за хвилину, тобто до того, як клієнт втратить терпіння, можна передати тільки близько 170 Кбайт даних. Отже, розмір документа не повинен перевищувати цього значення. Слід зазначити, що зазвичай панель управління, логотип і назва фірми виконуються у вигляді графічних елементів. Після створення макета можна приступити до його реалізації за допомогою мови HTML і інших засобів, пропонованих сучасними технологіями WWW.
Завершивши створення Web-сайту, необхідно розмістити його в Internet. Тут можливі два варіанти: перший - використати комп'ютер, який разом з Web-сервером й Web-вузлом перебуває у вашому офісі й підключається до Internet по виділеній або лінії, що комутується, другий - скористатися для розміщення Web-вузла послугами спеціальних організацій.
Розглянемо другий варіант. Правильний вибір провайдера, що надає доступ до Web-сторінці, дозволить вашим клієнтам з максимальною зручністю одержувати необхідну інформацію. Крім того, підтримка Web-сервером спеціальних можливостей значно полегшить розробку Web-сайту.
На що слід звернути увагу при виборі провайдера, яка розміщує ваш Web-вузол на своєму сервері?
Пропускна здатність каналів. Щоб вашим відвідувачам не довелося дуже довго чекати завантаження сторінок, провайдер повинен володіти надійним високошвидкісним з'єднанням порядку 1-2 Мбіт за секунду. Підтримка сервером провайдера SSI (Server Side Includes, вставки на стороні сервера). Використання SSI дозволяє Web-серверу вставляти невеликі обсяги динамічних даних безпосередньо у пересилається користувачеві HTML-документ. Запрошення HTML-сторінка "проглядається" у пошуках елементів SSI. Виявивши такий елемент, сервер вставляє необхідну динамічну інформацію. За допомогою SSI можна включати один файл до складу іншого, виконувати CGI-сценарії й передавати іншу інформацію. Необхідно уточнити, які саме функції SSI підтримуються на сервері провайдера. Підтримка сервером провайдера CGI-сценаріїв. CGI (Common Gateway Interface, загальний шлюзовий інтерфейс) - специфікація, що дозволяє Web-серверу виконувати довільні прикладні програми. У результаті роботи таких програм (сценаріїв, або "скриптів") створюються HTML-документи. За допомогою CGI-сценаріїв можуть прийматися дані від користувача, вони дозволяють організувати діалог на Web-сторінках, запити до баз даних і т.д. Створити CGI-сценарій можна за допомогою будь-якого популярного мови програмування: Perl, Basic, C, C + +, Pascal і т.п. Підтримка моментальної перекодування. На жаль, для російської мови в Internet при роботі на різних платформах (Windows, Mac, Unix і т.д.) прийняті різні кодування. Щоб користувачеві було легко переглядати сторінки, Web-сервер провайдера повинен вміти автоматично перекодувати документи залежно від надходження запиту. В іншому разі або зміст вашого Web-сайту для деяких відвідувачів буде нечитабельним, або доведеться забезпечувати кілька копій Web-сайту - по одній на кожну підтримувану кодування. Спосіб оновлення сторінок. Зазвичай сторінки оновлюються по протоколу FTP (File Transfer Protocol, протокол передачі файлів). Деякі FTP-клієнти дозволяють працювати з файлами на комп'ютері провайдера так само, як з власним диском, - копіювати, видаляти, перейменовувати і т.п.
Як правило, можливість розміщення Web-сайту провайдер надає своїм користувачам за невелику плату або безкоштовно.
Існують служби, які надають місце під Web-вузли безкоштовно разом з адресою електронної пошти та іншими послугами. Як правило, умовою такого "безкоштовного" розміщення є виділення на ваших сторінках деякого місця під рекламу. Крім того, накладаються обмеження на розмір ваших файлів.
· Електронна пошта (e-mail);
· Файлові архіви FTP;
· World Wide Web.
Загальні принципи створення Web-сайту
Ви вирішили створити й розмістити в інформаційному просторі WWW (World Wide Web, Всесвітня павутина) власний Web-вузол. Які ж кроки треба зробити, щоб він був цікавий, корисний і, що важливо, відвідуємо. Перше питання, на яке необхідно дати чітку відповідь: з якою метою створюється Web-вузол? Від цього залежить багато чого: стиль оформлення, необхідні для створення та подальшого функціонування витрати, формат подання інформації для розміщення в Web, інструментарій і вимоги, що пред'являються до програмного забезпечення Web-сервера і каналів зв'язку з Internet. Тут можливі кілька варіантів. Якщо ви створюєте Web-вузол для компанії, що реалізує якийсь товар, то основною метою може бути поширення інформації про фірму та реклама продукції, а також організація Web-магазину. При цьому будуть вирішені наступні завдання:· Зміна іміджу та підняття престижу компанії;
· Просування торгової марки;
· Доступність інформації про продукцію і ціни для клієнтів;
· Підтримка дилерської мережі, доступність інформації про продукцію і ціни для дилерів;
· Прямий продаж продукції в Internet, організація Web-магазину;
· Доступність внутрішньої інформації для співробітників, що працюють поза офісом.
Інший варіант - створення Web-сайту наукової або загальноосвітньої організації, не займається комерцією в Internet, а розповсюджує інформацію. У цьому випадку мова піде про збір, переробки та розміщення на Web-сайті великих масивів даних з організацією пошуку і доступу до них.
І останній розглянутий варіант - коли ви вважаєте за необхідне розмістити в Internet свою особисту сторінку. Для того, щоб правильно відповісти на поставлені питання, необхідно сформувати категорії користувачів, на які розрахований Web-вузол. Виходячи з їх психології, повинна будуватися інформаційна структура, яка буде залучати та утримувати клієнтів. Надалі всі питання про доцільність будь-яких дій, пов'язаних з Web-вузлом, повинні розглядатися відповідно до того, як відреагують на них відвідувачі, і наскільки вони будуть сприяти досягненню головної мети. Після того, як сформульовані цілі та визначені категорії користувачів, необхідно розподілити підготовлену інформацію по Web-документам, продумати зв'язку між ними і передбачити додаткові навігаційні можливості, наприклад, пошукову систему по вмісту Web-вузла.
Типова структура Web-сайту фірми зазвичай представлена так:
Інформація про компанію. Слід розповісти про цілі і діловому образі фірми, її історії і т.д. Покажіть, яку вигоду отримають клієнти від співпраці саме з вами, а не з іншими компаніями.
Інформація про продукцію і послуги. Розмістіть на Web-сторінці фотографії або малюнки своєї продукції. Опишіть її властивості та переваги, наведіть приклади використання. Якщо є паперовий каталог продукції, то можна перенести його структуру та зміст в Web-вузол. Це полегшить створення і подальше оновлення електронного варіанту каталогу. Якщо планується прийом замовлень на продукцію або послуги через Internet, то потрібно розмістити тут бланк замовлення, який буде надходити по електронній пошті.
Інформаційна підтримка. У цьому розділі публікується додаткова технічна інформація, актуальні питання, поради щодо усунення несправностей і т.п.
Новини. Проінформуйте клієнтів про нові товари та послуги, що надаються фірмою, опублікуйте прес-релізи і т.п.
Зворотній зв'язок. Повідомте, як з вами можна зв'язатися, де ви знаходитесь. Помістіть форму для відкликання, гостьову книгу, адреси електронної пошти, на які клієнт може відправити запит, і т.п.
При наповненні Web-сайту завжди потрібно пам'ятати два принципи: унікальність і достовірність опублікованих матеріалів. Унікальність є першочерговою вимогою до змісту. У WWW вже може існувати чимало сторінок зі схожими матеріалами. Ваш Web-сайт повинен чимось відрізнятися від серверів з аналогічною тематикою, хоча б для того, щоб привернути до себе увагу. Наявність унікальних матеріалів на вашій сторінці збільшить її відвідуваність. Для того, щоб створити унікальний інформаційний ресурс, не обов'язково винаходити щось принципово нове, можна по-іншому оформити вже існуючі ресурси, але при цьому не змушувати клієнта витрачати багато часу на їх пошук. Перевірити ж ресурси на унікальність можна за допомогою пошукових серверів. Що стосується авторитетності, то все залежить від того, наскільки ретельно ви підберете інформацію, перевірите її і будете своєчасно оновлювати. При створенні Web-сайту необхідно пам'ятати, що складові його окремі документи повинні бути об'єднані загальним стилем оформлення і засобами навігації. Єдиний стиль оформлення - один з показників, що відрізняють професійний Web-вузол від аматорського. Завдяки одноманітно зробленим документами користувачі будуть відрізняти ваш Web-вузол від інших і запам'ятають його. Це не означає, що документи повинні бути схожі один на одного як дві краплі води, але загальна ідея, єдиний стиль, повинні бути присутніми неодмінно.
Те ж відноситься і до засобів навігації по сторінках. Не варто розраховувати, що відвідувач знає структуру Web-вузла так само добре, як ви. Він повинен без зусиль розуміти, де він знаходиться зараз і як можна потрапити в будь-яке інше місце. Необхідно передбачити можливість переходу до першого документа, програмою пошуку або до схеми Web-вузла.
Крім того, єдність стилю дозволяє використовувати шаблони - сторінки, що містять тільки загальні елементи оформлення та навігації (без інформаційного наповнення). З їх допомогою можна швидко та ефективно створювати нові сторінки і розподіляти роботу з їх створення між кількома людьми. При використанні шаблону для отримання готової сторінки достатньо лише внести до нього необхідну інформацію. Послідовність, логічність, сталість - ось необхідні якості гарного Web-вузла. Значно спростять роботу з формування і зміни стилю вашого Web-вузла каскадні таблиці стилів, що з'явилися в HTML 4.0. Про деякі їхні можливості йтиметься нижче, а повністю їм присвячена окрема глава. Після того, як визначені цілі, задана структура і зібрана текстова та графічна інформація, необхідно розробити зовнішній вигляд Web-вузла. Він також залежить від тих цілей, які необхідно досягти. Спектр можливих рішень тут дуже широкий: від перегляду вже існуючих сторінок і створення подібних, до звернення за допомогою до професійних дизайнерів і художників. У той же час, необхідно пам'ятати про деяких вже сформованих правилах побудови Web-документів, з яких складається Web-вузол.
Структура. На сьогодні подання про структуру документа досить устоялося. Web-документ повинен містити в собі наступні розділи: заголовок, назва компанії, навігаційну панель, власне зміст, контактну інформацію, дату і час оновлення, авторські права і статус документа.
Логотип. Створюючи Web-сторінку, необхідно подбати про те, щоб назва фірми завжди було присутнє на екрані. Для цього на початку кожного Web-документа звичайно міститься барвисто оформлений логотип фірми. Крім того, назва компанії повинне бути присутнім і у вихідних даних до всіх документів.
Навігаційна панель. Одним з найбільш важливих розділів Web-документа є навігаційна панель або панелі управління. WWW завоювала весь світ багато в чому завдяки тому, що гіпертекстові посилання забезпечують повну зв'язність публікованих матеріалів. Але ці ж посилання таять у собі небезпеку занурення в повний хаос, коли, пройшовши ланцюжок з трьох-чотирьох документів, ви вже не зможете повернутися назад, заплутавшись у великій кількості посилань. Ваш Web-сайт повинен забезпечувати користувачеві ясні і інтуїтивно зрозумілі навігаційні маршрути.
Численні дослідження показали, що відвідувачі Web-серверів дуже нетерплячі і далі, ніж на два рівні документів, заглиблюватися у зміст сервера не хочуть. Тому, створюючи Web-вузол великого обсягу, слід передбачити проміжні документи, які зазвичай перебувають на першому-другому рівнях, від яких будь-яка інформація знаходиться не далі, ніж у двох переходах. Навігаційна панель вашого Web-вузла має бути присутня у кожному документі. У першу чергу, вона повинна включати в себе напрямні посилання типу "Вперед" - "Назад" ("Наступний" - "Попередній"), що вказують на сусідні документи в структурі Web-вузла. Далі від панелі управління обов'язково повинні йти посилання на всі великі розділи Web-вузла - так звані розділи першого рівня. І, нарешті, користувач завжди повинен мати можливість миттєво повернутися на головну сторінку Web-вузла. Крім посилань слід вказати шлях до локальної пошукової системи і індексу.
Зміст. Перш за все, слід зазначити, що зміст Web-документів повинне повною мірою відповідати всім вимогам, які висуваються до звичайних газетним або журнальних публікацій: граматична і орфографічна коректність, точність і достовірність пропонованих матеріалів, і багато іншого. Крім того, з'являється цілий ряд специфічних вимог, яким повинен задовольняти Web-документ.
Часто виникає питання про розміри документа: яке число сторінок є оптимальним? Відповідь на перший погляд може здатися дивним: одна екранна сторінка або взагалі ніяких обмежень. Численні дослідження показали, що користувачі не люблять працювати з смугами прокрутки браузерів. Найбільше їм подобаються документи, які розміщуються на одній екранній сторінці. Так і в WWW - ви жодним чином не зможете дати користувачеві більше інформації, ніж у концентрованому викладі на одній сторінці. Якщо все-таки ви не укладаєтеся в ці рамки, створіть ще один документ. Одна екранна сторінка виявилася придатною мірою подання інформації. Якщо розмір документа перевищує одну сторінку, то в більшості випадків він може бути поділений на декілька логічних частин, кожна з яких буде займати не більше однієї сторінки. Якщо ж логічного поділу інформації провести не вдається, то необхідно переробити стиль викладу, а може бути, і самі матеріали. Зараз виробилося єдину думку, що Web-сервер необхідно будувати на основі одноекранний документів. Є тільки два виключення з цього правила. Воно не поширюється на статті, що публікуються в WWW, і друге виняток - анкетні форми, які, природно, не можна розривати.
Графіка. При розробці Web-сторінки потрібно дуже уважно вибирати оптимальне співвідношення графічних і текстових матеріалів. Одна гарна картинка може замінити тисячу рядків тексту, але і завантажуватися з мережі вона буде в тисячу разів довше. Тому графікою потрібно користуватися обережно. Можна виходити з того, що графіки на сторінці повинно бути трохи менше, ніж хочеться Web-майстру. Користувачам може просто не вистачити терпіння, і вони закриють документ ще до того, як він повністю завантажиться. Затримка відгуку системи викликає у користувача роздратування. Всі розуміють, як важко зараз йдуть справи з канальною інфраструктурою в Internet. Тому час затримки зростає залежно від часу доби, за різними оцінками до 15-60 секунд. Тепер уявіть, що у клієнта тільки модем на 19200 біт / с. Більшого на російських телефонних лініях досягти дуже важко. Тоді за хвилину, тобто до того, як клієнт втратить терпіння, можна передати тільки близько 170 Кбайт даних. Отже, розмір документа не повинен перевищувати цього значення. Слід зазначити, що зазвичай панель управління, логотип і назва фірми виконуються у вигляді графічних елементів. Після створення макета можна приступити до його реалізації за допомогою мови HTML і інших засобів, пропонованих сучасними технологіями WWW.
Завершивши створення Web-сайту, необхідно розмістити його в Internet. Тут можливі два варіанти: перший - використати комп'ютер, який разом з Web-сервером й Web-вузлом перебуває у вашому офісі й підключається до Internet по виділеній або лінії, що комутується, другий - скористатися для розміщення Web-вузла послугами спеціальних організацій.
Розглянемо другий варіант. Правильний вибір провайдера, що надає доступ до Web-сторінці, дозволить вашим клієнтам з максимальною зручністю одержувати необхідну інформацію. Крім того, підтримка Web-сервером спеціальних можливостей значно полегшить розробку Web-сайту.
На що слід звернути увагу при виборі провайдера, яка розміщує ваш Web-вузол на своєму сервері?
Пропускна здатність каналів. Щоб вашим відвідувачам не довелося дуже довго чекати завантаження сторінок, провайдер повинен володіти надійним високошвидкісним з'єднанням порядку 1-2 Мбіт за секунду. Підтримка сервером провайдера SSI (Server Side Includes, вставки на стороні сервера). Використання SSI дозволяє Web-серверу вставляти невеликі обсяги динамічних даних безпосередньо у пересилається користувачеві HTML-документ. Запрошення HTML-сторінка "проглядається" у пошуках елементів SSI. Виявивши такий елемент, сервер вставляє необхідну динамічну інформацію. За допомогою SSI можна включати один файл до складу іншого, виконувати CGI-сценарії й передавати іншу інформацію. Необхідно уточнити, які саме функції SSI підтримуються на сервері провайдера. Підтримка сервером провайдера CGI-сценаріїв. CGI (Common Gateway Interface, загальний шлюзовий інтерфейс) - специфікація, що дозволяє Web-серверу виконувати довільні прикладні програми. У результаті роботи таких програм (сценаріїв, або "скриптів") створюються HTML-документи. За допомогою CGI-сценаріїв можуть прийматися дані від користувача, вони дозволяють організувати діалог на Web-сторінках, запити до баз даних і т.д. Створити CGI-сценарій можна за допомогою будь-якого популярного мови програмування: Perl, Basic, C, C + +, Pascal і т.п. Підтримка моментальної перекодування. На жаль, для російської мови в Internet при роботі на різних платформах (Windows, Mac, Unix і т.д.) прийняті різні кодування. Щоб користувачеві було легко переглядати сторінки, Web-сервер провайдера повинен вміти автоматично перекодувати документи залежно від надходження запиту. В іншому разі або зміст вашого Web-сайту для деяких відвідувачів буде нечитабельним, або доведеться забезпечувати кілька копій Web-сайту - по одній на кожну підтримувану кодування. Спосіб оновлення сторінок. Зазвичай сторінки оновлюються по протоколу FTP (File Transfer Protocol, протокол передачі файлів). Деякі FTP-клієнти дозволяють працювати з файлами на комп'ютері провайдера так само, як з власним диском, - копіювати, видаляти, перейменовувати і т.п.
Як правило, можливість розміщення Web-сайту провайдер надає своїм користувачам за невелику плату або безкоштовно.
Існують служби, які надають місце під Web-вузли безкоштовно разом з адресою електронної пошти та іншими послугами. Як правило, умовою такого "безкоштовного" розміщення є виділення на ваших сторінках деякого місця під рекламу. Крім того, накладаються обмеження на розмір ваших файлів.
Історія розвитку HTML
У 1989 році Тім Бернерс-Лі запропонував керівництву Європейського Центру ядерних досліджень (CERN) проект розподіленої гіпертекстової системи, яку він назвав World Wide Web (WWW), Всесвітня павутина. Спочатку ідея системи полягала в тому, щоб за допомогою гіпертекстової навігаційної системи об'єднати всю безліч інформаційних ресурсів CERN у єдину інформаційну систему. Технологія виявилася настільки вдалою, що дала поштовх до розвитку однієї із самих популярних у світі глобальних інформаційних систем. Практично у свідомості більшості користувачів глобальної комп'ютерної мережі Internet сама ця мережа асоціюється з трьома основними інформаційними технологіями:· Електронна пошта (e-mail);
· Файлові архіви FTP;
· World Wide Web.
Причому остання технологія поступово переміщається на перше місце.
Успіх технології World Wide Web визначений двома основними факторами: простотою і використанням протоколів міжмережевого обміну сімейства TCP / IP, (Transmission Control Protocol, протокол керування передачею / Internet Protocol, протокол Internet), які є основою Internet.
Практично всі користувачі Мережі одночасно одержали можливість спробувати себе як творців і читачів інформаційних матеріалів, опублікованих у Всесвітній павутині. Але й популярність самого Internet багато в чому викликана появою World Wide Web, тому що це перша мережна технологія, яка надала користувачеві простий сучасний інтерфейс для доступу до різноманітних мережевих ресурсів. Простота і зручність застосування привели до зростання числа користувачів WWW і привернули увагу комерційних структур. Далі процес зростання числа користувачів стало лавиноподібним, і так продовжується до цих пір.
При цьому сама технологія на початковому етапі була надзвичайно проста. Справа в тому, що при розробці різних компонентів технології (мови гіпертекстової розмітки HTML (HyperText Markup Language, мова розмітки гіпертексту), протоколу обміну гіпертекстової інформацією HTTP, специфікації розробки прикладного програмного забезпечення CGI та ін) передбачалося, що кваліфікація авторів інформаційних ресурсів та їх оснащеність засобами обчислювальної техніки будуть мінімальними. Одним з компонентів технології створення розподіленої гіпертекстової системи World Wide Web стала мова гіпертекстової розмітки HTML, розроблений Тімом Бернерсом-Лі на основі стандарту мови розмітки друкованих документів - SGML (Standard Generalised Markup Language, стандартний узагальнений мова розмітки). Деніел В. Коннолі написав для нього Document Type Definition - формальний опис синтаксису HTML у термінах SGML.
Розробники HTML змогли вирішити два завдання:
· Надати дизайнерам гіпертекстових баз даних простий засіб створення документів;
· Зробити це засіб досить потужним, щоб відбити що були на той момент подання про інтерфейс користувача гіпертекстових баз даних.
Перше завдання було вирішене за рахунок вибору тегів моделі опису документа. Така модель широко застосовується в системах підготовки документів для друку. Прикладом такої системи може служити добре відомий мову розмітки наукових документів TeX, який був створений Дональдом Кнутом та запропоновано Американським математичним суспільством, і програми його інтерпретації. Мова НТМL дозволяє розмічати електронний документ, який відображається на екрані з поліграфічним рівнем оформлення; результуючий документ може містити найрізноманітніші мітки, ілюстрації, аудіо-та відеофрагменти і так далі. До складу мови ввійшли розвинені засоби для створення різних рівнів заголовків, шрифтових виділень, різні списки, таблиці та багато іншого. Другим важливим моментом, що вплинув на долю HTML, стало те, що в якості основи був обраний звичайний текстовий файл. Вибір був зроблений під впливом наступних факторів:
· Такий файл можна створити в будь-якому текстовому редакторі на будь-якій апаратній платформі в середовищі якої завгодно операційної системи;
· До моменту розробки HTML існував американський стандарт для розробки мережних інформаційних систем - Z39.50, у якому в якості одиниці зберігання вказувався простий текстовий файл у кодуванні LATIN1, що відповідає US ASCII.
Таким чином, гіпертекстова база даних у концепції WWW - це набір текстових файлів, розмічених мовою HTML, який визначає форму подання інформації (розмітка) і структуру зв'язків між цими файлами й іншими інформаційними ресурсами (гіпертекстові посилання). Гіпертекстові посилання, що встановлюють зв'язки між текстовими документами, поступово стали поєднувати всілякі інформаційні ресурси, в тому числі звук і відео; в результаті виникло нове поняття - гіпермедіа. Такий підхід припускає наявність ще одного компонента технології - інтерпретатора мови. В World Wide Web функції інтерпретатора розділені між Web-сервером гіпертекстової бази даних і інтерфейсом користувача. Сервер, крім доступу до документів та обробки гіпертекстових посилань, забезпечує передпроцесорної обробку документів, у той час як інтерфейс користувача здійснює інтерпретацію конструкцій мови, пов'язаних з поданням інформації. Перша версія мови (HTML 1.0) була спрямована на подання мови як такого, де опис його можливостей носило скоріше рекомендаційний характер. Друга версія мови (HTML 2.0) фіксувала практику використання його конструкцій. Версія + + (HTML + +) представляла нові можливості, розширюючи набір тегів HTML убік відображення наукової інформації і таблиць, а також поліпшення стилю компонування зображень і тексту. Версія 3.2 змогла впорядкувати всі нововведення і погодити їх з існуючою практикою. HTML 3.2 дозволяє реалізувати використання таблиць, виконання кодів мови Java, обтікання графіки текстом, а також відображення верхніх і нижніх індексів. Зараз World Wide Web Consortium (W3C) - міжнародна організація, яка займається підготовкою та поширенням документації на опис нових версій HTML - уже опублікувала матеріали специфікації HTML 4.01. Крім можливостей розмітки тексту, включення мультимедіа та формування гіпертекстових зв'язків, вже існували в попередніх версіях HTML, у версію 4.01 включені додаткові засоби роботи з мультимедіа, мови програмування, таблиці стилів, спрощені засоби друку зображень і документів. Для керування сценаріями перегляду сторінок Website (гіпертекстової бази даних, виконаної в технології World Wide Web) можна використовувати мови програмування цих сценаріїв, наприклад, JavaScript, Java і VBScript. Ускладнення HTML і поява мов програмування призвело до того, що розробка Web-вузлів стала справою високопрофесійною, що вимагає спеціалізації за напрямами діяльності й постійного вивчення нових Web-технологій. Але можливості Internet дозволяють користувачам, які володіють основами HTML, створювати і розміщувати власні Web-вузли без більших витрат. Саме на таких користувачів і розрахований пропонований курс.
Наприклад, при описі таблиці відкриває тег з атрибутами може виглядати так:
<TABLE WIDTH = 570 ALIGN = center CELLPADDING = 10
CELLSPACING = 2 BORDER = 16>
Цей запис означає наступне: таблиця шириною 570 пікселів, вирівняна по центру, полі між рамкою і вмістом осередків 10 пікселів, поле рамки 2 пікселя, ширина бордюру 16 пікселів.
Атрибути тега слідують за ім'ям і відокремлюються одне від одного одним або декількома знаками табуляції, пробілами або символами повернення до початку рядка. Порядок запису атрибутів в тезі значення не має. Значення атрибуту, якщо таке є, слід за знаком рівності, хто стоїть після імені атрибута. Якщо значення атрибуту - одне слово або число, то його можна просто вказати після знаку рівності, не виділяючи додатково. Всі інші значення необхідно укладати в одинарні або подвійні лапки, особливо якщо вони містять кілька розділених пробілами слів. Довжина значення атрибуту обмежена 1024 символами. Регістр символів в іменах тегів і атрибутів не враховується, чого не можна сказати про значення атрибутів. Наприклад, особливо важливо використовувати потрібний регістр при введенні URL (Uniform Resource Locator, уніфікований покажчик ресурсу) інших документів в якості значення атрибуту HREF.
Найчастіше елементи розмітки HTML або HTML-контейнери складаються з початкового і кінцевого компонентів, між якими розміщуються текст та інші елементи документа. Ім'я кінцевого тега ідентично імені початкового, але перед ім'ям кінцевого тега ставиться коса риса (/) (наприклад, для тега стилю шрифту - курсив <I> закриває пара представляє собою </ I>, для тега заголовка <ТIТLЕ> закриває парою буде </ ТIТLЕ>). Кінцеві теги ніколи не містять атрибутів. За своїм значенням теги близькі до поняття дужок "begin / end" в універсальних мовами програмування, які задають області дії імен локальних змінних і т.п. Теги визначають область дії правил інтерпретації текстових документів. При використанні вкладених елементів розмітки в документі слід дотримуватися особливої акуратність. Вкладені теги потрібно закривати, починаючи з останнього. Деякі елементи розмітки не мають кінцевого компонента, оскільки є автономними елементами. Наприклад, тег зображення <IMG>, який служить для вставки в документ графічного зображення, кінцевого компоненту не вимагає. До автономних елементів розмітки також відносяться розрив рядка (<BR>), горизонтальна лінійка (<HR>) і теги, що містять таку інформацію про документ, яка не впливає на його відображуване вміст, наприклад, теги <META> і <BASE>. У деяких випадках кінцеві теги в документі можна опускати. Більшість браузерів влаштовано так, що при обробці тексту документа початковий тег сприймається як кінцевий тег попереднього. Найпоширеніший тег такого типу - тег абзацу <р>. Оскільки він використовується в документі дуже часто, його зазвичай ставлять тільки на початку кожного абзацу. Коли один абзац закінчується, наступний тег <Р> сигналізує браузеру про те, що потрібно завершити цей абзац і почати наступний. Більшість авторів тегом кінця абзацу не користуються. Є й інші кінцеві теги, без яких браузери відмінно працюють, наприклад, кінцевий тег </ HTML>. Тим не менш, рекомендується включати по можливості більше кінцевих тегів, щоб уникнути плутанини і помилок при відтворенні документа. Для стислості та образності ми будемо в ряді випадків замість словосполучення "елемент розмітки" застосовувати термін "контейнер". Загальна схема побудови контейнера у форматі HTML може бути записана в наступному вигляді:
"Контейнер" =
<"Ім'я тега" "список атрибутів">
зміст контейнера
</ "Ім'я тега">
Слід зазначити, що в літературі крім терміна "контейнер" ще використовується і термін "елемент". Слід бути уважним, щоб не плутати контейнер (наприклад, BODY) та теги (BODY), використовуваний при формуванні контейнера. Крім тегів, елементами HTML є CER (Character Entity Reference), вони призначені для представлення спеціальних символів в документі HTML, які можуть бути неправильно оброблені браузером. Припустимо, створюється документ HTML, мова в якому йде про елементи цієї мови. Якщо вказати ім'я тега <BODY> просто в документі, браузер може сприйняти його як безпосередньо старт-тег. Для виведення таких символів і використовується CER. Наприклад, щоб представити символ "<" в документі HTML, потрібно замінити його на <, а символ ">" - на>. Тобто, якщо вказати в тексті HTML рядок <BODY>, вона буде виглядати на екрані як текст <BODY>.
Може виникнути питання: як бути з символами "</>", "&" і зі спеціальними символами, типу знака наголоси? Можна виводити їх, використовуючи відповідні CER, наприклад для "&" це буде &, і т. д. Якщо подивитися на структуру будь-якого документа HTML, оскільки кожен з них починається з амперсанда "&". На відміну від найменувань тегів HTML, найменування CER чутливі до регістру символів. Також найменування CER можуть задаватися у вигляді імені, а за допомогою тризначних кодів символів у вигляді & # nnn;. Далі в таблиці наведені найбільш часто використовувані CER і відповідні їм числові коди.
· Визначають структуру документа;
· Оформлення блоків гіпертексту (параграфи, списки, таблиці, картинки);
· Гіпертекстові посилання і закладки;
· Форми для організації діалогу;
· Виклик програм.
Структура гіпертекстової мережі задається гіпертекстовими посиланнями. Гіпертекстова посилання - це адреса іншого HTML-документа або інформаційного ресурсу Internet, який тематично, логічно або будь-яким іншим способом пов'язаний з документом, в якому посилання визначена. Природно, при таких умовах дуже важлива схема адресації всіх наявних інформаційних ресурсів.
Реальний механізм інтерпретації ідентифікатора ресурсу, що спирається на URI (Uniform Resource Identifier, універсальний ідентифікатор ресурсу), називається URL, і користувачі WWW мають справу саме з ним.
Типовим прикладом використання такого запису можна вважати наступний приклад:
Цей текст містить:
<A HREF="http://www.intuit.ru/help/index.html">
гіпертекстове посилання </ A>
Виглядати це буде наступним чином: (відкрити)
У наведеному вище прикладі тег "A", який в HTML називають якорем (anchor), використовує атрибут HREF, що позначає гіпертекстове посилання (Hypertext Reference), для запису цього посилання у формі URL. Це посилання вказує на документ з ім'ям "index.html" в каталозі "help" на сервері "www.intuit.ru", доступ до якого здійснюється по протоколу HTTP. Гіпертекстові посилання у HTML діляться на два класи: контекстні гіпертекстові посилання і загальні. Контекстні посилання вмонтовані в тіло документа, як це було продемонстровано у попередньому прикладі, в той час як загальні посилання пов'язані з усім документом у цілому і можуть використовуватися при перегляді будь-якого фрагмента документа. Обидва класи посилань спочатку присутні в стандарті мови, однак перший час найбільшою популярністю користувалися контекстні посилання. Ця популярність призвела до того, що механізм використання загальних посилань практично повністю "атрофувався". У даному прикладі ми уклали URL в подвійні лапки. Насправді, це необов'язково. Лапки (подвійні або одинарні) застосовуються тільки тоді, коли посеред значення URL з'являються символи-роздільники (пробіл, табуляція, неотображаемие символи). Але такого сорту URL слід всіляко уникати. Структура HTML-документа дозволяє задіяти вкладені одна в одну контейнери. Власне, сам документ - це один великий контейнер, який починається з тега <HTML> і закінчується тегом </ HTML>.
На закінчення відзначимо, що при підготовці документів HTML використовується ідентифікатор тексту DTD (Document Type Definition, визначення типу документа) як першого рядка. Це дозволяє браузеру ідентифікувати документ як відповідний стандарту HTML. Зазвичай (але не обов'язково) кожний документ HTML починається з рядка типу:
<! DOCTYPE HTML PUBLIC "- / / W3C / / DTD HTML 4.0
Transitional / / EN ">
Тут міститься інформація про те, що документ відповідає версії HTML 4.0; розробленої W3C; використовувана мова - англійська.
Успіх технології World Wide Web визначений двома основними факторами: простотою і використанням протоколів міжмережевого обміну сімейства TCP / IP, (Transmission Control Protocol, протокол керування передачею / Internet Protocol, протокол Internet), які є основою Internet.
Практично всі користувачі Мережі одночасно одержали можливість спробувати себе як творців і читачів інформаційних матеріалів, опублікованих у Всесвітній павутині. Але й популярність самого Internet багато в чому викликана появою World Wide Web, тому що це перша мережна технологія, яка надала користувачеві простий сучасний інтерфейс для доступу до різноманітних мережевих ресурсів. Простота і зручність застосування привели до зростання числа користувачів WWW і привернули увагу комерційних структур. Далі процес зростання числа користувачів стало лавиноподібним, і так продовжується до цих пір.
При цьому сама технологія на початковому етапі була надзвичайно проста. Справа в тому, що при розробці різних компонентів технології (мови гіпертекстової розмітки HTML (HyperText Markup Language, мова розмітки гіпертексту), протоколу обміну гіпертекстової інформацією HTTP, специфікації розробки прикладного програмного забезпечення CGI та ін) передбачалося, що кваліфікація авторів інформаційних ресурсів та їх оснащеність засобами обчислювальної техніки будуть мінімальними. Одним з компонентів технології створення розподіленої гіпертекстової системи World Wide Web стала мова гіпертекстової розмітки HTML, розроблений Тімом Бернерсом-Лі на основі стандарту мови розмітки друкованих документів - SGML (Standard Generalised Markup Language, стандартний узагальнений мова розмітки). Деніел В. Коннолі написав для нього Document Type Definition - формальний опис синтаксису HTML у термінах SGML.
Розробники HTML змогли вирішити два завдання:
· Надати дизайнерам гіпертекстових баз даних простий засіб створення документів;
· Зробити це засіб досить потужним, щоб відбити що були на той момент подання про інтерфейс користувача гіпертекстових баз даних.
Перше завдання було вирішене за рахунок вибору тегів моделі опису документа. Така модель широко застосовується в системах підготовки документів для друку. Прикладом такої системи може служити добре відомий мову розмітки наукових документів TeX, який був створений Дональдом Кнутом та запропоновано Американським математичним суспільством, і програми його інтерпретації. Мова НТМL дозволяє розмічати електронний документ, який відображається на екрані з поліграфічним рівнем оформлення; результуючий документ може містити найрізноманітніші мітки, ілюстрації, аудіо-та відеофрагменти і так далі. До складу мови ввійшли розвинені засоби для створення різних рівнів заголовків, шрифтових виділень, різні списки, таблиці та багато іншого. Другим важливим моментом, що вплинув на долю HTML, стало те, що в якості основи був обраний звичайний текстовий файл. Вибір був зроблений під впливом наступних факторів:
· Такий файл можна створити в будь-якому текстовому редакторі на будь-якій апаратній платформі в середовищі якої завгодно операційної системи;
· До моменту розробки HTML існував американський стандарт для розробки мережних інформаційних систем - Z39.50, у якому в якості одиниці зберігання вказувався простий текстовий файл у кодуванні LATIN1, що відповідає US ASCII.
Таким чином, гіпертекстова база даних у концепції WWW - це набір текстових файлів, розмічених мовою HTML, який визначає форму подання інформації (розмітка) і структуру зв'язків між цими файлами й іншими інформаційними ресурсами (гіпертекстові посилання). Гіпертекстові посилання, що встановлюють зв'язки між текстовими документами, поступово стали поєднувати всілякі інформаційні ресурси, в тому числі звук і відео; в результаті виникло нове поняття - гіпермедіа. Такий підхід припускає наявність ще одного компонента технології - інтерпретатора мови. В World Wide Web функції інтерпретатора розділені між Web-сервером гіпертекстової бази даних і інтерфейсом користувача. Сервер, крім доступу до документів та обробки гіпертекстових посилань, забезпечує передпроцесорної обробку документів, у той час як інтерфейс користувача здійснює інтерпретацію конструкцій мови, пов'язаних з поданням інформації. Перша версія мови (HTML 1.0) була спрямована на подання мови як такого, де опис його можливостей носило скоріше рекомендаційний характер. Друга версія мови (HTML 2.0) фіксувала практику використання його конструкцій. Версія + + (HTML + +) представляла нові можливості, розширюючи набір тегів HTML убік відображення наукової інформації і таблиць, а також поліпшення стилю компонування зображень і тексту. Версія 3.2 змогла впорядкувати всі нововведення і погодити їх з існуючою практикою. HTML 3.2 дозволяє реалізувати використання таблиць, виконання кодів мови Java, обтікання графіки текстом, а також відображення верхніх і нижніх індексів. Зараз World Wide Web Consortium (W3C) - міжнародна організація, яка займається підготовкою та поширенням документації на опис нових версій HTML - уже опублікувала матеріали специфікації HTML 4.01. Крім можливостей розмітки тексту, включення мультимедіа та формування гіпертекстових зв'язків, вже існували в попередніх версіях HTML, у версію 4.01 включені додаткові засоби роботи з мультимедіа, мови програмування, таблиці стилів, спрощені засоби друку зображень і документів. Для керування сценаріями перегляду сторінок Website (гіпертекстової бази даних, виконаної в технології World Wide Web) можна використовувати мови програмування цих сценаріїв, наприклад, JavaScript, Java і VBScript. Ускладнення HTML і поява мов програмування призвело до того, що розробка Web-вузлів стала справою високопрофесійною, що вимагає спеціалізації за напрямами діяльності й постійного вивчення нових Web-технологій. Але можливості Internet дозволяють користувачам, які володіють основами HTML, створювати і розміщувати власні Web-вузли без більших витрат. Саме на таких користувачів і розрахований пропонований курс.
Принципи гіпертекстової розмітки
HTML є описовим мовою розмітки документів, в ньому використовуються покажчики розмітки (теги). Тегів модель описує документ як сукупність контейнерів, кожен з яких починається і закінчується тегами, тобто документ НТМL представляє собою не що інше, як звичайний АSСII-файл, з доданими до нього керуючими НТМL-кодами (тегами). Оскільки HTML стався від SGML, в ньому дозволено використовувати тільки три керуючих символу: горизонтальну табуляцію, переклад каретки і переклад рядка. Це полегшує взаємодію з різними операційними системами. Теги НТМL-документів в більшості своїй прості і зрозумілі, бо вони утворені за допомогою загальновживаних слів англійської мови, зрозумілих скорочень і позначень. НТМL-тег складається з імені, за яким може слідувати необов'язковий список атрибутів тега. Текст тега полягає в кутові дужки ("<" і ">"). Найпростіший варіант тега - ім'я, укладену в кутові дужки, наприклад, <HEAD> або <I>. Для ряду тегів характерна наявність атрибутів, які можуть мати конкретні значення, що встановлюються автором для зміни функції тега.Наприклад, при описі таблиці відкриває тег з атрибутами може виглядати так:
<TABLE WIDTH = 570 ALIGN = center CELLPADDING = 10
CELLSPACING = 2 BORDER = 16>
Цей запис означає наступне: таблиця шириною 570 пікселів, вирівняна по центру, полі між рамкою і вмістом осередків 10 пікселів, поле рамки 2 пікселя, ширина бордюру 16 пікселів.
Атрибути тега слідують за ім'ям і відокремлюються одне від одного одним або декількома знаками табуляції, пробілами або символами повернення до початку рядка. Порядок запису атрибутів в тезі значення не має. Значення атрибуту, якщо таке є, слід за знаком рівності, хто стоїть після імені атрибута. Якщо значення атрибуту - одне слово або число, то його можна просто вказати після знаку рівності, не виділяючи додатково. Всі інші значення необхідно укладати в одинарні або подвійні лапки, особливо якщо вони містять кілька розділених пробілами слів. Довжина значення атрибуту обмежена 1024 символами. Регістр символів в іменах тегів і атрибутів не враховується, чого не можна сказати про значення атрибутів. Наприклад, особливо важливо використовувати потрібний регістр при введенні URL (Uniform Resource Locator, уніфікований покажчик ресурсу) інших документів в якості значення атрибуту HREF.
Найчастіше елементи розмітки HTML або HTML-контейнери складаються з початкового і кінцевого компонентів, між якими розміщуються текст та інші елементи документа. Ім'я кінцевого тега ідентично імені початкового, але перед ім'ям кінцевого тега ставиться коса риса (/) (наприклад, для тега стилю шрифту - курсив <I> закриває пара представляє собою </ I>, для тега заголовка <ТIТLЕ> закриває парою буде </ ТIТLЕ>). Кінцеві теги ніколи не містять атрибутів. За своїм значенням теги близькі до поняття дужок "begin / end" в універсальних мовами програмування, які задають області дії імен локальних змінних і т.п. Теги визначають область дії правил інтерпретації текстових документів. При використанні вкладених елементів розмітки в документі слід дотримуватися особливої акуратність. Вкладені теги потрібно закривати, починаючи з останнього. Деякі елементи розмітки не мають кінцевого компонента, оскільки є автономними елементами. Наприклад, тег зображення <IMG>, який служить для вставки в документ графічного зображення, кінцевого компоненту не вимагає. До автономних елементів розмітки також відносяться розрив рядка (<BR>), горизонтальна лінійка (<HR>) і теги, що містять таку інформацію про документ, яка не впливає на його відображуване вміст, наприклад, теги <META> і <BASE>. У деяких випадках кінцеві теги в документі можна опускати. Більшість браузерів влаштовано так, що при обробці тексту документа початковий тег сприймається як кінцевий тег попереднього. Найпоширеніший тег такого типу - тег абзацу <р>. Оскільки він використовується в документі дуже часто, його зазвичай ставлять тільки на початку кожного абзацу. Коли один абзац закінчується, наступний тег <Р> сигналізує браузеру про те, що потрібно завершити цей абзац і почати наступний. Більшість авторів тегом кінця абзацу не користуються. Є й інші кінцеві теги, без яких браузери відмінно працюють, наприклад, кінцевий тег </ HTML>. Тим не менш, рекомендується включати по можливості більше кінцевих тегів, щоб уникнути плутанини і помилок при відтворенні документа. Для стислості та образності ми будемо в ряді випадків замість словосполучення "елемент розмітки" застосовувати термін "контейнер". Загальна схема побудови контейнера у форматі HTML може бути записана в наступному вигляді:
"Контейнер" =
<"Ім'я тега" "список атрибутів">
зміст контейнера
</ "Ім'я тега">
Слід зазначити, що в літературі крім терміна "контейнер" ще використовується і термін "елемент". Слід бути уважним, щоб не плутати контейнер (наприклад, BODY) та теги (BODY), використовуваний при формуванні контейнера. Крім тегів, елементами HTML є CER (Character Entity Reference), вони призначені для представлення спеціальних символів в документі HTML, які можуть бути неправильно оброблені браузером. Припустимо, створюється документ HTML, мова в якому йде про елементи цієї мови. Якщо вказати ім'я тега <BODY> просто в документі, браузер може сприйняти його як безпосередньо старт-тег. Для виведення таких символів і використовується CER. Наприклад, щоб представити символ "<" в документі HTML, потрібно замінити його на <, а символ ">" - на>. Тобто, якщо вказати в тексті HTML рядок <BODY>, вона буде виглядати на екрані як текст <BODY>.
Може виникнути питання: як бути з символами "</>", "&" і зі спеціальними символами, типу знака наголоси? Можна виводити їх, використовуючи відповідні CER, наприклад для "&" це буде &, і т. д. Якщо подивитися на структуру будь-якого документа HTML, оскільки кожен з них починається з амперсанда "&". На відміну від найменувань тегів HTML, найменування CER чутливі до регістру символів. Також найменування CER можуть задаватися у вигляді імені, а за допомогою тризначних кодів символів у вигляді & # nnn;. Далі в таблиці наведені найбільш часто використовувані CER і відповідні їм числові коди.
| Числовий код | Іменна заміна | Символ | Опис |
| " | " | " | Лапки |
| & | & | & | Амперсанд |
| < | < | < | Менше |
| > | > | > | Більше |
| | | Нерозривний пробіл | |
| ¡ | ¡ | Ў | Перевернутий знак оклику |
| ¢ | ¢ | ў | Цент |
| £ | £ | Ј | Фунт |
| ¤ | ¤ | ¤ | Валюта |
| ¥ | ¥ | Г | Йена |
| ¨ | ¨ | Е | Умляут |
| © | © | © | Копірайт |
| « | « | « | Ліва кутова лапки |
| ® | ® | ® | Зареєстрована торгова марка |
| ± | ± | ± | Плюс чи мінус |
| » | » | » | Права кутова лапки |
Групи тегів НТМL
Всі теги НТМL за їх призначенням і області дії можна розділити на наступні основні групи:· Визначають структуру документа;
· Оформлення блоків гіпертексту (параграфи, списки, таблиці, картинки);
· Гіпертекстові посилання і закладки;
· Форми для організації діалогу;
· Виклик програм.
Структура гіпертекстової мережі задається гіпертекстовими посиланнями. Гіпертекстова посилання - це адреса іншого HTML-документа або інформаційного ресурсу Internet, який тематично, логічно або будь-яким іншим способом пов'язаний з документом, в якому посилання визначена. Природно, при таких умовах дуже важлива схема адресації всіх наявних інформаційних ресурсів.
Реальний механізм інтерпретації ідентифікатора ресурсу, що спирається на URI (Uniform Resource Identifier, універсальний ідентифікатор ресурсу), називається URL, і користувачі WWW мають справу саме з ним.
Типовим прикладом використання такого запису можна вважати наступний приклад:
Цей текст містить:
<A HREF="http://www.intuit.ru/help/index.html">
гіпертекстове посилання </ A>
Виглядати це буде наступним чином: (відкрити)
У наведеному вище прикладі тег "A", який в HTML називають якорем (anchor), використовує атрибут HREF, що позначає гіпертекстове посилання (Hypertext Reference), для запису цього посилання у формі URL. Це посилання вказує на документ з ім'ям "index.html" в каталозі "help" на сервері "www.intuit.ru", доступ до якого здійснюється по протоколу HTTP. Гіпертекстові посилання у HTML діляться на два класи: контекстні гіпертекстові посилання і загальні. Контекстні посилання вмонтовані в тіло документа, як це було продемонстровано у попередньому прикладі, в той час як загальні посилання пов'язані з усім документом у цілому і можуть використовуватися при перегляді будь-якого фрагмента документа. Обидва класи посилань спочатку присутні в стандарті мови, однак перший час найбільшою популярністю користувалися контекстні посилання. Ця популярність призвела до того, що механізм використання загальних посилань практично повністю "атрофувався". У даному прикладі ми уклали URL в подвійні лапки. Насправді, це необов'язково. Лапки (подвійні або одинарні) застосовуються тільки тоді, коли посеред значення URL з'являються символи-роздільники (пробіл, табуляція, неотображаемие символи). Але такого сорту URL слід всіляко уникати. Структура HTML-документа дозволяє задіяти вкладені одна в одну контейнери. Власне, сам документ - це один великий контейнер, який починається з тега <HTML> і закінчується тегом </ HTML>.
На закінчення відзначимо, що при підготовці документів HTML використовується ідентифікатор тексту DTD (Document Type Definition, визначення типу документа) як першого рядка. Це дозволяє браузеру ідентифікувати документ як відповідний стандарту HTML. Зазвичай (але не обов'язково) кожний документ HTML починається з рядка типу:
<! DOCTYPE HTML PUBLIC "- / / W3C / / DTD HTML 4.0
Transitional / / EN ">
Тут міститься інформація про те, що документ відповідає версії HTML 4.0; розробленої W3C; використовувана мова - англійська.