Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Design Resposivo Além das @Media Queries

Erick Patrick
February 08, 2014

Design Resposivo Além das @Media Queries

Nesse slides, apresento a história do Design Responsivo além de outros métodos e técnicas para implementar o mesmo.

Erick Patrick

February 08, 2014
Tweet

More Decks by Erick Patrick

Other Decks in Design

Transcript

  1. O Design Responsivo
    além das @Media Queries

    View full-size slide

  2. ERICK PATRICK (@erickpatrick)
    Analista de Sistemas Web (Uninovafapi) — Mestrando em Ciências da Computação (Ufpi)
    Graduado em Ciências da Computação (Uespi)

    View full-size slide

  3. Design Impresso &
    Design Web

    View full-size slide

  4. Era uma
    vez...

    View full-size slide

  5. Fluid Grids
    Media Queries
    Flexible Media

    View full-size slide

  6. Fluid Grids
    target ÷ context = result

    View full-size slide

  7. Media Queries

    View full-size slide

  8. Flexible Images

    View full-size slide

  9. Beautiful
    Degradation

    View full-size slide

  10. Mobile First

    View full-size slide

  11. One More Thing!!!!11!1!!!!11!ONE!!!

    View full-size slide

  12. Round 2
    Métodos &
    Técnicas

    View full-size slide

  13. Progressive
    Enhancement

    View full-size slide

  14. Content Strategy

    View full-size slide

  15. Feature
    Detection

    View full-size slide

  16. Conditional
    Loading

    View full-size slide

  17. Livros
    ● Adaptive Web Design;
    ● Jump Start Responsive
    Web Design;
    ● Responsive Design;
    ● Responsive Web Design;
    ● Responsive Web Design -
    Getting the New Baseline
    in Web Design Right;
    ● Mobile First;
    ● Designing with
    Responsive Web Design;
    ● Hardboiled Web Design;

    View full-size slide

  18. Practice,
    motherfucker!

    View full-size slide