Escribiendo con Markdown

Hubo un tiempo en el que hacer una página Web o un blog era terreno exclusivo de personal especializado en el Lenguaje de Marcado de Hipertexto (html). Ahora es posible usar servicios como WordPress o Blogger que ofrecen un editor de texto integrado.

¿Qué pasa si se trabaja en una historia para publicar pero no se está conectado a la red? Para quien no conozca o no le interesa aprender las etiquetas del html, existe una solución: Markdown, una sintaxis similar a la usada en los viejos tiempos de las máquinas de escribir.

El Markdown utilizado en WordPress es una variante llamada Markdown Extra que permite fácilmente mezclar etiquetas de HTML con Markdown, para quienes quieran ir más allá de publicar una simple  cuartilla de texto.

Si quieres empezar a usarlo, descarga e imprime el siguiente archivo, que he traducido al español:

Sintaxis de Markdown.pdf

La forma de usar esta sintaxis es escribir como normalmente lo hacemos. Para tareas más complejas como agregar una imagen o un vínculo de hipertexto, se usa una nomenclatura que podemos memorizar sin dificultad. Por ejemplo, para una lista ordenada se escribe un número, punto, espacio y la descripción. No importa que cada línea empiece con el mismo número, el resultado final tendrá el orden correcto:

  1. Idea
  2. Sinopsis
  3. Guión literario
  4. Guión técnico
  5. Storyboard
  6. Desarrollo de personajes
  7. Escenarios

Por otra parte, para una lista no numerada empezamos cada línea con un asterisco.

  • Cámara.
  • Objetivo gran angular.
  • Telefoto.
  • Tripié.
  • Batería de repuesto.
  • Cargador.

Para ver la lista completa de Markdown, es mejor dirigirse a la página de su creador, John Gruber: Daring Fireball

HTML5 y CSS

La opción más amigable que he encontrada para aprender a programar en HTML5, CSS y JavaScript es el sitio codeacademy.com que tiene la ventaja de ofrecer estos cursos gratuitos en español. Bueno, más bien en argentino, pues quien hizo el favor de ofrecer la traducción es un amable vecino del cono sur muy nacionalista que se negó a usar un español neutro. Con todo, se pueden entender sin mayor problema las explicaciones.

codeacademy

La gran ventaja que ofrece este sitio reside en la interfaz al usuario, que contiene tres elementos: a la izquierda está una explicación del ejercicio a seguir, la parte central es el entorno de programación , y tiene una pequeña ventana (que se puede maximizar) para ver el resultado.

El curso está dividido en pequeños pasos que se deben ir completando para acceder al siguiente. Los avances hechos en una sesión son guardados, así que la siguiente vez puedes continuar en donde te quedaste, y de ahí continuar hasta terminar el curso.

Para usar el sitio deberás registrarte, lo cual puedes hacer con tu cuenta de Facebook o Google. También puedes hacerlo llenando el formulario de registro. Una vez hecho, tendrás la opción de elegir varios de los cursos disponibles, entre ellos HTML y CSS, que es donde te sugiero que empieces.

MarkDown

MarkDown es un código para escribir páginas web sin necesidad de aprender las etiquetas de html, razón por la cual es ideal para quienes su oficio es escribir artículos y no diseñar páginas Web.

Su sintaxis es parecida a la usada en el correo electrónico, como el uso del signo > para marcar un texto citado. Para indicar una frase importante, como puede ser el encabezado de un artículo, se usa el signo de almohadilla (#), y  los items de una lista se indican con un guión o un signo de más (+). Otros pocos símbolos con significado especial son aprendidos fácilmente, y al final se copia la traducción a html que hizo el programa, para pegarla en una página Web o blog.

Un editor de MarkDown  como app para Google Chrome presentará la página dividida en dos partes: a la izquierda escribes en MarkDown y al lado derecho tienes la visualización como página html.

Tutorial usando XnView

XnView ws un programa gratuito para visualizar diferentes formatos de imagen. Una de las opciones que tiene es hacer capturas de pantalla para con éstas realizar un tutorial.

 

Por ejemplo, para explicar dónde hacer el cambio de codificación a UTF-8 de un archivo de texto en Bloc de Notas, esta imagen muestra la ubicación de ésta codificación.

Para generar videos se uasrá el software CamStudio.

 

Probando Windows Live Writer.

WordPress es un excelente blog, pero su interfaz para crear nuevas entradas es bastante incómodo, con una ventana pequeña que no he logrado maximizar.

La edición de las entradas en html son otro dolor de cabeza, pues utiliza código propietario que hace suposiciones bastante alejadas a lo que quiero hacer, por lo que buscando alternativas de editores de blog encontré que sugerían Windows Live Writer. Sucede que éste editor ya lo tenía desde hace meses, pero no me imaginaba para qué servía, pues si bien tengo un blog desde hace años en blogger, sólo lo estuve toqueteando dos o tres veces sin encontrarle un uso práctico en ese entonces.

Sin embargo, durante el intersemestral tomé un curso que me hizo ver otras posibilidades a este medio de comunicación, más allá del que le dio origen, a saber, funcionar como un diario personal abierto al mundo. La posibilidad de publicar entradas de manera inmediata, sin la necesidad de todos los pasos previos que se requieren para hacer un sitio Web, es realmente atractiva. Y no que ignore cómo hacer un sitio web, a fin de cuentas soy diseñador gráfico, por lo que se el trabajo que eso representa.

Por supuesto que el blog tiene restricciones, algunas bastante incómodas, como es limitar los tipos de archivo que permiten subir a sólo imágenes y documentos de Word o pdf. Claro que se le puede dar la vuelta a este problema usando otros servicios en línea o comprando espacio en un servidor para alojar esa información y ofrecer los vínculos, porque no permite la incrustación de esos archivos.

The Windows Live Writer logo.

Image via Wikipedia

En fin, me extendí en ésta explicación sólo para probar WLW y su capacidad para enviar la información a WordPress desde mi computadora de escritorio. Probaré también con tumblr y posterous para conocer las posibilidades de esos otros servicios.

 Agregué un plugin para WLW que en teoría permite insertar archivos, por lo que estoy probando con un pdf de ayuda en HTML:  HTML Help Sheet 02

Ya publicado, noté que el este plugin no funciona, el attachment tuve que realizarlo directamente en WordPress.

Siguiendo con Hojas de Estilo en Cascada.

En este momento es ya una necesidad el uso de CSS (Cascade Style Sheets) para diseñar un sitio. De esta manera se separa el contenido, que permanece en el documento HTML, del diseño que ahora se puede concentrar en un documento por separado. La gran ventaja está en el momento de hacer cambios, pues éstos se verán reflejados en todas las páginas que estén vinculadas al archivo que contiene los estilos, sin necesidad de editar cada una de las páginas por separado.

Aquí les dejo una presentación que explica de una manera detallada qué son y cómo se usan los Estilos en Cascada, sólo perdonen a quien hizo este trabajo por algunas faltas de ortografía.

 

 


Y ahora, XHTML y CSS

La evolución de HTML fue XHTML (ahora HTML5 buscará desbancarlo). Mientras tanto, los principios que se siguen con esta combinación aún están vigentes y los cambios hacia la siguiente etapa no serán drásticos, así que este manual será de ayuda por un buen tiempo.

Puedes leerlo en línea, a pantalla completa si quieres, o descargarlo para leerlo en tus ratos de ocio lejos de la computadora si imprimes algo que te interese en particular. El documento, gracias a Dio, y subido a Scribd por un servidor para hacerlo accesible en línea.


Empezando con HTML

Este tutorial en video explica de manera sencilla cómo empezar a escribir el código HTML desde el Block de Notas de Windows. Se puede hacee el tutorial en TextEdit de Macintosh, sólo teniendo en cuenta que al abrir un nuevo documento se debe acceder al menú Format y allí elegir Convert to Simple Text, de otra manera se salvará en formato RTF, y no se podrá visualizar como página web.

Si se prefiere leer con más calma o imprimir las instrucciones, puedes ver en línea o descargar este manual proporcionado gratuitamente con Licencia de Documentación Libre GNU, Versión 1.1 por sus autores.

Empezando con HTML

Este tutorial en video explica de manera sencilla cómo empezar a escribir el código HTML desde el Block de Notas de Windows. Se puede hacee el tutorial en TextEdit de Macintosh, sólo teniendo en cuenta que al abrir un nuevo documento se debe acceder al menú Format y allí elegir Convert to Simple Text, de otra manera se salvará en formato RTF, y no se podrá visualizar como página web.

Si se prefiere leer con más calma o imprimir las instrucciones, puedes descargar el siguiente documento en PDF, un manual de más de 400 páginas que es proporcionado gratuitamente con Licencia de Documentación Libre GNU, Versión 1.1 por sus autores:

curso-html.pdf
Download this file

 Curso html.pdf

Aprendiendo HTML

A graphical despiction of a very simple html d...

Image via Wikipedia


El HTML, Hipertext Markup Language o Lenguaje de Marcado de Hipertexto en Español, es usado para describir el contenido y la estructura de texto que será usado para difundirse en Internet, específicamente por medio del World Wide Web (WWW).

Sin duda encontrarás útil el Curso Completo de HTML escrito por Jorge Ferrer, Rodrigo Garcia y Victor García, quienes otorgan permiso para copiar, distribuir y/o modificar este documento bajo los términos de la Licencia de Documentación Libre GNU, Versión 1.1 o cualquier otra versión posterior publicada por la Free Software Foundation..
Sigue leyendo

Multimedia y Arte I

Bisonte

Algunos dicen que la Multimedia se remonta a la época de las cavernas, cuando nuestros primitivos y venerables antepasados dibujaron y colorearon las primeras escenas  en las paredes de las cavernas, para después celebrar por anticipado los buenos resultados de la cacería que tenían proyectada.

Iluminado por antorchas, se iniciaba la comida ritual aderezada con algunas especies de plantas y hongos que, en las cantidades adecuadas, podían provocar un estado de alegría y trance quizá sóo comparado en nuestros tiempos a la experiencia de una fiesta rave o el ambiente de un antro de moda.