Рубрика: Frontend

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

15 февраля, 2023

Автор: Штефан Макс Оригинал статьи: Optimizing the Critical Rendering Path Оглавление: От загрузки страницы до рендеринга От чистого листа до содержания Как насчет изображений А теперь JavaScript Три шага для оптимизации критического пути рендеринга 1. Минимизируйте объем трафика, передающегося на сайт. 2. Минимизируйте блокирование рендеринга загрузкой CSS 3. Минимизируйте блокирующий рендеринг JavaScript Заключение Последние годы мы видим… Читать далее »

Веб становится более сложным каждый день

29 апреля, 2015

Когда-то давно, в 2004 где-то, когда я постепенно начинал вникать в веб-разработку, сайты были очень простыми. Таблица стилей для сайта помещалась в один CSS файл. Обычно его называли style.css или index.css кому как больше нравилось. Сегодня это с десяток стилевых файлов (12 стилевых файлов для обычного интернет-магазина). И с каждым днем становится все сложнее и… Читать далее »

Инструменты для тестирования верстки и отзывчивого дизайна

23 января, 2015

Подходы к клиентской части разработки веб-сайтов меняются и усложняются. Сегодня в моде responsive дизайн, то есть дизайн сайтов отзывчивых относительно того или иного устройства. Я не удивлюсь если через несколько лет у меня закажут сайт для тостера или микроволновой печи. Почему нет? Усложняются подходы, усложняется и возможность тестировать свою работу. В идеальном случае тестировать клиентскую… Читать далее »

Элементы микроразметки для улучшения взаимодействия сайта с социальными сетями

12 января, 2015

Микроразметка это дополнительная возможность сообщить роботу поисковой системы на то, что конкретно содержит страница. Микроразетку так же называют семантической разметкой. Дополнительное информирование роботов осуществляется за счет добавления на страницу в html код тэгов и атрибутов тэгов. Под микроразметкой (или семантической разметкой) мы подразумеваем разметку страницы с дополнительными тегами и атрибутами в тегах, которые указывают поисковым… Читать далее »

В Киеве прошел Web Standarts Days

8 декабря, 2014

В субботу в Киеве прошла встреча любителей веб-стандартов. В программе были доклады: — Сколько нужно верстальщиков, чтобы вставить picture? — Правила хорошего тона в HTML и CSS — Пишем БЭМ правильно — Доступный веб для всех — PostCSS — что такое постпроцессоры CSS — Зачем нам функциональное программирование — Swarm.js: реактивная синхронизация данных — Режимы… Читать далее »

Несколько моих принципов верстки (front end coding my best practices)

7 декабря, 2014

Работая длительное время с версткой макетов у меня сложилась своя система, которой я стараюсь придерживаться из проекта в проект. И я решил ее свести в набор 10 правил, которые я обычно использую в работе. Итак 1. Используйте стандартный ластик reset.css Я использую стандартный ластик от Сида Мейэра reset.css который позволяет обнулить все отступы, и привести… Читать далее »

Книга Отзывчивый веб-дизайн, Итан Маркотт

3 сентября, 2014

Читаю сейчас книгу «Отзывчивый веб-дизайн» про совокупность подходов к реализации адаптивной верстки макетов веб-страниц, и задаюсь вопросом почему эту книгу написал американец Итан Маркотт, а не русский парень, например Вадим Макеев (достаточно известный русский фронтэнд разработчик)? Вообще, вас никогда не удивляло, что технологическое развитие в мире, оно совершенно неслучайно идет именно с запада? Автор, например,… Читать далее »

Firebug, PageSpeed, Yandex и Webvizor

18 апреля, 2014

Оптимизируя пару сайтов через Firebug и PageSpeed наткнулся на удивительную рекомендацию. PageSpeed рекомендует уменьшать размеры запросов которые генерирует Yandex.Metrika с подключенным Webvizor причем основное время кушает именно Webvizor. В общем вердикт такой, если Webvizor не требуется не включайте его.

Уроки по bootstrap

5 марта, 2014

Хорошая подборка уроков по Bootstraps (front-end framework облегчающий верстку клиентской части приложений). В свете набирающих популярность landing pages он будет очень кстати т.к нет желания всю разметку делать каждый раз с нуля http://mybootstrap.ru/video-obuchenie-twitter-bootstrap/