Mini-Curso sobre Bootstrap 3

4.288 visualizações

Publicada em

Slides de apoio para um mini-curso de Twitter Bootstrap 3 realizado em 10/5/2014 na DevRioClaro!

Publicada em: Tecnologia
0 comentários
7 gostaram
Estatísticas
Notas
  • Seja o primeiro a comentar

Sem downloads
Visualizações
Visualizações totais
4.288
No SlideShare
0
A partir de incorporações
0
Número de incorporações
29
Ações
Compartilhamentos
0
Downloads
231
Comentários
0
Gostaram
7
Incorporações 0
Nenhuma incorporação

Nenhuma nota no slide

Mini-Curso sobre Bootstrap 3

  1. 1. Mini Curso Bootstrap #DEVRIOCLARO – 10/05/2014
  2. 2. Oi (^.^)/  “Palestrante”  Diego Doná  Desenvolvedor Web @ Sismat Consultoria & TI  Bacharel em Sistemas de Informação pela Faculdade Salesiana Dom Bosco de Piracicaba  Likes: C#, Entity Framework, Desenvolvimento Web, Tênis de mesa (não é ping pong!!!)  Dislikes: Bugs, Bugs Intermitentes, Bugs zombies (enterra-se um, surgem 3)
  3. 3. Planejamento! Nas eras mitológicas... A chegada do CSS! CSS e “seus” problemas Frameworks de CSS Bootstrap
  4. 4. Nas eras mitológicas... H.T.M.L. Texto. Texto. Bastante texto.  Tinha link, mas era texto.
  5. 5. Nas eras mitológicas...  http://info.cern.ch/hypertext/WWW/TheProject.html
  6. 6. Nas eras mitológicas...  Recomendo:  http://broadcast.rackspace .com/blog/HTMLtimeline/in dex.html
  7. 7. Nas eras mitológicas...
  8. 8. Nas eras mitológicas...  O HTML evoluiu...  Vieram as imagens...  Tabelas...  ... o deturpo semântico das tabelas :(  Tabelas são para dados tabulares, não para separar imagem de texto!  Vieram os web designers...
  9. 9. Nas eras mitológicas...
  10. 10. A chegada do CSS!  Proposta de melhorar a aparência, usabilidade e manutenibilidade dos sites
  11. 11. A chegada do CSS!  Em teoria... Menos stress! Mais produtividade e qualidade! Mais liberdade! Tudo de bom!
  12. 12. A chegada do CSS!
  13. 13. A chegada do CSS!  Cascading Style Sheet (CSS1) é aprovado pela W3C em 1996  Browsers iniciam a implementação  CSS2 vem em 1998  Revisão em 2011 (CSS2.1)  Maior parte implementado pelos navegadores atuais  CSS3 vem em 1999 (WTF!)  Em 2014, ainda estamos na fase de implementação!
  14. 14. CSS e “seus” problemas
  15. 15. CSS e “seus” problemas  A implementação dos navegadores podem diferir  Layouts vão podem parecer “quebrados” em testes  “Funciona no IE, mas no FireFox o menu desapareceu...”
  16. 16. CSS e “seus” problemas http://www.w3counter.com/globalstats.php - Acesso em: 07/05/2014
  17. 17. CSS e “seus” problemas Pequena demonstração...
  18. 18. Vários problemas em manter os sites funcionando em todos os browsers
  19. 19. Logo as pessoas resolveram criar algumas ferramentas...
  20. 20. Frameworks de CSS
  21. 21. Frameworks de CSS Soluções vem de discussões...
  22. 22. Frameworks de CSS USAR OU NÃO USAR, EIS A QUESTÃO... ...QUE NÃO DEVE SER GENERALIZADA.
  23. 23. Frameworks de CSS  Vantagens  Facilidade  Padrões robustos  Comunidade  Muitas ferramentas  Desvantagens  Restrições  Semântica alheia  Curva de aprendizado  Muitas ferramentas
  24. 24. Bootstrap
  25. 25. Bootstrap Framework de CSS... ... Front End... ... Responsivo... ... Mobile First...  ... Só não faz café. Ainda.
  26. 26. Bootstrap  Originalmente, ferramenta interna do Twitter  “Twitter Blueprint”  Meros mortais ganharam acesso em 2011  Mais de 20 releases  Atualmente na versão 3.x
  27. 27. Bootstrap  Vamos ver ao vivo!
  28. 28. Bootstrap Temas customizados!  https://wrapbootstrap.com/
  29. 29. Conclusão Aprendizado fácil Boa documentação Suporte aos navegadores recentes Mais que CSS, Front End!
  30. 30. Referências e Reverências  http://getbootstrap.com  http://css-tricks.com/what-are-the-benefits-of-using-a-css- framework/  http://speckyboy.com/2011/03/14/discussing-the-pros-and-cons-of- using-a-css-framework/
  31. 31. Referências e Reverências  http://blog.artversion.com/web-design-company/the-importance-of- web-user-interface-design/  http://www.cssneuse.net/the-history-of-css.php  http://www.design-laorosa.com/2012/01/history-websites-at-their- infancy-10.html  http://www.wdtonline.com/wdtMagazine/MemberWorks/WiserWays/cs shtml.htm  http://sites.jmu.edu/wrtcworkshop/evolution-of-communication/

×