Как всегда приветствую Вас, ищущего полезную информацию по верстке сайтов. Сегодня мы поговорим о кодировке файлов. Данную тему важно запомнить один раз и больше к ней не возвращаться. Сегодня мы будем говорить о том, как сохранить файл в кодировке utf-8, почему необходимо использовать utf-8?
Что же такое юникод, utf-8, преимущества и минусы можно почитать на Wikipedia, так и на других сайтах, например, мне понравилась статья Дмитрия, в ней интересно описано откуда и почему появились кодировки ASCII, юникод и UTF 8, расширенная ASCII (Windows 1251, CP866, KOI8-R).
Давайте, перейдем к нашей теме и начнем разбираться с проблемами во время нашей верстки сайта.
Основной проблемой неправильной кодировки это отображение текста как кроказябли, непонятные символы и т.д. Так же в кодировке window-1251 отсутствуют специальные символы (что-то типа копирайтов §, ©, ‰) и другие пинтограммы (♥, ☺).
Все это от того, что в cp1251, например, всего 256 символов (что в принципе достаточно для кирилицы), а в Unicode более 100 000 символов. Поэтому я советую создавать html каркас (как html верстальщик) и вообще сайты с кодировкой utf-8. Вы скажите мне достаточно window-1251, так как я использую кириллицу. Полностью согласен с Вами, но если Вы захотите использовать специальные символы, или сделать мультиязычный сайт? Ну, а в связи с тем, что я верстаю для Казахстана, то кодировки cp1251 изначально не подходит, так как обычно используется казахский, русский и английский языки. Лучше запостись символами 
.
Как сохранить файл в кодировке utf-8 без BOM? (utf-8 without BOM)
Именно так и надо сохранять без BOM (Byte Order Mark или— сигнатура – три символа, которые все портят).
Не все программы способны сохранять файлы в кодировке utf-8 без BOM. Яркий пример – Блокнот от Windows.
Программа Notepad++
Программа шикарная и очень полезная как для верстальщика, так и для программистов, веб-разработчиков. Посетите официальный сайт, там же можно скачать редактор совершенно бесплатно.
Откройте файл и выберите преобразовать в utf-8 без BOM.
Если нажмете кодировать в utf-8 без BOM, то произойдет следующее.
Если сомневаетесь и, чтобы не рисковать всегда делайте backup – резервное копирование!
Программа PhpDesigner
PhpDesigner – удобный редактор. Программа платная.
Немного сложней будет. Для начала проведем настройки для браузеров:
1. Откройте выпадающее меню: Создать новый файл -> Изменить шаблон (Edit template) либо Файл -> Новый… -> Edit templates
2. Выберите Html и вставьте туда следующий код и поставьте галочку на «Использовать данный шаблон для HTML/XHTML» (Use this template for HTML/XHTML):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title>Документ Без Имени</title> </head> <body> </body> </html>
Установка кодировки:
– Пройдите: Инструменты -> Установки (или вызовите через CTRL + E) и выставите соответствующую кодировку.
Для преобразования отдельного файла используйте:
Файл -> Кодировка файла -> utf-8
Текущую кодировку можно увидеть в нижней части программы слева.
Можно, конечно, пойти другим путем. Создать файл, после открыть файл в Notepad++ и сделать соответствующие настройки.
Программа PSpad
Pspad - еще один неплохой текстовый редактор. Кстати, полностью бесплатный. Функций больше чем у Notepad++.
Поменять кодировку текущего файла в Pspad очень просто: Вкладка Формат -> Выбрать необходимую кодировку (например, utf-8)
Кодировка для браузеров по умолчанию:
Создать новый файл (Ctrl + N) -> Из шаблона -> Html -> Html 4.01 Transitional -> Правка…
В charset впишите необходимую кодировку, например:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="cs"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <meta name="generator" content="PSPad editor, www.pspad.com"> <title>Untitled</title> </head> <body> </body> </html>
Сохраните и закройте шаблон.
Теперь, создавая новый файл из шаблона все будет готово.
Программа Rapid PHP (2010)
Rapid PHP – платный текстовый редактор.
Для настройки кодировки сделайте следующее:
Опции -> Настройки… -> Файл -> utf-8 без BOM (либо другая кодировка)
По умолчанию файл html создается без meta данных. Вставить кодировку (charset) для браузеров можно так:
Вставка -> Кодировка -> Unicode (utf-8) (либо другая необходимая)
Кодировка с помощью .htaccess
С помощью файла .htaccess можно заставить браузер отобразить нужную кодировку. Не советую пользоваться данным методом на работающих сайтах (я обычно использую только для html на локалке, ), но все же метод работающий. Добавьте в файл:
AddDefaultCharset utf-8
Внимание! Ваш хостинг может не поддерживать данные настройки.
Сообщение кодировки для браузеров
Как браузеры понимают, в какой кодировке Вы писали свой файл? Для этого и существует строка (мета данные):
<meta http-equiv="content-type" content="text/html; charset=utf-8">
Т.е. браузер по умолчанию «читает» страницу в кодировке utf-8. Это Вы в принципе, должны знать еще из школьной программы.
В принципе, это основные настройки. Если остались вопросы, отписывайтесь в комметариях, чтобы закрыть эту тему с кодировкой и сохранить себе нервы 
.
Надеюсь информация была полезной. Спасибо за Ваши like и ретвиты.
с/у УтБ
Постовой: Если Ваш интернет магазин не приносит доходы, то пора сделать полный анализ интернет магазина. Хватит терять потенциальных клиентов!
На десерт сегодня вирусное видео про Светлакова. Но все же мне понравилось, обязательно надо сходить на его фильм
А как это массово перекодировать в нотепаде ?
Спасибо Тебе Добрый человек!
Спасибо! Полезная информация!
А как заставить Notepad++ сохранять UTF-8 без BOM по дефолту?
Опции – Настройки – Новый документ (вкладка) – Кодировка – UTF-8 без BOM
Новый созданный файл будет в utf-8, если поставить галочку – Применить при откр. ANSI файла, то при открытии файлов будет автоматически переделывать в utf-8 (не советую ставить галочку)
Парни помогите мне плиз!!!
Установил “Notepad++”. Выполнил все инструкции по изменению кодировки.
1 Поставил Кодировка – UTF-8 без BOM
2 Зашел в Опции – Настройки – Новый документ – Кодировка – UTF-8 без метки BOM.
Вот что получается: Ãäå æå òû ìîÿ óäà÷à :?:
Что вы можете посоветовать???
преобразовать в utf-8
Преобразовала, все путем.
Но ведь нам требуется кодировка без BOM или это уже не важно?
Да, конечно, это я имел ввиду))
Нормально текст отображается просто в utf-8
А без BOM – опять крюкозябрики.
Попробовала PSPad, там все отображается, как надо. Но опять просто utf-8, причем варианта “без BOM” нет.
Спасибо!Чётко,лаконично и понятно.Информация нужная и на русском языке.
не за что, все для людей
Я тут на другой сервак переехал, дык у меня с кодировкой совсем плохо было! А кто-нить знает программу которая массово перекодирует файлы, а не по-одному?
У стандартного блокнота (notepad второй версии) тоже есть функция перекодировки в UTF-8 без BOM
зачем резать сайт на картинки ?
-если можно сделать одну большую картинку-сайт
и сделать некоторые части этой картинки ссылками
ничего себе
может и готовить кушать не будем, все равно переварится в желудке :))
вы действительно все так верстаете?
на самом деле этим тоже не надо увлекаться, потому что я иногда забываю, что работа должна делаться не столь качественно как быстро и режу сайт на малюсенькие детали))
как я понял в нотпаде никак нельзя использовать казахские шрифты?(((
правильно понимаете:)
нет вы наверно ошиблись, я справился с этим,написал пхп код на нотпад++ на казахском языке,и в браузерах видно казахские буквы, Алелуя)))
Это как так??!!
з.ы. Да, если кодировку использовать utf-8
Да я выбрал кодировку utf-8 и получилось , а что нельзя использовать utf-8? если выбрать без БОМ то казахские шрифты в браузере иероглифами станет :lol:
нет, все отлично, казахский шрифт отлично кодируется в utf-8. а вот в Ansi будут каракули, смотрите внимательно на кодировку
Пользуюсь Rapid PHP давно. Для меня – так идеальная программа.
В смысле обзора программ да, очень полезна, но для меня почему когда то в иное перекодирую краказябра становится так и не понятно)))
в какой программе? на всякий случай копируй все, затем поверх вставляй
Несмотря на очевидную простоту, статья полезная =) Особенно, что объединено и кодировка в самих файлах и браузеру и htaccess. Совсем недавно у себя на блоге делал обзор редактора Notepad2, в нём тоже очень много кодировок и легко меняются. Что следует отметить – в UTF-8 – процесс безболезненный, а вот с юникода в другие, или между ANSI – могут теряться некоторые символы в процессе перекодировки.
Спасибо за Notepad++. С первых шагов оценил его +++++. Подсветка, перекодировка, ошибки (показ) всё в тему. Вот только не понятно, как пользоваться «поиском»? Я привык в Дримвивере не мотать километры текста, а через «поиск» по слову, например: class=”clear”, и тебе находят эту строку. А в Notepad++, что-то не получается. Может надо где то поднастроить? Спасибо!
Не за что
Ctrl + F, Выбираешь вниз или вверх поиск, либо поиск по всему документу. Удачи 
@DNilin согласен, все кто начинает сталкивается с этой проблемой=)
Сколько я с этой кодировкой в прошлом перемучался. Только после узнал о Notepad++, а до него постоянно какой-либо сайт на кваказябрах отображался. И понять почему так, никак не мог. Спасибо, хоть и знаю все это, но ностальгия одолела. )))
Держи от меня +1 скачал себе нотепад..а то шота нехорошо все сохранять блокнотом…не знал я про какой то БОМ)
ок, поймал
ну, как так-то ?? блокнотом))
Задавайте, вопросы. Пишите. какие еще темы затронуть буду формировать список, что писать, куда идти дальше
Возможно, мой вопрос покажется глупым. Но в Ваших статьях встречаются упоминания на школьную программу. Сейчас в школах учат веб-программированию или это такая шутка-юмора?
а где именно ?
возможно, шутка была)) но html, насколько помню, учили в школе. банальные вещи и азы, но всё же.