Recursos frescos para web designers e desenvolvedores (agosto de 2016)

Neste artigo, apresentamos uma lista de estruturas e ferramentas que são voltado para o desenvolvimento web. Curiosamente, eu encontrei algumas dessas ferramentas e estruturas provenientes de corporações gigantescas como Microsoft e Alibaba.

Este é um bom sinal, já que mais empresas estão contribuindo para o open-source e ajudando a moldar melhor a web. Vamos dar uma olhada no que está reservado para a compilação deste mês.

Clique para mais recursos

Encontre toda a nossa coleção de recursos recomendados e as melhores ferramentas de web design e desenvolvimento disponíveis.

CuteStrap

Um framework de interface do usuário construído sobre o Sass. Ele vem com todas as interfaces web mais comuns, como formulários, navegações e botões, que devem ser suficientes em muitos casos. Se você encontrar estruturas populares como Bootstrap e Foundation esmagadora, Cutestrap pode ser uma ótima alternativa para você.

Teste HTML5

Teste HTML5 é uma ferramenta online que testará até que ponto um navegador suporta as especificações mais recentes do HTML5. É uma ferramenta útil para os envolvidos na depuração e teste de aplicativos da Web modernos.

Calorias do Navegador

Calorias do Navegador é uma extensão do Chrome que mede o peso de uma página da web. Ele verifica os arquivos carregados e sua contribuição para o peso total da página. Uma excelente ferramenta para ajudar você a otimizar o desempenho do seu website.

Weex

Weex é uma estrutura do Alibaba para construir aplicativos móveis com apenas HTML, CSS e JavaScript. Ele vem com módulos, componentes de interface do usuário, seus próprios DevTools e CLI projetados para o ambiente móvel e para acelerar o desenvolvimento.

Microsoft Web Framework (MWF)

Uma estrutura da Microsoft, os componentes da interface do usuário MWF é construído com base na linguagem de design moderno da Microsoft: plana, limpa e minimalista. Esse framework, além dos componentes da UI, também dá orientação sobre o uso de Cores, Tipografia e Animação. Eu acho que o Material Design Lite finalmente encontrou um concorrente igual.

Vital

Vital é um framework com uma interface mínima muito agradável. É leve, não tem JavaScript, e nativamente Rogue - um syntaxhighlight baseado em Ruby.

Fontea

Fontea é uma extensão gratuita do Photoshop para gerenciar e aplicar facilmente centenas de fontes do Google. Você pode pesquisar a fonte de dentro do Photoshop, visualizar e aplicar a fonte diretamente em seu design - simplificando seu fluxo de trabalho.

Chuvisco

Esta é uma ferramenta que permite criar padrões de interface do usuário ou guia de estilo para o seu site. Ele irá gerar coisas como as cores, estilos básicos ou layout para componentes, bem como o trecho de código. Um gerador de guia de estilo como Chuvisco permitirá que você fique consistente com os estilos do seu website.

InterCooler

InterCoolerJS é uma biblioteca JavaScript que torna a aplicação de AJAX em seu site tão fácil quanto adicionar atributos HTML. Ele vem com um guia extenso e muitos exemplos para ajudá-lo a começar a usar a ferramenta.

Picla

Picla é um plugin jQuery para mostrar os rótulos das imagens recuperadas da imagem alt atributo. Ele fornece algumas opções para permitir que você adicione estilos e movimentos personalizados à etiqueta. Picla pode ser instalado como sua dependência de site com Bower.

IziModal

Aqui está um plugin jQuery para mostrar modal popups. IziModal tem muitas opções para personalização. Você pode, por exemplo, personalizar a animação, o conteúdo de texto e as cores. É leve, responsivo e pronto para retina.

MegaBoilerplate

MegaBoilerplate é um gerador para configurar rapidamente uma pilha de desenvolvimento. Acesse o site e selecione quais ferramentas e bibliotecas (Node.js, HTML5, Vanilla JavaScript e Electron) você usará como base do site. Ele irá compilar e configurar todas as coisas que você precisa em um pacote zipado, pronto para download..

Berrador

Uma biblioteca JavaScript para exibir o player de áudio moderno usando a API de áudio da Web, Berrador funciona em navegadores tão antigos quanto o IE9 e suporta muitos codecs de áudio como MP3, WEBM, WAV. Muitos recursos, modular e funciona sem biblioteca externa.

SuperEmbed

SuperEmbed é uma pequena biblioteca JavaScript que torna os objetos incorporados responsivos, mantendo a proporção original. Ele suporta uma ampla gama de fontes, incluindo Youtube, Flickr, Vine, VideoPress e DailyMotion. Veja a demonstração.

CleaveJS

Cleave é uma biblioteca JavaScript que formata automaticamente valores na entrada. Pode, por exemplo, adicionar o separador de milhar em entrada de moeda, adicionar espaço na entrada do número de cartão de crédito ou adicionar / na entrada de data. Use esta biblioteca para atender melhor a experiência do usuário.

Virando Típico

FlippingTypical permite visualizar todas as fontes instaladas em seu sistema. Acho que este aplicativo é mais conveniente do que usar o FontBook aplicativo no macOS. Eu digito um texto aleatório e vejo quais fontes do meu sistema estão melhor.

LightTable

Um novo IDE que eu acho que vale a pena explorar. Começou como um projeto do KickStarter, apoiado por Matt Mullenweg (fundador do WordPress), e finalmente foi open source. Você pode assistir a este vídeo para ter uma ideia de como esse IDE é legal.

Compressor

Compressor é um aplicativo da web que compacta os arquivos de imagem até o menor tamanho sem perder a qualidade visual. Suporta JPG, GIF, PNG e SVG também. Este aplicativo é gratuito.

Microsoft Site Scan

Essa é uma ferramenta útil da Microsoft para analisar seu site em busca de problemas como compatibilidade e acessibilidade do navegador. A ferramenta listará um relatório informando se alguma coisa não está correta sobre o seu site e como você pode proceder para resolver o problema. De uma chance!

Desativar blogs

Esse plug-in, como o nome indica, removerá os recursos de blogs, como postagens, comentários e feeds. É o plugin certo para você, se você não precisa do recurso de blogs no WordPress.