- - Snap Guide per misurare gli elementi del sito Web con nastro per Chrome

Guide a scatto per misurare gli elementi del sito Web con nastro per Chrome

Un buon web design si basa su diversi fattori, uno dei quali è il corretto posizionamento di ogni elemento. Nastro è un'estensione di Chrome per aiutare i web designer conquesto consentendoti di aggiungere righelli a una pagina web. Il nastro va oltre ciò che offrono le estensioni di misurazione pixel comuni; non ti dice solo l'area occupata da un particolare elemento in pixel, ma ti consente anche di aggiungere all'interfaccia del browser quanti righelli vuoi, per misurare e delineare la distanza relativa di elementi diversi l'uno dall'altro. Puoi aggiungere righelli sia in orizzontale che in verticale, definire i punti di origine (sì, più di uno) e impostare il puntatore in modo che si agganci automaticamente a diversi elementi in una pagina Web mentre ti sposti, proprio come in Photoshop. Il nastro è abilitato su una pagina Web tramite un pulsante ed è controllato esclusivamente dalla tastiera. Ovviamente, la stessa pagina web non rimane funzionale mentre il nastro è abilitato, quindi non perderai la normale funzionalità dei tasti.

Una volta installato, fai clic sul pulsante dell'estensione accantoalla barra degli URL per abilitarlo. Apparirà un piccolo popup in basso a sinistra, che elenca le scorciatoie da tastiera e le loro funzioni. Il cursore si trasformerà automaticamente in un righello con linee orizzontali e verticali. Mentre sposti il ​​cursore sulla pagina web, noterai che si aggancia agli elementi (evidenziato in rosso). Consulta l'elenco delle funzioni della tastiera per determinare come aggiungere un righello. La maggior parte di queste scorciatoie sono abbastanza intuitive per cominciare; ad esempio, è possibile utilizzare rispettivamente i tasti H e L per aggiungere linee di righello orizzontale e verticale.

Nastro

È possibile rilasciare una linea verticale e orizzontaleche provengono dallo stesso punto posizionando il cursore su di esso e premendo il tasto O. Il nastro è eccellente per lavorare con elementi di design di grandi dimensioni e offre anche uno strumento di ingrandimento che ti permetterà di aggiungere righelli a elementi più piccoli. Per attivare lo strumento di ingrandimento (chiamato Lente di ingrandimento), premi il tasto L con il nastro abilitato e il cursore ingrandirà tutto ciò su cui lo sposti.

Lente a nastro

I righelli abilitati da Tape possono essere accuratiospitare anche i piccoli elementi del display e creare una buona griglia attorno ad essi è molto semplice. Forse la migliore caratteristica dell'estensione è che se disattivi il nastro su una pagina dopo aver tracciato una griglia su di essa, ricorderà i tuoi vecchi segni ogni volta che la attivi, a condizione che non aggiorni la pagina, chiudi la scheda o esci dal browser.

Il nastro è abbastanza veloce e molto reattivo e non abbiamo trovato motivo di lamentarci nei nostri test. Le funzionalità sono sufficienti per ogni web designer che utilizza Chrome per provarlo.

Installa nastro dal Chrome Web Store

Commenti