Éste blog funciona bajo WordPress 2.3.3. y el actual tema se llama HedKandi. Todo el proceso, desde la conceptualización, la diagramación, el dibujo, la maquetación en CSS + XHTML y la puesta en marcha del blog como tal para que funcionara en WordPress fueron hechos completamente por mi.
1. El Concepto y la Diagramación
El concepto inicial, parte de un estilo al cual llamo estilo retro-disco que se ve influenciado por los colores fuertes, los contrastes y las formas básicas con un toque retro de los años 70, todo ello mezclandolo con elementos que acompañan el diseño y refuerzan éstos conceptos. Para la parte central del diseño que es el header hice una ilustración sencilla, en la cual sólo se resaltan los accesorios y las texturas, para ello utilicé Flash CS3.
Después añadí algunas brushes en Photoshop CS2 y los fondos y las estrellas las hice finalmente en Fireworks CS3.
La diagramación la hice completamente en Fireworks CS3, primero hice la base general donde están el header, el contenido de los post y el sidebar, más adelante seguí puliendo diversos detalles como la forma en que se verían los comentarios, los gravatares, el footer y la parte inferior donde se muestran los Post Recientes.
Para finalizar agregué ciertos detalles a la forma en que muestro cierto contenido como en el sidebar, donde agregue una imágen específica para mi Portafolio y otra para mi galería en DeviantArt, además creé un background para el recuadro donde se muestra el estado actual de la Luna y una imágen inferior alusiva al theme como tal.
2. Maquetación en CSS y XHTML
La maquetación la hice completamente en CSS y XHTML, para ello me valí del Dreamweaver CS3, pero más que todo, porque estoy acostumbrada a él y para completar algunas líneas de código. Hice un documento inicial con la previsualización de todo el tema, añadiendo todos los elementos básicos como si fuera una página completa. Utilicé un sólo documento CSS y afortunadamente no tuve que hacer ningún hack especial para que se viera bien en IE y por lo que he probado hasta ahora, se ve bien en todos los navegadores.
El diseño está hecho para verse a una resolución igual o mayor a 1024 x 768, por eso extendí el fondo oscuro y el footer para que abarcaran todo el ancho de la pantalla y el resto de contenido lo centré.
3. El theme para WordPress
Anteriormente ya había hecho varios themes para WordPress, la mayoría de ellos sin ningúna cuestión extraña, eran muy sencillos, pero a éste decidí agregarle algunas cosas extra para mejorar la forma en que se muestra la información. El primer cambio fue hacer en la parte inferior un bloque que contiene los 6 últimos post aparte del post de la portada, para ello utilicé el excerpt y acomodé un código que había usado previamente para otro proyecto que tiene algo similar.
Debido al cambio anterior y para que todo funcionara mejor tuve que crear varios templates para que el contenido se mostrara correctamente y no en la parte inferior que acababa de construir. Además organicé el contendio de una forma diferente a como la tenía en el tema anterior así que dejé en el menú superior la sección: About, que es en la que estás actualmente, la del Archivo que se muestra por categorias o mensualmente y una Nube de Tags.
También agregué en el sidebar una sección donde se ven los últimos comentarios para lo cual usé el plugin: Get Recent Comments y los links los puse de tal forma que no se muestran completos sino que se despliegan hacia abajo, para ello utilicé un pequeño script de Candyscript llamado Minikit-Accordion.
Los plugins que utilizo actualmente en mi blog son: Akismet para todo el spam que llega diariamente, Get Recent Comments para poner los últimos comentarios en el sidebar, Gravatar para poder poner los gravatares en la sección de comentarios, Maintenance Mode para cuando el blog está fuera de servicio por fallas técnicas o cuando se hace el cambio de la versión de WordPress, Pop Stats para las estadísticas de cuánta gente visita el blog y los hits obtenidos, SpotMilk para darle una apariencia más cool al panel de control de WordPress y Vid4Zrza un plugin especial que me hizo Lunatic para mi anterior blog y que sirve para darle un estilo especial a los videos de youtube.
Para todo el proceso de realización del theme me apoyé muchisimo en la documentación de WordPress la cual fue de mucha ayuda.
4. Créditos
Para la realización de éste theme y en mi blog utilicé los siguientes recursos:
Brushes
Ewanism: Retro Brushes 2 by Ewanism
Texturas
Retro Prints by Pinkandfluffy
Scripts
Minikit by Candyscript
Plugins
Akismet by Matt Mullenweg.
Get Recent Comments by Krischan Jodies
Gravatar by Tom Werner
Maintenance Mode by Michael Woehrer
PopStats by Luis Sancho
Random Posts by Rob Marsh, SJ.
SpotMilk by Sunghwa Park
Vid4Zrza by Juan Manuel Luna
Yazmin Marichi dice:
April 16th, 2008
Hola Zarza! alguna vez te había escrito porque soy diseñadora gráfica y super fanatica del scrapbooking, de hecho doy clases de eso aqui en la ciudad de Mexico.
Me parece super de tu parte que compartas los recursos que utilizas y toda tu justificación de diseño tan bien planteada, Felicidades ! ! !
Me gustaría mucho entrar en contacto contigo fijate que tengo algunas preguntas que hacerte, yo tambien soy diseñadora grafica, y ultimamente he estado un poco desconectada de varios temas que me parece manejas a la perfeccion, si no es mucha molestia me gustaria saber a donde te puedo escribir para poder ponerme en contacto contigo, te lo agradeceria muchisimo !
Saludos y felicidades por tu blog, gracias por compartir !
Yaz.
Deja tu comentario. Recuerda no escribir en mayúsculas ya que cualquier comentario de ese tipo será borrado.
que alguien me rescate de esta pila de trabajo!!!! lo más seguro es que tenga...
Una respuesta en “About”