Subscribe to RSS feed Subscribe to RSS feed or ou follow me siga-me on Twitter? no Twitter?
Bookmarklets are bookmarks containing snippets of JavaScript code. Bookmarklets são fichas contendo trechos de código JavaScript. They can be used to accomplish specific tasks. Elas podem ser usadas para realizar tarefas específicas. Web developers can quicken several common operations by using bookmarklets. Os desenvolvedores da Web podem acelerar várias operações comuns usando bookmarklets. Best of all, bookmarklets do not slow down your web browser like extensions do. Melhor de tudo, bookmarklets não abrandar o seu navegador da web como extensões do. For example, some of these bookmarklets together can effectively substitute the Web Developer Firefox addon (if you crave for them in other browsers). Por exemplo, alguns desses bookmarklets juntos pode efetivamente substituir o Web Developer Firefox addon (se você implora para eles em outros navegadores).
To save these bookmarklets, just right click on the link to the bookmark and save it into your bookmark folder OR drag the bookmarklets to your Bookmarks toolbar. Exception: The first three bookmarklets (first two list elements) are links to pages containing the bookmarklets, as I found them difficult to embed here. Para salvar esses bookmarklets, basta clicar no link para o indicador e salvá-lo em sua pasta Favoritos ou arrastar o bookmarklets a sua barra de Favoritos. Excepção: Os três primeiros bookmarklets (os dois primeiros elementos da lista) são links para páginas que contenham a bookmarklets, como eu encontrei-os difíceis de inserir aqui.
To use a bookmarklet, simply right-click on it and choose “Bookmark Link”. Para usar um bookmarklet, simplesmente botão direito do mouse sobre ela e escolha "Link Favoritos". I would recommend placing them into a folder in the toolbar, so that any bookmarklet can be accessed with 2 clicks. Eu recomendaria colocá-los em uma pasta na barra de ferramentas, de modo que qualquer bookmarklet pode ser acessado com 2 cliques. I find that to be the least-cluttered and easiest-to-use arrangement. Acho que, para ser menos confuso e mais disposição para usar. Onto the bookmarklets then. Para o bookmarklets então.
- Updated 07 July 2008: Atualizado em 07 de julho de 2008:
XRAY XRAY : :
See the box model for any element on web pages. Veja o modelo de caixa de qualquer elemento em páginas da web. - Test Styles Teste de Estilos and e Edit Styles Editar Estilos : :
Test Styles gives you a new tab/window to type CSS rules for the original webpage. Teste Styles dá-lhe uma nova aba / janela para escrever regras CSS para a página original. The styles are applied to the webpage immediately. Os estilos são aplicados para a página imediatamente. Edit Styles is similar, except that you start with the CSS styles for the page. Editar Estilos é similar, exceto que você começar com os estilos CSS para a página. [thanks, [agradecimentos, Nick Nick ] ] - W3C HTML Validator W3C HTML Validator : :
Validate the document that you are currently viewing. Validar o documento que você está vendo. Great for on-the-fly validation checks while coding pages. Great for on-the-fly verificações de validação enquanto codificação páginas. - W3C CSS Validator W3C CSS Validator : :
Validate the CSS of the webpage that you are currently viewing. Validar o CSS da página que você está vendo. Useful for quick checks during CSS coding. Útil para verificações rápidas durante codificação CSS. - Resize Viewport: Redimensionar Viewport: 800×600 800 × 600 , , 1024×768 1024 × 768 , , 1280×1024 1280 × 1024 and e 1600×1200 1600 × 1200 : :
See how your web page looks like, in different resolutions. Veja como a sua página na Internet parece, em diferentes resoluções. Quickly switch between 800×600 to 1600×1200, the two extreme resolutions normally considered in web design. Alternar rapidamente entre 800 × 600 a 1600 × 1200, as duas resoluções extremas normalmente considerados em web design. - View Cookies View Cookies and e Toss Cookies Toss cookies : :
View the cookies stored by the current page (using the first link). Ver os cookies armazenados pela página atual (usando o primeiro link). Then toss the cookies that you wish to, by using the second link. Em seguida, atirar os cookies que você desejar, usando o segundo link. - NetCraft NetCraft : :
Tells you server details of a site and displays uptime graph. Diz-lhe detalhes do servidor de um site e exibe o gráfico de uptime. - Replace with Alternate Text Substitua com texto alternativo : :
Useful to check for images that do not have alt tags. Útil para buscar por imagens que não têm alt tags. The downside is that it removes only <img> tags, leaving intact buttons and images created using CSS or sprites. A desvantagem é que ele remove apenas <img> tags, deixando intactos os botões e imagens criadas usando CSS ou sprites. - Alexa Snapshot Lookup Alexa Snapshot page : :
Look up your website details and snapshot at Alexa, a popular web metrics website. Olhe para o seu site detalhes e instantâneo no Alexa, uma métrica popular web site. - Whois Lookup Whois Lookup : :
Lookup the WhoIs of the domain you are on. WhoIs Lookup a do domínio que você está. - Edit current website Editar site atual : :
Edit the current page – add text, delete text, move web elements around etc. – all without the need for any other extension. Edite a página atual - adicionar texto, apagar texto, mover elementos da cerca, etc - tudo sem a necessidade de qualquer outra extensão. - Search selected text in Google Texto selecionado Busca no Google : :
Although not strictly related to web design/development, Google searches can be useful to look up various terms and techniques in presentation and scripting languages. Embora não seja estritamente relacionado com web design e desenvolvimento, pesquisas do Google pode ser útil para procurar vários termos e técnicas de apresentação e linguagens de script. - Image Drag Drag Imagem : :
Drag and rearrange images seamlessly from within a page. Arraste e reorganizar as imagens diretamente de dentro de uma página. - Grab screenshot Agarre screenshots : :
Grab a screenshot of the page that you are viewing, without using any other installed application. Pega um screenshot da página que você está vendo, sem utilizar qualquer outro aplicativo instalado. - Color List Lista de Cores ( ( use this use este instead for IE): vez para o IE):
Lists colors used in the current webpage. Listas de cores utilizadas na página web atual.
Further Bookmarklet resources Mais recursos Bookmarklet
You might also want to read through these collections of bookmarklets: Você pode também querer ler as coleções de bookmarklets:
- WebDev at Squarefree WebDev na squarefree : :
A large collection of bookmarklets useful for web designers and developers. Uma grande coleção de bookmarklets úteis para web designers e desenvolvedores. Maintained by Jesse Ruderman. Mantido por Jesse Ruderman. - Useful bookmarklets for casual web users Bookmarklets úteis para os usuários da web casual : :
A guest post that I wrote on DailyApps.net. Um hóspede post que escrevi sobre DailyApps.net. It lists useful bookmarklets for everyone. Ele enumera bookmarklets úteis para todos. Most of them speed up or automate commonly used tasks, which no doubt helps designers and devs too. A maioria deles acelerar ou automatizar tarefas comumente usados, o que sem dúvida ajuda os designers e desenvolvedores também.
As is usual with my resource posts, this list will be continuously updated as recommendations come in. Como é habitual com postos de meu recurso, esta lista será continuamente atualizado conforme recomendações vêm polegadas Contact us Contacte-nos to recommend bookmarklets. recomendar bookmarklets. Tell us what are your favorite bookmarklets – for web development or otherwise – I'm sure we can all benefit from new bookmarklets shared by others. Diga-nos quais são seus favoritos bookmarklets - para desenvolvimento web ou não - Eu tenho certeza que todos nós podemos beneficiar de bookmarklets novo compartilhada por outros.
Hello buddy!! Olá amigo! i want to say that short but sweet link,you should also add differ browser list in which one can test his/her website by the way its good that you share it with us.Have a good day. Eu quero dizer que a ligação curta mas doce, você deve acrescentar também diferem browser lista em que um pode testar o seu site pela sua maneira bom que você compartilhe com us.Have um bom dia.
God bless you. Deus te abençoe. Punne4e Punne4e
I find Eu acho https://www.squarefree.com/bookmarklets/webdevel.html#test_styles https: / www.squarefree.com / bookmarklets / webdevel.html test_styles # invaluable – I'll create a HTML document, and then using that bookmarklet I can shape the stylesheet in realtime. inestimável - Vou criar um documento HTML e, em seguida, usando esse bookmarklet que pode moldar o estilo em tempo real. It's also very handy for writing user stylesheets. É também muito útil para a escrita de estilo de usuário.
This is pretty good, for those who are forced to do some work on the fly Isso é muito bom, para aqueles que são forçados a fazer algum trabalho na mosca
@Nick Z: Excellent suggestion about style testing bookmarklet, will update the post soon. Nick @ Z: excelente sugestão sobre bookmarklet ensaio estilo, irá atualizar o post em breve.
Hi Sumesh, I just came across your blog. Sumesh oi, eu vim através de seu blog. Good work. Bom trabalho. Keep it up. Keep it up. Will try to read all your future posts. Vou tentar ler todos os seus postos no futuro.
Just saw how useful these shortcuts can be in a post by QQT, bookmarked for future uses Só vi quão útil estes atalhos podem estar em um post por QQT, marcada para usos futuros
The “Edit current website” is a nice bookmarklet, but lacks what the “Live Website Editor” bookmarklet has to offer. O site "Edit atual" é um bookmarklet agradável, mas falta o que o "Live Website Editor bookmarklet" tem para oferecer.
Among other things, it can persist the modifications made to any webpages (at least it's its purpose). Entre outras coisas, que pode persistir as modificações feitas a qualquer páginas (pelo menos é a sua finalidade).
You can find it here: Você pode encontrá-lo aqui: http://code.google.com/p/lwe/ http://code.google.com/p/lwe/
It's still in an early version but it works on most of the websites. É ainda em uma versão inicial mas funciona na maioria dos sites.
Cheers Felicidades
@Arnaud L: Arnaud @ L:
That's a useful bookmarklet, and being persistent would likely be useful for many more web users. Isso é um bookmarklet útil, e sendo persistente provavelmente seria útil para muitos usuários da web. I will post the bookmarklet in a future post rounding up more useful bookmarklets – so thanks for the recommendation. Vou postar o bookmarklet em um futuro pós arredondamento bookmarklets mais útil - Então, obrigado pela recomendação.