Текст в зображеннях

Дизайнери швидко зрозуміли, що найвірніший спосіб абсолютного контролю над шрифтами – помістити текст в зображення. Можна часто бачити заголовки, підзаголовки і оголошення, що виконані у вигляді файлів 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 пт).

Графіка на web-сторінках

На даний момент майже всі зображення в Web, представлені в трьох форматах: GIF, JPEG та PNG

GIF

GIF – Grafic Interchange Format можна назвати традиційним форматом файлів Web. Він був першим форматом файлів, який підтримували Web-браузери, і до цього дня продовжує залишатися основним графічним форматом Web.

Відмінні характеристики

• підтримує не більше 256 кольорів;

• використовує індексовану палітру кольорів;

• використовує стиснення без втрати інформації за методом LZW (який подібний до вживаного в архіваторі PKZIP, і, отже, GIF-файли в подальшому практично не стискаються);

• підтримує через рядкову розгортку;

• є потоковим форматом, тобто показ картинки починається під час завантаження;

• дозволяє призначити одному з кольорів в палітрі атрибут прозорості, що застосовується при створенні так званих прозорих GIFов;

• має можливість збереження в одному файлі декількох зображень, що знаходить своє застосування при виготовленні анімованих GIFов;

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

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

JPEG

Іншим найбільш популярним графічним форматом в Web є JPEG – Joint Photographic Experts Group. Він містить 24-розрядну інформацію про колір. Це 16,77 млн. кольорів на відміну від 256 кольорів формату GIF. У JPEG використовується так зване стиснення з втратами. Це означає, що певна інформація про зображення в процесі стиснення відкидається, але в більшості випадків погіршення якості зображення не завдає шкоди і часто навіть не помітно.

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

PNG

Це третій графічний формат, що конкурує за постійне використання в Web. Це формат PNG – Portable Network Graphic, який, не дивлячись на свої переваги, знаходиться здебільшого в тіні. Підтримувати PNG як вбудовану графіку браузери почали значно пізніше за вищеназвані формати, але PNG має всі шанси стати популярним форматом в Web. PNG може підтримувати 8-розрядні індексовані кольори, 16-розрядні півтони або 24-розрядні повнокольорові зображення, використовуючи схему стиснення без втрат. Це забезпечує вищу якість зображень, а іноді і менший об'єм файлів в порівнянні з форматом GIF.

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