Кодировки web-документов

История возникновения

Кодировка представляет собой таблицу символов, где каждой букве алфавита (а также цифрам и специальным знакам) присвоен свой уникальный номер – код символа..
Стандартизирована только половина таблицы, т.н. ascii-код – первые 128 символов, которые включают в себя буквы латинского алфавита. И с ними никогда не бывает проблем. Вторая же половина таблицы (а всего в ней 256 символов – по количеству состояний, который может принять один байт) отдана под национальные символы, и в каждой стране эта часть различна. Но только в России умудрились придумать целых 5 различных кодировок. Термин «различные» обозначает то, что одному и тому же символу соответствует разный цифровой код. Т.е. если мы неправильно определим кодировку текста, то нашему вниманию предстанет абсолютно нечитаемый текст.

Кодировки появились исторически. Первая широко используемая российская кодировка называлась koi-8. Её придумали, когда адаптировали к русскому языку систему unix. Это было ещё в семидесятых – до появления персоналок. И до сих пор в unix это считается основной кодировкой.

Потом появились первые персональные компьютеры, и началось победное шествие dos. Вместо того, чтобы воспользоваться уже придуманной кодировкой, microsoft решила сделать свою, ни с чем не совместимую. Так появилась dos-кодировка (или 866 кодовая страница). В ней, кстати, были введены спецсимволы для рисования рамок, что широко использовалось в программах, написанных под dos. Например, в том же norton commander-е.

Параллельно с ibm-совместимыми развивались и macintosh-компьютеры. Несмотря на то, что их доля в России очень мала, тем не менее потребность в русификации существовала и, разумеется, была придумана ещё одна кодировка – mac.

Время шло, и 1990 году microsoft явила на свет первую успешную версию windows 3.0-3.11. А вместе с ней и поддержку национальных языков. И снова был проделан такой же фокус, как и с dos. По непонятным причинам они не поддержали ни одну из уже существовавших ранее (как это сделала os/2, принявшая за стандарт dos-кодировку), а предложили новую win-кодировку (или кодовая страница 1251). Де-факто она стала самой распространённой в России.

И, наконец, пятый вариант кодировки связан уже не с конкретной фирмой, а с попытками стандартизации кодировок на уровне всей планеты. Занималась этим iso – международная организация по стандартам. И, догадайтесь, что они сделали с русским языком? Вместо того, чтобы принять за «стандартную русскую» какую-нибудь из вышеописанных, они придумали ещё одну (!) и назвали её длинным неудобоваримым сочетанием iso-8859-5. Разумеется, она тоже оказалась ни с чем не совместимой. И в настоящий момент эта кодировка практически нигде не применяется. Кажется, её используют только в базе данных oracle. По крайней мере, я ни разу не видел текст в этой кодировке. Тем не менее, её поддержка присутствует во всех броузерах.

Сейчас идет работа над созданием новой универсальной кодировки (unicode), в которой предполагается в одну кодовую таблицу запихнуть все языки мира. Тогда точно проблем не будет. Для этого на каждый символ отвели 2 байта. Таким образом, максимальное количество знаков в таблице расширилось до 65535. Но до момента, когда все перейдут на unicode, остаётся ещё слишком много времени.

web-дизайн и кодировки

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

Со стороны сервера мы должны установить систему, которая умеет предварительно посылать сообщение о том, в какой кодировке будет прислана страница. А броузер это сообщение должен принять и, соответственно, настроиться на нужное отображение. Если всё сделано корректно, то проблем не возникает. Но действительность вносит свои коррективы и неправильная настройка web-сервера может привести к тому, что, послав сообщение о том, что сейчас будет страничка в кодировке win-1251, сервер присылает ее в koi-8. Разумеется, броузер путается, ведь он не в состоянии самостоятельно определить кодировку страницы. Он всего лишь пользуется указаниями сервера и, соответственно, показывает страничку неправильно.

Имеется способ указать кодировку странички не на сервере, а непосредственно в html-коде. Для этого используется специальная версия meta-тега с параметром charset, задающим нужный язык. Например, для странички, написанной в кодировке win1251, соответствующий код будет выглядеть так:

Но, к сожалению, с этим тегом связано несколько проблем. В России очень распространён способ, при котором web-сервер автоматически определяет, в какой кодировке приходит запрос от клиента и отдаёт страничку web-броузеру уже перекодированной. Вот тут нас и поджидает небольшой подводный камень. meta-тег может сыграть плохую шутку. Дело в том, что указания на страничке имеют приоритет по сравнению с командами, присылаемыми web-сервером и, правильно перекодировав страничку, сервер, тем не менее, не может изменить содержимое тега meta. Происходит несовпадение реальной кодировки, в которой пришла страничка, и указаниями в теге meta. Такую страничку нельзя будет нормально просмотреть и перекодировать средствами броузера. Выбор кодировки вручную в данном случае не поможет, т.к. тег meta имеет приоритет и над установками броузера. Единственный способ сделать это – сохранить страничку и удалить злосчастный тег.

В связи со всеми этими проблемами в РУНЕТ-е не рекомендуется применять данный тег вообще. В таком случае просмотр будет осуществляться в той кодировке, на которую настроен броузер, если сервер не пришлёт уведомление о кодировке документа. В случае несовпадения ее можно достаточно легко переключить. Кроме того, если по-умолчанию выставлять кодировку win-1251, то у 95% Ваших посетителей страничка сразу же будет показана правильно.

Проблемы с таблицами стилей

В последнее время в связи с широким распространением dhtml, css и 4-х версий броузеров возникла новая проблема, связанная с кодировками. И причиной её появления служит использование каскадных таблиц стилей (css).

Как известно, css позволяет нам задать конкретный шрифт, который будет использоваться для отображения текста. И, вроде бы, мы можем пользоваться абсолютно любым шрифтом, и от этого захватывает дух. Но проблема заключается в том, что шрифты берутся из набора, установленного на компьютере у посетителя, а вовсе не у Вас. И именно Ваш набор шрифтов совершенно не обязан быть у других. Как правило, его там и нет.

Что же делать? Неужели нельзя пользоваться разными шрифтами? Можно! Но с рядом ограничений и пониманием того факта, что даже при этих ограничениях у некоторых людей Ваша страничка не будет просматриваться.

Каковы же эти ограничения?

Первое, и основное, заключается в том, чтобы использовать только стандартные шрифты, поставляемые с windows и гарантированно находящиеся на машине клиента. А этих шрифтов, как известно, всего три. Вот их список: «arial», «times new roman», «courier».

А второе – корректное описание шрифта в таблице стилей и перечисление в списке также и других заменяющих шрифтов. В конце списка должно быть обязательное указание общего семейства шрифта (с засечками, без засечек, моноширинный и т.д.). При помощи такого описания мы увеличиваем потенциальную аудиторию нашего сайта. Пример корректного описания шрифтов в таблице стилей показан ниже.

Почему же нельзя использовать другие шрифты? Потому что в этом случае недостающий шрифт будет подменён ближайшим подходящим по-умолчанию. Для уменьшения вероятности этого мы и используем в css список заменяющих шрифтов. Но ещё хуже, если шрифт будет на компьютере, но окажется нерусифицированной версией. В этом случае текст будет отображен некими спецсимволами из набора знаков центральной Европы – всевозможные знаки с умляутами, апострофами, тильдами и т.п.

Из всего вышесказанного следует вывод – со шрифтами следует работать осторожно. И до сих пор много чисто текстовых надписей отливается в gif. Ситуация не изменится до тех пор, пока шрифт нельзя будет загружать на клиентскую машину, подобно тому, как это происходит с картинкой. На самом деле такая технология уже есть и реализована, например, в 4-ом internet explorer. Но она ещё слишком сыра и, что самое главное, шрифт должен быть представлен в специальном формате. Будем надеяться, что в будущем это станет стандартом, а пока нужно с осторожностью пользоваться шрифтами, отливая редкие в графику и используя в css только стандартные.

Поделиться в соц. сетях

mailru Кодировки web документов
facebook Кодировки web документов
odnoklassniki Кодировки web документов
livejournal Кодировки web документов
googlebuzz Кодировки web документов

Также рекомендуем:

  1. Метатэги Здесь можно расслабиться. В противоположность многочисленным утверждениям о важности правильного использования тэгов META, вам предстоит сейчас узнать о том, что это не так уж и важно.. Ключевые слова, равно как и заполнение метатагов, были придуманы для описания содержимого веб-страницы для поисковых систем, с целью облегчить тем работу, а также описать содержимое страниц, содержащих в основном [...]...
  2. Реалистичный огонь Создайте новое изображение 200×200 пикселей. Заполните его белым цветом. Примените Filter > Render > Difference clouds два-три раза. Затем подгоните контрастность изображения примерно так как на нижерасположенном рисунке.. Теперь примените Filter > Render > Lighting effects с такимим параметрами: Применим фильтр Filter > Brush strokes> Accented edges с параметрами: Получившийся слой можно накладывать на ваши [...]...
  3. Ловушка для спам-бота Многие спам-боты, чтобы скрыть свои реальные имена (названия), которые легко отследить по записи user_agent, изменяют эту запись, меняя её на записи разных браузеров (например: «mozilla/4.0 (compatible; msie 5.5; windows nt 5.0)» и так далее). Также эти боты игнорируют стандарты записей для файла robots.txt (описание стандарта Вы можете прочесть здесь http://www.robotstxt.org/wc/exclusion.html robots.txt standard).. Можно, конечно, пойти [...]...
  4. Второй раз повторяю: я человек! CAPTCHA 1. Краткий обзор Интернет-роботы или как их чаще называют боты, это программы созданные для автоматизированного выполнения некоторых функций в сети. В зависимости от их предназначения, цель работы таких программ тоже разная. Но объединяет роботов одно – избавить человека от выполнения однообразной рутинной работы. Казалось бы, в этом нет ничего зазорного. Бизнесмен, получающий на электронную почту [...]...
  5. Как подружить интерпретатор Perl с Homesite В каких только редакторах не пишут люди программы на Perl.. Мы же любим Homesite и поговорим об этом замечательном редакторе. Главным недостатком Homesite в контексте программирования на Perl является отсутствие встроенного интерпретатора perl. Однако ничто не мешает нам связать родной интерпретатор perl с Homesite. У нас есть два пути: 1. Вынести кнопку, запускающую интерпретатор perl [...]...
  6. Неоправданное использование ООП Парадигма ООП – замечательный подход к написанию кода. У ООП есть множество неоспоримых преимуществ, самое значительное из которых – возможность использовать заново уже некогда написанный код. Однако все мы рано или поздно осознаём тот факт, что ‘PHP – не объектно-ориентированный язык’. . Несмотря на то, что PHP имеет корректно работающую поддержку объектов, использовать объекты там, [...]...
  7. PHP и формы Ни для кого не является секретом, что наиболее распространенным способом взаимодействия html-страницы с сайтом является форма. Форма (то есть html-элемент образуемый тегом form) используется и бесплатными почтовыми службами, электронными магазинами и многими другими типами сайтов.. Обработка простых форм посредством PHP не представляет никакого труда. Однако время от времени возникает потребность обработать форму, содержащую несколько однотипных [...]...
  8. Несколько советов по созданию эффективного сайта! Для чего нужен вам сайт и его основные задачи. . Вы сначала должны определиться, для чего нужен вам сайт и на какую тематику он будет.Образно говоря сайты делятся на некоторые категории, к примеру – не коммерческие сайты и коммерческие. Не коммерческий сайт. Такой сайт может быть посвящен чему угодно. Вашему хобби или же он будет [...]...
  9. Частые ошибки при поисковой оптимизации сайта. Как это избежать? 22 наиболее часто встречаемых ошибок при самостоятельной оптимизации сайта под поисковые системы:. Регистрируемая в поисковой системе страница должна содержать ссылки на другие страницы сайта. В противном случае она будет единственным, что проиндексирует поисковая машина.Не стоит регистрировать сайт в поисковых системах, который находится в стадии разработки (к каталогам, доскам объявлений и форумам это относиться в меньшей [...]...
  10. Инструкция по размещению статей Написание текстов: 1. Напишите статью, которая заинтересует аудиторию ресурсов, на которые вы будите публиковать. При публикации в общей тематике старайтесь в статье не использовать сложных слов и длинных предложений.. 2. Рассказ ведите не от первого лица, а от третьего. Например, «Компания S-Company представляет…», а не «Мы представляем …». 3. Открыто рекламные тексты – имеют маленькие [...]...
  11. Смешивание слоев при помощи маски прозрачности Вот попыталась перевести урок, если, что не вышло, не судите строго.С помощью этого урока Вы научитесь комбинировать области различных слоев и создавать композитное изображение.. 1. Откройте в Illustrator изображение, состоящее хотя бы из 2-х слоев. В данном случае картинка состоит из слоя с розовой розой (верхний слой) и желтой (нижний) 2. С помощью пера или [...]...
  12. Переплетающиеся кольца Не так давно один из посетителей сайта спросил меня, как создать переплетающиеся кольца наподобие эмблемы Олимпийских Игр. Его просьба была реализована в Corel DRAW8, однако я не мог остановиться на достигнутом, поэтому здесь я познакомлю вас с вариантом того же урока для Corel DRAW9. Различие между уроками в том, что здесь были использованы Artistic Media [...]...
  13. Трехмерные здания 1. Инструментом Rectangle Tool (F6) нарисуйте три прямоугольника. Для удобства работы с ними залейте каждый разным оттенком.. 2. Сгруппируйте объекты (выделите их и нажмите ctrl+G). Примените перспективу: Effects > Add Perspective. 3. Чтобы сделать здания разной высоты, разгруппируйте объекты и передвиньте прямоугольники вверх или вниз в зависимости от того, ниже или выше здание вы хотите [...]...
  14. Ucoz web service. Как это было… ПРЕЛЮДИЯ Жил был один молодой парень, который даже не слышал о компьютерах и не мог понять, что это такое. Впервые ему удалось лицезреть его в 10лет. Решив удивить своих друзей и преподавателя, он радостно сказал : я знаю что ЭТО… Осциллограф! Но не было в этом моей вины, вы убедитесь в этом увидев ЭВМ «Электрон».. [...]...
  15. Текст из воды Step 1Создайте документ и напишите любой текст. Растеризуйте слой.. Используя кисть, добавьте несколько капель и подтеков к тексту. Объедините оба слоя Layer > Flatten Image. Step 2Идем в палитру каналов и создаем маску канала путем перетаскивания любого слоя Red, Green или Blue на иконку New Channel внизу палитры каналов. Называем его water. Далее инвертируем канал [...]...

Комментарии запрещены.