Пошукова робота

на тему:

Початок роботи з Web-сторінками

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

Створення нової Web-сторінки

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

Мал.1. При запуску FrontPage створюється нова пуста Web-сторінка.

Створити Web-сторінку можна й іншими способами:

за допомогою кнопки New Page на панелі інструментів Standard;

з меню File (виберіть спочатку New, а потім — Page);

за допомогою комбінації клавіш Ctrl+N;

з використанням правої кнопки миші та контекстного меню. Працює в усіх
режимах за виключенням Tasks View.

Клацніть по пустому просторі всередині списку файлів чи Folder List і в
контекстному меню виберіть New Page.

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

В Page View натиснення клавіші New Page на панелі інструментів відразу ж
створює та відкриває нову Web-сторінку. Три методи, що залишились,
дозволяють вибрати шаблон для сторінки, що створюється. Вікно вибору
шаблонів показане на мал. 2.

Мал. 2. При створенні нової Web-сторінки можна вибрати для неї шаблон.

На вкладці General виводиться перелік доступних на даний момент
шаблонів. Обравши будь-який шаблон, можна переглянути його опис в полі
Description та зображення для попереднього перегляду в полі Preview в
правій частині вікна.

На вкладці Frames Pages можна вибрати шаблон для створення Web-сторінки
з фреймами.

Вкладка Style Sheets відкриває файл каскадних таблиць стилів (.css) для
теми FrontPage. Файл .css – текстовий файл в спеціальному форматі. При
створенні нового файла .css він успадкує всі риси старого. Ви можете
змінювати будь-які наладки стилів в цьому файлі.

Кнопки Large Icons і List змінюють представлення списку стилів у вікні.

Прапорець Open in current frame доступний тільки тоді, коли у FrontPage
відкрита сторінка з набором фреймів. На даному етапі його можна
проігнорувати.

При встановленому прапорці Just add web task крім створення сторінки
буде створене і пов’язане з нею завдання в Tasks List.

Пам’ятайте, що створення нової сторінки у Page View реально не створює
нового файлу. Щоб цей файл був створений, збережіть сторінку. Якщо ж ви
закриєте нову пусту сторінку без будь-яких змін, FrontPage не збереже її
і навіть не дасть запит, щоб ви це зробили.

Редагування існуючої Web-сторінки

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

Відкриття сторінки в режимі Page View

З режиму Page View є чотири способи відкрити існуючу сторінку:

в меню File виберіть Recent Files. Буде відображений список файлів, що
недавно відкривалися. Просто виберіть потрібний файл з цьо8го списку;

клацніть правою кнопкою миші по гіперпосиланню на вже відкритій
сторінці, а потім в контекстному меню виберіть Follow Hyperlink. Буде
відкрита та сторінка, на яку вказує гіперпосилання;

якщо ви працюєте з FrontPage Web, просто виберіть потрібний файл у
Folder List і два рази клацніть по ньому мишею;

використайте діалогове вікно Open File, яке показане на мал. 3.

Мал.3. Діалогове вікно Open File

Є три способи відкрити діалогове вікно Open File. Ви можете вибрати Open
File з меню File, натиснути Ctrl+O чи застосувати кнопку Open на панелі
інструментів Standard. На панелі в лівій частині діалогового вікна можна
вибрати п’ять способів як відкрити Web-сторінку:

History відображає список документів Microsoft Office, що недавно
відкривалися;

My Documents (Personal в Windows NT) дозволяє відобразити файли у
відповідній папці;

Desktop відображає файли, які знаходяться на робочому столі вашого
комп’ютера. До них відносяться значки My Computer, Network Neighborhood,
My Briefcase та інші;

Favorities показує те ж саме, що ви побачите в меню Favorities (Вибране)
Internet Explorer;

Web Folders відображає список Web Folders, зареєстрованих для Microsoft
Office на даному комп’ютері, і файли в них.

Список Look In у верхній частині екрана дозволяє вибрати
місцезнаходження потрібного файлу.

Для визначення файлу можна скористатися і полем File Name, при цьому
можна вказати як шлях до файлу у файловій системі (наприклад, \My
Documents\mypage.htm), так і URL
(http://www.interlacken.com/default.htm). При використанні URL файли
відкриваються за допомогою того ж механізму, який використовується в
браузері. В панелі інструментів діалогового вікна Open File є декілька
корисних кнопок.

При відкритті Web-сторінки, що створена в іншому додатку Office,
FrontPage може здивувати вас, відкривши файл з з допомогою того додатку,
в якому він був створений. Щоб уникнути цього, один раз, у списку, що
відкривається при кнопці Open виб6еріть Open in Microsoft FrontPage/ Щоб
відключити таку можливість зовсім, в меню Tools виберіть Configure
Editors, і зніміть прапорець Open web pages in the office application
that create them.

Відкриття сторінки з режиму Tasks View

Так як Tasks View призначений для роботи з завданнями, а не Web-файлами,
відкривати файли з цього режиму доводиться не так часто. Але, якщо вам
все-таки знадобилось це зробити, ви можете використати будь-яким з двох
способів:

клацніть правою кнопкою миші на задачі, що повязана з Web-сторінкою, і в
контекстному меню виберіть Start Task;

виберіть задачу, зв’язану з Web-сторінкою, а потім в меню Edit виберіть
Task-Start.

Відкриття сторінки в інших режимах

В режимах Folders View, Reports View, Navigation View і Hyperlinks View
відкриття сторінки відбувається абсолютно однаково:

можна двічі клацнути мишкою по імені файла чи його значку;

можна клацнути по імені файлу чи значку правою кнопкою мишки і в
контекстному меню вибрати Open;

можна вибрати імя файлу чи значок а потім натиснути Enter, Ctrl+O чи
вибрати Open в меню File.

Використання панелі інструментів Standard

Крім кнопок, які застосовуються для створення і відкриття Web-сторінок,
в панелі інструментів Standard знаходяться й інші корисні кнопки. Як і
всі інші панелі інструментів, її можна сховати чи показати з меню View.

Збереження сторінок

Якщо ви не зберегли сторінку, вважайте, що всіх ваших змін більше немає.
Щоб зберегти файл, відкритий в режимі Page View, в меню File виберіть
Save. Якщо сама сторінка чи будь-який з її компонентів ще ні разу не
зберігався, FrontPage відкриє діалогове вікно Save As. Щоб зберегти
сторінку під другим іменем, потрібно скористатися сусіднім пунктом меню
Save As. Діалогове вікно Save As показане на мал. 4.

Мал. 4. Діалогове вікно Save As

Як ми бачимо, воно виглядає практично однаково з діалоговим вікном Open,
за виключенням двох нових елементів:

Page title. Відображає назви сторінок. Хоча це поле можна і не
заповнювати, дуже раджу все-таки не ігнорувати його. Назва сторінки –
те, що бачить відвідувач, коли відкриває її в браузері. Крім того, назва
застосовується у FrontPage для багатьох ситуацій;

Change. Натиснення на цю кнопку відкриває діалогове вікно, в якому ви
можете змінити назву сторінки

Як і при відкритті файлу, можна вказувати різні шляхи до файлу.
Зберігати файл можна на локальному диску, на сервері чи у FrontPage Web.
Якщо FrontPage Web ще не відкритий, FrontPage його відкриє автоматично.

Час від часу при збереженні сторінки FrontPage виводить діалогові вікна,
подібні до тих, що представлені на мал. 5. Це означає, що в оперативній
пам’яті знаходиться об’єкт, місце зберігання якого FrontPage поки що не
знає. В даному випадку — це малюнок, вставлений з буферу обміну, але це
може бути і результат інших дій, наприклад, використання засобів праці з
графічними зображеннями. Початкове зображення може залишатися там же, де
воно було розміщене до цього, але файл зі змінами потрібно зберегти
окремо.

Мал. 5. При збереженні Web-сторінки з елементами, які поки що
знаходяться тільки в оперативній памяті, FrontPage виводить таке
діалогове вікно

Видалення існуючої Web-сторінки

При роботі з Web-сайтом рано чи пізно трапиться так, що якісь сторінки
вам будуть більше не потрібні і вам захочеться їх знищити. Існують
чотири способи видалення Web-сторінки (при цьому ви повинні бути в
режимах Folders View, Reports View, Navigation View або Hyperlinks
View):

виберіть файл (клацнувши по його назві або значку) і натисніть на кнопку
Delete;

виберіть файл і потім виберіть Delete в меню Edit;

клацніть по назві файла або значку правою кнопкою миші і в контекстному
меню виберіть Delete;

виберіть файл і натисніть на кнопку Delete в панелі інструментів
Standard. Який би спосіб ви не вибрали, FrontPage попросить вас
підтвердити видалення.

Налагодження атрибутів сторінки

Атрибути Web-сторінки в основному використовуються для загального
управління її зовнішнім виглядом. Щоб відкрити властивості сторінки (всі
шість вкладок), клацніть правою кнопкою миші по сторінці в режимі Page
View і виберіть в контекстному меню Раge Properties. Відкриється
діалогове вікно Page Properties, в якому ви побачите п’ять вкладок:
General, Background, Margins(ця вкладка зявляється тільки коли в меню
Tools-PageOptions вказано, що сорінки розраховані тільки на браузер
Microsoft Internet Explorer ) , Custom, Language іWorkgroup.

Вкладка General

Ця вкладка зображена на мал. 6.

Мал. 6. Вкладка General властивостей Web-сторінки у FrontPage

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

Location. Звичайно — це URL для даної сторінки, по якому до неї може
звернутися, наприклад, браузер. Якщо файл відкривається не з
Web-сервера, а з диска, URL буде починатися з file:///. Для щойно
створеної і ще не збереженої сторінки Location буде виглядати як
unsaved:///new_page_l.htm. Редагувати це поле ви не зможете — воно
призначене тільки для читання.

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

Base location. Це поле, яке використовується відносно рідко, дозволяє
задати URL, який буде автоматично підставлятися до гіперпосилаань, в
яких вказані сторінки без повної адреси (наприклад, в Base location
вказане www.pfew.com/info, а в гіперпосиланні — contact.htm; адреса для
переходу по гіперпосиланню виходить www.pfew.com/info/contact.htm).
Детальніше про це — трохи далі. Як правило, це поле залишають
незаповненим.

Відносні адреси і основні URL

Для гіперпосилань на Web-сторінці вказувати повні адреси зовсім не
обов’язково. Якщо в ній не вказано ім’я хоста, браузер автоматично
підставить ім’я поточного хоста Якщо в гіперпосиланні не вказане ім’я
папки, браузер скористається поточною папкою Такий підхід називається
використанням відносних адрес (relative addressing), оскільки повна
адреса для гіперпосилання залежить від того, на якій сторінці вона
розташована Ось приклад:

Поточна сторінка — http //www pfew com/info/default htm

Гіперпосилання — /products/toasters htm

Адреса для браузера http //www.pfew.соm/products/toasters htm

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

Але іноді може трапитися так, що в якості адреси за умовчанням для
гіперпосилань вам треба буде використати адресу, відмінну від поточної.
Для таких ситуацій і призначене поле Base location Ось як воно
використовується:

Поточна сторінка — http //www pfew com/mfo/default htm

Base URL — http //www xxxx com/mfo/

Гіперпосилання — contact htm

Адреса для браузера — http //www xxxx com/info/contact htm

Default target frame. Якщо ви розділили вікно браузера на фрейми, це
поле буде відображати інформацію про фрейм, в якому буде показуватися
дана сторінка.

Background sound. Три поля в цій групі призначені для інформації про
звуковий файл, який буде програвати браузер відвідувача під час
перегляду файла.

Вказується ім’я і шлях до звукового файлу. Це може бути як шлях до
локального файлу, так і URL. Щоб можна було вибрати файл, натисніть на
кнопку Browse;

Locaton. Вказує ім’я файла. Це може бути, як шлях до локального файла,
так і URL. Щоб можно було вибрати файл скористайтися кнопкою Browse.

Loop. Скільки разів буде програватися файл;

Forever. Встановіть прапорець, щоб звуковий файл грав постійно.
Відповідно, те, що ви вказали в полі Loop, значення мати не буде.

Design-time control scripting. Ця група призначена для налагодження
параметрів виконання скриптів на сторінці.

Platform. Вказується, де будуть виконуватися скрипти в браузері або на
сервері;

Server. Яка мова за умовчанням буде застосовуватися для інтерпретації
скриптів, призначених для виконання на сервері. Можна вибрати
JavaScript, VBScript або настройки за умовчанням для Web;

Client. Яка мова за умовчанням буде застосовуватися для інтерпретації
скриптів, призначених для виконання в браузері. Можна вибрати
JavaScript, VBScript або настройки за умовчанням для Web;

Style. За допомогою цієї кнопки можна настроїти параметри стильового
оформлення (каскадних таблиць стилів) для основного тексту сторінки.

Вкладка Background

Вкладка Background призначена для управління загальними параметрами
колірної схеми сторінки. Вона наведена на мал. 7.

Мал. 7. Вкладка Background властивостей Web-сторінки у FrontPage

Настройка фону і кольорів

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

Background Picture. Установка перемикача показує, що у сторінки буде
фонове зображення. У полі трохи нижче можна вказати шлях до файла
фонового зображення (або вибрати його, натиснувши кнопку Browse).

Використання фонових зображень

Фонові зображення показуються на сторінці під будь-якими іншими
зображеннями або текстом. Якщо зображення менше, ніж сторінка, воно буде
повторюватися, щоб заповнити весь простір зліва направо, і зверху вниз.
Такий підхід називається мозаїчним розміщенням (tiling). У результаті
невелике зображення, яке можна завантажити швидко, заповнює весь простір
екрана.

Якщо вам не треба, щоб фонове зображення повторювалося, зробіть його
ширшим, ніж стандартний екран комп’ютера. Звичайно більш ніж вистачає
ширини в 1200 пікселів. У більшості редакторів зображень можна
скористатися засобом Add Margin або Extend Canvas, які дозволяють дуже
просто збільшити розмір зображення. Додані пікселі можна заповнити
кольором фону або зробити їх прозорими. Пікселі того ж кольору, що
повторюються звичайно стискуються дуже непогано, і розмір файла (і час
його завантаження) істотно не збільшиться.

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

Уникайте насичених кольорів для фонових зображень, які можуть утруднити
читання тексту

Watermark. Перекладається як “водяний знак”. Установка цього прапорця
означає, що при прокрутці сторінки фонове зображення залишиться
нерухомим і не буде переміщатися разом з іншими елементами сторінки.
Така можливість підтримується Internet Explorer, але багато інших
браузерів її не підтримують. Цікаво, що не підтримує показ поведінки
цього елемента і сам FrontPage. Тому, щоб переглянути, як буде виглядати
цей елемент, відкрийте сторінку в Internet Explorer.

Properties. Натиснення цієї кнопки відкриває діалогове вікно, в якому
можна настроїти властивості фонового зображення.

Background. Визначає колір фону сторінки. Цей колір буде відображатися,
якщо немає фонового зображення, якщо яка-небудь частина фонового
зображення прозора і якщо браузер відображає текст ще до завантаження
фонового зображення.

Text. Настройки кольору звичайного тексту.

Hyperlink. Настройки кольору для гіперпосилань.

Visited hyperlink. Настройки кольору для гіперпосилання, що вказує на
сторінку, яку користувач недавно відкривав в браузері. Колір повернеться
до звичайного для гіперпосилань стану, якщо протягом часу, вказаного для
кеша браузера, користувач не відвідає сторінку-мету.

Active hyperlink. Настройки кольору для гіперпосилання, по якому
користувач щойно клацнув мишею.

Enable hyperlink rollover effects. Установка цього прапорця дозволяє
настроювати зміну зовнішнього вигляду гіперпосилання при проходженні над
ним курсору миші. Настройки проводяться із звичайного діалогового вікна
Font.

Get background and colors from page. Установка цього прапорця відміняє
всі індивідуальні настройки вкладки Background для сторінки і дозволяє
отримати настройки від іншої сторінки. Така можливість може виявитися
корисною при роботі з набором уніфікованих сторінок.

Вкладка Margins

На вкладці Margins вказуються x-y координати для першого елемента на
сторінці (мал. 8). Як точка відліку приймається верхній лівий кут
сторінки.

Мал. 8. Вкладка Margins властивостей Web-сторінки у FrontPage

Відступ по висоті вказується за допомогою прапорця Specify Top Margin і
вказівки розміру відступу в пікселях, а відступ зліва — за допомогою
прапорця Specify Left Margin і аналогічного поля.

У FrontPage і Internet Explorer все відображається, як потрібно.
Netscape Navigator використовує свої команди для роботи з відступом,
тому в ньому виходить інша картина.

Вкладка Custom

Вкладка Custom використовується для роботи із системними і призначеними
для користувача змінними (мал. 9).

Мал. 9. Вкладка Custom властивостей Web-сторінки у FrontPage

Системні змінні — це, як правило, стандартні заголовки HTTP (HTTP
headers), а в якості призначених для користувача ви можете вказувати все
що завгодно. Детальніше про системні змінні — у врізці нижче, а змінні
користувача дуже зручно використовувати, наприклад, щоб автоматично
підставляти ім’я відповідального за щось співробітника або адресну
інформацію. Якщо на цю посаду прийде інша людина або адреса зміниться,
вам досить буде усього раз змінити змінну, замість того, щоб вишукувати
всі згадки про предмет на сторінках. Додавати змінні просто: натисніть
кнопку Add, а потім введіть ім’я і значення змінної (мал. 4.10).

Мал .10. Діалогове вікно для додання системної змінної

Для зміни вже існуючої змінної або її значення призначена кнопка Modify.

Copyright. Заява про авторські права.

Description. Пропозиція з описом змісту сторінки.

Distribution. Звичайно використовується одне з двох слів: global або
local. Local означає, що сторінка не представляє інтересу для
користувачів за межами організації — власника Web-сайту.

Expires. Дата, після якої зміст сторінки вважається застарілим.
Використовуйте наступний формат:

Tue, 02 Dec 1997 21:29:02 GMT

Keywords. Це — ключові слова, які полегшують знаходження цієї сторінки
при пошуку. Якщо ключових слів декілька, вони розділяються комами.

Robots. Інструкції для “роботів” — пошукових серверів Інтернету. Єдиних
стандартів не існує. Деякі інструкції підтримуються одними серверами і
не підтримуються іншими. Ось найпоширеніші змінні:

None. Роботам пропонується проігнорувати цю сторінку. Еквівалентне
Noindex, Nofollow;

All. Роботам пропонується індексувати цю сторінку і всі сторінки, до
яких можна перейти по гіперпосиланням, без будь-яких обмежень. Діє так
само, як і Index, Follow;

Index. Запрошення всім роботам включити цю сторінку в результати пошуку;

Noindex. Цю сторінку індексувати не рекомендується;

Follow. Запрошення роботам слідувати по гіперпосиланням цієї сторінки;

Nofollow. Слідувати по гіперпосиланням цієї сторінки не рекомендується.

Можливості системних змінних HTTP

Системна змінна Refresh, яка показана на мал. 10, в деяких ситуаціях
може бути дуже корисною Вона наказує браузеру зачекати декілька секунд
(в нашому прикладі — 20), а потім автоматично перейти на новий URL. Так
можна влаштувати, наприклад, щось на зразок автоматичного показу
слайдів. Інше застосування — при переміщенні всього сайту на нове місце
залишити на старому сторіночку з оголошенням про перехід на нову адресу
При цьому відвідувач буде переноситися на нову адресу автоматично. Краще
не використовувати значення затримки, що рівне нулю. Відвідувач може не
зрозуміти, в чому справа, і повторно спробує потрапити на ту ж адресу
або скористається кнопкою Back, а сторінка буде повертати його назад.

Про деякі інші корисні системні змінні розказано нижче. Ці змінні часто
використовуються пошуковими роботами типу Yahoo, Lycos, AltaVista і
lnfoSeek для більш точного індексування сторінок.

Вкладка Language

Вкладка Language призначена для настройок кодування для Web-сторінки
(мал. 11).

Мал 11. Вкладка Language властивостей Web-сторінки у FrontPage

На цій вкладці є три поля:

Mark current document as. Встановлене в цьому полі значення буде
використовуватися FrontPage для перевірки правопису (якщо стоїть None,
то FrontPage буде керуватися тим, яка розкладка клавіатури у вас була
включена під час набору тексту). Значення, введене в це поле,
використовується також пошуковими серверами;

Save the documents as. Можна вибрати кодування, в якому буде збережена
Web-сторінка. Наприклад, для сторінки на російській мові можна вибрати
Cynllic або Cyrillic (KOI8-R). Якщо ви вибрали значення за умовчанням
(None), то буде використовуватися мова за умовчанням вашої операційної
системи;

Reload the current document as. Настройки для браузера. Керуючись ними,
браузер буде відображати вашу Web-сторінку. За умовчанням
використовується значення .

Вкладка Workgroup

Вкладка Workgroup призначена для організації роботи з Web-сторінками в
колективі (мал. 13).

Мал. 12. Вкладка Workgroup властивостей Web-сторінки у FrontPage

На цій вкладці можна скористатися наступними полями:

Available Categories. Можна встановити прапорець для віднесення сторінки
до певної категорії. Кнопка Categories призначена для створення нової
категорії, якщо ті, що вже є, вас не влаштовують. Цей атрибут
призначений для спільного використання з компонентом Categories
(детальніше про нього і про інші компоненти буде розглянуто пізніше);

Assigned To. У цьому полі належить вказувати відповідального за
Web-сторінку. Поповнити список відповідальних можна за допомогою кнопки
Names;

Review Status. Сюди можна ввести (або вибрати зі списку) поточний етап
проходження Web-сторінки по інстанціях. Інстанції можна вказувати і
свої, скориставшись кнопкою Statuses;

Exclude This File When Publishing the Rest of the Web. При публікації
вашого Web ця сторінка передаватися не буде. Така можливість може
виявитися корисною, якщо сторінка ще не готова.

Як вибрати кольори

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

Модель RGB

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

Цей ефект використовується для відображення кольорів на екрані
комп’ютерних моніторів. Для кожного пікселя екранного зображення додаток
повідомляє (наприклад, в діапазоні від 0 до 255) бажану кількість
червоного, зеленого і синього кольору. Внаслідок множення 256 можливих
значень інтенсивності червоного кольору на 256 — зеленого і на 256 —
синього виходить 16 777 216 можливих колірних відтінків. Такий підхід
отримав назву колірної моделі RGB (від red — червоний, green — зелений і
blue — синій). Наприклад, колір RGB 255-0-0 означає найінтенсивніший,
який тільки можливий. 0-0-0 — абсолютно чорний колір, а 255-255-255 —
повністю білий.

Безпечні кольори — гарантія правильного відображення сторінок

У значної кількості відвідувачів Web відеоадаптери працюють тільки з 8
бітами на піксель, що дає тільки 256 можливий значень. Технологія така,
що їх системи можуть відображати всі 16 777 216 кольорів, але не більше
за 256 кольорів одночасно на екрані. У результаті можуть виникнути деякі
проблеми.

Звичайно не всі з 256 кольорів можна одночасно використати. Наприклад,
для комп’ютерів під управлінням Windows 20 кольорів зарезервовано для
використання з елементами вікон (кордони вікон, заголовки і інші). У
результаті в розпорядженні додатків залишається тільки 236 кольорів.

Web-сторінки можуть містити будь-яку кількість зображень у форматі GIF.
Кожне з цих зображень, в свою чергу, може використати 256 кольорів.
Однак два зображення можуть запросити вже 512 кольорів, три — 768 і т.д.
Але одночасно на екрані можуть відображатися тільки 256 кольорів, що
може привести до проблем при перегляді Web-сторінок.

Зображення у форматі JPEG (JPG) може містити до 16 777 216 кольорів.
Зрозуміло, що при спробі використати для такого зображення тільки 256
кольорів можуть виникнути проблеми.

Більшість браузерів вирішують ці проблеми, використовуючи для
відеосистем з 256 кольорами фіксовану палітру з 216 кольорами. Ця
кількість кольорів виходить шляхом множення шести певних рівнів
червоного на шість рівнів зеленого і на шість рівнів синього (табл.
4.3). Оскільки це — єдині кольори, відносно яких можна бути упевненим,
що браузер відобразить їх так, як ви задумали, вони отримали назву
безпечних кольорів браузерів (browser-safe colors).

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

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

Висновки прості. Так як при змішенні та підстановці відвідувачі будуть
бачити зовсім не те, що ви планували, використовуйте для Web-сторінок
тільки безпечні кольори.

У деяких випадках, однак, можна забути про відвідувачів з 8-бітним
кольором і розраховувати тільки на відвідувачів з 24-бітними
відеосистемами (наприклад, всі відвідувачі вашого сайту — співробітники
підприємства зі стандартними робочими станціями). Однак, якщо ви
відкриваєте сайт для публічного доступу, потурбуватися про 8-бітних
відвідувачів слід обов’язково.

Використання діалогових вікон FrontPage для вибору кольорів

Для вибору більшості кольорів у FrontPage використовуються три
діалогових вікна:

Діалогове вікно, що розкривається з 16 стандартними кольорами VGA,
кнопкою для кольору за умовчанням (Automatic) і кнопкою для додаткової
настройки (More Colors). Це діалогове вікно наведено на мал. 13.

Мал .13. Перше діалогове вікно для вибору кольорів у FrontPage

При натисненні на кнопку More Colors відкривається наступне діалогове
вікно, в якому вам вже пропонується вибір з 127 кольорових зразків,
зразків білого і чорного кольорів і 15 відтінків сірого кольору (мал.
4.15). Крім того, там є декілька інформаційних полів для відображення
інформації про колір і дві кнопки. Натиснення на кнопку Select дозволяє
вибрати будь-який колір з екрана вашого монітора, а натиснення на кнопку
Custom відкриває ще одне діалогове вікно для найбільш точного вибору
кольору.

Абсолютно будь-який з доступних в системі кольорів можна вибрати в
діалоговому вікні Color (мал. 16). Щоб відкрити це вікно, в діалоговому
вікні More Colors натисніть кнопку Custom.

Розглянемо кожне вікно для вибору кольорів по порядку.

Найперше діалогове вікно (мал. .13) надає у ваше розпорядження 16
кольорів (кнопка Automatic передбачає вибір кольору, що використовується
браузером по умовчанню). На жаль, з цих 16 кольорів лише половина є
безпечною. Вісім, що залишилися, може не вистачити для створення
ефективного оформлення вашого сайту.

Мал. 14. Діалогове вікно More Colors

Тому для вибору кольорів краще використовувати наступний рівень —
діалогове вікно More Colors (див. мал. 14). У ньому використовується
шестикутник з набором із 127 кольорів, а внизу — чорний і білий зразки і
шість градацій чорно-білого зображення. Переважна більшість кольорів з
набору є безпечними, однак зрідка попадаються і такі кольори, які не
відповідають вимогам до безпечних кольорів. Наприклад, такий колір
вибраний на малюнку. Пам’ятайте, що якщо будь-яке з трьох
шістнадцатеричних значень відрізняється від 00, 33, 66, 99, CC або FF,
то колір не є безпечним.

У цьому ж діалоговому вікні можна скористатися кнопкою Select, щоб
вибрати потрібний колір з будь-якої точки екрана монітора.

Мал. 15. Діалогове вікно Color

Будь-який колір, доступний в системі, можна вибрати в наступному
діалоговому вікні Color (див. мал. 16). При цьому у вашому розпорядженні
три способи: можна вибрати колір на панелі, можна скористатися звичайною
колірною моделлю RGB, а можна також скористатися моделлю
відтінок-насиченість-яскравість: Hue-Saturation-Luminance (в цій книзі
ми її не будемо розглядати). Пам’ятайте, що для створення будь-якого з
216 безпечних кольорів в полях Red, Green і Blue можна використати
тільки десятеричні значення 0, 51, 102, 153, 204, 255 — і ніякі інші.

Вибір кольорів для сторінки

На жаль, мистецтво вибору кольорів не є предметом цієї роботи. Однак ось
декілька порад, які можуть допомогти Web-дизайнерам.

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

При виборі кольорів для Web-сторінок пам’ятайте про те, що вони повинні
поєднуватися з кольорами на зображеннях.

Між текстом і фоном завжди повинен бути чіткий контраст.

Краще використовувати темний текст на світлому фоні, ніж навпаки.

Кольори повинні контрастувати, але не дисгармоніювати.

Краще не використовувати таких фонових зображень, які будуть відволікати
увагу від тексту. Ідеальні зображення для фону — дуже світлі і зі слабим
контрастом.

Похожие записи