8 ferramentas online para agilizar a vida de todo desenvolvedor web

 Não importa em que estivermos trabalhando, a velocidade é um ponto positivo, desde que não comprometa a qualidade final. Quando tratamos de internet, então, nem se fala.

Tudo chega e parte tão rápido que precisamos também ser ágeis em desenvolver nossos projetos e nada melhor do que usar a ferramenta certa para isso.

Pensando nisso, separamos algumas ferramentas gratuitas para facilitar a vida de quem se aventura no desenvolvimento web. Confira:

Verificar as Web Safe Fonts

Se optar por não utilizar fontes personalizadas, as fontes originais do sistema são a melhor alternativa. Mas nem toda fonte instalada em seu computador funcionará bem em qualquer lugar.

Para isso o site cssfontstack.com mostra uma relação de tipos e sua compatibilidade com Windows e Mac. Assim você pode ter uma escolha consciente da tipografia que vai utilizar.

Essa funcionalidade vai dar certo?

A web está em constante mudança, junto com a maneira que a escrevemos. HLML, CSS, JS (e isso só no frontend) fazem novas tags e linhas de código brotarem com uma frequência cada vez maior.

Por isso, antes de usar uma nova ferramenta ou técnica, é bom dar uma olhada no site caniuse.com para ver em quais navegadores já está funcionando completamente. Se for algo muito novo e pouco aceito, mesmo que seja muito legal, o ideal é esperar mais um pouco, ou criar alternativas para mostrar seu conteúdo de maneira tradicional também.

Caracteres especiais em unicode

Unicode é uma maneira prática e universal de inserir alguns ícones no html. No site unicode-table.com você encontra o código pronto para ser copiado e colado onde quiser aplicar o símbolo.

Ícones e mais ícones

Esse é um grande conhecido, mas não custa relembrar: o Font Awesome é um site que disponibiliza centenas de ícones de maneira gratuita, alguns até mesmo animados.

Lá é bem fácil de inserir os ícones apenas com 2 linhas de código (uma na head e outra no local que deseja aplicar o ícone).

Uma ajudinha nas cores

O Adobe Color é um amigo inseparável para criar boas paletas de cores, mas se quiser algo pontual e instantâneo, existe o site randoma11y.com que pode gerar combinações de cores que tenham um bom contraste entre si, para facilitar leitura (fundo/texto).

Depois de gerar a combinação aleatória que gostou mais, é só copiar o CSS gerado automaticamente e colar no seu site.

Gerador de CSS3

Aqui poderia ser uma lista só de alternativas para falarmos desse ponto, mas apenas para falar de uma das opções, temos o css3generator.com que cumpre bem o papel de mostrar algumas propriedades úteis e como utiliza-las com CSS3. Na lista tem coisas como cantos arredondados, sombra, degradês, transições e muito mais. Vale dar uma olhada.

Tabelas menos chatas

Quem já fez tabelas manualmente sabe que não é uma parte muito prazerosa da estrutura. Mesmo que usadas pontualmente, as tabelas podem ser úteis para diagramar pequenos blocos de informações, lista de nomes e valores, etc.

Mas não precisa mais se preocupar em digitar <td> por <td> com o gerador de tabelas tablesgenerator.com

Subir um site para teste online

Muitas vezes é preciso apresentar um projeto para um cliente aprovar, ou mesmo para você ver se as coisas estão funcionando como deveriam, mas fora do ambiente de teste local.

Existe uma alternativa bem prática além de subir em seu próprio servidor:  usar o site Bit Balloon para isso. Lá conseguimos arrastar a pasta com todos os arquivos HTML, CSS e ver tudo funcionando.

A limitação na versão gratuita fica a cargo de funcionar apenas sites estáticos. Mas já ajuda bastante.

 

É claro que essas são apenas algumas das milhares de ferramentas úteis que temos por aí. Por isso, se você usa alguma e quiser compartilhar, deixe o link nos comentários!

Fonte: https://www.designerd.com.br/ferramentas-online-agilizar-a-vida-desenvolvedor-web/