Оцените этот текст:


      Как надо и как не надо оформлять HTML-документы? Основная
идея - будьте  реалистами  -  думайте  о  своем  посетителе.  А
посетитель  этот сейчас, в 1998(*) году живет под MS Windows 95
на PC/P586 RAM 16M, и экран у него 14 дюймов. И  модем  у  него
14400,  шипящий  по  паршивой  телефонной  линии. Использует он
Netscape  3.0  или  4.0,   Java   отключена   по   соображениям
безопасности,  загрузка  картинок - тоже - чтоб не платить свои
кровные денежки за  дизайнерские  многокилобайтные  графические
изыски.  Вы  спросите  -  а как же MS Explorer и ActiveX? Чтож,
есть и такие - их 37%, у них под рукой дистрибутив Win95, и они
не боятся, что сквозь дырку в ActiveX им отформатируют drive C:

---------------------------------------------------------------
       Устарело:
       (*)посетитель этот сейчас, в 1996 году живет под Windows
3.11 на PC/P486 RAM 4M, и экран у него 14  дюймов,  графическое
разрешение  640x480  16 цветов. И модем у него 9600, шипящий по
паршивой телефонной линии. Использует он Netscape 2.0.
---------------------------------------------------------------



Правила, которых я решил придерживаться для себя.
  - и  которых  не  знают обладатели нормальных машин и быстрых
    линков
  + и исключения, придуманные мною из этих правил




Изредка   задумываться  -  нужна-ли  хоть  кому-нибудь  в  мире
информация, лежащая на home-page
  - сколько таких страниц "о себе любимом" вы уже посетили? Что
    при этом чувствовали?

Самая трезвая оценка странички - логи web-сервера
  + Регулярное заглядывание в access_log избавляет от многих
    иллюзий, позволяет реально оценивать доступность информации,
    а так же способствует упрощению дизайна веб-страницы.



ВСЕГДА СТАВИТЬ Last-Modified АТРИБУТ В ВЫДАЧУ CGI-СКРИПТОВ
  - документ  без  временного штампа не сохраняется в локальном
    кэше, и постоянно перезасасывается при просмотре

Переименовать   свою  директорию  CGI-скриптов  из  cgi-bin  во
что-нибудь другое
  - Прокси-серверы не кэшируют URL вида
    http://host.name/cgi-bin/file/name.txt и каждый раз вынуждены
    обращаться к вам на сервер.

Всегда устанавливать поле Last-midified у Русского-Апача с
автоматическим угадыванием кодировки
  + Да, если не взводить это поле, то на proxy-серверах не застрянут
    файлы в неккоректной кодировке.
  - Но насколько напрягутся все остальные юзеры (а их >95%), и сам
    веб-сервер...

Избегать "широких" документов не влезающих в экран по ширине
  - пускай юзер купит себе монитор 25", или ковыряется мышкой
    в попытке проскроллировать документ по горизонтали
  + Картинки  -  поменьше, избегайте широких преформатированных
    PRE текстов, а так же широких таблиц, и все будет Ok
  + Избегать можно, но иногда приходится искать разумный компромис.
    Можно сделать так, чтоб вся ВАЖНАЯ информация была всегда слева.

Не писать белым по черному, голубым по синему и т.п.
  - траур по поводу американского сената давно кончился,  а  на
    плохих мониторах читать такой текст невозможно.
  + Если следить за качеством текста, сделать буквы покрупнее
    и пожирнее, то можно добиться хорошего вида даже "неоновым" по черному.

Никаких мегабайтовых wav и au файлов
  - никто никогда не дослушает их до конца
  + формат real-audio примерно в 10 раз компактнее

Никаких Java-апплетов
  - Netscape падает в коре без объяснения причин
  - Глупое  приветствие,  ползущее в статус строке загораживает
    координаты линков

Помечать, какой линк "свой" а какой - "чужой"
  - "...ах как легко заблудиться..."

Таблички не использовать,
  - текст внутри таблички view'ер не показывает до тех пор, пока
    вся табличка не  приедет целиком. При  маленькой   скорости
    связи юзер будет несколько минут пялиться в пустой экран. А
    если  прервет  закачку  документа  на  пол-пути,  то  так и
    останется перед пустым экраном.
  + разбивайте  одну большую  таблицу  на  много  маленьких
    подтабличек

Фреймы не использовать
  - Теряется  пространство.  В Netscape 2 из  фрейма  нельзя
    выйти  кнопкой "back".   Кнопка "reload" внутри фреймов не
    работает, "View document source" тоже. В итоге юзер попадает
    в  непривычный для него интефейс.
  + внутри фреймованых текстов ставьте "TAGET=anotherscreen"
    внутрь A HREF ссылок на внешние    документы,    чтоб они
    открывались на просмотр в целом окне а не внутри фрейма
  + Netscape версии 3 и больше работает с фреймами уже достаточно
    удовлетворительно. Но все равно - фрейм хорош только там, где
    он хорош, а в остальных местах он только вреден.
  - Netscape младше 4 версии не умеет делать релоад внутри фрейма

Не делать суперобложек, максимум info в головную страницу
  + это так стильно: на первой странице - просто логотип
    и выбор кодировки, а затем уже вход на основную страницу.
  - Среднестатический юзер на любую страницу заходит в среднем
    на 3-4 клика. За эти 3 клика надо успеть донести до него -
    какой сайт хороший - "суперобложка" Logo+encoding означает,
    что один клик уже потерян, на "завоевание" зрителя остается
    только 2.
  - Поисковые роботы заходят на сайт в среднем раз в 3-6 месяцев
    и за один раз проходят только один уровень сайта. Суперобложка
    означает, что робот доберется до вашей информации на 3 месяца позже.

"Under-construction" не применять
  - Да простит меня интиллегентная публика, но этот мужик с лопатой
    и шлагбаумом, да еще animated, уже просто за-дол-бал!
  - Неработающий линк лучше совсем не показывать - тогда, когда
    он наконец появится, постоянный посетитель сразу его заметит
    по цвету. Помнить же у кого на каком сайте еще недоделано -
    выше человеческих сил.
  + Если хотите показать, что ваш сайт все время в работе и достоин
    регулярного посещения, сделайте регулярно обновляемый "What new"

Ставить "Цветную дату недавней модификации"
  - Тому, кто на вашем сайте впервые, эти пометки - по барабану.
  + Когда сайт испещрен пометками о недавней модификации, это производит
    приятное впечатление и намекает: "заходите еще, не пожалеете".

Обязательно снимать устаревшую "Цветную дату модификации"
  - Нет зрелища печальнее, чем файлы с пометкой NEW и последние
    записи в списке новостей, имеющие даты полугодичной давности.
  - Клеймо "Сайт-покойник" смывается только кровью.



Не класть пестрые темные картинки в background
  - невозможно читать текст
  - долго ждать полной загрузки документа

Ставить только 256-цветные или 16-цветные картинки.
  - Зритель    с   8-мибитной  картой  все  равно  увидит  вашу
    труколорную картинку рябой и побежалой - так не обманывайте
    себя.
  - При использовании 256 цветной палитры необходимо следить, чтоб на
    всех картинках была ОДНА И ТАЖЕ ПАЛИТРА! Или использовать
    Netscape-палитру(216) цветов), или соптимизированную палитру
    на 128, 64 или даже 32 цвета!

Делать inline-иконки с помощью internal-netscape-images
  - долго ждать закачки текста
  + MS Explorer не понимает встроенных в internal-netscape-images
  + При печати сам Netscape internal-иконы не распознает

СТАВИТЬ WIDTH/HEIGHT В  IMG SRC
  - текст не показывается, пока все картинки не прокачаются

Картинки в jpg  и не больше 40 kb
  - невозможно дождаться, пока огромный gif доедет до конца
  + естественно, надо смотреть, по месту какой формат
    предпочтительней - в текстовых картинках (карты, рисунки,
    текст, иконки) gif оказывается компактней.

НИКАКИХ ANIMATED-ГИФОВ
  - Дохлый PC свапуется и еле мышью шевелит
  - Мелькание в статус строке загораживает координаты линков
  - Неоднократно замечалась "руханье" netscape  на  сильно
    "дерганых" страницах.
  - Из-за ошибки в Netscape-навигаторе он постоянно перезапрашивает
    animated-гиф по сети, посылая запрос на сервер каждые 10-15 секунд
    Представьте, что на вашу страницу с 10 анимированными гифами зашло
    двадцать Netscape и просто  смотрят на нее ни во что не кликая.
    Netscap'ы сами начнут слать вашему серверу IFMS-запросы в темпе
    20 запросов в секунду.
  + Впрочем, если у вас веб-сервером Sequent или HP-9000 сервер модели V,
    то он и 200 запросов секунду выдержит.

Избегать больших interlased gif'ов
  - Netscape заметно тормозит при его показе
  + лучше  вместо  interlased  гифа  подложить  в  img  src=...
    дополнительный параметр LOWSRC=small-black-white-dithered.gif

"Управляющие" иконки дублировать текстом и alt-текстом
  - Сайт ДОЛЖЕН быть ПОЛНОСТЬЮ ФУНКЦИОНАЛЕН даже при полном отключении
    графики. К 2%, использующих lynx добавьте еще 20% веб-серферов
    отключающих графику в своем броузере.
  - Этого вам недостаточно? Тогда добавьте сюда еще поисковых
    роботов - не думайте, что они отOCRят и проиндексируют ваши gif'ы

Не вешайте чужих баннеров и кнопок, если за них вам не платят
  - Картинка с наградой - это для вас она награда, а для
    наградителя - бесплатно размещенный баннер на вашей корневой
    странице
  - "Best viewed with Netscape/Explorer", да еще заAHREFленная -
    прямая реклама корпораций Microsoft или Netscape.
  + Сделайте отдельную некорневую страничку "Награды", на которую и поставите
    все ссылки и url ваших наградителей и любимых производителей софта.
  + картинки с наградами на корневой странице делайте некликабельными
  + Или пусть они вам заплатят. Деньгами, кликами, банерами,
    услугами, борзыми щенками и т.п.

Не связывайтесь с интернет-магазинами, платящими проценты с продаж
  + Пошлешь туда за месяц 1000 человек, из них 20 купят там что-нибудь
    на 5 долларов, 3% - вам. 3 доллара в месяц. Заработок, однако.
  - Комиссионные с торговли кассетами, CD, книжками, майками - мизерны.
    Интернет-магазин получит с вас массу посетителей практически задаром.
    Если бы он заплатил за них или за свои баннеры хотя бы по демпинговым
    ценам ValueClick'а (3-10 центов за клик) или российских баннеропоказов
    (от 10 долларов до 10 центов за тысячу _показов_, не кликов!), это
    обошлось бы ему в десятки и сотни раз дороже.
  + Возможно, комиссионные с _дорогих_ товаров (авто, путевки, авиабилеты...)
    смогут себя оправдать. (Хотя не удивлюсь, если и здесь будет кидалово).

Лишние имаджи = потерянные деньги
  + Многие хостеры не берут денег за траффик и размеры графики можно не
    считать.
  - Но часто включают счетчик на _входящий_ зарубежный траффик.
    Помните, что сам HTTP-реквест от зарубежного посетителя - _входящий_
    Всего-то в нем 200-300 байт. Но если у вас на каждой страничке по
    20 гиф-файлов с оформлением, то один HTML-клик из-за заграницы обойдется
    в 4Кб входного трафика. Помножимна 10 тысяч страничек  в день да на
    30 дней - 1.2Gb - входящей зарубежки. 100-200 баксов - как с куста.



Страница должна быть смотрибельной в ЛЮБОМ броузере
  + Отсматривать свой сайт 5-ю разными броузерами.
    MSIE, Netscape 4.75, Netscape 3, Opera, Lynx
    А так же см. "Viewable With Any Browser"
  - Диалектизмы HTML-я одного броузера непонятны в другом.
  - Вывеска "Optimized for Explorer" означает - "Сайт изготовлен
    артелью Напрасный труд": MSIE на начало 1998-го использует 
    только 37% всех посетителей, Netscape - 60%.
  - В 2000 году 80% Юзеров все равно пользуются MSIE
  + Сервер может генерить страницу "под конкретный броузер"
    if ( $ENV {HTTP_USER_AGENT} =~ /MSIE/i ) { ... }else { ... }




<meta http-equiv="Content-Type" content="text/html; charset=ЧТО-ТО">
     Очень  стремный  таг.  Обращаться  с  осторожностью.  Если
httpd-сервер с автоматической поддержкой кодировок то этот  таг
применять _КАТЕГОРИЧЕСКИ НЕЛЬЗЯ_

     Все  страницы  в  кодировке  koi8 для Netscape и Explorera
рекомендуется выдавать со взведенным заголовком  charset=koi8-r
Тогда   броузер  (даже  под  виндами)  автоматически  подстроит
кодировку, и покажет ее корректно.

     Взводить  charset  для  броузера  Lynx  не  рекомендуется.
Старые версии lynx'а предлагают сгузить подобные  странички  на
диск,  а в новой, хоть и есть возможность сконфигурироваться на
koi8-r, но тогда он перестанет  читать  странички  с  charsetом
iso8859-1 !!!

     Charset устанавливается HTTP-headerом со стороны сервера
---------------------------------------------------------------
Content-Type: text/html; charset=koi8-r
---------------------------------------------------------------

     Лучше  всего  сконфигурировать  httpd-сервер,  чтоб он сам
взводил charset. Это умеет делать, например "Русский apach" Это
легко  сделать  в  cgi-скрипте  ему  -  достаточно  печатать  в
обязательном  заголовке  вместо  "Content-Type:  text/html\n\n"
"Content-Type: text/html; charset=koi8-r\n\n"

charset можно взвести и на самой html-страничке, добавив в нее таг
<meta http-equiv="Content-Type" content="text/html; charset=koi8-r">
Но  это  чревато массой сопутствующих неприятностей и я не могу
рекомендовать такой метод добавления charset'а.

     Про  русские буквы мы еще поговорим, надо только набраться
духу. Много информации к размышлению найдете на кирилизаторском
сайте Андрея Чернова
     http://www.nagual.pp.ru



Рекламные  баннеры  - это зло для клиента. Практически всегда они не по
теме материала страницы. Согласитесь, забавно увидеть на  религиозном  сайте
баннер   с   голой   теткой.  Разбивается  дизайн.  Прокачка  дополнительных
килобайтов бьет по карману диалап-юзера. Img src, да еще с relocation -  это
2  лишних  DNS-resolving.   Баннер и текст на разных хостах, как следствие -
неравномерность загрузки  страницы.  Многие  сети  (кстати,  надо  составить
черный  список)  ставят  в баннер expires=0, из-за этого по сайту невозможно
быстро перемещаться - "Back" тормозится, пока не  подсосется  новый  бантик.
Каждый  норовит  подослать  свой  cookies, причем - каждый раз новый, хотя и
обещает его использовать при _всех_ обращениях к  рекламному  хосту.
     И  еще.  Баннеры,  которые вы заработали дадут вам некоторое количество
новых посетителей. Но ведь баннеры крутятся  и  на  вашем  сайте.  И  _ваши_
посетители  иногда  уходят  по  ним.  Приобретая новых, вы теряете старых. И
иногда - даже больше, чем приобретаете.
     Я    трижды подумал бы, прежде чем в свою страницу 404 ставить баннер -
мне нужно, чтоб промахнувшийся юзер уходил ко мне. А баннер вместо этого его
от  меня  уводит,  причем  навсегда.  Задумайтесь  - стоит ли надрываться на
других страницах  копя  показы  под  2%  ctr,  и  при  этом  царским  жестом
избавляться  от своего - уже пришедшего к вам клиента - ради одно(!) показа.
Прикиньте - заманить юзера вам стоило 50 показов, а теперь  вы  этого  юзера
отпускаете обратно - за жалкий 1 показ.

Не ставьте баннеры на самый верх
 - Баннер сверху отнимает 1-2 реквеста из 4 - и в итоге грузится вперед
   тормозя ваши сайтовые картинки
 - При движении по сайту "back" страница на которой посетитель уже был
   вместо того чтобы сразу показаться из кэша, не прорисовывается,
   пока не пройдет прокачка верхнего баннера (он ведь вверху и expired)
 + Баннер вверху ставить можно - если за него платят 10 долларов за 1000.
 + в ссылке на img src баннера вместо hostname ставьте IP - сэкономите
   посетителю dns-ресолвинг - а это 2-30 секунд.
 - Ставьте в a href баннера target=_blank чтоб он открывался в новом окне

Выделяйте баннер как баннер, подписывайте, что "здесь реклама"
 - Умельцы делают баннеры с кнопочками навигации, надписями "смените
   кодировку"  - на прозрачном фоне, или голыми тетками и прочие приколы.
   Чтоб посетитель по ошибке не принял такой баннер за часть вашего сайта -
   выделяйте и отделяйте баннероместо  как только сможете. Помогает border=1,
   table bgcolor=black, подписи "RLE Banner Network", "Здесь реклама"...

     To be continued.


 -     Методы  борьбы с банерами. Говорят, грамотные фильтры прокси-серверов
умеют ампутировать все gif-ы размера 468x60. Довольно действенны  ACL-списки
на  прокси  сервере. Подробнее об этом и о других методах см. статью "Как не
получать рекламы через Internet"

 + Говорят, рекламные баннеры - это счастье для вебмастера. Это живые деньги
за показ коммерческих фантиков.  DoubleClick,  Burst,  FlyCast,24/7  и  Val╜
ueClick  платят деньги. Это новые посетители от остальных - linkexchange'ных
показов.

     Давайте  посчитаем.  Оптовая закупка баннеров - обычно около $0.1-0.5
за тысячу, и в лучшем случае удается продать  около  5-10%  рекламной  площади.
Берем  сайт  с  1000 визиторов в день, средней глубиной просмотра 5, и двумя
баннерами на странице.

     1,000*5*2*30 = 300,000 баннеров в месяц * 10% * 0.5 цента = 15$

     Теперь посчитаем, что нам даст linkexchange.
     Замечательные  баннеры  типа "Format your drive [Yes/No]" давали аж 30%
кликабельность. Но, боюсь, все диски  в  интернете  уже  отформатированы,  и
расчитывать  надо на добротных середнячков баннерного дизайнерства дающих 3%
визитов за показ. Не забыв отдать 15% комиссионных считаем:

       300,000 баннеров в месяц * 85% * 3% = 25% посетителей дополнительно.

       Итак,  замозолив  глаза 29,000 (97%) посетителей навязчивой рекламой,
вебмастер получает дополнительно 25% посещаемости  и  15$  в  месяц  навара.
Неплохая  прибавка  к  пенсии.  Правда он  забыл  в этих расчетах поделиться
наваром  с  хозяином  хоста,  заплатить  за  трафик   и   аренду   дискового
пространства. Но это понятно - он ведь (был) некоммерческим сайтом и все это
имел бесплатно.

      Кстати, мой собственный сайт имеет 4,000 посетителей в день, и средняя
глубина просмотра  на  нем  10  кликов.  Если  посчитать  по  примененным  в
предыдущем  примере  формулам,  получится   60$   в  месяц  и   50%  прирост
посещаемости. (Может все же  провести на себе эксперимент? :^)

     Не  забывайте  так же и о накрутчиках баннерной статистики.  Халтурщик,
который  в  состоянии  сделать  страничку  показывающий  "ваши"  баннеры   в
_никуда_,  в  состоянии  так  написать  скрипт, который будет "щелкать" ваши
баннеры  с  заданным  ожидаемым  ранжиром  CTR,  чтобы  вы  ни  о   чем   не
заподозревали.

 From: Pasha Khodakov 
 Date: 31 Oct 98

Статистика сегодняшнего дня для одинаковых баннеров MUSIC RU
из сетей:

баннер              IR                RRU
             показов / CTR       показов / CTR
lalka.gif       4695 / 1.95 %       5341 / 5.6 %
music1.gif      2022 / 1.48 %       3024 / 5.0 %
cat.gif         4057 / 2.26 %       1473 / 3.2 %

 А здесь меняют клики. Кстати, тут тоже можно прогадать, получив
для показа баннер с CTR 0.1%
 http://click.ipc.ru

Сравнительные характеристики ведущих баннерных систем


Для рандомизатора в баннерном коде вместо CGI-скрипта (rb2,rru и т.п.) можно использовать просто подстановку переменных, определенных в SSI -
текущее время, текущий url, текущий IP клиента -
тут все что угодно можно подставить. Простейший пример:

<!--#config timefmt="%m%d%M%S"-->
<a href=http://rb2.design.ru/cgi-bin/href/nit?<!--#echo var="date_local"-->>
<img src=http://rb2.design.ru/cgi-bin/banner/nit?<!--#echo var="date_local"-->
ismap></a>


    Эпилог

Не учите жить других - им это не поможет + а если взялись учить других, то получайте от этого удовольствие Regards. Максим Мошков.

    См. также

Естественно на эту тему есть странички других вебмастеров. Они могут советовать диаметрально противоположные вещи. Что поделать - таково их imho. Кстати, один из главных советов вебсайту - не исчезать из сети. К сожалению - многие советчики сами этому совету не всегда следуют. 10 советов Артемия Лебедева Вредные советы на hobby.ifmo.ru (?) Секреты вебмастера. (Планета Интернет, No 5) Золотые правила плохого HTML

Last-modified: Thu, 10 Jul 2003 05:17:57 GMT
Оцените этот текст: