¿Trabajan con pixeles o porcentajes?

[eduardobrutaldeath]

Hola a todos,
Hace algún tiempo tuve problemas con la página que le diseñe a una persona... Tengo dos computadoras, una laptop con la que estoy ahora, y otra estática que tiene una pantalla plana enorme, osea tiene como 21 pulgadas creo, es muy grande, parece la pantalla de una TV XD... La cuestión es que diseñe la página del cliente en esa computadora con monitor muy bonito pero muy grande y la hice en pixeles, entonces le puse como 1400px creo de ancho al contenedor principal y así, con esas medidas enormes diseñe toda la página... Esto fue hace mucho tiempo, al final la página quedo muy bonita pero, luego recibí llamadas del cliente diciendo que la página se metía a los lados, y cuando fui a revisar, efectivamente, la página estaba en el centro y no se veían las columnas de los lados, desde ahí comencé a usar porcentajes, cosa que la página se veía de la misma manera en una pantalla enorme o una chica; sin embargo, he notado que las páginas creadas con porcentajes cargan más lento y supongo que es porque el navegador demora un poco en calcular la resolución de cada pantalla... algunos me han dicho que mejor use pixeles pero que le ponga al contenedor un tamaño de 780px u 800, que más o menos es un standar para que se vea bien en cualquier resolución de pantalla...

[pzin]

Cualquier persona que te haya dicho eso, bloquéala de Facebook.

Eso de que los 780 pixeles es un estandar, era cierto hace como una década, cuando reinaban las quince pulgadas y la resolución 800x600.

Tampoco te va a tardar más la página en cargar si la haces con una medidas u otras.

Hoy en día es casi obligatorio trabajar con diseños líquidos, que es más o menos la base del diseño web responsivo, más que nada porque no hay ni una sola resolución que destaque por encima de otra y porque el abanico de resoluciones van, en el ancho, de 320 hasta 1920 pixeles, eso se considera "normal".

[eduardobrutaldeath]

Iniciado por pzin

Cualquier persona que te haya dicho eso, bloquéala de Facebook.

Eso de que los 780 pixeles es un estandar, era cierto hace como una década, cuando reinaban las quince pulgadas y la resolución 800x600.

Tampoco te va a tardar más la página en cargar si la haces con una medidas u otras.

Hoy en día es casi obligatorio trabajar con diseños líquidos, que es más o menos la base del diseño web responsivo, más que nada porque no hay ni una sola resolución que destaque por encima de otra y porque el abanico de resoluciones van, en el ancho, de 320 hasta 1920 pixeles, eso se considera "normal".

Cuando dices diseños líquidos... ¿Te refieres a porcentajes cierto?
Bueno si es así, una consulta más... Yo, como ya dije, desarrollo mis webs con porcentajes desde que me pasó lo que me pasó con ese tío XD... bueno para que sepas, yo pongo a mi HEADER, SECTION y FOOTER en un DIV contenedor, y luego centro ese DIV; osea, mi BODY siempre tiene por defecto 100% de ancho, mi contenedor tiene 80% y sus ARTICLES tienen sus respectivas medias en porcentajes también... hasta ahí todo bien pero, ahora que recuerdo, yo el valor de MARGIN o PADDING lo pongo en pixeles, así que quería preguntarte si tú haces lo mismo o le das porcentajes incluso a tus márgenes, paddings, bordes, etc...

POSDATA: Si haces lo que creo que haces, ¿Cómo calculas el equivalente de pixel a porcentaje?

[pzin]

Puedes trabajar con medidas relativas y fijas, no hay ningún problema en eso.

Iniciado por eduardobrutaldeath

¿Cómo calculas el equivalente de pixel a porcentaje?

No se calcula, porque no puedes igualar una medida fija a una relativa.

[eduardobrutaldeath]

Iniciado por pzin

Puedes trabajar con medidas relativas y fijas, no hay ningún problema en eso.



No se calcula, porque no puedes igualar una medida fija a una relativa.

Bueno gracias, entonces supongo que no hay problema si trabajo los elementos con porcentajes; y sus márgenes, espacios y bordes con pixeles...

[pzin]

Iniciado por eduardobrutaldeath

Bueno gracias, entonces supongo que no hay problema si trabajo los elementos con porcentajes; y sus márgenes, espacios y bordes con pixeles...

Ningún problema.

Una cosa a tener en cuenta, es el modelo de caja de CSS. Para trabajar mejor con porcentajes y pixeles, es conveniente al menos cambiar ese modelo de caja, para que el borde y el padding formen parte del ancho/alto del elemento:

Código CSS:

* {
  box-sizing: border-box
}
 

Para el tema de los márgenes, que siempre estarán por fuera del elemento, a veces es conveniente usar calc():

Código CSS:

div {
  width: calc(50% - 10px);
}
 

[eduardobrutaldeath]

Iniciado por pzin

Ningún problema.

Una cosa a tener en cuenta, es el modelo de caja de CSS. Para trabajar mejor con porcentajes y pixeles, es conveniente al menos cambiar ese modelo de caja, para que el borde y el padding formen parte del ancho/alto del elemento:

Código CSS:

* {
  box-sizing: border-box
}
 

Para el tema de los márgenes, que siempre estarán por fuera del elemento, a veces es conveniente usar calc():

Código CSS:

div {
  width: calc(50% - 10px);
}
 

Buen dato gracias...