Андрей Федосеев

В дополнение к ответам: бэкдор, это то что намерено оставляют коде. Не всякий баг это бэкдор, и не всякий бэкдор это баг. Можно eval() воткнуть специально, тогда это бэкдор, а можно по незнанию, тогда это баг =) off>

Как правильно выстраивать гармонию по вертикали в макете?

Вертикальный ритм это такая же сетка. Только если горизонтальную сетку регулируют колонки макета (8/12/16/24) и при любой ширине экрана любые две колонки (например в шапке и в теле поста) имеют одну ширину, то вертикальный ритм регулируется вертикальными отступами, размером шрифта и интерлиньяжем. Танцуем от основного размера шрифта. Марджины и паддинги делаем кратными, интерлиньяж и размеры неосновных элементов тоже кратными. удобнее всего 8-пиксельная сетка. Тогда размеры шрифтов, отступов и интерлиньяжей будут 2/4/8/12/16/24. Почему тогда сетка называется 8-пиксельная? Потому что из набора размеров выпадают 6/10/14/20 кратные четырем пикселям. Если считать в em'ах, то отступы и интерлиньяж всегда будут 0,25/0,5/1/1,25/1,5/2 и т.д.

Можно где-то отступать от правил и делать размер шрифта элемента, например, 13 или 17. Но чтобы отступать от правил они (правила), должны быть.

if ('IntersectionObserver' in window) {

    let config = {     
        root: document.querySelector('#scrollArea'),   // если не указывать, root это viewport
        rootMargin: '0px',   // '10px 10px 10px 10px' отступы будут включены в зону отслеживания пересечения. Observer вызовет калбэк за 10px до пересечения секции c любой стороны root. 'px' обязательны.
        threshold: [.0,.1,.2,.3,.4,.5,.6,.7,.8,.9,1]  // вызывать калбэк при пересечении каждых 10%. [0] для вызова калбэка один раз при первом пересечении
    };
    
    // заводим observer с обработчиком и конфигом
    sectionObserver = new IntersectionObserver(onIntersection, config); 

     // прикручиваем созданный observer на нужные элементы    
    let sections = document.querySelectorAll('section');
    sections.forEach(section => {
        sectionObserver.observe(section);
    });

    // обработчик observer
    function onIntersection (entries, self) {
        if (entry.intersectionRatio > 0.5) {
            // секция пересекла observer's root на 50%
        }
    });
}

awwwards.com
cssdesignawards.com