CSS. HTML. Para todos los dispositivos
Hace poco se cumplieron 20 años de la web, World Wide Web, y Tim Berners-Lee criticaba los dominios .tel y .mobi. No es de extrañar ya que realmente con el mismo contenido html o xhtml podemos crear estilos para los distintos dispositivos o Media types. Echar un vistazo a las guias de las w3c sobre estos Media types
El tema es sencillo, si hemos separado bien el contenido de la apariencia, el html del css.
Dentro de <html><head> podemos definir hojas de estilo, css, para cada dispositivo cliente que pueda solicitar una url de nuestra web.
Se trata de añadir con el valor del atributo media las diferentes hojas de estilo, css, que hayamos generado, mejor que sea el diseñador gráfico si sabe que existe algo más que flash.
No te olvides echar un vistazo a la w3c, hay una guía muy interesante sobre css (en español) que puede resolver muchas dudas y por su puesto los Media types en inglés.
El tema es sencillo, si hemos separado bien el contenido de la apariencia, el html del css.
Dentro de <html><head> podemos definir hojas de estilo, css, para cada dispositivo cliente que pueda solicitar una url de nuestra web.
Se trata de añadir con el valor del atributo media las diferentes hojas de estilo, css, que hayamos generado, mejor que sea el diseñador gráfico si sabe que existe algo más que flash.
<!-- para monitores de ordenador, computadora -->
<link rel = "stylesheet" type = "text/css" media="screen" href="css/screen/general.css"/>
<!-- para imprimir -->
<link rel = "stylesheet" type = "text/css" media="print" href="css/print/general.css"/>
<!-- para pequeñas pantallas, como móviles, pda, ... -->
<link rel = "stylesheet" type = "text/css" media="handheld" href="css/handheld/general.css"/>
<!-- incluso para ciegos -->
<link rel = "stylesheet" type = "text/css" media="braille" href="css/braille/general.css"/>
<link rel = "stylesheet" type = "text/css" media="embossed" href="css/embossed/general.css"/>
<!-- sintetizadores de voz -->
<link rel = "stylesheet" type = "text/css" media="speech" href="css/speech/general.css"/>
<!-- Para nuestro querido terminal o consola, cuando navegamos con lynx -->
<link rel = "stylesheet" type = "text/css" media="tty" href="css/tty/general.css"/>
<!-- Los tipicos pantalla, impresión y teléfono móvil o pda
<link rel = "stylesheet" type = "text/css" media="screen" href="css/screen/menu.css"/>
<link rel = "stylesheet" type = "text/css" media="print" href="css/print/menu.css"/>
<link rel = "stylesheet" type = "text/css" media="handheld" href="css/handheld/menu.css"/>
No te olvides echar un vistazo a la w3c, hay una guía muy interesante sobre css (en español) que puede resolver muchas dudas y por su puesto los Media types en inglés.
Comentarios
Publicar un comentario