Как в html сделать оптимизацию. Выбираем лучший онлайн-сервис по сжатию CSS. Title, Description и Keywords — располагаем сразу после тега

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

Одним из важных мероприятий по внутренней оптимизации сайта является оптимизация кода страниц . За счет этого можно улучшить общее качество ресурса, увеличить скорость загрузки страниц, повысить эффективность работы интерактивных функций.

Валидация и стандартизация HTML

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

Для достижения общей унификации все сайты разрабатываются на основе стандартных версий HTML. Наиболее актуальными сегодня являются версии HTML 4.1 и HTML5. Последняя хотя все еще и находится в стадии разработки, в сети уже опубликовано огромное количество таких сайтов.

Все самые популярные браузеры – Opera, Google Chrome, Mozilla Firefox в своих последних версиях используют поддержку нового гиперязыка HTML5. Важность использования HTML5 для создания сайтов еще и в том, что мобильные компьютеры на базе операционной системы Android не поддерживают технологию Flash и пользователи не смогут просматривать видео в формате SWF.

Сайты на основе HTML5 способны воспроизводить видео без необходимости загрузки и установки Adobe Flash Player. Тенденция к отказу от флеш расширяется, поэтому для нормальной работы сайтов полезно постепенно отказываться от использования флеш-видео и анимированных баннеров этого формата.

Проверить валидность HTML-кода сайта можно бесплатно на официальном сайте Консорциума Всемирной Паутины, вот например этот

validator.w3.org

Встроенные валидаторы имеются в хороших конструкторах сайтов и системах управления контентом.

Очистка HTML-кода

В процессе создания и последующего редактирования веб-страниц программист второпях оставляет на страницах технические заметки, комментарии, забывает удалять лишние теги. Все это не только замедляет работу сайта, но и снижает функциональные возможности. За счет простого удаления HTML-мусора можно ускорить загрузку страниц сайта буквально на 35%.

К вредоносному мусору относятся также битые, неработающие ссылки, которые никуда не ведут, потому что реципиент был удален. Такие ссылки очень не нравятся поисковым системам. Наличие битых ссылок может негативно отражаться на поисковом провождении ресурса.

Поскольку битые ссылки имеют свойство время от времени возникать сами собой, необходимо регулярно проводить их поиск и удаление. Это относится как к внешним, так и внутренним ссылкам. Если система управления контентом не имеет опции поиска битых ссылок – можно воспользоваться бесплатными онлайн-сервисами.

http://creatingonline.com/site_promotion/broken_link_checker.htm

http://anybrowser.com/linkchecker.html

Оптимизация графического контента

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

• Для публикации фотографий целесообразно использовать формат JPEG, поскольку этот тип файлов обеспечивает лучшее качество при минимальном весе.

• Для сохранения картинок, для которых качество не очень важно, можно выбрать формат PNG при весе файлов не более 100 или 200 КБ.

• Все графические файлы нужно, по современным стандартам, сохранять в сжатом виде и в отдельной директории на сервере, но не внедрять в веб-страницы.

После редактирования страницы, содержащей изображения, необходимо проверить скорость загрузки. Страница должна появиться в браузере не более чем в течение пяти секунд. Иначе показать отказов резко возрастает.

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

Метатеги веб-страницы

Метатеги для разных страниц сайта должны быть в обязательном порядке уникальными. При обнаружении дублированных тегов поисковая система их склеивает и часть страниц таким образом не будет проиндексирована. Эксперименты показали, что уникализация метатегов сайта улучшает ранжирование и повышает посещаемость примерно на 18%.

Особое внимание следует уделить оптимизации тегов Title и Description

1. Заголовок страницы должен состоять не более чем из разрешенного поисковой системой количества символов и содержать главное ключевое слово.
2. Оптимальное количество слов для заголовка – шесть.
3. Описание страницы оформляется как своего рода продающий текст для посадочной страницы и обычно составляется из двух коротких предложений. В первом предложении содержится главное ключевое слово, а во втором – дополнительное.
4. Метатеги Keywords не очень важны, но должны быть на всякий случай.

Я у себя например вообще удалил из самого движка часть кода который отвечает за метатеги.

Оптимизация программных элементов – скриптов

Принципы оптимизации скриптов такие же, ка для графики – на странице не размещать, сохранять в сжатом виде в особой директории.

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

Оптимизация текстового контента

Наверняка, каждый уважающий себя оптимизатор, уделяет немало времени работе над html-кодом. Эти шаги имеют определенное практическое значения, в плане удобства для пользователей и анализа сайта поисковой машиной.

HTML ошибки могут усложнить индексацию и ранжирование страниц для определения релевантности их содержимого какому-то запросу. Обилие таких ошибок на разных страницах сайта говорит поисковикам о низком качестве всего веб-ресурса. Перечислим наиболее опасные html ошибки.

Даже самые минимальные работы по оптимизации html-кода предусматривает знания:

1. Язык программирования html
2. Систему управления сайтом CMS
3. Знание CSS

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

Оптимизация, в свою очередь не одномоментный процесс, а требует терпения и грамотности, особенно при работе с html-кодом.

Этапы оптимизации кода-html:

1. Формирование файла CSS
2. Удаление лишних тегов
3. Применение глобальных блоков

Работа с CSS:

В этом этапе, стоит перенести все стили таблиц, изображений, тела страницы, ссылок, меню и прочего, в стилевые таблицы. Это делается с той целью, чтоб код страницы стал чище, имел меньший вес.

1. Имеем следующий код:

2. Для создания класса, в таблице css прописываем: .newstyle {background: url(/style/backs.jpg); border: black 1px double.}

3. Теперь, в таблицу можно вписать новый класс:

Очевидно, что код стал значительно меньше и теперь загрузку этого стиля можно применить на всех страницах. Этот метод подойдет для всех тегов, где прописаны стили.

Удаление лишних тегов:

Часто на странице можно встретить посторонние коды, ссылки на другие сайты, фреймы и прочее. Не стоит игнорировать этого.

1. В первую очередь, стоит удалять посторонние ссылки, а если это ссылки на источник, то желательно помещать их в тег , а также, прописывать параметр . Это делается для того, чтоб поисковые системы не считывали код из данного участка страницы.

2. Не игнорируйте различные теги типа