Stfw.RuЗолотые правила плохого HTML
этот трактат следует рассматривать как руководство для всех, кто намеревается прославиться плохим html
🕛 04.10.2006, 11:37
этот трактат следует рассматривать как руководство для всех, кто намеревается прославиться плохим html - оформлением своей странички. он посвящается также памяти тех, кто не нашел пути истинного. благодарности:
поблагодарить я хочу всех тех, кто своим примером поставлял идеи для этого труда, а так же тех кто помогал мне найти новаторские оформления страничек.
далее следует!
этот документ будет через короткие промежутки дополняться. множество пустопорожних примеров будут уводить вас с истинного пути. обращайте внимание на символ на домашней страничке: http://www.karzauninkat.com/goldhtml/
вначале самое важное: не читайте руководств, чаво (часто встречающихся вопросов и ответов или в англоязычнойм исполнении - faqs), прочтименя-файлов (readme) по html. чистая потеря времени. в группах новостей (newsgroups) и на форумах можно найти достаточно компетентных людей, которые ответят на одни и те же вопросы с присущим для них великодушным терпением. к тому же совершенно бесплатно! если вы последовательный человек, то дальше читать не имеет смысла. те же, кто не смотря на это будет читать дальше, делают это под свою ответственность. родители несут ответственность за своих детей.
всегда используйте новейшие тэги, которые поддерживают браузеры последних версий. это особенно важно, если ваша информация должна дойти до самой широкой публики. благодаря этому люди будут стараться иметь у себя свеженькую beta-версию браузера поддерживая тем самым прогресс в разработке соответствующего программного обеспечения. в настоящее время, например, только с netscape navigator 4 (communicator) и microsoft internet explorer 3.0 (и выше) можно использовать <frameborder>-тэг, с которым можно делать фреймы без рамок. туда же относятся <multicol>-тэг, с которым возможно реализовывать тексты, состоящие из многих колонок (как в газете) и <font face>-тэг, который допускает применение любых шрифтов. обе версии доступны с 20 августа 1996. так что было достаточно времени для обновления своей устаревшей версии. используйте тотчас новейшие тэги!
встречайте своих гостей с прекрасными фреймами. откажитесь от сложных <noframe> областей, которые только вводят посетителей в заблуждение. кто не может видеть фреймы - должен позаботиться о новейшей версии браузера. см. также следующий совет.
на первой странице необходимо располагать как можно больше анимированных кнопок, которые ведут к страничкам с различными браузерами, необходимых для лучшего просмотра вашей странички. этим вы также доказываете как здорово вы ориентируетесь в интернете. не забудьте также, что ссылку необходимо установить на главную страницу соответствующей фирмы, а не на download-страницу. посетитель будет вам бесконечно благодарен за возможность пробираться через множество уровней, пока он наконец получит возможность начать копирование выбранного им браузера.
используйте много больших картинок. людям в очках не надо будет напрягаться, чтобы разглядеть картинки величиной с почтовую марку, а вы можете более полно выразить себя и свой художественный талант. параллельно вы заботитесь и о том, чтобы интернет был более перегруженным, что в конце концов заставит ответственных задуматься о повышении пропускной способности сетей. сохраняйте картинки с возможно максимальным количеством цветов и малой компрессией. в конце концов до наблюдателя должно дойти высокое качество. это же очевидно, что любой человек готов за качество платить временем загрузки. будьте уверены!
не поддерживайте больше одной кодировки. зачем утруждать себя конвертированием текста, если в сети доступна масса отличных конвертеров и при том совершенно бесплатно! если кто-то не хочет видеть салат из символов на вашей страничке, то пусть позаботится об одинаковой с вами операционной системе и кодировки. ведь без сомнения ваша система самая лучшая. в противном случае вы бы ее не пользовали, не так ли?
всегда используйте для навигации большие imagemaps и не заботьтесь об альтернативной поддержке в виде текстовой навигации. текстовые строки для навигации портят общий вид страницы и к тому же посетитель может куда-нибудь кликнуть еще до полной загрузки ваших прекрасных картин. для каждой страницы необходимо использовать новую imagemap для навигации (чуть-чуть измененную). если вы главную страничку сделали исключительно с использованием imagemap и без единой строчки текста, то вы можете в виде исключения одну графическую ссылку пожертвовать на текстовый вариант главной странички. ваша добрая воля будет по достоинству оценена. и совершенно не важно, что текстовые браузеры (или те, в которых отключена опция для показа графики) не только не покажут подобную ссылку, но и не позволят ее каким-либо способом активировать.
встраивайте как можно больше анимированных gif-картинок и java applets. интернет болен статичностью. надо поддать немного жару! в движении жизнь! чем больше видно одновременно - тем лучше. см. также правило 14.
вверху первой странички необходимо разместить картинку (желательно анимированную) "идет строительство!". по крайней мере необходимо как можно раньше предупредить посетителей, что страничка находится "under construction" и постоянно меняется. поскольку такое состояние абсолютно непривычно в www.
строка состояния браузера - отличное место для дополнительной информации, которая не помещается на страничку. есть множество javascript-примеров в сети для свободного пользования. длинная бегущая строка без окольных путей найдет своего наблюдателя. кому, скажите на милость, надо знать сколько еще загружаться какой-нибудь страничке или какой url у ссылки над которой находится курсор мышки? правильно, никому!
упростите навигацию по страничке тем, что вы напрочь откажетесь от всякого рода внутренних ссылок. для перелистывания страничек в каждом браузере есть красивейших форм кнопки, а для прокрутки имеется справа, входящая в стандартную поставку системы, полосочка с кнопочкой. к чему вводить в заблуждение читателя внутренними ссылками типа: "к началу страницы".
при использовании картинок оставьте в покое данные о высоте, ширине и альтернативном тексте в <img>-тэге. во-первых, картинка сама знает какого она размера и вы можете на этом сэкономить работу. html-документ будет компактнее и его загрузка будет быстрее. во-вторых, netscape-программисты окажутся под давлением заставить работать javascript без надоедливых <width=...> и <height=...>. в-третьих ваш текст будет располагаться плотно и иногда весело так прыгать в разные стороны если где-то в середине будет загружаться картинка. еще один посильный вклад в поддержку движения в сети.
особенно важно опускать <alt=...>-текст (показывается, если картинка еще не полностью загрузилась, но вы это и без меня знаете) в картинках, которые являются кнопками-ссылками. в противном случае кто-нибудь обязательно придет к идее щелкнуть в эту область до полной загрузки вашей графической кнопки и вся кропотливая работа по ее созданию пойдет на смарку.
используйте максимально возможное количество фреймов и других примочек (gimmicks). это затруднит наблюдателя сконцентрироваться на чем-то конкретном, что позволит ему вкусить всю картину в целом.
большое число сложных и вложенных фреймов и перекрестных ссылок, постоянная подгрузка информации - все это доказывает вашим посетителям какую замечательную способность проникновения в сложную материю и умелого владения оной вы имеете. множество заказов как web-дизайнеру вам обеспечено.
используйте фреймы всегда с <noresize>-тэгом. вера в то, что любой посетитель вашей странички может на свой вкус менять гениальное распределение пространства странички - дерзость высшей степени. в конце концов за подобным распределением скрыты идеи автора. каждый, кто имеет не соответствующий современному стандарту 14"-монитор, сам виноват, что картинки не помещаются в экран и каждую строчку необходимо читать используя горизонтальную прокрутку.
используйте в центральных высказываниях как можно больше (!) восклицательных знаков!!! только таким образом (!) можно достичь того, что подобные высказывания никогда (!!!) не останутся незамеченными!!!!!!
текст должен мерцать, чтобы он был прочитан. в каждом абзаце как минимум одно слово или строка должны привлекать внимание с помощью постоянного мерцания. вы также можете в десятки раз облегчить навигацию, если сделаете ссылки мерцающими. так называемая "мерцающая ссылка". очень здорово выглядит.
пишите всегда для конкретного браузера. только не проговоритесь для какого. таким образом можно принести много радости интерактивного действа людям, которым интересно сознательно исследовать степень несовместимости текста с конкретным браузером. они наверняка будут часто заглядывать на вашу страничку. к тому же посетители осознают ограничения собственного браузера и в следующий раз наверняка будут иметь тот который необходимо.
используйте без стеснения и ложной скромности картинки, фотографии, javascrips и applets с других страничек и не забивайте голову мыслями о правах (copyright). пусть это делают скучные люди, не осознавшие знаков нашего времени. только "link me"-кнопки можно оставить в стороне. кому они нужны?
разрабатывайте страничку всегда для конкретного разрешения экрана. лучше всего для 1280 x 1024. вы выиграете таким образом пространство для оформления странички. и не задумывайтесь о людях с маленькими экранами. таковые встречаются очень редко, и если встречаются, то в конце концов есть удобная горизонтальная прокрутка.
в полную силу используйте горизонтальную прокрутку. это особое, по непонятным причинам редко встречающееся, оформление материала притягивает посетителей как магнит. чем чаще читателю одной строки приходится двигать ее горизонтально по экрану, тем мощнее зов интерактивности и, вместе с этим, радость читателя по этому поводу. форматированный текст подходит для этого как нельзя лучше. или огромные таблицы. и на десерт пару картин? извольте-с!
содержательную и логическую структуру текста необходимо хорошо завуалировать. ничего не вводит читателя в такое глубокое заблуждение как ясная концепция. ведь сеть по природе своей хаотична и неструктурированна. здесь нельзя идти в разрез со всеми.
если вы делаете страничку ссылок, то не забудьте сделать сюрприз своим посетителям и внесите в список поисковые системы alta vista, yahoo. об их существовании знает скромное меньшинство. посетители будут признательны вам за помощь. или еще лучше: поместите эти ссылки прямо на главной страничке (желательно вверху). ведь главная причина посещения вашей странички - скорейшее переключение к одной из этих поисковых систем.
ваши внутренние ссылки не должны быть слишком заметными или по крайней мере делайте их как можно загадочней. какие-либо неожиданные ссылки помогают повысить аттрактивность вашей странички.
пишите огро-о-омные документы, которые требуют много времени для загрузки. и, пожалуйста, не делайте каких-либо замечаний, что за ссылкой "скрывается" больших размеров документ. в этом случае вы не украдете у человека радость предвкушения успешной загрузки документа. и если вы предлагаете файлы для загрузки, то совсем не обязательно указывать их размеры. для чего, спрашивается, в современных браузерах встроена функция автоматическое вычисление предполагаемого времени копирования файла?
используйте при любой возможности множество различных по размеру и цвету шрифтов. читабельность документа будет повышена. вы добьетесь повышенного внимания, больше радости чтения и, кроме того, наблюдателю приятно видеть сколько различных цветов существует в системе. если вы к тому же сделаете шрифт мерцающим , то воодушевлению не будет границ.
достойная альтернатива - полный отказ от цветового и структурного оформления. красивый и гармоничный серый фон со светящимся черным шрифтом обеспечат солидную альтернативу чрезмерно напряженной пестроте сети. откажитесь также от всякого рода форматирования: абзац, списки, структурирование. нет ничего лучше ухоженного текстового блока, состоящего из 927 строк. таким образом вы гарантированно привлечете читателя на свой путь.
чаще оформляйте свои странички однотонными. серый шрифт на черном фоне является, например, щадящей глаза комбинацией. подберите так же соответствующие фону цвета для ссылок. люди, продающие очки вашим посетителям, будут вам признательны.
приклейте к фону вашей странички шероховатые бело-серые обои. как в вашей квартире. подобного ведь ни у кого нет. каждый будет чувствовать себя как дома. или дикую психоделическую комбинацию. 70-ые ведь снова в моде, не правда ли?
не делайте offline-тестирования вашей www-странички. выпадающие окошки с сообщениями об ошибках при использовании javascript или отсутствующие картинки имеют особую эстетическую ценность, наслаждения от которой вы не должны лишать своих посетителей. ссылка-сюрприз на несуществующую страничку или на чужой фреймсет (frameset) снова и снова привносит в происходящее необычные интерактивные моменты.
если вы распространяете свой сайт на cd или дискете, может даже на весь мир пк, не заботьтесь о встроенных картинках. сообщение браузера "здесь отсутствует картинка" видят так редко, что все будут бесконечно рады праву в полной мере вкусить это эстетическое переживание. к тому же вы сэкономите место на носителе информации; что особенно важно, если речь идет о скудных размерах компактных дисков (cd).
меняйте стиль написания ссылочных тэгов как вам вздумается; один раз большими, другой маленькими буквами. на компьютере с системой windows, где не делается различий между большими и маленькими буквами в названиях файлов, вам очень легко добиться безукоризненной работы ссылок - и готовите тем самым unix-посетителям радость исправления не правильно работающих ссылок. unix еще как различает между большими и маленькими буквами в названиях файлов. вы приобретете много друзей, поскольку unix-пользователи известны своей любовью мастерить или работать с клавиатурой. столько же радости вы уготавливаете вашим посетителям, если вы дома делаете весь проект в windows, а потом копируете его на unix-сервер (которых большинство).
отвечайте на каждый негативный комментарий в сторону вашей страницы с искренним непониманием. ссылайтесь на плохое программное обеспечение, если речь идет о плохом виде или ошибочном функционировании. никогда не ставьте под вопрос ваш уровень компетенции в областях интернета, компьютеров и любых жизненных ситуаций, или сразу пишите ответное письмо полное ненависти; в конце концов идиотами являются другие.
хорошей альтернативой можно считать отсутствие mailto-кнопки. вы демонстрируете тем самым с абсолютным спокойствием насколько само собой разумеющимся является высокое качество вашей странички. кому нужен отзыв от народа? если же вы не можете отказаться от этого, то по крайней мере сделайте роскошно оформленную mailto-ссылку. пару java-applets с летающими письмами, собаками и ершиками для унитаза, в комбинации с парой анимированных gif-картинок позволят только мужественным профессионалам пожертвовать вам пару строк похвалы. начинающие же сопляки с озу меньше 64мб задолго до этого зависнут и их спасет только кнопка "reset".
откажитесь от meta-информации в области заголовка. эта информация все равно нигде не показывается. поисковые машины, которые индексируют первые 200 строк вашего документа покажут javascript-код, которым можно гордиться или, при использовании фреймов, не будет показано даже это. ищущий сразу опознает за этим профессионала за работой и срочно навострит лыжи на вашу страницу. даже если он никакого представления о содержании вашей страницы не имеет. гарантированно!
располагайте счетчик посетителей в самом верху вашей странички. особенно графические счетчики требуют время для копирования актуального состояния. или покажите дружественно "busy". последующая загрузка странички будет замедленна, а иногда и совсем остановлена. хороший повод для посетителя погрузиться на некоторое время в медитацию и поразмышлять о смысле жизни, и не быть при этом потревоженным слишком быстро загружающейся страницей. к тому же с самого начала посетителю будет предоставлена наиболее интересующая его информация.
сообщите своим посетителям, что они наконец-то здесь - на вашей страничке. для этого лучше всего использовать красивую, пеструю и большую картинку, которая в полном одиночестве встречает гостей. совершенно не важно какая это картинка. лучше всего, если эта картинка никакого отношения к теме странички не имеет. вы можете, хотя и не обязаны, встроить маленькое замечание как гостям пробраться до следующего куска информации. кто до этого не додумается сам, тому и нечего делать на вашей страничке. там, где каждый ожидает imagemap сделайте сюрприз и вставьте просто картинку. только так. наконец-то сеть будет загружена творческим и осмысленным! такие трюки особенно любят рекламные агентства. и картинки. и художественные вузы. и все это - профессионалы, которые понимают в этом толк. посему: тотчас имитируйте.
если какие-то части вашей странички еще не готовы, то старайтесь оставить это незамеченным. согласитесь, что намного интересней, если посетитель сам установит, что за каждой кнопкой скрыта одна и та же страничка с надписью "еще-не-готово". если вы хотите доставить особенную радость своим посетителям, оформляйте свою страничку такой насыщенной, что только после полной загрузки странички с картинками станет ясно, что речь идет о "месте, где идет строительство".
подчеркивайте при любой возможности, что вы предлагаете нечто особенное и "другое". если вы этого не сделаете, может никто этого и не заметит. особенно тогда, когда вы являетесь web-дизайнером.
оформляйте ваши документы без единой строчки текста. наконец-то есть возможность забыть все устаревшие, доисторические ограничения языка описания страниц и не подавлять свой талант художника. никаких тебе скучных стандартов - times шрифтов, располагайте текст в выбранном вами шрифте. таким образом можно оптимально комбинировать текст и графику. элегантно так же, если вы откажитесь от - и -данных. тогда не будут показываться эти безобразные пустые рамки пока картинка еще не загрузилась (см. также правило 12 и 13) и картинки имеют достаточно пространства для адекватного их выражения. посетитель будет безмерно рад, если он, будучи полон ожидания, имеет право не заботиться об ориентации на страничке по зачаткам информации, а ждать полной загрузки документа.
правопесание - эта очинь проста. если вы не уверены как то или иное слово пишется, пишите его так как слышите. после реформы правописания практически отсутствуют люди, которые знают как правильно писать и с вас как с гуся вода. вам не должно быть стыдно, если вы вместо "интернет" пишете "интэрнэт". словари вышли из моды, а словари на cd слишком дорогие. если же вас все-таки выловят, то возьмите на вооружение правило 34.
ничего не умалчивайте, и уж тем более ваши интересные хобби, размер ноги вашей подруги (друга), цвет вашего ковра, диаметр вашей любимой электроплиты. такой информацией может по праву гордиться общественность сети.
пакуйте всю свою огромную страницу в одну единственную таблицу. этим вы добьетесь не только шикарного форматирования с элегантными краями страницы, но и позволите посетителю посвятить себя занятию какой-нибудь важной деятельности, поскольку содержание таблицы будет показано только тогда, когда вся табличная информация загрузится. если же речь идет о больших страницах, равно как и о больших таблицах, ободренный вами посетитель наконец-то протрет свой экран монитора от грязи, которую очень хорошо видно на пустом, матового цвета экране. ваш достойный вклад в гигиену мониторов!
стандартизируйте цвета ссылок. задайте значения параметров <link> и <vlink> в body-тэге, которые отвечают за цвет ссылок в html-документе, одинаковыми. это определяет однообразность внешнего вида и предлагает посетителям значительную и неоднократную пользу: если кто-то не может или не хочет запоминать какие ссылки он уже выбирал, таким людям вы предоставляете редчайшую возможность тренировать эту маленькую умственную способность. и даже тогда, когда цель и смысл ваших ссылок невозможно однозначно идентифицировать из текста, посетитель будет частенько попадать на одну и ту же страницу и радостный сможет воспринять вашу информацию еще более основательно. еще более идеальный случай продуктивной работы с вашим текстом, если цвет текста и ссылок будет одинаковым.
без javascript ничего не получится. задолго до того как появится первая строчка вашей странички необходимо сделать загрузку зависимой от javascript, например для того, чтобы выбрать язык или кодировку, цвет или марку откидного сиденья для унитаза. тому, кто не имеет браузера поддерживающего javascript, нет места на вашей страничке! ссылки, которые определены с помощью javascript, имеют большие преимущества перед нормальными. они впечатляют посетителя вашими программистскими умениями и отключают надоевшую back-кнопку браузера. кому она нужна?
не пишите url вашего документа еще раз в нем самом. в конце концов при каждом вызове странички url видно в браузере. особенно это важно для документации или длительного применения. наверняка вы хотите получить множество писем, поскольку всякий, кто ваш документ сохранил как файл, но не внес url в bookmarks, или имеет только распечатку вашего документа, напишет вам письмо и спросит о том, где же можно найти актуальную версию.
незамедлительно укажите посетителю, какой системный шрифт он непременно обязан установить в своем браузере, чтобы иметь возможность адекватно воспринимать вашу страничку. лучше всего, если вы также поместите в тексте замечание о том, что при отсутствии подобного шрифта ему (посетителю) следует скорейшим образом убираться подальше. этим вы докажете не только отличное владение общим оформлением, но и то, что вы глубоко проникли в особенности html.
создавайте динамику за счет постоянного подгружения. в особенности применение фреймов позволяет реализовывать лихие эффекты, если вы как можно чаще будете менять каждое окно в отдельности, его содержание, картинки, анимации, java applets, цвета. таким образом вы, может быть, достигнете уровня высококачественного рекламного ролика. мы полны страстного ожидания увидеть это. все!
игнорируйте стандартную палитру цветов, которую в свое время встроил netscape для оптимального представления страниц даже там, где система поддерживает 256 цветов. во-первых - подобного рода доисторическим машинам нечего делать в сети, а во-вторых ... во-вторых я лично делаю тоже самое. в случае чего апеллируйте к этому факту.
делайте ссылку на чужие странички в одной из своих рамок (frame). таким образом вы тотально контролируете дальнейший путь вашего посетителя и при этом крепко-накрепко удерживаете его на своей страничке. по счастливой случайности не будет показываться url новой странички и замечательные особенности html автоматически подправят структуру чужой web-презентации под вашу. а наложение различных цветов и оформления могут вырасти в новую, неожиданную комбинацию. особое воодушевление обеспечено, если вам удастся заполучить в комбинацию <noborder>-тэг. в этом случае "ссыльный" (тот, на кого вы сошлетесь) будет любить вас всем сердцем!
задолго предупреждайте о грядущих изменениях и называйте для них точные даты. в эти дни вы непременно повысите число ваших посетителей. будьте при этом достаточно дальновидным человеком и не вздумайте в самом деле опубликовать новую страничку или внести обещанные изменения. во-первых всем должно быть видно насколько важный и занятый вы человек, а во-вторых - будет повод заглянуть к вам в другой раз. очевидно же, что высокое число посетителей - лучшее доказательство качества.
если вы хотите обнародовать радостное известие о выходе в свет вашей новой странички (будь то на каком-либо форуме или в группе новостей, списках электронной почты), то напишите просто: "замечательная новая страничка. заходите ко мне!" без каких-либо дополнительных разъяснений о содержании. страниц в сети существует невероятно мало и если кто-то получает подобную информацию, он тотчас устремляется с жадными глазами выяснить вопрос: "а чего ж там такое написано?!". кошки в мешке, да еще за деньги, всегда пользовались большим спросом.
упражняйтесь в метании пряников. cookies (печенье, пряники) используются различными web-авторами для сохранения информации на компьютере посетителя. если уж вы решили использовать cookies, то делайте это в больших количествах. кто, скажите на милость, не с превеликой радостью, будет щелкать мышкой в каждое отдельное окошко, которое просит подтвердить сохранение cookie. кто без охоты выходит по весне на субботник по расчистке директории от cookies? дайте людям возможность насладиться этим.
порадуйте криптографов и любителей головоломок среди ваших посетителей, задавая имя директории и файла с помощью изменчивой и свободной от смысла комбинаций цифр и букв: http://www.frlx.com/grflb5w/drc3k1/zrrrt0r/fl2bsl.htm. так каждый сразу догадается о чем собственно здесь идет речь. да и запомнить подобное весьма просто.
делайте ссылки на картинки с сюрпризом. ну кто же догадается, что за картинкой, величиной 50x50 пиксель - скрывается ма-а-аленькая такая картиночка размером в 320кб, отскалированная с помощью width и height тэгов? осчастливленный или осчастливленная имеют несколько решающих преимуществ: он получает сюрприз. вы идете в ногу со временем, доказательством чего является необыкновенно быстрая распродажа шоколадных яиц-сюрпризов. она получает пару жирных байтов на ее винчестер. и здесь вы идете в ногу со временем, доказательство - падающие цены на пространство жестких дисков.