Стандарти управління життєвим циклом ПЗ (ISO12207, ISO15504). Основи управління якістю розробки. Стандарти серії ISO9000. - Програмна інженерія

Кафедра інноваційних та
інформаційних технологій
в освіті
Вінницький державний
педагогічний університет
імені Михайла Коцюбинського

Програмна інженерія

Перейти к контенту

Главное меню:

Стандарти управління життєвим циклом ПЗ (ISO12207, ISO15504). Основи управління якістю розробки. Стандарти серії ISO9000.

Лабораторні роботи
Тема: Аналіз якості програмного продукту
Мета: навчитися проводити функціональне тестування та оптимізацію проекту
Матеріально-технічне забезпечення та обладнання: персональний комп'ютер, програмне забезпечення, інструкційні картки, роздатковий матеріал
Література:
1. Гончаров А. HTML в примерах. – СПб.: Питер, 2007. – 192 с.
2. Жадаев А.Г. Самоучитель HTML. – К.: Юниор, 2009. – 296 с.
Теоретичні відомості
ЕФЕКТИВНІ ТЕГИ ДЛЯ ОПТИМІЗАЦІЇ САЙТУ
Мета-теги є командами для web-сервера або браузера, які не впливають на відображення сторінки. З погляду оптимізації мета-теги є важливими об'єктами, правильна робота з якими – запорука успіху при створенні ефективного сайту.
ОПТИМІЗАЦІЯ РОЗДІЛУ HEAD
Частина початкового коду, що знаходиться в верхній частині сторінки, відноситься до найважливіших зон, які повинні знаходитися під пильною увагою оптимізатора. Максимальна простота коду є одним їх найважливіших чинників, який повинен враховувати оптимізатор при роботі з розділом Head.
Більшість неоптимізованих сайтів складаються із сторінок, у яких даний розділ захаращений не істотною для пошукової системи інформацією, що заважає ефективній роботі спайдерів. Їм доводиться розгрібати купу сміття, щоб докопатися до ключових слів, які розташовані в найважливіших тегах, наприклад, в Title. Проте, як показує практика, в неоптимізованих сторінок найбільш важливі теги розташовуються ближче до кінця розділу заголовка.
Особливо грішать надмірним кодом розділу Head сторінки, що створені у візуальних HTML-редакторах. Структура документа, що автоматично генерується, поповнюється тегами, які оголошують про використаний програмний засіб, містять різні коментарі, інформацію про автора або організацію, до якої належить сайт (тег Copyright), тощо. Досить часто розробники сторінок додають в розділ Head мета-теги, що чітко регламентують роботу індексуючого павука з даною сторінкою (Robots (управління поведінкою пошукових роботів на сторінці), Revisit (управління повторними відвідинами сторінки роботом) і ін. Проте сучасні роботи часто не прислухаються до виписаних рекомендацій і сканують мережні ресурси за своїми методиками.
Необхідно ретельно обґрунтовувати наявність на початку початкового коду сторінки кожного тегу та уникати тих тегів, які жодним чином не впливають на результативність оптимізації сайту. «Зайві» теги не привносять на сторінку нічого корисного, оскільки не можуть містити ключових фраз і, відповідно, не грають ніякої ролі в підвищенні релевантності сторінки.
Отже, розділ Head сторінки не повинен містити тегів, що не несуть інформаційного навантаження для пошукової системи. На перших позиціях повинні бути розміщені елементи, вміст яких підвищує релевантність сторінки.
ТЕГ ЗАГОЛОВКУ СТОРІНКИ TITLE
Вміст тегу Title є найважливішим чинником, що враховується при розрахунку релевантності сторінки. Він має розташовуватися якомога ближче до початку сторінки. Головне правило при оптимізації тегів заголовків сторінок полягає в тому, що кожна сторінка повинна мати свій унікальний Title. Оптимальна довжина вмісту тега – до 80 символів. Довший текст заголовка не приносить користі для відвідувача сайту, оскільки він продовжується за видиму область вікна браузера, а також може бути сприйнятий пошуковою машиною як спам.
Ключові слова необхідно писати на самому початку заголовка і старатися їх не повторювати. Іноді дублювання ключових слів все ж таки допускається за умови, що елементи фрази, що повторюються, не слідують один за одним.
Слова, що вказані в тегу Title, відображаються у вигляді посилання на сторінці результатів пошуку, натиснувши на яку, користувачі переходять з пошукової системи на сторінку сайту. Тому вміст тега заголовка сторінки повинен бути ємким та інформативним.
Тег заголовка необхідно писати для сторінки тільки один раз. Метод використання декількох тегів Title з метою збільшення кількості ключових слів, що доступні для пошуковика, відноситься до спамерських методів оптимізації.
Не слід використовувати в тегу слова, повністю написані прописними буквами, якщо в цьому немає особливої необхідності. Якщо в тексті використовуються розділові знаки, то вони повинні бути притиснуті до слова праворуч від нього, після чого повинен стояти пропуск. Слова, набрані в тегу Title через п р про б е л, сприймаються пошуковою системою як група незв'язних символів.
Отже, по значущості для визначення позиції сторінки в результатах пошуку тег Title грає найважливішу роль безпосередньо після оптимізації вмісту самої сторінки.
МЕТА ТЕГИ
Мета теги використовуються для опису властивостей HTML документа і повинні знаходиться в рамках тегу HEAD. Якщо в документі використовується тег TITLE, то мета теги рекомендується вставляти в документ після нього.
Мета теги мають широку функціональну спрямованість, але багато що ще не стандартизованим або знаходиться на стадії розробки.
Мета теги можуть ідентифікувати авторство HTML документа, його адресу і як часто він оновлюється. Пошукові системи використовують мета теги для індексації і формування заголовків HTML документів.
Мета теги можуть впливати на режим відображення HTML документів, хоча самі на екран не виводяться.
Далі будуть описані мета теги, прийняті більшістю постачальників послуг і програм для мережі Інтернет.
Мета теги поділяються на дві групи: NAME і HTTP-EQUIV.
Мета теги типа NAME містять текстову інформацію про документ, його автора і певні рекомендації для пошукових машин. Наприклад: Robots, Description, Keywords, Author, Copyright.
Мета теги типа HTTP-EQUIV впливають на формування заголовка документа і визначають режим його обробки.
ОПИС МЕТА ТЕГОВ ГРУПИ NAME:
  • Мета тег Author
Мета тег Copyright
  • Мета тег Description
  • Мета тег Document-state
  • Мета тег Generator
  • Мета тег Keywords
  • Мета тeг Resource-type
  • Мета тeг Revisit
  • Мета тeг Robots
  • Мета тeг Subject
  • Мета тeг URL
    AUTHOR, COPYRIGHT
    Ці теги не відбиваються браузерами, але обробляються деякими пошуковими машинами. Як правило, немає необхідності використовувати ці теги одночасно. В більшості випадків достатньо одного інформаційного тега, що дозволяє ідентифікувати автора або приналежність документа.
    Тег Author повинен містити ім'я автора, якщо сайт належить організації, має сенс використовувати тег Copyright. Інформація обов'язково повинна полягати в лапки, наприклад
    <META Name= Author content="Іванів Петро">.
    Додатково інформаційні теги можуть містити атрибут "Lang", що вказують мову, на якій написано значення властивості.
    Приклад: <META Name= Author Lang="ua" content=" Іванів Петро ">.
    DESCRIPTION
    Вміст мета-тегу є коротким описом сторінки сайту. Відношення пошукових систем до даного тегу є різним і іноді непередбачуваним. Тому, щоб підвищити рейтинг сайту, заповнювати цей тег потрібно завжди. При цьому найбільш важливі ключові слова треба розташовувати якомога ближче один до одного, але не поряд.
    Досить часто тег Description заповнюється текстовою послідовністю, що складається тільки з ключових слів. Необхідно уникати подібної надмірності і прагнути формувати вміст описового тега у вигляді правильної читабельної пропозиції. Окрім того, треба не забувати про те, що ключові слова, під які оптимізується як мета-тег Description, так і інші елементи HTML-коду, обов'язково повинні з відповідною частотою зустрічатися безпосередньо в тексті сторінки.
    Для кожної сторінки бажано складати власний текст тегу опису з врахуванням тих, ключових слів, під які вона оптимізується.
    Пошукові системи встановлюють різні норми по обмеженню довжини цього тега і залежно від цього сприймають тільки задану кількість символів. Оптимальна довжина оптимізованого тегу опису не повинна перевищувати 150 символів.
    Деякі пошуковики аналізують вміст цього тегу і враховують наявність в ньому ключових слів при розрахунку релевантності сторінки, інші – ні. Першу категорію пошуковиків також можна розділити на ті, які виводять вміст тега опису в результатах пошуку відразу після тегу заголовка сторінки Title, і ті, які беруть як опис перші 150-200 (до 256) символів тексту, що відображено на сторінці. Не рекомендується застосовувати досить поширений метод копіювання в мета-тег Description вміст тегу заголовка Title, а також використовувати теги Description і/або Title як ще один тег Keywords.
    Основною функцією тегу опису - попереднє інформування користувача про те, чому присвячена сторінка, яка видається як результат пошуку. Тому текст тегу повинен бути коротким, ясним, не мати яскраво виражений рекламний характер, оскільки найчастіше саме за цією інформацією користувач вирішує, переходити на дану сторінку чи ні.
    Приклад: <META Name="Description" content= ". . .">
    DOCUMENT-STATE
    Мета тег Document-state - призначений для управління індексацією пошукових роботів. Може мати два значення:
    • Static - Немає необхідності індексувати цю сторінку в майбутньому.
    Dynamic - Індексувати цю сторінку регулярно (за умовчанням).
    Режим "Static" призначений для сторінок, які не міняються в принципі. Якщо зміст вашої сторінки періодично міняється, то використовувати цей тег необов'язково.
    Приклад: <META Name="Document-state" content ="Dynamic">
    GENERATOR
    Мета тег Generator - це всього лише один з тегів, що широко використовуються генераторами HTML коду в своїх цілях. Він зазначає редактор, за допомогою якого було створено сторінку. Як правило, для власника сайту ці теги не несуть корисного навантаження.
    <META Name=”Generator” Content=”Microsoft Notepad”>
    KEYWORDS
    Мета тег Keywords використовується пошуковими машинами для оцінки релевантності.
    Слова, що містяться в тегу Keywords, розглядаються пошуковими машинами як рекомендація, але іноді саме цієї інформації бракує.
    При формуванні списку ключових слів для мета тегу Keywords необхідно використовувати слова, що містяться в тексті документа. Слова, що не містяться в тексті, можна використовувати в дуже невеликих кількостях, два - три слова. Вставляти їх треба в кінець списку.
    Ключові слова не повинні повторюватися в тегу Keywords, в крайньому випадку, не більше двох разів.
    У мета тегу Keywords має сенс використовувати не більше 10 слів, більша кількість не покращує релевантності.
    В більшості випадків пошукові машини знаходять ключові слова, що стоять в множині (cats), навіть якщо пошук заданий в однині (cat). Тому рекомендується в тег Keywords заносити англійські іменники в множині.
    Роботи деяких пошукових машин не переходять до нового рядка при аналізі мета тегу Keywords, тому не рекомендується розбивати його на декілька рядків.
    Приклад: <META Name="Keywords" content="пример, meta, теги">
    Якщо документ написаний на декількох мовах, можна використати додатковий атрибут lang для вибору кодування (дивися опис мета тегу Content-Language).
    Приклад:
    <META Name="Keywords" lang="ua" content="приклад, meta теги">
    <META Name="Keywords" lang="en-us" content="meta tegs, example">
    Але краще зробити окремі сторінки на різних мовах з переходами з однієї на іншу, за допомогою тегов <A> чи <Link>.
    RESOURCE-TYPE
    Мета тег Resource-type - описує стан даного документа. Якщо його значення відрізняється від “Document”, то пошукові системи його не індексуватимуть.
    Призначений для використання в крупних проектах, з множиною документів різного типу.
    Можливі значення:
    • Build
    Classification
  • Creation
  • Document - Приймається за замовченням.
  • Formatter
  • Host
  • Operator
  • Random text
  • Rating
  • Site-languages
  • Subject
  • Template
  • Version
    Приклад: <META Name="Resource-type" content ="Document">
    REVISIT
    Мета тег Revisit - вказує пошуковому роботу, за скільки днів йому потрібно повернутися і переіндексувати даний документ.
    Приклад (приходити раз в тиждень): <META Name="Revisit" content="7">
    ROBOTS
    Мета тег Robots - містить вказівки для роботів пошукових машин, що збирають інформацію про HTML документи у мережі.
    Значення Robots може складатися з наступних директив, що розділені комами:
    • Index - ця сторінка повинна бути індексована.
    Noindex - ця сторінка не повинна індексуватися.
  • Follow - простежувати гіперпосилання на сторінці.
  • Nofollow - не простежувати гіперпосилання на сторінці.
  • All - = index, follow (прийнято за умовчанням).
  • None - = noindex, nofollow.
    Тег <META name=Robots content="all"> нічого не змінює в роботі робота пошукової машини, оскільки значення "all" прийняте за умовчанням.
    Але якщо ця сторінка створюється динамічно або часто оновлюється, то немає сенсу її індексувати, оскільки інформація про сторінку в пошуковій машині та її дійсний зміст будуть різними. В цьому випадку можна рекомендувати пошуковій машині не індексувати цю сторінку, а тільки відстежувати на ній гіперпосилання, що б проіндексувати решту частини сайту <META name=Robots content="noindex,follow">.
    При використанні тегу, що забороняє відстежування гіперпосилань <META name=Robots content="index,nofollow"> частина сайту може залишитися не проіндексованою, оскільки всередині сайту роботи переміщаються по гіперпосиланням. Сторінки, перехід на які є  заблокованим, індексуватися не будуть.
    Мета тег Robots має пріоритет над директивами управління, що задані у файлі robots.txt.
    SUBJECT
    Мета тег Subject використовується пошуковими машинами для визначення тематики документа. Але, поки пошукові системи не погодять класифікаційні таблиці, використання цього тегу не завжди є виправданим.
    URL
    Мета тег URL - призначений для виключення з індексації згенерованих сторінок та дзеркал. Зустрівши цей тег, робот пошукової машини повинен припинити індексацію поточного документа і перейти по вказаному посиланню.
    Приклад: <META Name="URL" content= "http://www.Main-Site.com">
    ОПИС МЕТА ТЕГІВ ГРУПИ HTTP-EQUIV:
    • Мета тeг Content-Language
    Мета тeг Content-Script-Type
  • Мета тeг Content-Style-Type
  • Мета тeг Content-Type
  • Мета тeг Expires
  • Мета тeг PICS-Label
  • Мета тeг Pragma
  • Мета тeг Refresh
  • Мета тeг Set-Cookie
  • Мета тeг Window-target
    CONTENT-LANGUAGE
    Мета тег Content-Language - це вказівка на мову документа. Використовується пошуковими машинами при індексуванні. Хоча більшість з них вміють розрізняти мову за текстом сторінки.
    Можливі значення (стандарт [ISO639] [ISO3166]):
    ua
    Українська
    ru
    Російська
    de
    Німецька
    el
    Грецька
    en
    Англійська
    en-GB
    Англійська - Великобританія
    en-US
    Англійська, Американська версія
    en-cockney
    Англійська, діалект цокни
    Es
    Іспанська
    Fr
    Французька
    It
    Італійська
    i-navajo
    Навахо - Північна Америка
    ja
    Японська
    he
    Іврит
    nl
    Голландська
    pt
    Португальська
    x-klingon
    Код "x" позначає експериментальний код мови
    zh
    Китайська
    Приклад: <META HTTP-EQUIV="Content-language" content ="ua">
    У специфікації HTML 4.0 є альтернативна можливість явної вказівки мови - <html lang="en">
    CONTENT-SCRIPT-TYPE
    Meta тег Content-Script-Type - визначення мови програмування сценаріїв.
    Деякі з можливих значень:    
    text/javascript
    JavaScript (значення за замовченням)
    text/perlscript
    PerlScript
    text/tcl
    TCL
    text/vbscript
    VBScript
    Приклад: <META HTTP-EQUIV="Content-Script-Type" content="text/javascript">
    Якщо тег Content-Script-Type не використовується, то тип мови програмування сценаріїв, який відрізняється від прийнятого за замовченням, повинен бути вказаний безпосередньо в кожному тегу <SCRIPT>, приклад <SCRIPT type="text/javascript">.
    В одному документі допускається використання декількох мов програмування сценаріїв. Вказівка мови в тегу <SCRIPT> має вищий пріоритет, в рамках поточного тега <SCRIPT>.
    CONTENT-STYLE-TYPE
    Мета тег Content-Style-Type - вказує мову таблиці стилів, значення "text/css" приймається за замовченням, якщо воно влаштовує і розробник не використовує в цьому документі теги <Style> і <Span>, то використовувати цей тег необов'язково.
    Приклад: <META HTTP-EQUIV="Content-Style-Type" content="text/css">
    Браузери визначають мову таблиць стилів за наступним алгоритмом:
    • Якщо в тегу  МЕТА задається мова таблиць стилів, то дійсним є останнє зазначення в потоці символів.
    Якщо мова таблиць стилів задається в тегу STILE, мову таблиць стилів визначає останній заголовок в потоці символів.
  • Якщо мова таблиць стилів не задана, за замовченням використовується мова "text/css".
    CONTENT-TYPE
    Мета тег Content-Type – вказівка на тип документа і кодування символів.
    Використовувати мета тег Content-Type потрібно з врахуванням певних нюансів.
    1. кодування символів тексту повинно відповідати кодуванню, що вказано в тегу.
    сервер не повинен міняти кодування тексту при обробці запиту браузера.
  • якщо сервер міняє кодування тексту, він повинен скоректувати або вилучити мета тег Content-Type.
    Недотримання цих вимог може привести до наступного: web-сервер автоматично визначить кодування запиту клієнта і віддасть сторінку web-браузеру перекодованою. Браузер, у свою чергу, читатиме документ відповідно до мета тегу Content-Type. І якщо кодування не збігаються, то прочитати документ можна буде тільки після ряду хитромудрих маніпуляцій. Особливо це характерно для старих браузерів IE 3.x - 4.x і Netscape 4.x.
    Увага! Мета тег Content-Type часто вставляється генераторами HTML коду.
    Деякі з можливих типів кодування (стандарт [ISO10646]):
    ISO-8859-1
    Latin-1, для більшості західноєвропейських мов
    Windows-1251
    Кирилиця (Windows)
    KOI8-r
    Кирилиця (КОИ8-Р)
    cp866
    Кирилиця (DOS)
    Windows-1252
    Західна Європа (Windows)
    Windows-1250
    Центральна Європа (Windows)
    shift_jis
    Японія (Windows)
    Приклад: <META HTTP-EQUIV=”Content-Type” content="text/html; charset=windows-1251">
    EXPIRES
    Мета теги Expires - керують кешуванням. Якщо дата, що вказана в тегу пройшла, то браузер повинен зробити повторний мережний запит, а не використовувати копію з кешу. Якщо відразу вказати минувшу дату, то документ не кешуватися не буде.
    Деякі пошукові роботи можуть відмовитися індексувати документ із застарілою датою.
    Дата повинна вказуватися в стандарті [RFC850].
    Приклад: <META HTTP-EQUIV="Expires" content="Wed, 26 Feb 2008 08:21:57 GMT">
    PICS-LABEL
    Мета тег      PICS-Label - (Platform-Independent Content rating Scheme Label) ) визначає рівень доступності сайту (sex, violence), але може використовуватися і в інших цілях.
    PRAGMA
    Pragma - Контроль кешування. При значенні “no-cache” кешування даного сайту не рекомендується. Призначений для документів, що створюються в результаті роботи скрипта.
    Приклад: <META HTTP-EQUIV="Pragma" content ="no-cache">
    REFRESH
    Мета тег Refresh - визначення затримки часу в секундах, після якої браузер автоматично оновлює документ. Додаткова можливість - автоматичне завантаження іншого документа.
    Приклад: <META HTTP-EQUIV="Refresh" content ="4; URL=http://www.name.com/">
    Якщо потрібно просто відновити документ, то URL вказувати не обов'язково.
    SET-COOKIE
    Set-Cookie - налаштування cookie браузера.
    Приклад: <META HTTP-EQUIV="Set-Cookie" content="NAME=value; EXPIRES=date; DOMAIN=domain_name; PATH=path; SECURE">
    Атрибути EXPIRES, DOMAIN, PATH і SECURE при необхідності можна опустити.
    Приклад: <META HTTP-EQUIV="Set-Cookie" content="NAME=value;">NAME
    Ім'я cookie, не може містити символи перенесення рядка, пропусків, крапки з комою (;) і табуляції.
    EXPIRES
    Час зберігання cookie. Після вказаної дати (в форматі "Wdy, DD-Mon-YYYY HH:MM:SS GMT") закінчується час зберігання cookie.
    Якщо цього атрибуту не вказано, то cookie зберігається протягом одного сеансу, до закриття браузера.
    DOMAIN
    Домен, для якого задається значення cookie. Для доменів COM, EDU, NET, ORG, GOV, MIL, INT значення можна задавати скорочено "MY.COM", воно буде розповсюджено і на домен "WWW.MY.COM". Для всіх інших (у тому числі і RU) значення треба задавати повністю "WWW.MY.RU".
    Якщо цього атрибуту не вказано, то за замовченням використовується доменне ім'я сервера, з якого було виставлено значення cookie.
    PATH
    Встановлює підмножину документів, на які розповсюджується дія cookie. При значення "/doc" дія cookie буде поширена на всі файли і каталоги в цій директорії, які починаються на "doc" (/doc/, /document/, /doc2/, docs.html, doc-test.htm).
    Якщо цього атрибуту не вказано, то значення cookie розповсюджується тільки на документи директорії, в якій розташовано поточний документ.
    SECURE
    Вказує, що інформація про cookie буде пересилатися за протоколом HTTPS (HTTP з використанням SSL). Інакше інформація про cookie буде пересилається за протоколом HTTP.
    Перед запитом до серверу, браузер перевіряє cookie. І якщо атрибути NAME, DOMAIN і PATH збігаються, тоді браузер посилає cookie до серверу.
    Якщо cookie приймає нове значення, старе значення знищується.
    Браузер має ряд обмежень по роботі з cookie:
    • Одноразово може зберігатися не більше 300 значень cookie.
    Cookie не може перевищувати 4 Кбайт.
  • Від одного сервера (домена) не може бути більше 20 cookie.
    Ці обмеження можуть бути дещо іншими, залежно від налаштування та типу браузера.
    Якщо відбувається перевищення ліміту (загального або по домену) знищується перший за часом запис. Знищення відбувається, не залежно від значення атрибуту EXPIRES.
    При перевищенні 4 Кбайт, cookie усікається.
    Приклад: <META HTTP-EQUIV="Set-Cookie" content="NAME=cookexample; EXPIRES=Monday, 22-FEB-08 21:11:51 GMT; DOMAIN=WWW.MY.RU; PATH=/; SECURE">
    WINDOW-TARGET
    Мета тег Window-target - визначає вікно поточної сторінки. Приведений приклад можна використати для припинення появи нових вікон браузера при застосуванні фреймових структур. Діє для багатьох (але не для всіх) браузеров.
    Приклад: <META HTTP-EQUIV="Window-target" content ="_top">
    ВИСНОВКИ
    При проведенні оптимізації слід уникати використання стратегії багатократного повторення ключових слів або фраз з метою підвищення релевантності сторінки. Правило оптимального включення ключової фрази в теги можна сформулювати так: необхідно використовувати один раз ключову фразу в тегу Title, один-два рази (але не більше) помістити її в тег опису Description, декілька варіацій або версій ключової фрази включити в тег ключових слів Keywords.
    Теги Title, Description і Keywords повинні розташовуватися в один рядок без розривів і перенесень рядка. Звичайна практика розміщення тегів в окремих рядках часто приводить до ускладнень в роботі роботів при читанні тегів.
    При аналізі сайту необхідно ретельно розбирати по кісточках скелет кожної сторінки і подивитися на нього очима пошукової системи. Час, витрачений на детальне вивчення початкового коду та його оптимізацію, окупиться досягненням сайту високих позицій в результатах пошуку.
    ЗАСОБИ CSS
    Каскадні таблиці стилів або CSS (від англійського Cascading Style Sheets) є подальшим розвитком HTML і надає перехід на якісніший рівень представлення інформації. Таблиці стилів дозволяють розділити смисловий вміст сторінки та його оформлення.
    У перших версіях стандарту HTML не було передбачене ніяких засобів для управління зовнішнім виглядом інформації. Загальна концепція гіпертексту була направлена на доступність інформації для будь-яких пристроїв, здатних відтворювати текст. Для розмітки рекомендувалося використовувати лише логічні теги, що визначають заголовки, підзаголовки, переліки, абзаци, цитати і т.д., – тобто, ті елементи, які і складають структуру документа. Інтерпретація ж зовнішнього вигляду залишалася повністю на совісті кінцевого монітору.
    Проте з тих пір багато що змінилося. Зараз все оформлення рекомендується виносити в зовнішній стильовий файл. Основна ж сторінка міститиме лише інформацію і посилання на необхідні стилі.
    Таблицю стилів потрібно написати лише і вона має бути єдиною для цілого сайту, і тоді, не потрібно буде повторювати одні і ті ж описи стилів на кожній із сторінок.
    Розміщення всієї стильової інформації в одному зовнішньому файлі відкриває інші корисні можливості – адже змінивши вміст лише одного (!) стильового файлу, можна в лічені секунди змінити весь дизайн сайту. Причому жодних інших переробок не знадобиться. Зрозуміло, це вірно лише в тому випадку, якщо спочатку сайт був спроектований вірно.
    ПРЕДСТАВЛЕННЯ ТЕКСТУ НА WEB-СТОРІНКАХ
    При створенні професійної графіки для Web використовується текст із згладженими краями. Згладжування – це легка розмитість на нерівних краях, що згладжує переходи між кольорами. Не згладжені краї, навпаки, виглядають зазубленими і ступінчастими. Виключенням з цього загального правила є текст малого розміру, (10, 11 пунктів і менше), застосування згладжування робить його практично невиразним. Текст малих розмірів виглядатиме набагато краще без згладжування.
    ТИПИ ШРИФТІВ
    При розробці Web-сторінки засобами базового HTML є два комплекти шрифтів: пропорційний і шрифт фіксованої ширини.
    Пропорційний шрифт – інакше "шрифт змінної ширини" для кожного символу виділяє різну кількість місця залежно від його зображення. Наприклад, в пропорційному шрифті заголовна "W" займає більше місця в рядку по горизонталі, ніж прописна "I". Такі гаринітури, як: Times, Helvetica і Arial є прикладами пропорційних шрифтів.
    Web-браузери для більшості текстів на Web-сторінці, включаючи основний текст, заголовки, списки, цитати і т. д., використовують пропорційні шрифти. Як правило, великі уривки основного тексту зручніше читати, коли вони надруковані пропорційними шрифтами. Оскільки більшість користувачів не мають часу замінити шрифти, встановлені за замовчуванням, з великою вірогідністю можна припустити, що текст на сторінці буде відображений шрифтом Times розміром 10 або 12 пунктів або Helvetica. Але це всього лише загальне правило.
    Шрифт з фіксованою шириною надає однакове місце для всіх символів шрифту. Заголовна "W" займає не більше місця, чим прописна "I". Прикладами шрифтів фіксованої ширини є гарнітури Courier і Monaco. У Web-браузерах шрифти фіксованої ширини використовуються для відображення будь-якого тексту всередині наступних HTML-тегів: <рге>, <tt>, <code>, <kbd>,<samp>, <хтр>.
    Оскільки багато людей не міняють налаштування шрифтів, що встановлені за замовченням, текст, що знаходиться у вказаних тегах, буде виведений одним з шрифтів типа Courier.
    ТЕКСТ В ЗОБРАЖЕННЯХ
    Дизайнери швидко зрозуміли, що найвірніший спосіб абсолютного контролю над шрифтами – помістити текст в зображення. Можна часто бачити заголовки, підзаголовки і оголошення, що виконані у вигляді файлів GIF.
    Переваги використання графіки замість HTML-тексту:
    • можна визначати тип шрифту, розмір, интерлиньяж, проміжок між буквами, колір і вирівнювання – всі атрибути, які викликають складнощі тільки в HTML;
    ваша сторінка буде однакова при висновку у всіх графічних браузерах.
    Але у цього методу є ряд недоліків:
    • зображення завантажується довше, ніж текст, оскільки графічні файли зазвичай важать більше, ніж HTML-тексти, що мають той же зміст;
    у неграфічних браузерах зміст втрачається. Користувачі, які не можуть (або не хочуть) проглядати графіку, не побачать і тексту. Альтернативний текст (використовується атрибут Alt) на місці графічного зображення допомагає, але його можливості обмежені і це не завжди надійний спосіб ототожнення графічної інформації;
  • інформацію, що знаходиться в зображенні, не можна індексувати або організувати її пошук. В результаті виключаються з документа важливі частини інформації.
    РОЗМІР ШРИФТУ
    Зазвичай розмір шрифту визначається в пунктах (72 пункти (пт) = 1 дюйм висоти шрифту) але, на жаль, ці розміри не достатньо точно переводяться між платформами. Частково це відбувається тому, що їх операційні системи управляють дисплеями з різними роздільчостями. Зазвичай Windows використовує роздільчість екрану 96 точок/дюйм, а MACOS – 72 точок/дюйм. Монітори MultiScan допускають вищу роздільчість.
    Шрифт на екрані дисплея Масintosh має такий самий розмір, як і при друці (наприклад, 12 пт Times на екрані виглядає так само, як 12 пт Times на папері).
    Для шрифтів Microsoft це не виконується, і розмір шрифту при виводі на екран є більшим, що полегшує читання з дисплея. В результаті шрифт розміром 12 пт на Windows більше схожий на друкарський шрифт в 16 пунктів. Щоб отримати на Windows друкарський розмір 12 пт, потрібно вибрати розмір шрифту 9 пунктів (але тоді користувачі комп'ютерів Масintosh побачать текст майже нерозбірливим, оскільки він буде відображений шрифтом розміром всього 6,75 пт).
    Завдання для самостійного виконання
    1. Провести аналіз роботи сайту.
    Провести оптимізацію роботи сайту
    Контрольні запитання
    1. Назвіть основні структурні елементи сторінки.
    Опишіть призначення мета-тегів.
  • Охарактеризуйте програми для створення Web-сайту.
  • Опишіть структуру розробленого індивідуального Web-сайту.
    Відповідальний - доцент В. Уманець
    Назад к содержимому | Назад к главному меню