Os desenvolvedores e Web Designers estão constantemente à procura das melhores soluções para o seu trabalho, que além de lhes facilitarem as suas tarefas, lhes poupem tempo, dinheiro e trabalho. Nos dias de hoje a oferta deste tipo de soluções é grande, e a tendência é que aumente exponencialmente. Todavia nem todas elas são de qualidade, e é preciso ter muito cuidado com os parceiros de trabalho que escolhemos.

Uma boa solução ou parceiro de trabalho, é uma aplicação que seja simples de utilizar, fiável, rápida e acima de tudo que tenha muita qualidade. De entre as milhares existentes, escolhemos 10 Ferramentas Online Úteis para Desenvolvedores e Web Designers muito orientadas para a Web 2.0 e para as novas tecnologias que nos têm chegado ultimamente, como o HTML5 e CSS3.

1. CSS3 GRADIENT GENERATOR

CSS3 Gradient Generator foi criado como uma base de conhecimento do poder dos gradientes CSS, bem como uma ferramenta online para web designers e desenvolvedores criarem os seus gradientes.

2. TRANSFORMS

Transforms fornece-lhe um conjunto de barras de deslize para experimentar vários transforms, como a posição, rotação,  distorção entre outros, dando-lhe o código enquanto faz as modificações.

3. WORDMARK

Wordmark é uma ferramenta que lhe permite pré-visualizar qual o aspecto de um wordmark com os tipos de letra instalados no seu computador, antes de instalar ou procuras novos.

4. SUPER CONVERSION BUTTON

Super Conversion Button é uma pequena ferramenta que lhe permite criar muito rapidamente um botão bonito e efectivo, de uma maneira extremamente fácil!

5. PROCSSOR

ProCSSor é uma ferramenta poderosa de melhoramento de código CSS gratuita que permite formatar o seu código da maneira que pretender, ao seu gosto.

6. CSS3 GENERATOR

CSS3 Generator é uma ferramenta bastante simples que cria código para multi-browser baseado nos valores que pretender.

7. FRAME BOX

Frame Box é uma fantástica ferramenta para criar os seus wireframes!

8. JSFIDDLE

JsFiddle é uma multi-ferramenta online que pode ser utilizada para vários fins, como por ex. um editor online para snippets HTML, CSS e Javascript.

9. SPRITEBOX

Spritebox é uma ferramenta WYSIWYG (What You See Is What You Get – “O que vê é o que obtém” ) para ajudar web designers a criar classes e ID’s CSS rapidamente apartir de uma única imagem sprite. Isto é feito usando uma combinação de jQuery, CSS3 e HTML5.

10. 0 TO 255

Com 0 To 255 conseguirá encontrar variações de cor de qualquer cor.

E VOCÊ, UTILIZA ESTAS FERRAMENTAS?

Você utiliza alguma destas ferramntas? Gostaria de aconselhar ferramentas aos outros leitores? Comente e participe!

Abraço, até já!

 

Autor: Diogo Espinha

Blog do Autor | Artigos do Autor:

Workaholic e totalmente viciado em computadores, Internet e desporto motorizado. Adora praticar desporto, é um curioso da programação em PHP, CSS e HTML5 e não dispensa a companhia do seu Mac OSX 86 Snow Leopard!

  • Explorer - Factory Construction & Ship Building Joomla Theme
  • Justice - Attorney and Law Firm Joomla Template
  • OwnFolio - One Page Personal Portfolio / vCard / Resume / Showcase Joomla Template
  • Big Business - Responsive Template
  • Merab - Creative Multipurpose Drupal 8 Theme
  • Fitness Academy Joomla Template
  • Fruition - Business Joomla Template
  • Educate | Education & Courses, Kindergartens Joomla Template
  • Constructive - Contractors Multipurpose Joomla Landing Page Theme
  • Vina Bubox - VirtueMart Joomla Template for Online Stores
  • BizOne - One Page Parallax Drupal Theme
  • LawHouse - Responsive Lawyers Attorneys Joomla Template

Gostou deste artigo? Então torne-se fã do Blog no Facebook!



Comentários dos Alunos


  1. Bruno Veiga
    15 de fevereiro de 2011

    Sem dúvida nenhuma que algumas destas ferramentas poupam imenso tempo e trabalho.
    Algumas não conhecia.
    Já adicionado aos favoritos
    Excelente artigo.



    • Diogo Espinha
      16 de fevereiro de 2011

      Olá Bruno, obrigado pelas suas palavras!

      Abraço



  2. Brindes Publicitários
    15 de fevereiro de 2011

    Era mesmo disto que eu andava à procura. Obrigado!



    • Diogo Espinha
      16 de fevereiro de 2011

      Fico contente por poder ajudá-lo com este artigo!

      Abraço



  3. Cristiano
    16 de fevereiro de 2011

    Não utilizo, mas vou passar a utilizar.

    Obrigado pelas dicas!

    Cumprimentos,
    Cristiano Perdigão.



    • Diogo Espinha
      16 de fevereiro de 2011

      Olá Cristiano, espero ouvir algum feedback seu quando utilizar estas ferramentas, fico á espera!

      Abraço



  4. Alexandre Zanette
    16 de fevereiro de 2011

    Versátil e RÁPIDO o Frame Box. Muito Bom!

    Parabéns Diogo e obrigado por esta luz! =)



    • Diogo Espinha
      16 de fevereiro de 2011

      Olá Alexandre, ainda bem que gostou :) obrigado pelas suas palavras!

      Abraço



  5. Alex Felipe Raulino
    16 de fevereiro de 2011

    Muito bom! Boas dicas!!

    Valeu



    • Diogo Espinha
      17 de fevereiro de 2011

      Olá Alex, obrigado pelo seu comentário!

      Abraço



  6. Cezar
    16 de fevereiro de 2011

    Cara…

    muito bom compartilhar essas ferramentas conosco…
    parabens!!!
    muito obrigado!



    • Diogo Espinha
      17 de fevereiro de 2011

      Cezar, obrigado pela sua visita e comentário e seja bem-vindo à Escola Criatividade!

      Abraço



  7. Rodrigo Galvão
    17 de fevereiro de 2011

    Aoow Diogo, muito bom o post, me ajudo muito também!
    Obrigado

    Abraçoos



    • Diogo Espinha
      17 de fevereiro de 2011

      Olá Rodrigo, ainda bem que este artigo lhe é útil, fico muito contente :)

      Abraço, volte sempre!



  8. Bruno Veiga
    17 de fevereiro de 2011

    #offtopic

    Já viram a última novidade do Gravatar? São os hovercards e mostram mais informação do perfil.

    Vejam aqui: http://www.nodesigntoday.com/como-mostrar-os-perfis-do-gravatar-hovercards/

    Abraços



  9. Phil
    17 de fevereiro de 2011

    Gostei

    Mais ferramentas são bem vindas

    Abraços



    • Diogo Espinha
      18 de fevereiro de 2011

      Olá Phil, obrigado pela sua visita e comentário!

      Abraço



  10. Lucas Peperaio
    18 de fevereiro de 2011

    Cara, parabéns pela postagem, valeu a pena ter voltado aqui no seu site!



    • Diogo Espinha
      18 de fevereiro de 2011

      Olá Lucas, obrigado pelas suas palavras. Fico muito contente por saber que os nossos leitores voltam ao nosso site à procura de conteúdos úteis, e os encontram!

      Abraço!



  11. Robson
    26 de março de 2011

    Caro Diego gostaria se possível que vc me oriente, gostaria de aprender como criar meu próprio site por onde começar, apostilas, etc.
    deste já agradeço se possível sua ajuda.



    • Diogo Espinha
      12 de abril de 2011

      Robson, obrigado pela sua visita!
      Aconselho-o a utilizar o WordPress. Poderá encontrar bastante conteúdo sobre o WordPress na Escola WordPress, em http://www.escolawp.com

      Abraço



  12. Wendel
    6 de maio de 2011

    From Photoshop to HTML = Notepad…



  13. Olá ótima postagem!
    Indico também as seguintes ferramentas:

    IDE Aptana Studio -> Para desenvolver Sites… (substituto free do Dream Weaver): http://www.aptana.com/

    Fireshot plugin do Firefox para printar sites

    Webdeveloper – Plugin do Firefox para inspecionar códigos de sites



  14. Diego Reis
    6 de dezembro de 2011

    Boa man, to te acompanhando faz um tempo, até então tudo útil ou legal, de qualquer forma ajuda uns mostra a outros e os que não tem o que fazer critica, tenho que tirar meu chapéu para seus posts resolvi postar em um post velho só pra lembrar =D
    Eu trabalho com web a um tempo e gosto muito disso perco horas e horas com isso talvez dias seguidos e nem reparo que a lua subiu e saiu do céu, o que me agrada é que mexe com a imaginação criatividade liberdade, se prestar bem atenção parece até um sonho =D
    Abraços e continue com seus posts agradeço.



  15. Ailton
    30 de janeiro de 2012

    faltou uma : browserlab.adobe.com



  16. Ignacio
    13 de fevereiro de 2012

    ProCSSor also has a mac app: http://procssorapp.com



  17. Tiago
    22 de julho de 2012

    Uma ferramenta bastante util também é o Clean CSS, que formata o código CSS de acordo com as configurações.



  18. alexandre
    15 de novembro de 2012

    Indico uma ferramenta que utilizo para capturar as cores de uma imagem.Acho muito pratica.

    http://www.degraeve.com/color-palette/index.php

    Att
    Alexandre


RSS
Twitter
Facebook
Comentários
ASSINANTES
SEGUIDORES
FÃS
COMENTÁRIOS
7794

Subscrever Newsletter
Subscreva a Newsletter:



Aplicativos Android, iPhone e Muito Mais!




Assine a Escola Criatividade Assine a Newsletter da Escola Criatividade Escola Criatividade no Twitter Escola Criatividade no Facebook Escola Criatividade no Youtube Escola Criatividade no Google Buzz