Cinto de utilidades para Webdesigners
O desenvolvimento web consome tempo e é bastante desafiador. Existem muitas maneiras de ajudar a combater esse desafio, aplicações úteis de segurança para análise de tráfego, bem como CSS – conceitos que nos dê um código limpo, condensado e o tempo de carregamento mais rápido, reduzindo o tempo e os esforços de assistência designers e desenvolvedores com melhorias fundamentais para fluxos de trabalho.
Abaixo, apresentamos 30 ferramentas de desenvolvimento extremamente útil, templates, geradores, e sugestões de segurança, esperando que você se inspirou para utilizar estas ferramentas úteis para tornar sua vida mais fácil.
1. CSS e Ferramentas de Desenvolvimento
CSScaffold CSS é um framework escrito em PHP. Ao invés de tentar criar um quadro estático, que utiliza as capacidades padrão de CSS, como Blueprint, ele usa o PHP para estender CSS. A sintaxe olha e se sente exatamente como CSS, exceto que você tem alguns novos, habilidades poderosas.
Compass é uma ferramenta de criação de estilo que usa a linguagem de estilo Sass para fazer o seu estilo menor e seu Web site mais fácil de manter.
css_doc Ruby é uma biblioteca e uma ferramenta de linha de comando para extrair documentação de arquivos CSS. O formato da documentação é muito semelhante ao JavaDoc.
Como JavaScript inclui, isto funciona porque o CSS não está sujeita à política de mesma origem que afeta XMLHttpRequest. Funções CSSHttpRequest à semelhança JSONP, e está limitada a solicitações GET. Ao contrário JSONP, não confiáveis de terceiros JavaScript não pode executar no contexto da página de chamada.
Diga adeus à tentativa e erro, mas dizer Olá a uma ferramenta e um brinquedo para testar CSS em tempo real. É uma alternativa simples e rápida de recarregar uma página e ver os últimos ajustes para o seu código. Role o mouse sobre o botão de código ea formatação para o código CSS necessário estará pronto para o seu site.
Esta é uma ferramenta útil para desenvolvedores da Web para verificar as propriedades CSS ou elementos HTML. Após a instalação, você pode executar uma busca ou clicar em um item na página para ver as informações de compatibilidade do navegador, sintaxe e exemplos de código. Ele fornece uma referência rápida disponível no seu navegador.
Esta versão stand-alone de HTML do W3C / XHTML Markup Validator não requer instalação. Basta colocar o Validator onde você precisa, como um flash drive, CD ou disco rígido. É possível validar os arquivos locais, sites, ou ser configurado como um serviço Web para permitir que os usuários para validar através da rede local. Basta arrastar e soltar arquivos e URLs para o ícone do aplicativo, ou usar o comando Arquivo> Abrir.
Ferramenta útil que nos permite fazer upload de pesquisa e projetos de código executável, modificar ou criar um código com coloração conclusão, depuração de código cliente / servidor, bem como publicar links código. Para a nuvem, podemos implantar com um clique, gerir os recursos de nuvens, e as versões completa com SVN. Ele suporta várias línguas.
Ferramentas de desenvolvimento online script vamos implementar ricos, sites dinâmicos em menos tempo. Com este parque AJAX API, podemos experimentar com novas funções como o JavaScript ou mapas, ou mesmo baixar feeds. Então, essas funções podem ser exportados, totalmente pronto para implementar. Novas ferramentas de continuar a ser adicionados, por isso este é um bom lugar para se revisitar a linguagem, blogger, gráficos e outros códigos de visualização.
Boks é um aplicativo AIR, o que significa que funciona em Windows, Mac e Linux. Ele fornece uma interface de usuário para Blueprint quadro CSS e pode lidar com grade e configuração do ritmo de base, antes de exportar grid.png e comprimido CSS.
Este editor Open Source é voltada para programadores e web designers e funcionará na maioria dos sistemas operacionais, incluindo Linux, FreeBSD, MacOS X, OpenBSD e Solaris. Bluefish centra-se na edição de sites dinâmicos e interativos e os scripts, e suporta muitos programação e linguagens de marcação. Não será neste momento executado no Windows, mas um nativo Bluefish 1.0.7 binário.
FireCrystal é uma extensão do Firefox para ajudar os programadores e designers descobrir como comportamentos interativos na web funcionam. Ele permite aos usuários “rewind” suas interações com as páginas da web ao mesmo tempo mostrando o código correspondente. No entanto, é atualmente uma versão alfa e podem sofrer de tempos de carregamento longos ou falhar em Javascript intensivo páginas.
Esta ferramenta está disponível como um trecho da música, assim que os profissionais da web deve experimentá-lo, enquanto podem. Adobe BrowserLab fornece web designers com uma cópia exata de suas páginas em vários navegadores e sistemas operacionais. É uma solução para testes de compatibilidade cross-browser e pode ser personalizado com suas preferências, além de ser um serviço online que pode ser acessado a partir de praticamente qualquer computador conectado à web.
Esta ferramenta é para verificar novos e combinações de cor de fundo de todos os elementos do DOM para determinar se eles fornecem um contraste suficiente quando visualizados por alguém que tenha défices de cor. Você digita um endereço web e checkmycolors retorna resultados de teste com base em algoritmos sugeridos pela W3C.
2. Tipografia
Uma ferramenta simples, mas útil, que permite que você digite os caracteres que são geralmente não disponível em um teclado com facilidade. Esta coisa é um layout de teclado normal, só que com a tecla Alt no Mac ou a tecla Alt Gr no Windows que permite que você digite todas estas personagens perfeitamente agradável. O layout também suporta vários tipos de sinais diacríticos, assim você pode digitar palavras como ingênuos ou café e se divertir.
Enciclopédia compartilhada de fontes, com recursos para classificar, categorizar e ligar fontes.
Esta web telespectador com fonte permite que você olhar para todas as fontes com seu texto amostra através da incorporação de fontes HTML5. Você pode visualizar as métricas, glifos ou o corpo do texto fonte. Suporte em breve deverá estar disponível para a marcação, classificação e favoriting.
3. Ferramentas de Referência
Regex Widget
Este widget interactivo é útil para testar JavaScript, Sed, Ruby, Perl ou expressões. A interface de usuário é simples, maiúsculas e minúsculas, tem interruptor global, e corresponder ver índice de matriz para codificadores para implementar testes de forma fácil e eficaz.
Utilizando entidades de HTML é o caminho certo para garantir todos os personagens em sua página são validados. No entanto, muitas vezes, encontrar o código de entidade de direito requer a digitalização através de 250 linhas de caracteres. Essa pesquisa permite-lhe encontrar rapidamente a entidade com base na sua aparência, por exemplo, como um <ou a letra C.
PHPQuickReference (Mac Dashboard Widget)
PHPQuickReference lhe dá o direito de referência útil PHP no Dashboard. Pesquisa com autocompletar e sugestões e copiar e colar o código de exemplo para seu projeto. Você pode achar mais útil Mac Dashboard Widgets para web designers e desenvolvedores aqui e aqui.
4. Edição de imagem e Otimização
Punypng é uma ferramenta gratuita que reduz drasticamente os tempos de carregamento da página, reduzindo o tamanho do arquivo de uma imagem sem qualquer perda de qualidade.
Smush.it é uma ferramenta de otimização de edição de imagem que leva a maioria dos tipos de formatos de imagem e converte para PNGs menores sem mudar sua aparência ou qualidade visual. Ele irá fornecer dados sobre quantos bytes seriam salvos por meio da otimização, bem como produzir um arquivo zip para download com os arquivos de imagem minimizada.
Most of us use Photoshop, but Fireworks allows us to use an alpha transparency with PNG8 for a smaller file size while maintaining edges that blend smoothly and look great. Select the number of colors needed or setup a color matte and save a PNG8 image with alpha transparency. In the Optimize pallet, select PNG8 format with alpha transparency selected, and then click “Rebuild” in the lower right corner. Smaller file sizes equal faster page loads and this works the best for logos, shadows and gradients to be fully optimized.
Finetuna editor de imagens pode ser usado para divertimento ou para locais mais grave. Você pode fazer upload de uma imagem ou uma escolha de uma página web, antes de adicionar rapidamente os seus comentários para qualquer imagem. A única coisa que resta a fazer é compartilhar.
Esta ferramenta faz a conversão de imagens para ícones rápido e simples. É um processo um passo para a criação de ícones para Windows, Mac e Linux.
5. Freelancing
Web designers e desenvolvedores de sites podem utilizar esta ferramenta simples para estimar o tempo rapidamente e materiais necessários para um projeto da proposta. Digite o título do projeto e sua taxa horária padrão, em seguida, ajustar o seu horário antecipado para gerar sua estimativa total do projeto. Os resultados podem ser impressos ou salvos em um PDF.
Redmark é uma ferramenta útil para os designers e os seus clientes para se comunicar visualmente em três passos simples. Carregue o seu design, e-mail automaticamente para os clientes que podem fazer comentários, fazer revisões e repetir, automaticamente, antes de publicação.
6. Melhorar o fluxo de trabalho
Web Form Factory é uma fonte aberta gerador de formulários Web que gera automaticamente o código necessário backend para amarrar o seu formulário para uma base de dados.
O Printliminator é um bookmarklet com algumas ferramentas simples que você pode usar para websites de impressão faz melhor. Um clique para activar e, em seguida, clique para remover elementos da página, remover gráficos, e aplicar um estilo de impressão melhor.
Multitarefa é obrigatória. Dependendo da memória RAM e tamanho da tela, essa ferramenta permite que o navegador FireFox para ser dividida infinitamente. A janela de configuração pode ser dividido em colunas ou no entanto, é necessário comparar várias páginas da Web. Escolha o “Split Browser para” menu e, em seguida, arrastar e soltar links, bookmarks, calendários, agendas ou guias nas janelas divididas.
LiberKey é o “canivete suíço” equivalente a 250 programas de softwares que oferecem locais e / ou utilização portátil. Os melhores programas Open Source ou Freeware foram selecionados para atender às necessidades mais práticas, mantendo 100% de portabilidade.
Fonte: http://www.noupe.com/design/fresh-web-development-goodies-bag.html
Nenhum comentário ainda