Nuevo año, nuevo blog
Después de estar ausente un tiempo, vuelvo para enseñaros en qué he estado trabajando bastante más tiempo del que me gustaría: el rediseño del blog. ✨
Aspectos generales
Como era de esperar, no podía rediseñar el blog sin un giro de radianes. Ahora solo hay modo claro y uso un naranja como color secundario (haciendo referencia a los diseños de Dieter Rams).
He querido añadir “animaciones”, ya sabéis, efectitos, para mejorar todo el feeling. Ni tan mal, la verdad. Estoy muy contento con la tabla de contenidos, el botón para compartir en redes sociales y el botón de me gusta, que esa otra. Por fin ha llegado, como prometí en algún momento, el botón de me gusta. Todavía falta la sección de comentarios, pero eso requiere gestionar sesiones y quiero darme tiempo para hacer otros proyectos, estudiar, vivir, etc.
Como manifiesto en la página principal, busqué que el diseño fuese minimalista, útil, human-first y estético; y creo que lo he conseguido, aunque eso es cuestión de cada uno, ¿no? ¿Era necesario el botón de pronunciación? Pues no es imprescindible, pero creo que un buen diseño tiene que tener personalidad y estilo, y el botón de pronunciación aporta eso, igual que todas las animaciones que hay. Sobre todo, no quería que por intentar añadir algo chulo se empeorase la experiencia del usuario (UX first), ese era mi límite.
Botón de me gusta
Este botón me ha dado problemas serios. Al final, conseguí algo cute y gracioso que creo que no desentona con el resto de la interfaz.
Tienes hasta cinco me gusta, y por cada uno se va llenando el corazón. Cuando terminas, suelta confeti. ¡¿Qué más se puede pedir?!
Uso Astro DB y Turso para guardar los datos, y la IP (hasheada) como identificador de los usuarios sin que estos tengan que iniciar sesión. Nada de esto es nuevo; me “inspiré” (vamos a decirlo así) en Josh W. Comeau. ¿Podría ser mejor? Seguramente, tal vez usando la dirección MAC u otros métodos, ¿pero para qué darle tanta importancia a un detalle gracioso?
Markdown
Mucho CSS hay aquí, más allá de TailwindCSS, pero por culpa de Markdown. Quise que la parte más importante, los artículos, tuviera cierta identidad también, así que tocó personalizar intensamente.
Lo más problemático fue Expressive Code, más por la cantidad de opciones que por ser difícil, pero al final conseguí algo que me gustase. Sin embargo, todavía hay algo que me quema: el botón de copiar en los bloques de código. No puedo animarlo como el botón de copiar URL al final de los artículos porque crea y destruye el ícono, mientras que para animarlo (o al menos como yo lo hice) deben existir ambos íconos al mismo tiempo. ¡AAAHHH!
Aparte de CSS, para tener un buen Markdown hay que saber usar plugins de remark y rehype. Ya mencioné esto en otro artículo, pero todo el ecosistema unified es un tanto difícil de entender, y mucho más crear plugins.
Un problema que os comento, y seguro alguno ha tenido: uso Markdown cuando necesito escribir un documento rápido porque es fácil y me permite usar KaTeX. Pero no puedo pasarle un .md a un muggle y esperar que tenga un lector de Markdown, luego tengo que exportar a PDF. Pero es fácil exportar Markdown a PDF, ¿cuál es el problema? El problema es que el PDF generado es más feo que pegar a tu abuela, sin contar que cosas como las notas a pie de página o KaTeX no son nativos de Markdown. ¿Solución? Ahora tengo una web con Vite configurada para renderizar un .md, y después imprimo la web con la herramienta del navegador (en mi caso, Firefox). Como lo configuré yo, tengo los plugins que uso en Obsidian y puedo exportar sin problemas. ¿Para qué os cuento esto? Porque tengo un sueño: que las personas puedan escribir Markdown en la web, sin instalar nada ni iniciar sesión, y que puedan exportar archivos a PDF sin dificultades. Sueño con un mundo mejor, pero de momento solo es eso, un sueño.
Volviendo al rediseño.
Nuevas páginas
Ahora tengo una sección de links, nada importante, pero a mí me gusta que esté ahí.
También he añadido una página para desuscribirse del newsletter, algo que debería haber incluido antes. Bueno, mejor tarde que nunca.
Respecto al newsletter, es evidente que prácticamente nadie se suscribe, igual que prácticamente nadie lee esto. ¡Pero a mí me gusta tenerlo!
También enlazo mi portfolio, aunque ya ha pasado tiempo y ya no me convence. No voy a rediseñarlo porque tardaría una barbaridad en hacerlo. Al menos estoy contento con la sección Personal, aunque a veces la primera carga sale rara en algunos navegadores. ¯_(ツ)_/¯
Sobre los artículos
He eliminado algunos artículos, y eso va a ser algo habitual, pues poco a poco iré descartándolos o actualizándolos. No voy cumpliendo con lo de un artículo al mes, pero es porque no tengo constancia. La mayoría de los últimos artículos los escribí en un día. Creo que lo mejor será intentar escribir una vez a la semana y publicar cuando las cosas estén completas.
Tal vez sea yo, pero tengo muchas cosas que hacer entre proyectos, trabajo, hobbies y estudios. Realmente debo limitarme un poco, ¡porque al final no acabo nada!
Este es un tema común, sobre todo entre programadores, pero en mi caso es peor porque también hago música, toco la guitarra, dibujo, leo, hago fotos y soy un cinéfilo. ¿Qué hago con mi vida, entonces? ¡¿ME MATO O QUÉ, UNIVERSO, POR QUÉ ME HAS HECHO ASÍ?! Pero bueno, lo que queda es seguir intentando las cosas, aunque no siempre salgan bien.
Compartir en RRSS
Al final de los artículos, a la derecha de copiar URL y a la izquierda de dar corazones (dad corazoncitos a este artículo, que para algo lo he creado), hay un botón para compartir en redes sociales. Comento esto porque me siento muy orgulloso de ese botón. Tenía un sueño: un sueño en el que bla, bla, bla. Me siento orgulloso porque tal como imaginé su funcionamiento, así lo programé. Realmente me gusta y creo que es original, porque no recuerdo haberlo visto en otra parte. ¿Estaré innovando? ¡¿ESTARÉ ACASO REVOLUCIONANDO EL DESARROLLO WEB?! Pues tal vez sí, quién sabe.
Logo
Nuevo logo y todo eso. El motivo es simple: el anterior no pegaba con el nuevo estilo de la página. Además, ya no me gustaba.
Este nuevo logo tiene un problema: no funciona muy bien en reducciones. ¿Importante? Sí, pero fue para salir del aprieto, y al menos no está feo.
Nuevo correo
Ahora podéis escribirme a hi@imangelo.dev. Uso Forward Email, un servicio de redirección de correos gratis y open-source. Yo solo necesitaba que fuera gratis, la verdad. Descubrí este servicio por una nota de Antfu sobre los dominios de correos. Parece que funciona, y mientras mi cuenta bancaria no se desangre, yo estaré contento.
Poco más, en realidad. Podría hablar más sobre cuestiones técnicas o de diseño, pero realmente la parte técnica da igual porque podéis visitar el repositorio de la web. Respecto al diseño… Creo que hablaré largo y tendido sobre eso en otro artículo, así que nada.
¡Hasta la vista, cowboy del espacio!