5 dicas para ser produtivo com o Bootstrap 3!

29 mar 2015
Marcelo Paespor Marcelo Paes
Categorias: Tecnologia

É consenso que o Bootstrap é um excelente ponto de partida para uma imensa variedade de sites. Resolvemos então começar nosso blog com 5 dicas para aumentarmos nossa produtividade com ele!

1 – Use temas prontos

Temas são uma excelente fonte de aprendizado e ajudam muito no início do desenvolvimento. Lembre-se sempre de revisar as licenças dos componentes utilizados e verificar a compatibilidade de todos itens com o seu stack.

Um site com diversos temas grátis: http://startbootstrap.com/

2 – Use LESS (ou SASS)

No início da febre Bootstrap praticamente todos a customização das classes era feita sobrescrevendo as regras da folha de estilo original em um outro arquivo CSS. Usando uma linguagem como LESS é possível customizar todos os aspectos do layout sem comprometer o CSS final, além dá fácil remoção dos componentes não utilizados.

Com o uso de LESS você pode extender as classes originais do bootstrap e tornar seu html muito mais semântico, usando a função “extend”. Isso será tema de próximos posts.

3 – Aprenda e Compartilhe

Em sites como http://bootsnipp.com/ podemos aprender com diversos exemplos, e compartilhar nossas próximas soluções. Antes de tentar uma solução nova, pesquise!

4 – Combine com o seu designer

Essa é bem básica, mas é muito comum hoje em dia o designer trabalhar todo o layout e a decisão de utilização de um framework venha após as telas fechadas.

Componentes para o designer:

http://www.designshock.com/bootstrap-3-psd/

Grid para o designer:

http://www.minimit.com/articles/tips-resources/bootstrap-3-responsive-grid-psd-templates

5 – Aprenda direito!

Por último, apesar do Bootstrap acelerar o processo de desenvolvimento é muito comum ver projetos inteiros terminados onde claramente se vê a falta de compreensão do framework por parte dos desenvolvedores. Para ajudar vai aí uma lista de bons recursos para aprender:

http://getbootstrap.com/

http://www.sitepoint.com/understanding-twitter-bootstrap-3/

http://tutsplus.com/tutorials/search?utf8=%E2%9C%93&search%5Btopic%5D=&search%5Bterms%5D=bootstrap+3&button=

 

 

One comment:

  • Guido Luz Percú on 5 de maio de 2015 at 03:04

    Complementando a lista, um serviço muito útil para criar protótipos de layouts com bootstrap:

    http://www.layoutit.com/

Comments are closed.

TG4 © 2019