Diego Sanches Modesto apresenta o framework front-end Twitter Bootstrap, que fornece arquivos CSS e JavaScript para criar layouts responsivos e mobile-first através de um sistema de grade flexível baseado em colunas. O documento explica como obter os arquivos do Bootstrap, seu sistema de grade e layout responsivo, além de discutir suporte em navegadores antigos.

1. Diego Sanches Modesto
Facebook, Linkedin, E-Mail

2. Twitter Bootstrap 3.3.5
http://getbootstrap.com/

3. Arquivos necessários
 Arquivos por CDN;
 Arquivos por Bower;
 Arquivos por Node Package Manager;
 Arquivos por Composer;
 Arquivos do Código Fonte;
 Arquivos principais;

4. Sistema de Grade (Grid System)
 Colunas? Como assim?
 “Grid systems are used for creating page layouts through a series of rows and
columns that house your content.”
 Container -> Row -> Column;
 Colunas estão ligadas com Media Queries;
 O que diabos são Media Queries?
Nome Prefixo Dimensão
Celular .col-xs-* Automático
Tablet .col-sm-* 750px
Notebooks .col-md-* 970px
Desktops (TVs também) .col-lg-* 1200px

5. Layout Responso
 Vantagens;
 Desvantagens;
 Como desabilitar? Veja no site
 Como identifico em cenário real se devo usar layout responsivo?

6. Suporte em navegadores
Suporte no INTERNET EXPLORER 8
Feature Internet Explorer 8 Internet Explorer 9
border-radius Not supported Supported
box-shadow Not supported Supported
transform Not supported Supported, with -ms prefix
transition Not supported
placeholder Not supported