Nueva cabecera, más ancho y nuevo estilo visual

Una nueva imagen para Contando Estrelas

Como ya habréis visto quienes hayáis entrado esta noche al blog, Contando Estrelas ha cambiado de aspecto. Además de la nueva cabecera -más limpia que la anterior-, he pasado el menú principal del blog a la parte de arriba. Además, el blog ha crecido: de 945 píxeles de ancho pasa a 999; espero que esto facilite algo la lectura a quienes se conectan con pantallas grandes, pues este estirón me ha permitido aumentar un poco el ancho de las columnas de portada y del tamaño de letra de las mismas. También he añadido un fondo al blog y un marco al bloque principal, creo que esto le da una imagen más cuidada.

No están terminados todos los cambios -ando con bastante trabajo y ya sabéis lo que dice el refrán: en casa del herrero cuchillo de palo- y hay otros cambios que he implementado estos últimos días y que tal vez hayan pasado desapercibidos para muchos. Uno de los más visibles es que ahora las entradas pueden llevar antetítulos, los textos que se ponen sobre los titulares para aportar más información sobre un contenido (tenéis varios ejemplos aquí y en esta misma entrada). Esto lo he hecho con los campos personalizables de WordPress: cada vez hay más en el blog y lo hacen más complicado pero también más completo. Con esos mismos campos he implementado un sistema para adaptar el tamaño de los titulares al ancho de las entradas (da mejor imagen). También he añadido font-faces a las CSS del blog para que deje de haber problemas con las fuentes. el blog usa la fuente Calibri para los titulares y la LucidaSans para los textos de las entradas. La primera es cada vez más habitual (pues ahora la incluye Windows), pero la segunda no es tan frecuente y ambas es poco habitual verlas en móviles. Espero que esto no aumente demasiado el tiempo de carga del blog (es la razón por la que hasta ahora no lo había hecho); de momento lo dejaré en pruebas.

Por otra parte, hace días, con el nuevo año, Contando Estrelas ha cambiado de color secundario: del verde hierba al amarillo anaranjado. Es ya el cuarto color que uso (antes de ésos usé el rojo y el azul claro), llevaba ya un par de años con el verde y me apetecía cambiar. Estuve unos cuantos días haciendo combinaciones de distintos tonos de amarillo anaranjado hasta que di con el que me pareció más adecuado. También he hecho algunos colores derivados para enlaces y otros elementos. Ya algún lector me ha comentado que los enlaces de las entradas no se ven tan bien como antes, estoy pendiente de buscarle una solución. En fin, me gusta como combina el amarillo anaranjado con el negro y el blanco. Ya me diréis vuestra opinión.

Además de esto, he cambiado el diseño de mi cuenta en Twitter (@elentirvigo) y el de mi canal en Youtube con la decoración que podéis ver sobre estas líneas. No me convencía la idea de seguir teniendo el clásico fondo de estrellas con haces puntiagudos, quería probar con algo que fuera más original y moderno y pensé en usar asteriscos. Usé los procedentes de varias fuentes tipográficas. Después de varias pruebas el resultado me ha dejado satisfecho, pero espero las conclusiones que saque vuestro ojo crítico. 😉

Quedan unas cuantas cosas por hacer en el blog y algunos fallos por solucionar, pero tendrán que esperar a que encuentre tiempo para arreglarlos. Os agradeceré que si veis algo que no va bien, me lo digáis. Este blog tiene una estructura compleja y a veces se me escapan cosas...

No te pierdas las novedades y contenidos que te interesan. Recibe gratis el boletín diario en tu correo electrónico:

Comentarios:

  1. Conchita

    Ha quedado chulísimo 🙂

  2. disconforme

    Todo perfecto, maestro. Siga usted así que esta es su casa :aplauso:

  3. Muy bueno amigo, cada dia nos sorprendes más!
    Cuando tenga mi empresa ya te contratare pero interno, que la competencia es dura 😀

  4. Lu

    Como siempre muy bueno! Y lo mejor es que nunca te quedas quieto y siempres estas pensando en mejorar y en hacer cambios.
    Cómo yo! q me mudo a 60 km de mi ciudad de toda la vida! no te imaginas el lío q hay en mi casa… con decirte que por momentos a Felipe lo pierdo de vista entre tanto bulto! Me da miedo embalarlo sin darme cuenta, jaja.
    Beso grande!

  5. Muy chulo, pero esto me plantea una duda, ¿por qué 999 y no 1000? :mrgreen:

  6. Juana de Arco

    Este diseño me encanta :aplauso:

  7. La inquietud por mejorar siempre es admirable. Enhorabuena.

  8. Me alegro de que os guste. 😉 ¿No hay nada que os parezca mejorable? Bienvenidas sean las sugerencias. 🙂

  9. Bueno. El fondo negro es tu identificación, tantas estrellas tiene más del titulo de tu blog, sobretodo si tú estás ubicado en la esquina superior izquierda 😛
    Pienso que cualquier «sugerencia» de nuestra parte, ya no tendría tu personalidad al 100%. 😀

  10. Enhorabuena, muy, muy bonita. Aunque yo también me quedo con la duda: ¿999? ¡Cachis!

  11. «¿por qué 999 y no 1000?», «¿999? ¡Cachis!»

    ¿Habeis contado al sol como una estrella más? 😀

  12. Lo de los 999 píxeles de ancho tiene una explicación técnica. Las pantallas con una resolución de 1024 píxeles de ancho siguen siendo las más habituales. Los principales navegadores tienen barras de desplazamiento que varían entre los 13 y los 17 píxeles de ancho. A eso hay que añadir los bordes de los navegadores: entre 0 y 4 píxeles según el navegador. Si sumamos la barra de desplazamiento más ancha y los bordes del navegador con más borde obtenemos 25 píxeles. Si a los 1024 píxeles de resolución les restamos esos 25, nos quedamos en 999.

    Precisamente ésa es la medida que tienen hoy de ancho la mayoría de los diarios digitales. Y como veis, no es una medida caprichosa. 😉

  13. Casi siempre he seguido tus publicaciones sobre logos, tema que siempre me ha interesado mucho, y mira por donde, ahora leo algo sobre tu propio logo.

    Me gusta por la simplificación y porque, como las multinacionales, haces un cambio no muy brusco de imagen para que se te siga reconociendo.

    Te felicito.

  14. Precisamente Epiro, no soy muy amigo de los cambios drásticos de imagen por lo que apuntas. Si uno tiene una imagen consolidada, cambiarla por completo y sin guardar ninguna continuidad con la imagen previa lo que genera es una pérdida de imagen de marca. Además, eso puede lanzar una impresión de falta de seguridad y de escasa consolidación del titular de la imagen. Creo que en esto es mejor ir evolucionando poco a poco que cambiar un logotipo de arriba a abajo de un día para otro. 😉

    Eso sí, a ver si algún día escribo un poco más sobre el origen del logotipo. Te sorprendería como lo representé por primera vez: era parte de un escudo élfico que diseñé para esta web:
    http://personal.telefonica.terra.es/web/noitedia/elentir/

    Inicialmente lo representaba en color azul y amarillo anaranjado. Después lo simplifiqué bastante y lo pasé a blanco y negro.

  15. ¡Gracias por la explicación pixelera!

  16. doiraje

    Yo no entiendo mucho de esto (es más, soy un completo desastre en todo lo que tenga que ver con la informática), pero me resulta evidente que Contando Estrelas es quizá el blog más estéticamente elegante y pulcro que conozco.

  17. Muchas gracias, Doiraje, pero te aseguro que los hay mejores. 😉

  18. El diseño élfico te quedó perfecto, no me imaginaba que fuera ese el origen de tu logotipo 🙂 .

  19. boccheron

    Es elogiable tu afán por mejorar continuamente.

    Yo tengo un monitor de 24″, 16:10, 1920×1200 y utilizo el navegador Opera a poco más de media pantalla. He notado que hay un margen gris a la derecha -no recuerdo si estaba antes del nuevo diseño- que hace que aparezca barra de desplazamiento horizontal. No sé si me he explicado.

    ¿Podrías poner sindicación podcast en tu canal de Youtube?

    Gracias.

    Dejo enlace de un vídeo que me ha gustado mucho visto en un blog que sigo:

    http://www.alpoma.net/tecob/?p=6008

  20. Samuel, aquella fue fue una obra de artesanía. El Flash de cabecera era una pasada. Ah, qué tiempos aquellos en los que tenía tiempo de sobra para recrearme en una web…

    Boccheron, Opera es -con mucha diferencia- el navegador que da más problemas de compatibilidad. Por ejemplo, en Opera no salen los fondos del body del blog. A ver si encuentro la forma de resolverlo. Eso sí, no encuentro el margen gris que comentas, ¿me podrías detallar un poco más el fallo a ver si consigo localizarlo? Por otra parte, lo de la sindicación de podcast en el canal de Youtube, ¿dónde se activa? No encuentro nada de eso… ¿?

    Muy bueno el vídeo. Tecnología Obsoleta es uno de mis blogs favoritos, os lo recomiendo a todos.

  21. Tendré que acostumbrarme… tanto tiempo con el anterior diseño…

  22. Estaría encantado de leer esos orígenes Elentir. Un saludo.

  23. boccheron

    Efectivamente, Opera da muchos problemas de compatibilidad. Yo lo uso para navegar a diario, pero para mirar correo, bancos, dar datos personales… utilizo el Firefox y, últimamente, el Chrome.

    Lo que me gusta de Opera es la rapidez, altísima personalización, gestos de ratón, teclas rápidas, el panel lateral de favoritos, historial, rss, descargas… aparte de que tiene lector de podcast. Además, tiene algo que ningún otro navegador tiene: en blogs, canales de youtube, etc. que no tienen botón de sindicación, aparece en la barra de direcciones un botón que te permite acceder al rss o atom; lo puedes comprobar, por ejemplo, en el canal de youtube de Libertad Digital.

    Lo del body del blog no sé que es, tu blog lo veo igual en cualquier navegador.

    Lo del margen supongo creo que es la delimitación de la anchura del blog. Lo curioso es que con el navegador a pantalla completa ese margen aparece a ambos lados, manteniendo en el centro la anchura normal del blog; con pantalla minimizada, ese margen aparece siempre a la derecha, es decir, dando a la ventana del navegador la anchura exacta del blog, no debería aparecer la barra de desplazamiento horizontal, pero sí aparece.

    Gracias y un saludo.

  24. Debes estar viendo el nuevo marco del blog. ¿Qué dimensiones tiene tu navegador cuando lo minimizas?

  25. boccheron

    El monitor es de 24″, 16:10, 1920×1200; Windows 7; el navegador lo pongo a media pantalla, el blog es más ancho, no cabe y el navegador coloca barra de desplazamiento horizontal; estiro el navegador hasta ajustarlo a la anchura exacta del blog (fondo blanco), lógicamente, al igualar la anchura de blog y navegador, la barra debería dejar de ser necesaria, pero no desaparece hasta estirar un poco más.

    Es una chorrada, pero ya tengo curiosidad.

  26. Eso posiblemente se deba al fondo del blog. Tengo que hacer pruebas, pero bueno, en un pantallón (qué envidia me das) que ocurra esto no es problema. 😉

  27. Anda, pues qué curioso, lo de los 1024 me lo imaginaba, pero no sabía que había que quitarle 25 pixeles para tantas cosas.

    Por cierto, Boccheron, también tengo una pantalla de 24″ a 1920 x 1200, en mi caso un iMac, y utilizo un javascript para redimensionar las ventanas, aunque ahora hay unas cuantas extensiones para Safari y Chrome que te permiten cambiar con un clic el tamaño de las ventanas.

Opina sobre esta entrada:

Debes iniciar sesión para comentar. Pulsa aquí para iniciar sesión. Si aún no te has registrado, pulsa aquí para registrarte.