Download - Bootstrap - Amor e ódio
BOOTSTRAP - AMOR EÓDIO
0
OIHanneli (H mudo)Codeminer 42 - HIRING!Café, Pokémon, Lego, bichos, ciência
O QUE NÃO VAMOS VER AQUI
O QUE VAMOS VER AQUIPor que se fala tanto em BootstrapCoisas legais no BootstrapCoisas não tão legais no BootstrapNeat e outras alternativasGIFs e imagens legais <3
POR QUE AMOR E ÓDIO?
DEVS DE BACKEND
"Dev de backend é aquele cara que vai fazer umapágina muito feia, mas cujo servidor permanece
em pé quase sempre."
FRONT, Desenvolvedor, 2014
Ê LINDEZA
"QUE LINDO, GENTE, DESSA VEZ NÃO DEIXEI OFUNDO BRANCO!"
"Se você não fizer algo decente, vou droppar seu banco"
Vem então o Bootstrap!
"QUE LINDO!!!111!111!"
Fonte: http://www.sitepoint.com/11-reasons-to-use-twitter-bootstrap/
#1 - É MUITO RÁPIDO FAZER O LAYOUTPADRÃO
#2 - LESS E MUITO JAVASCRIPT DE BRINDE
#3 - RESPONSIVO
#4 - DOCUMENTAÇÃO BEM ESTRUTURADA EINTUITIVA
VOU USAR ISSO <3
EEEEEEEEEEPPPAAAAAAAAAAAACCCCCCALLLLLLLMMMAAAAAAAAAAAIIIIIIIIIIII COM ESSE
BOOTSTRAP!!!!!!!!!111111111!!!!!!
Vai rolar um fight...
Sabe onde eu vou enfiar esse seu Bootstrap?
CALMA MIIKA S2
PROBLEMAS DOBOOTSTRAP
#1 - A SEPARAÇÃO ENTRE CONTEÚDO EAPRESENTAÇÃO NÃO É MUITO BOA
#1 - A SEPARAÇÃO ENTRE CONTEÚDO E APRESENTAÇÃO NÃOÉ MUITO BOA
<div class="row"> <div id="article" class="span8">...</div> <div id="aside" class="span4">...</div> </div>
/* LESS */ article { .column(8); } aside { .column(4); }
#2 - MUITOS NOMES DE CLASSES POUCOINTUITIVOS
#2 - MUITOS NOMES (POUCO INTUITIVOS) DE CLASSES
#3 - REDESIGN É CUSTOSO
#3 - REDESIGN É CUSTOSO
ORIGINAL
COM ALGUNS DETALHES ALTERADOS
#3 - REDESIGN É CUSTOSO
.pagination ul {
border-radius: 0px;
box-shadow: none;
}
.pagination ul > li > a,
.pagination ul > li > span {
padding: 8px 16px;
line-height: 1em;
text-decoration: underline;
background-color: none;
border-top: none;
border-bottom: none;
}
.pagination ul > li > a:hover,
.pagination ul > .active > a,
.pagination ul > .active > span {
background-color: transparent;
color: black;
}
.pagination ul > li:first-child > a,
.pagination ul > li:first-child > span {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.pagination ul > li:last-child > a,
.pagination ul > li:last-child > span {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
SÓisso
#4 - PROBLEMAS SEMÂNTICOS
#4 - PROBLEMAS SEMÂNTICOS <i class="icon-search"></i>
#4 - PROBLEMAS SEMÂNTICOSWTF O QUE i tem a ver com icon??????
#5 - MUITOS SITES TERÃO A MESMAIDENTIDADE VISUAL QUE O SEU
E AGORA? O QUE POSSO UTILIZAR?
MOTIVOS PARA UTILIZAR O BOURBON/NEAT
(MEUS GIFS BONS ESTÃO ACABANDO)
#1 - COMPASS TYPE MIXINS
#2 - MUITO MAIS SEMÂNTICO - VOCÊDETERMINA OS NOMES
aside { @include span-columns(3); } section { @include span-columns(6); }
Livre de rows e cols!
#3 - DOCUMENTAÇÃO MUITO BOA
NEM TUDO É PERFEITO
MOTIVOS PELOS QUAIS VOCÊ PODE NÃOCURTIR O BOURBON / NEAT
#1 - É PRECISO CONHECER MAIS SOBRE CSS
#2 - ESCREVE-SE MAIS CÓDIGO
#3 - É PRECISO TER CAUTELA COM OSMIXINS.
AINDA HÁ MAIS OPÇÕES - FOUNDATION
CONCLUSÕESNem tudo é perfeito
Escolha o caso mais adequado para você
CONCLUSÕESSei que ninguém perguntou, mas minha opinião é
CONCLUSÕESUsar o que form melhor para você. Considero semântica muito
importante então tendo a priorizá-la.
OBRIGADA!! PERGUNTAS?@hannelita - [email protected]
REFERÊNCIAShttp://www.zingdesign.com/5-reasons-not-to-use-twitter-bootstrap/http://halanstevens.com/blog/bootstrap-youre-doing-it-wrong/http://fourword.fourkitchens.com/article/you-dont-need-bootstraphttp://blog.teamtreehouse.com/use-bootstrap-or-foundationhttps://www.liquidlight.co.uk/blog/article/twitter-bootstrap-3-the-good-the-bad-the-ugly/http://lucisferre.net/2013/06/14/bootstrap-foundation-bourbon-neat/