Vamos ver como inspecionar o elemento de um site no Mac. Ele mostra como fazer isso através do Safari, bem como através do Google Chrome.
Como você usa o recurso Inspecionar elemento em um Mac?
Antes de inspecionar os elementos no MacOS ao usar o Safari, você precisa habilitar o menu do desenvolvedor no navegador. Veja como ligá-lo e o que fazer para inspecionar um elemento.
Usando o recurso Inspecionar elemento no Safari
- No Safari, clique em Safari > Preferências.
- Clique em Advanced.
- Clique em Mostrar menu Desenvolver na barra de menus e feche a janela.
- Ao navegar em um site, clique com o botão direito no item que deseja inspecionar.
- Clique em Inspecionar elemento.
- Agora você pode visualizar o código por trás do site que inspecionou.
Usando o recurso Inspecionar elemento no Chrome em um Mac
Se você usa o Chrome em vez do Safari no Mac, é ainda mais fácil visualizar um elemento, pois não há necessidade de habilitar o recurso. Aqui está o que fazer.
- No Chrome, navegue até um site.
- Clique com o botão direito no elemento que deseja inspecionar.
- Clique em Inspecionar.
- Agora você pode visualizar o código em uma janela lateral no Chrome.
Por que não posso inspecionar no meu Mac?
O principal motivo pelo qual você pode não conseguir inspecionar um elemento em seu Mac é se você não habilitou o menu Desenvolvedor no Safari. Aqui está um lembrete de como fazer isso.
- No Safari, clique em Safari > Preferências.
- Clique em Advanced.
- Clique em Mostrar menu Desenvolver na barra de menus e feche a janela.
Como fazer alterações no site?
Além de permitir que você visualize o código em um site, também é possível alterar temporariamente qualquer elemento do site através do Inspecionar elemento. Veja como fazer isso pelo Safari.
O processo é muito semelhante em outros navegadores.
- Ao navegar em um site, clique com o botão direito no item que deseja inspecionar.
- Clique em Inspecionar elemento.
- Clique duas vezes no texto do código para torná-lo editável.
- Exclua-o ou insira uma nova sequência de texto.
- Toque em Enter.
- O código foi alterado temporariamente apenas para seu benefício.
Por que você gostaria de usar o recurso Inspecionar elemento?
Isso é útil por vários motivos.
- Para alterar o código na hora. Os designers de sites podem alterar as coisas em um site temporariamente para ver como as mudanças afetam as coisas.
- Para verificar o código. Os designers e o pessoal de marketing podem verificar o código para confirmar se itens estão incluídos, como detalhes do Google Analytics.
- Para ver as imagens separadamente de um site. Se um site não permite que você abra uma imagem em uma nova guia ou janela, a visualização do elemento torna isso possível.
- Tinker. Ver o código de uma página da web pode ajudá-lo a entender o que você está vendo, o que pode remover o mistério do que está acontecendo no site em que você está. Pense nisso como desmontar um eletrodoméstico para ver como funciona, mas, neste caso, não há parafusos a perder.
