Archivo categoría Lenguajes de Marcado
Lenguaje Sass. El CSS 2.0
Por Scipion - CSS, Lenguajes de Marcado - 9 Febrero 2010
Me he encontrado con el lenguaje SASS. Según sus autores hace el CSS fácil y divertido. Es como si un monton de diseñadores artos de algunas cosas de CSS se hubiesen puesto a programar, y esto es lo que ha salido.
Sass es un meta-lenguaje que está sobre CSS que se utiliza para describir el estilo de un documento de forma limpia y estructurada, con más potencia que que la que permite CSS plano.
Sass, proporciona una sencilla sintaxis más elegante para CSS e implementa varias características que son útiles para crear hojas de estilo manejable.
Dan algunos ejemplos de la sintaxis en comparación con el CSS tradicional y parece bastante lógico el haber implementado el lenguaje.
Embellecimiento:
// Sass h1 height: 118px margin-top: 1em .tagline font-size: 26px text-align: right |
/* CSS */
h1 {
height: 118px;
margin-top: 1em;
}
.tagline {
font-size: 26px;
text-align: right;
}
|
Anidación:
// Sass
table.hl
margin: 2em 0
td.ln
text-align: right
li
font:
family: serif
weight: bold
size: 1.2em
|
/* CSS */
table.hl {
margin: 2em 0;
}
table.hl td.ln {
text-align: right;
}
li {
font-family: serif;
font-weight: bold;
font-size: 1.2em;
}
|
Variables:
// Sass !blue = #3bbfce !margin = 16px .content_navigation border-color = !blue color = !blue - #111 .border padding = !margin / 2 margin = !margin / 2 border-color = !blue |
/* CSS */
.content_navigation {
border-color: #3bbfce;
color: #2aaebd;
}
.border {
padding: 8px;
margin: 8px;
border-color: #3bbfce;
}
|
Mixins:
// Sass
=table-scaffolding
th
text-align: center
font-weight: bold
td, th
padding: 2px
=left(!dist)
float: left
margin-left = !dist
#data
+left(10px)
+table-scaffolding
|
/* CSS */
#data {
float: left;
margin-left: 10px;
}
#data th {
text-align: center;
font-weight: bold;
}
#data td, #data th {
padding: 2px;
}
|
Aunque no tiene muchas entradas, pero para más información el blog de SASS. Tambien está muy bien su proyecto hermano de nombre HALM que hace cosas similares pero para html/xhtml.
Funciona sobre Ruby y está licenciado con la MIT con lo cual es software libre y código abierto.
Interesante para proyectos donde el diseño tenga mucha relevancia que hoy en día son muchos.
Los videos de HTML 5 y el factor X
Por Scipion - General, Lenguajes de Marcado, Web - 6 Febrero 2010
La dichosa etiqueta <video> está dando que hablar mucho en la blogosfera sobre la nueva versión de nuestro lenguaje de marcado favorito.
Más interesante que la especificación de la etiqueta es el twitter de HTML5 (sí, ahora todo tiente twitter) para ver si dicen algo del video.
La cosá está en que la etiqueta <object> no va a desaparecer del “mercado”. Claro, que harían con todos los videos flash que ya están macados como objects, no se puede reescribir todo de repente. Y a demas están todos los juegecillos flash (y en otras tecnologías como silverlight/moonlight y JavaFX) que hay y que habrá, eso no son videos ni audios, son … objetos.
Pero la polemica con que el iPad no soporte flash es lo que reaviva el tema. Tenemos a las empresas que tienen formatos de video propietario, como Adobe y Microsoft que quieren se sea el suyo, está claro. Por otro lado la comunidad que quiere que se utilice el estandar OGG que para eso está y es libre. Por otro lado aparece el ya famoso driver h.264 que es el driver con el que Google ha implementado el HTML5 de YouTube, pero por lo visto Apple tiene patentes por ahí, así que tiene metida la mano en ese formato una empresa privada.
Pero no es Apple una empresa más malevola que Adobe, las dos son eso, empresas y por lo tanto su mayor prioridad es ganar dinero y es por eso que “barren para casa”. La voluntad de la industria y no la de las empresas particulares es la de ir hacia algo abierto. Es por eso que ya se habla de la muerte de Flash, y es curioso porque nadie habla de la muerte de JavaFX o de la muerte de Silverlight cuando al rededor del 95% de los PCs tiene instalada una maquina virtual de Flash y la cuota de mercado de sus competidores es bajisima (porque JavaFX corre sobre una JVM SE que aun aun, pero Silverlight … :S ).
¿Es la muerte de Flash la nueva etiqueta video? Pues es lo que dicen muchos, que si es cerrado, hace falta maquina virtual a parte, dependes de Adobe, y para elegir a Adobe porqué no elegir a otro que mejora X.
Esos son los argumentos en contra y a favor tiene que la maquina virtual a parte, bueno, ya la tienen casi todos, dependes de Adobe, bueno pero mejor malo conocido que bueno por conocer, que no es libre … ¿Con que sistema operativo y navegador estas leyendo este post?
Lo que tiene a favor Falsh es la primera ley del marqueting: “Es mejor ser el primero que ser el mejor“. Bueno no se si es la primera ley, pero desde luego es importante. A demás el factor de apoyo que tiene flash es el mismo que tenía el VHS contra el BETA, el mismo que hizo que el Blue Ray luchara duro y ganara la batalla contra el HD-DVD. Ese es el factor Porno. Las webs de video streaming porno usan flash AHORA, son ellas las que tendrian que cambiar para que otro formato tuviese fuerza de verdad. Es el Porno lo que tira de internet y no Google como parece. Esó dá para un buen debate también.
De todos modos aun queda tiempo para ver cómo se decide el vencedor de esta guerra que va a seguir generando polemicas.
Wikitexto, otro lenguaje de marcado
Por Scipion - Lenguajes de Marcado, Web 2.0 - 5 Enero 2010
El wikitexto es un lenguaje de marcado como el HTML o el XML pero solamente se usa en los wikis para darle un formato al texto y que no sea simplemente texto plano.
Lo define la wikimedia fundation. A pesar de que no existe un estandar del wikitexto (no existe el estandar que no la iniciativa de hacerlo) muchas veces se toma como referencia el que usa la wikipedia que define wikimedia (diferenciar entre P y M 
).
Y tu ¿cueces o enriqueces?
Las caracteristicas hace que enriquezca en texto que se tiene. Es un sistema bastante sencillo y está completamente orientado a generar páginas web (que en definitiva son texto enriquecido).
Para que al lector le aparezca un texto en negrita el texto original debe aparecer entre tres comillas simples -> ”’negrita”’ = negrita
Para que aparezca el texto en cursiva (italic) el texto tiene que estar entrecomillado con dos comillas simples -> ”cursiva” = cursiva
Y para que aparezca en cursiva y negrita … la respuesta es obvia, hay que entrecomillarlo con cinco (3+2=5) comillas simples -> ””’cursiva y negrita””’ = cursiva y negrita
Esto es un ejemplo muy sencillo existe practicamente todo tipo de listas, enlaces y otras cosas similares al HTML pero en general de forma más intuitiva que el HTML para que quien no lo conozcan puedan darle un formato de wiki al documento que estén escribiendo, o al menos esa es la intención.
Si quieres profundizar más en el tema en wikipedia.org tienes articulos que lo describen muy bien, concretamente este es interesante porque describe las ambiguedades que pueden haber.
Interpretar o compilar
Cuando generamos un wikitexto este es almacenado tal cual en la wikipeda (o el wiki que sea) sin borrar el anterior por si fuese necesario revertir los cambios. Pero a la hora de leer esa informacion de la base de datos es necesario reinterpretar el wikitexto y mostrarlo en HTML, ya que al fin y al cabo el usuario que quiere ver la página web tiene un interprete de HTML (el navegador).
De la tarea de generar HTML correcto a partir de wikitexto se ocupa un wikiparser.
Un parser o en castellano un “analizador sintactico” es una parte de un compilador que se ocupa de transformar el código fuente de un programa y generar el código maquina (código binario) que será ejecutado por el ordenador.
En el caso de un wikiparser no genera un programa, genera otro texto. Para el caso de la wikipedia es HTML. Pero ¿puede ser otro lenguaje el que genere? claro, de hecho existen muchos parsers alternativos que generan XML, documentos pdf, LaTeX o lo que se quiera. Esta es una lista de parsers alternativos al de la wikimedia.
Por supuesto cualquiera puede escribir un parser y de hecho se hacen en muchos lenguajes como puedens ser Ruby, Delfy, C++, pyton, PHP o java. Algunos puenden generar varios textos de salida de formatos diferentes.
Siempre es curioso conocer otros lenguajes, en el caso del wikitexto no es un lenguaje de programación, en general muchos programadores consideran que el HTML tampoco es un lenguaje de programación, algo lógico porque no describe un algoritmo. Pero desde la parte del programador que se dedica a los procesadores del lenguaje (sean comipadores o no) no deja de ser un reto el meta-programar un programa que forma parte de una maquinaria compleja para hacerle la vida más fácil al usuario final. Me ha llamado la atención que se mencione en la especificación del wikitexto las sintaxis del BNF, EBNF y ANTLR que es estudian en la carrera, parece que al final si que se aprende algo útil.