Створюючи під IE, не забудьте про Netscape, Web Design, Інтернет-технології, статті

Максим Костюченко, Комп’ютерна газета

Погодьтеся, іноді забавно бути не співучасником, але спостерігачем. Високо сиджу, далеко дивлюся … Можна будувати чіткі аналогії. У незалежній голові народжуються незалежні оцінки … Адже ось як воно з боку …

А з боку видно, що як і раніше киваємо на “старшого брата”. Ну? Як там у них? А-а-а, Лебедєв “Керівництво” винайшов. Ну так ми теж не ликом шиті. Нате вам “Луководство” і “Осоводство” на додачу!
Що? Прочуханки у них на гребені хвилі? Так цього господарства у нас хоч відбавляй. Як гриби після дощу виросли самостійні “мережеві оглядачі”. Не встигнеш і “добрий ранок” сказати, а вони тобі пачку оглядів вже показують. І де тільки час беруть, графомани чортові?
Це солодке слово “Рунет”. Звучить як пісня солов’я, чи не так? А ось тепер раджу закрити вушка: “Б-А-Й-Н-Е-Т”. Про жах, хто його придумав!?
Ось тільки з доменами невеликий конфуз (але є значні подвіджкі, смію вас запевнити). Нещодавно Діма Шейко запитав: “Які-такі основні події Байнета?” Для мене самої загадкової стала повальна тенденція реєстрації двубуквенних доменів в зоні * BY. Звідки вітер дме?
Фантазери-мрійники (читай: поліграфісти) – народ жвавий. Ну люблять вони DHTML до нестями, що ж ти тут поробиш. Візуальні редактори HTML, Java теж не на останньому місці. Ай, що там говорити, сам грішний, маю тягу до CSS. Все, звичайно, мило і красиво … в Explorer’e.

Що б так, дик ти ось так …

Не ламаючи язики, і життя прекраснішим стає. Якщо вже і вбивати двох (як мінімум) зайців, так для цього не треба винаходити двоколісний транспортний засіб. Достатньо всього лише не “навертати” з три короби, а просто прагнути до елементарного і доступному. Ось погодьтеся, по-дурному і місцями сумбурно я писав до цих пір? Але ж має ж так, щоб зрозуміло більшості …
Отже, мова йде про універсальність. Звичайно, різні версії сайту – це добре. Але чи зручно? Ось, припустимо, кволеньких аналогія з повсякденною життєвою ситуацією. Пам’ятаєте, раніше в метро замість жетонів були п’ятаки? І стояли автомати по 20, 15 і 10 монет для їх розміну. А що ж робити, коли в тебе 15 копійок, а саме цей автомат і не працює? Йти, шукати, де розбити дрібниця?
А як зручніше з жетонами – з будь-грошовою одиницею приходиш до каси і отримуєш свій жетон. Процедура скорочена до мінімуму, до двох операцій – рішення і дії, спрямованої на виконання цього рішення. Ти вирішуєш поїхати в метро – ти купуєш жетон. Проміжні операції, як то розмін та ін, тепер уже не твоя головний біль. Система побудована так, що бере її на себе.
Сайт бажано спочатку робити легкотравним не тільки під IE або Navigator, а й під текстові браузери. Тоді й Opera пісні заспіває, і Linux “покотить”. Щоб користувач від випадаючих Java-меню не випав в осад, текстова навігація повинна бути інтуїтивно зрозуміла в більшості місць окремо взятої сторінки і на більшості сторінок.
Якщо взагалі встати на місце ЙОГО, користувача, який прийшов чисто ЗА ІНФОРМАЦІЄЮ, він не повинен відволікатися на такі дрібниці (для нього, не для нас, дрібниці), як її подання. Більше того, навіщо навантажувати його зайвими турботами, пропонувати вибір версії сайту? Тільки дві операції – рішення, дія. Вирішив отримати інформацію на сайті (рішення) – отримав (дія). Не більше того.
Насправді все не так складно. Обережніше з чудо-ілюстраціями, розбитими на мудровані таблиці, CSS, Map-малюнками і Java. А взагалі, тільки за допомогою одного тексту можна створити чудовий дизайн веб-сайту, і, головне, універсальний. І не доведеться нікому ламати мови.

Ось де @ зарита

А тепер, безпосередньо про тих нюансах, які найбільш часто є причиною некоректного відображення сторінок в Netscape Navigator.

Теги

Обов’язкові замикаючі теги, особливо і . Navigator це дивне створіння (без Gekko, зрозуміло), позбавлений “штучного інтелекту”, яким бог обдарував IE. Ні в яку не прочитає правильно вашу таблицю, якщо не поставите скрізь замикаючі теги. Теж відноситься і до форм – відкриває , закриває .
Для абзаців з червоними рядками краще не користуватися

і

. Застосування нерозривних пробілів досі актуально.

Таблиці та заливки

Якщо заливається тільки осередок, то background = “images / example.gif” необхідно прописувати в

, а ніяк не в

. Тому що в першому випадку заливка буде зрозуміла обом браузерам, а в другому – тільки Navigator’у.
Вкладені таблиці. Be careful. Navigator має нахабство за замовчуванням розмножувати заливку основних таблиць, в комірках вкладених.
Тому якщо вся або окремі осередки вкладеної таблиці повинні бути прозорими, відповідно в або

прописується background = “no”.
Те, що сокирою не вирубаєш, розпеченим залізом не вижжешь, коротше з чим доведеться змиритися – заливка таблиці з встановленим відстанню між осередками Cell Spacing. Мається на увазі заливка кольором. Якщо ви хочете, щоб таблиця, незалежно від кількості осередків у ній, була одного суцільного кольору

, то Navigator все одно вставить вам палиці в колеса і буде показувати прогалини-порожнечі Cell Spacing. Вихід тільки один – помістити основну таблицю в іншу, залиту необхідним кольором. Причому не забути зробити основну таблицю прозорою, тобто background = “no”.

Стилі

Ось вже воістину! Navigator їх, як правило, просто ігнорують. Ніякої Америки я тут, звичайно, не відкрив. А так, просто емоційно – е-е-ех – висловився.
З CSS Navigator адекватно розуміє, мабуть, тільки текст (шрифт, розмір, колір). Шістнадцяткове представлення кольору обов’язково з гратами #.
Форми піддаються стилізації частково. Якщо заданий стиль для тексту в

або

, то розмір і шрифт тексту форм буде аналогічним. Колір – ні. Що добре, можна задати відстань від форм зверху і знизу, прописавши form {margin-bottom: px; margin-top: px}. Можна регулювати величину розриву рядка
, встановивши br {font-size: pt}. Можна керувати параграфом, наприклад: p {text-align: justify; margin-bottom: px; margin-top: px}.

Форми

Треба зазначити, що в Navigator’е вони виглядають чомусь більше, ніж в IE. Часом це може зіпсувати дизайн сайту, якщо осередок, в якій стоїть форма, повинна бути фіксованою ширини. В IE все буде виглядати нормально, а от Navigator розтягне форму і разом з нею клітинку. Попливе таблиця. Щоб уникнути таких сюрпризів, необхідно чітко ставити розмір форми. Скажімо, якщо це звичайне текстове поле, то . Відразу підібрати потрібний розмір – справа проблематична. Доведеться перебирати варіанти і тестувати в обох браузерах. До речі, на останньому можна особливо загострити увагу, так як паралельне тестування в обох браузерах, а ще краще і в Oper’е, може істотно додати очок на користь доступності й універсальності вашого сайту.

Схожі статті:


Сподобалася стаття? Ви можете залишити відгук або підписатися на RSS , щоб автоматично отримувати інформацію про нові статтях.

Коментарів поки що немає.

Ваш отзыв

Поділ на параграфи відбувається автоматично, адреса електронної пошти ніколи не буде опублікований, допустимий HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*

*