"Venta de garaje": fachada y publicidad en hh.ru

Si su proyecto público cuenta con una audiencia impresionante, sus usuarios definitivamente estarán interesados ​​en los sistemas publicitarios. Las empresas tarde o temprano se dan cuenta de esto y, naturalmente, intentan extraer algunas ganancias.

Por coincidencia, la mayor parte del tiempo me dediqué al desarrollo de interfaces para servicios publicitarios en hh.ru. En este artículo, no encontrará una descripción de ninguna tecnología innovadora, este material trata más sobre cómo construir la interacción con los contratistas (en el contexto de un sistema de publicidad interna) y no caer en la trampa.

Cómo funciona

Entonces, el cliente se acerca al equipo y dice la codiciada palabra "pancartas". El líder del equipo busca tiempo en su calendario para la próxima reunión y comienzan a formarse los requisitos.

web " ", . , "" , . , url/image/description. , , , iframe.

backend- RPS, frontend web-. , WoW , . :

. hh 4- ( xs/s/m/l). , CSS.

, ( ) , . ( ).

, , . . , . , serp_first_l L (serp - search engine result page).

, . .

banners.add(
    pages=['vacancy_search_result'],
    banner_ids={
        BannerPlaces.SERP_FIRST_L: [1],
        BannerPlaces.SERP_FIRST_M: [2],
        BannerPlaces.SERP_FIRST_S: [3],
        BannerPlaces.SERP_FIRST_XS: [4],
        BannerPlaces.SERP_SECOND_L: [5],
        BannerPlaces.SERP_SECOND_M: [6],
        BannerPlaces.SERP_SECOND_S: [7],
        BannerPlaces.SERP_SECOND_XS: [8],
    },
)
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
    

, — , id , ( , serp_first_l). , id , .

: , global store setup, setup- .

, CSS. dom , . . , .

: ( , callback , ). , callback, AJAX- .

const visibilityWatcher = ({ element, onVisible }) => {
    let visible = false;
    const checkVisible = () => {
        if (visible) {
            return;
        }
        visible = 
            element.offsetWidth || 
            element.offsetHeight || 
            element.getClientRects().length;
        if (visible) {
            onVisible();
            window.removeEventListener('resize', checkVisible);
            element.dataset.listenersSetted = 'false';
        }
    };
    if (element.dataset.listenersSetted !== 'true') {
        window.addEventListener('resize', checkVisible);
        element.dataset.listenersSetted = 'true';
    }
    checkVisible();
};
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
    

( javascript ). , : , .

, , . hh.ru iframe .

. .

Google Ad Manager

, Ad Manager — . Google , , ( , ..).  DFP ( Ad Manager) , .

GPT (GPT Google Publisher Tags —  javascript Ad Manager). , ad unit ( ).

, DFP , . , GPT , . , "".

Ad Manager : - 20%. DFP view hh.ru . .

CPU, Chrome?!

. , . , , . har …

, — . . Javascript CPU . , .

, observer. , . okmeter alerts, , .

, , ,

, :  . . har. ( ) pop-up , .

, ( ), , adblock . , pop-up. - — , .

?

( ). . , , .

GAM (Google Ad Manager), , . , 300 . , .