Como tomar medidas de mi cellphone para responsive?

[wilson_romero]

TEngo un tema con esto.
tuve la idea de crear una técnica la cual me salio mal.
era algo así.
Tome una regla y medi mi cellphone y luego puse esas medidas en el photoshop de pulgadas y en la regla del photoshop la cambie a pixeles, Pero al investigar me documente que no se puede hacer eso , porque el mundo físico no es el mismo que el mundo dentro de la computadoras.
Osea la pantallas visualiza medidas por pixeles y las medida física por pulgadas.
Aun que mi técnica tiene un poco de lógica, no se puede hacer esto en photoshop.

Entonces busco la forma de tener mis medidas del cellphone en pixeles para para poner esas misma medidas en el CSS. Como los tamaños del botón, posiciones ect...

[Triby]

Haz una página con una serie de DIVs, incrementando en 20 pixeles el ancho y ábrela en el celular, así podrás tener una referencia más adecuada.

[Rafael]

no se puede hacer eso

Sí se puede hacer eso que comentas pero es un poco inútil.

Desafortunadamente hay ahora diferentes conceptos de pixel...

En lo que tienes que basar primero es en los pixeles declarados. Estos son los que el aprarato de indica al navegador que son los que tienen.

Revisa esto para que veas cual es: https://www.whatismyscreenresolution.com/

Después (o aparte) de esto hay que encontrar cual es la densidad de pixeles de tu pantalla. Entonces sí, mides en medidas físicas (cm convertidos a pulgadas por ejemplo) Luego vas a ver las específicaciones de tu pantalla y ves la resolución de la pantalla, digamos FullHD (1920x1080)

Entonces, si tu pantalla mide 5 pulgadas, la densidad de pixeles serán 1920/5 = 384. Esto es lo que tendrías que poner en tu Photoshop. Un documento de 384 ppi de 5 pulgadas.

Peeeeeero es mejor que simplemente pongas 1920px.

Me regreso a los pixeles declarados. Por eso existe una notación para las imágenes 2x y 3x, pero eso lo hace el dispositivo, no tú.

Para definir CSS simplemente utiliza los pixeles declarados. Despúes de eso preparas ciertos assets a 2x y 3x. Pero la realidad es de que para mí, un diseño movil debe de tener una resolución simple para bajar el consumo de ancho de banda de redes no WiFi.