Como examinar um elemento em um Chromebook

Se mexer no código de um site parece interessante ou se você quer solucionar um problema de layout, usar a ferramenta Inspecionar Elemento no Chrome é praticamente indispensável. Ela mostra o HTML, CSS e JavaScript brutos que compõem uma página da web, o que pode ser uma verdadeira revelação. Além disso, você pode ajustar as coisas temporariamente para ver como ficarão sem quebrar nada — como se estivesse brincando de médico com o código. Em Chromebooks, é simples, mas às vezes o método que você acaba usando depende de como você prefere acessá-lo ou dos atalhos que você usa.

Como inspecionar um elemento em um Chromebook

Como os Chromebooks são apenas laptops com ChromeOS, as Ferramentas de Desenvolvedor do navegador Chrome estão integradas. Você pode se virar clicando com o botão direito do mouse ou preferir menus ou atalhos de teclado — o que for mais rápido ou confortável. Observe que as opções de menu do Chrome às vezes se escondem atrás de caminhos diferentes dependendo das atualizações, mas o processo geral permanece o mesmo.

Usando o menu do botão direito para inspecionar

Esta é provavelmente a maneira mais simples, pois tudo o que você precisa é do seu mouse ou touchpad. Nada sofisticado, mas eficaz. Se você não gosta de ficar vasculhando menus ou configurações:

• Abra o navegador Chrome e acesse a página da web que você deseja visualizar.
• Clique com o botão direito em qualquer lugar da página — sim, o clique direito normal que você usaria para qualquer outra coisa.
• No menu de contexto, escolha Inspecionar. Pronto, as Ferramentas do Desenvolvedor são abertas e você pode ver o HTML e o CSS.

É meio estranho como às vezes o menu do botão direito pode ter uma ordem ou opções diferentes dependendo do site ou da versão do Chrome, mas o Inspecionar geralmente está lá. Em algumas configurações, ele pode ser chamado de __Inspecionar Elemento__ ou apenas __Inspecionar__.

Usando o menu do Chrome (opção Ferramentas do desenvolvedor)

Se você prefere menus ou quer uma maneira de usar sem clicar com o botão direito, o menu do Chrome resolve. Este método é bom se você preferir navegar pelos menus para acessar mais recursos de desenvolvedor:

• Clique no ícone de três pontos no canto superior direito do Chrome.
• Passe o mouse sobre Mais ferramentas no menu suspenso.
• Selecione Ferramentas do desenvolvedor no submenu.

Isso abrirá um painel na lateral ou na parte inferior da janela, exibindo o código-fonte da página da web.Às vezes, esse método é um pouco mais lento, mas é mais limpo se você não quiser que cliques acidentais com o botão direito acionem outras opções.

Usando atalho de teclado para acesso rápido

Certo, esse é o caminho mais rápido — se você se lembra do atalho. Em um Chromebook, é só uma Ctrl + Shift + Icombinação e pronto, as Ferramentas do Desenvolvedor aparecem instantaneamente. Não precisa mexer em menus ou clicar com o botão direito.

Este atalho geralmente funciona imediatamente e, depois de um tempo, é o que costumo usar por padrão, pois parece mais rápido do que navegar pelos menus. No entanto, esteja ciente de que em algumas configurações mais recentes ou se você remapeou as teclas, os atalhos podem ser um pouco diferentes, mas, em geral, este é o padrão.

Conclusão

É provável que, em um Chromebook, inspecionar elementos pareça bastante natural depois que você se acostumar com esses métodos. Seja para fazer uma depuração rápida, tentar entender como um site é construído ou apenas brincar com estilos de página, as Ferramentas de Desenvolvedor do Chrome são suas amigas. O método do botão direito é barato e agradável, a abordagem do menu é um pouco mais formal e o atalho é o demônio da velocidade.

---

---