Pendule - plugin cromo puro para um desenvolvedor web

Video: Популярные видео – Notepad++ и Сайт

Eu faço um pouco de desenvolvimento Web e Google Chrome é o meu principal navegador nos dias de hoje. Chrome é bastante-desenvolvedor amigável como ela é, e você também pode configurar Firebug no Chrome. Mas hoje eu queria mostrar-lhe uma extensão do Chrome diferente chamado Pendule. suplementos pendule built-in do Chrome Inspecione recurso Elemento com alguns extras interessantes.Como instalar o Firebug no IE, Safari, Chrome & ÓperaComo instalar o Firebug no IE, Safari, Chrome & Óperaconsulte Mais informação

O Menu Pendule

plugins de desenvolvimento web cromo

botão da barra de Pendule saia um menu de aparência lisa, dividido em seis áreas principais. Primeiro, o Folhas de estilo seção. o Ver CSS opção pode parecer redundante - afinal, o Chrome já nos permite vista CSS ... ou não?

Muitos sites usam CSS comprimido, com alguns comprimi-lo ao ponto de ilegibilidade. Se você é o único desenvolvedor Web em seu site, você pode ser capaz de decidir por si mesmo o quanto você quer comprimir o CSS. Para mim, não existe tal sorte. Um dos sites que eu trabalho para comprime o CSS usando uma ferramenta de PHP chamada Minify, então inspecionar o CSS com ferramentas embutidas do Chrome mostra algo como isto:

ferramentas de desenvolvimento web cromo

Não é exatamente o formato mais legível imaginável. Com Pendule, eu posso facilmente embelezar o CSS do meu lado. I basta clicar no botão Pendule e clique Ver CSS. Eu, então, obter algo como isto:

ferramentas de desenvolvimento web cromo

Ainda não é muito legível. Mas clique no embelezar CSS botão e ver a mágica acontecer:

ferramentas de desenvolvimento web cromo

Video: PHP Avanzado - Introducción al curso - Parte 1

Agora estamos a falar! Enquanto você não pode mudar nada na vista CSS, esta é uma grande melhoria quando se trata de CSS comprimido.

manipulação de Imagens

Pendule também oferece algumas utilidades relacionadas com imagens interessantes:

Video: Как установить Android Studio | обучение Android 02



desenvolvimento web Chrome

informações Ver imagens”Leva você para uma nova página contendo todas as imagens da página actual, cada um com uma série de informações relacionadas:

desenvolvimento web Chrome

Isso é útil porque permite percorrer todas as imagens uma a uma e auditar-los individualmente. Por exemplo, alguns sites servir conteúdo de um servidor e imagens relacionadas de outro servidor (para fazer as coisas mais rápido). Com este ponto de vista, você pode ver exatamente onde cada imagem vem e facilmente rastrear os que não são servidos a partir da fonte direita.

Você também pode ler o texto Alt para cada imagem, que pode ser a chave para ofertas de SEO. No entanto, se você está apenas interessado no texto Alt, Pendule permite auditar facilmente que na página, usando o “texto Mostrar alt”Opção. Quando ativado, as imagens em sua página parecido com este:

desenvolvimento web Chrome

Este passa a ser de uma linda post intitulado 3 sinais de Apple está deslocando Microsoft para se tornar o império do mal, mas o ponto aqui é o pequeno “alt =” trecho acima da imagem. Parece uma dica, mas você não tem que passar o cursor do mouse sobre ele para torná-lo mostrar. com “texto Mostrar alt”, Você pode apenas percorrer sua página e ver exatamente o que as imagens tenham em falta ou incorrecto Alts.

Utilitários diversos

imagem

Menu Diversos Utilities da Pendule embala algumas guloseimas interessantes. o Ver javascript produtos de uma única página dividida em seções, uma seção para cada script da página atual contém. Muito parecido com o “Ver CSS”Opção que começou com, Ver javascript permite embelezar o código para torná-lo legível. javascript é quase sempre comprimido (mais ainda do que CSS), então esta é uma opção muito útil se você gosta de ler código para descobrir como as coisas funcionam.

O "exibição governante”Opção escurece a página e cobre de um quadro redimensionável, draggable com um pouco de etiqueta que mostra suas dimensões em um determinado momento. Isto é muito útil para verificar se os elementos estão corretamente alinhados, por exemplo.

plugins de desenvolvimento web cromo

Pensamentos finais

Se você é um desenvolvedor Web usando o Chrome, a primeira coisa que você deve fazer é obter absolutamente confortável com as próprias ferramentas de desenvolvimento embutidas do Chrome. No entanto, uma vez que você tiver feito isso, provavelmente você vai ser capaz de encontrar pelo menos uma ou duas ferramentas dentro Pendule que bem complementar o seu fluxo de trabalho.


Artigos relacionados