Que pasa con el "responsive"
4 seguidores
Hola a todos, recientemente me las he tenido que ver con el tema de adaptar la web a móviles y demás historias...
Estoy haciendo una web adaptable y he utilizado mediaqueries, al cambiar el tamaño de la ventana del navegador carga uno u otro css, hasta ahí todo bien (en local)... peeeeeero he colgado la web y tanto en iphone, ipad y android se lo pasa por al arco del triunfo y me muestra solo la web "grande"...
Seguro debe ser alguna tontería pero como soy novatillo con este sistema....... alguien puede echarme una manilla con esto?
Un saludo y gracias!!!
elperi
Correcto, reducir el número de peticiones http al servidor es fundamental. A nivel de ahorro de tiempo de carga es posible llegar a notar reducciones de tiempo superiores que con los típicos consejos de "optimiza tus fotos", comprime tu código, etc... Si usases sprites css ya sería la caña.
Ander
Me alegro que se solucionara con la etiqueta, de ahora en adelante seguro que no se te olvida ponerla en ningún proyecto :P
Sobre el tema de los CSS todo depende de la cantidad de archivos que cargues a tu web, pero siempre es una buena práctica el minimizar la cantidad de peticiones http que realices al servidor. Podrías probar a tener los CSS por separado cuando estés desarrollando y a la hora de subirlos al servidor compilar todos en un único de CSS y de paso minificarlos para que te ocupen menos. Puede que en alguna web sencilla no veas mucha diferencia pero cuando trabajas con proyectos grandes cada kb que puedas ahorrarte se nota.
Alo
Gracias a todos...
Vaclad, efectivamente faltaba la etiqueta meta que me dices... ahora va estupendamente... y ya entrados en harina....
...es notable la agilidad unificando css? yo los suelo dividir por organización y para poder editarlos sin volverme loco haciendo scroll.
Un saludo y de nuevo gracias!
Ander
Prueba a añadir la etiqueta del viewport, a ver si así se te soluciona:
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
Y como te dice samuelvgm, yo incluiría todos los CSS dentro de un mismo archivo para reducir las peticiones.
samuelvgm
¿Y porqué no juntas todos los CSS en uno solo?. Así reduces las peticiones y te libras del error.
Alo
La estoy realizando bajo Joomla3
Alo
Claro!, marchando!!
<!DOCTYPE html><head>
<jdoc:include type="head"/>
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ;?>/css/screen_layout.css" media="screen and (max-width:3000px) and (min-width:481px)">
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ;?>/css/mobile_layout.css" media="screen and (max-width:480px) and (min-width:0px)">
<link rel="stylesheet" href="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ;?>/css/fuentes.css">
<script src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ;?>/js/jquery.anchorScroll.js"></script>
<script src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ;?>/js/jquery.animate.js"></script>
<script src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ;?>/js/easing_scroll.js"></script>
</head>
microbians Staff
Podrías poner el head de tu html principal, porque si no es complicado de ver que ocurre.