Por @Alvy — 5 de Septiembre de 2005

Estaba jugando hoy con mi tessssoooooro y cotilleando el navegador web que lleva la versión 2.0. Diego y Nacho se percataron de nuestro weblog se ve más bien regular porque usa DIVs de ancho fijo y hay que hacer scroll. Así que aproveché una plantila que había quedado olvidada de una microciervada de Nacho, la famosa el nuevo microsiervos a.k.a. «Optimizado para NCSA Mosaic y pantalla Hércules» y monté Microsiervos Retro optimizado para la PSP y seguramente para otros sistemas como PDAs, etc.

Esa nueva portada retro actualizará los contenidos continuamente. Es como una versión ligera de la portada del blog. Seguramente hasta aprobaría algún test de accesibilidad. Es un HTML muy de los 90. En realidad espero que podamos dedicar algo de tiempo a preparar una versión accesible más digna que tenga todo el site con sus anotaciones, enlaces, comentarios etc. basados en la original, pensando sobre todo en la PSP y de paso otros PDAs y los temas de accesibilidad, el eterno asunto pendiente. Pero para ir probando yo creo que este apaño de versión retro puede valer. Por lo menos no hay que hacer scroll ;-)

Actualización: He añadido también Últimos 42 Comentarios, versión retro, página que a mi me resulta bastante útil, es como mi portada de este blog, la verdad. Por cierto que nos dijeron que estas versiones ligeras se ven estupendamente en las Blackberrys. Genial.

Actualización (enero 2007): Ha surgido cierto movimiento para nombrar las versiones texto o para móviles de las web con el subdominio m. (en vez de www), de modo que siguiendo este intento de estandarización también se puede acceder ahora a través de m.microsiervos.com.

Compartir en Flipboard  Compartir en Facebook  Tuitear

21 comentarios

#1 — Nacho

bueno, en realidad usaremos la misma portada añadiendo un CSS con un "media type" = handhelds con el ancho variable que en principio debería solucionar el problema -- y es mucho más sencillo! ;-)

#2 — Alvy

Sí, eso es lo suyo. Esto como apaño low-tech hecho en cinco minutos quick-and-dirty no está mal, da el pego bastante, al menos hasta que no haya otra cosa. Hala, ya tenemos motivación ;-)

#3 — alidhaey

Alvy, leyendo tu post sobre el navegador incluido en la PSP ¿Consideras la PSP un chisme/gadget para jugar?

#4 — mini-d

En las pruebas que hice, media="handheld" no está soportado por la PSP. Es una pena, pero he encontrado una forma de hacer un switcher con PHP para imprimir un estilo dependiendo el navegador.

#5 — Jeremías_Grunge

Aquí tenéis a uno que le resultará muy útil.

Saludos

#6 — rbarbera

Una consecuencia colateral del cambio, es que esta nueva página retro se ve muy bien el el navegador de las Blackberry. El original, tambien se puede leer, pero las BB "despliegan" las páginas con divs y tablas, apilando las columnas de izquierda a derecha y tienes que saltar un buen número de pantallas para saltarte los enlaces antes de llegar al contenido. Con este nuevo formato retro, nada más entrar tienes contenido MicroSiervos 100%. Gracias!

#7 — Alvy

#3  Sí, un poco para todo. Yo sobre todo la voy a usar para hackear y cacharrear, de hecho casi seguro que tendrá más juegos retro que modernos.

#8 — Nacho

mmm... cierto la PSP no coge el mediatype handheld como apunta Mini-d (#4), así que se chafó el plan (aka, el de la vía rápida --aquí es cuando la página retro adquiere todo su valor ya que la cosa va a requerir un poco más de tiempo del previsto! ;-)

La opción del PHP es una ñapa pero puede valer, (identificando el USER_AGENT) -- o ajustando según la resolución horizontal. investigaremosssss...

#9 — Alvy

#6  Mira que bien. Si es que no hay como el código de los 90 ;-)

#10 — billy

y tu? ya navegas link por link con tu incomoda psp?

#11 — Nacho

ah, #10 la ignorancia... en la PSP no hay que navegar link por link, sino que puedes desplazar el cursor con el mando analógico de la izquierda (debajo del digital) o desplazar la página en modo arrastrar pulsando cuadradito + mando analógico

#12 — jotarp

Tengo una entrada en mi blog pendiente explicando como tengo hecho el "theme" para Drupal de mi página.

En resumen: no me gustan las páginas de ancho fijo (¿para que quiero un TFT de 17'' de 1280x1024 si luego las páginas están a 640 u 800 de ancho fijo?), pero ocupar toda la anchura de la ventana puede dificultar la lectura cuando la ventana es muy ancha (las líneas deben permanecer dentro de un límite de longitud). Mi solución: dos o tres columnas según resolución.

Probar a redimensionar la ventana dónde veis http://jotarp.org por encima o por debajo de 820 pixeles de ancho. Probado en Firefox e IE5.

Idea inspirada (y scripts descaradamente copiados: debería dar un toque a Cameron Adams) en este artículo: http://www.themaninblue.com/writing/perspective/2004/09/21/

(Esto del blogging es una mierda: tengo como 4 ó 5 entradas laaaargas pendientes. O tengo "real life" o soy un lento y un vago...)

#13 — Alvy

Bueno, todo tiene sus ventajas y desventajas. Si haces muy anchas algunas páginas se estira tanto el texto que apenas son legibles. Más allá de cierto punto los párrafos que no están en columnas más bien estrechas (unos dos alfabetos y medio de ancho) no se leen nada bien.

#14 — Alvy

#10 #11  Una recomendación es usar del.icio.us que con su diseño años 90 se lee perfectamente y es donde puedes guardar tus miles de favoritos para luego navegar sin tener que teclearlos.

Es realmente incómodo escribir.

#15 — jotarp

#13 En lo de las columnas estrechas estamos de acuerdo. ¿O no me he explicado bien?. Dónde tu dices "columnas más bien estrechas" yo digo "líneas deben permanecer dentro de un límite de longitud", pero es lo mismo.

Lo que quiero decir es que eso no implica, necesariamente, página de ancho fijo. El usuario debería poder determinar el ancho de la ventana de visualización (es su navegador, es su pantalla, es su ventana) y el diseñador debería preocuparse de mantener las líneas (o las columnas: llámalas como quieras) dentro de unos límites.

La página de ancho fijo es una solución (perdón: parece que es LA solución actual) al tema del ancho de las columnas, pero que plantea problemas con el ancho de las páginas. Lo de la PSP lo hace evidente, pero ya estaba ahí: que a estas alturas redimensiones una ventana del navegador (para ver algo de debajo) dentro de un tamaño razonable y te aparezca la barra de scroll horizontal... pues como que nunca me ha gustado. Y los espacios en blanco (a la derecha a la izquierda o a los dos lados) me ponen nervioso: me parece que falta algo de cargar de la página.

#16 — Alvy

Es un gran dilema. Yo abogo por un ancho flexible cuando haces las ventanas pequeñas pero con un límite cuando las haces grandes, elegido por el diseñador para garantizar una buena legibilidad.

#17 — Edetano

Que mal rato, ese fondo gris y enlaces azules me han traido a la memoria a Infovia 28.800 + windows 95. Iconos de red que no parpadean, pantallazos azules, > >, >, > Gifs animados en colores chillones, descargas a 300 bites/s, uffff

Respira, respira, Ono y Suse, Ono y Suse, todo va bien, todo va bien, ohhhhmmmmmmmm

#18 — Nacho

El ancho ideal debería ir en porcentaje, igual que el tamaño de la letra -- o mejor en unidades em, de modo que el ancho de la columna se mantendría en proporción al tamaño de fuente y el ancho de línea, pero ambos casos dan cierto control con min-width y max-width, que de momento no están soportadas por IE.

para IE se puede probar el "width:expression" tal y como se explica en max-width in Internet Explorer

#19 — Fëaluin

Acerca de últimos 42 Comentarios, si es tan útil, porque no ponen el enlace en la página inicial?

#20 — Wicho

Ya lo está, fíjate bien.

#21 — Alvy

#19  Es el letrero destacado, grande, azul, enorme, arriba del todo en la pestaña que dice «Comentarios».