Из этой статьи Вы узнаете как ускорить загрузку Вашего сайта:

1) Оптимизация изображений;
2) Форматы изображений;
3) Оптимизация CSS-файлов;
4) Использование слэша на конце ссылок;
5) Указание атрибутов Height и Width для всех изображений;
6) Уменьшение количества HTTP запросов.


Оптимизация изображений:

Широко известно, что время загрузки сайтов имеет огромное значение для пользователей Интернета. Если в эпоху dial-up (56K модемов) пользователь готов был ждать загрузки сайта полминуты, то сейчас, с приходом скоростных соединений, это время сократилось до 4 секунд – если за эти 4 секунды сайт не успевает загрузиться, пользователь с него уходит.

Известно, что неоптимизированные изображения тормозят процесс загрузки веб-сайтов в целом, веб-страниц в частности. Такие графические редакторы, как Adobe Photoshop и другие, имеют очень полезную функцию, называемую «Save for the web». Всегда пользуйтесь этой возможностью, предоставляемой графическими редакторами.

Если же Вы не пользуетесь никакими графическими редакторами, то специально для Вас в Интернете функционирует отличный инструмент оптимизации изображений. Этот инструмент автоматически оптимизирует изображения следующих форматов: GIF, PNG и JPEG, а также, по необходимости, конвертирует из одного формата в другой.

-----------------------------------------------------------------------------------

Форматы изображений:

Мы рассмотрели процесс оптимизации изображений. Чтобы при оптимизации изображений достичь наилучших результатов, нужно правильно выбрать формат изображений.

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

Формат JPEG (Joint Photographic Experts Group). Данный формат был создан для фотографий и других полноцветных изображений. Запомните, что при оптимизации изображений в данном формате для получения оптимальных результатов степень сжатия ставьте 50%.

Формат GIF (Graphics Interchange Format). Данный формат является, чуть ли не основным форматом изображений. Формат GIF славится малым размером файлов изображений. Изображения в формате JPEG содержат миллионы цветов, а изображения в формате GIF - не более 256. Формат GIF следует использовать для изображений с малым количеством цветов, таких как логотипы и различные кнопки. Помимо этого, формат GIF поддерживает анимацию.

Формат PNG (Portable Network Graphics). Данный формат был создан специально для Интернета с целью вытеснения формата GIF. Основное преимущество формата PNG – поддержка 24-битных цветов и прозрачности. Формат PNG следует использовать для простых изображений, содержащих более 256 цветов.

-----------------------------------------------------------------------------------

Оптимизация CSS-файлов:

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

Несмотря на то, что CSS в разы облегчает сайт, оптимизация CSS-файлов просто необходима, если, конечно, Вы хотите ещё более ускорить загрузку Вашего сайта.

Во-первых, найдите все разгруппированные записи в коде и объедините их в одну строку. Ниже приведены примеры:

Вместо: