RWD Site Responsivo

[Jonatan Passos 0]

Boa noite.

 

Estou fazendo à leitura do livro web design responsivo do escritor Maujor (Maurício Samy), e estou enfrentando algumas dificuldades.

 

Bom estou aplicando na prática o que estou estudando, porem estou com dúvidas se o que estou fazendo esta correto ou não, sabendo da grande gama de resoluções que os dispositivos hoje em dia tem, fiquei na dúvida, alguns autores fazem uso das seguintes resoluções:

 

320 pixels - 20em - Smartphones no modo retrato.

480 pixels - 30em - Smartphones no modo paisagem.

600 pixels - 37.5em - Tablets pequenos. Ex: Amazon Kindle (600×800)

768 pixels - 48em - Tablets maiores em modo retrato. Ex: iPad (768×1024)

1024 pixels - 64em - Tablets maiores em modo paisagem, monitores antigos.

1200 pixels - 75em - Monitores wide.

Porem tive que adaptar meu uso alem disso, minha pergunta é: somente com essas consigo resolver um site responsivo?

Para o meu caso usei assim:

@media only screen and (min-width : 20em) { /* 320px */ }

@media only screen and (min-width : 23.4em) { /* 374px */ }

@media only screen and (min-width : 30em) { /* 480px */ }

@media only screen and (min-width : 35.5em) { /* 568px */ }

@media only screen and (min-width : 37.5em) { /* 600px */ }

@media only screen and (min-width : 40em) { /* 640px */ }

@media only screen and (min-width : 64em) { /* 1024px */}

@media only screen and (min-width : 80em) { /* 1280px */ }

É uma simples tela de login: onde tenho que reposicionar as divs de acordo com à resolução da tela. Quem puder esclarecer minhas dúvidas ficarei grato.

Exemplo do que fiz: www.acomacgo.com.br/index.php/gerenciar

 

[Diéssica 140]

Você pode usar o tamanho que quiser, na teoria. Na prática, é bom que mantenha padrões, e somente isso. Não é necessário usar apenas aquelas resoluções recomendadas; afinal, são apenas recomendações. O seu projeto é que define as resoluções a serem usadas. =)