Aquí en (: HEC también gastamos una inocentada. Si alguien visitó el sitio durante el día 28 de diciembre lo vería todo al revés, “en espejo” concretamente. Así:

La verdad es que es un truco que puede conseguirse muy fácilmente con los comandos que se utilizan en CSS para dar estilo a textos de idiomas que se leen de derecha a izquierda, como el árabe, por ejemplo. Si colocáis lo siguiente en vuestra hoja de estilo, toda vuestra página aparecerá “al revés”.

* {
direction:rtl; unicode-bidi:bidi-override;
}

Por supuesto, también puede usarse style=”direction:rtl; unicode-bidi:bidi-override;” aplicado al elemento concreto que queramos modificar en la página. Así:

<p style="direction:rtl; unicode-bidi:bidi-override;">Ejemplo</p>

Producirá:

Ejemplo

Espero que os haya hecho al menos un poco de gracia.

Felices Fiestas.

La primera cuestión que se suscitó con el anuncio fue terminológica. ¿Seguimos usando el adjetivo “canónico” o usamos otro tipo “estándar”, “validado”, “central” (core), etc.?

Quizás llamarlo algo así como “certificado” sea un término que se acerca a la idea y que además puede cuajar bien entre los principiantes, pero a mí dejarlo como “canónico” no me parece mal. Aunque, ¿cuál será el proceso de convertir una extensión en canónica? ¿Canonizarla?

(Si no lo suelto reviento ).

Necesitaba crear tablas complicadas con los horarios de mi club de gimnasia para publicarlos en su sitio web, así que me puse a buscar un editor visual decente (tipo WYSIWYG) para no complicarme la vida con el código.

Tras intentar varios que no me convencieron mucho, probé el famoso Kompozer, y le tengo que agradecer el tiempo que me ha ahorrado, pues además de generar código limpio, no hay que instalar nada: se descarga, se descomprime y se usa.

La solución es bien sencilla, pero hay que indagar un poco en PHP.net:

Puede prevenir que un caracter reconocido en la cadena de formato sea expandido escapándolo con una barra invertida. Si el caracter con una barra invertida es una secuencia especial, puede que necesite escapar también la barra invertida.

De esta manera:

<?php
// imprime algo del tipo: lunes, 6 de abril de 2009
echo date(“j, d \\d\e F \\d\e Y”);
?>

En WordPress puede hacerse usando:

<?php the_time(‘l, j \\d\e F \\d\e Y’) ?>

Que es el código que utilizo para mostrar la fecha en esta bitácora.

He visto que en algunos sitios se ofrece la posiblidad:

Publicado el <?php the_time(’l'); ?>, <?php the_time(’j'); ?> de <?php the_time(’F'); ?> de <?php the_time(’Y'); ?>

Es lo que se me ocurrió hacer la primera vez que necesité ese formato, pero me parece que es complicarse la vida demasiado cuando PHP suele tener soluciones bastante sencillas. Y en efecto: puede hacerse simplemente con ese par de líneas que os comento.

¡Espero que os sirva!

Mientras tanto, si alguien necesita servicios de traducción, redacción de contenidos o edición de páginas web, estoy disponible. Más información: Traduxnet C.B. (mi empresita) y mi perfil en LinkedIn.

Ya que predico, que sea con el ejemplo. Yo he pagado 6 EUR por artículo a un amigo por su colaboración en uno de mis sitios, y me siento mal por no haber podido darle más.

Ante esto quiero manifestar mi buena experiencia con Maestros del Web en los años 2006 y 2007: un entorno amigable, bastante libertad a la hora de redactar y, ahora puedo apreciarlo como se merece, bien pagado.

Hace un año y medio seguí el Curso online de diseño de webs eficaces (3ª edición) organizado por la Universidad de Murcia. Entre los profesores estaba Imma Bermejo, de Chavalina.net.

Para la evaluación del curso nos propusieron varios ejercicios y nosotros teníamos que realizar uno. Yo elegí construir un sitio web que cumpliese los estándares relacionados con la usabilidad y la accesibilidad.

Aprendí mucho construyéndolo y como por lo visto el material es aprovechable, publico aquí el resultado final para que sirva de inspiración o ilustración a quien le interese el tema. No obstante, he observado cosas que aún podrían mejorarse, así que lo revisaré y mejoraré en cuanto pueda.

Se trata del sitio web final, con los contenidos requeridos en el ejercicio, pero al que añadí una sección “créditos” para explicar cómo y con qué lo construí.

He aquí el enlace.
Sitio web usable y accesible

Descargar:
También pongo a vuestra disposición el código fuente, pero si usáis algo de él, no olvidéis dar crédito a quien corresponda:
Plantilla XHTML CSS usable y accesible

Por favor, no me fusiléis el sitio entero y luego vayáis diciendo por ahí que lo habéis hecho vosotros (no está tan bien como para presumir ).

En muchos páginas web se explica el código que se puede usar en su lugar para que el sitio donde queráis incluir vídeos de YouTube sí pase la validación del Markup Validation Service del W3C, este es el que yo utilizo.

Atención: cambiad únicamente las partes en negrita por el código del vídeo de YouTube, la parte que va tras watch?v= en la URL del vídeo, también podéis cambiar el tamaño de la ventana del vídeo. En este código se incluye también la URL del vídeo para que si alguien está suscrito a las entradas y lee la nota como un correo electrónico, por ejemplo, pueda ver al menos la dirección a la que debe ir para ver el vídeo.

<object type="application/x-shockwave-flash" style="width:425px; height:350px;" data="http://www.youtube.com/v/yOOmFgBAdIA"><param name="movie" value="http://www.youtube.com/v/yOOmFgBAdIA" />http://www.youtube.com/watch?v=yOOmFgBAdIA</object>

Pero si tenéis un clon de YouTube o archivos .flv procedentes de otros sitios, el código anterior no suele servir de mucho: esta es la solución que a mí me ha funcionado. Cambiad las partes con “elsitioencuestion.ext” con vuestro dominio y video.flv con el nombre del archivo, quizás tengáis también que arreglar la URL para mostrar la ruta exacta del archivo. Podéis cambiar el tamaño, añadir un logotipo con un enlace, lo veréis en el código.

Atención: la parte en negrita debe ir sin espacios, en una sola línea, aquí tuve que hacer cortes para que se viera bien en la página:

<object type="application/x-shockwave-flash" data="http://www.elsitioencuestion.ext/flvplayer.swf" width="425" height="355" id="VideoPlayback"><param name="movie" value="http://www.elsitioencuestion.ext/flvplayer.swf" /><param name="allowScriptAcess" value="sameDomain" /><param name="quality" value="best" /><param name="bgcolor" value="#000000" /><param name="scale" value="noScale" /><param name="salign" value="TL" /><param name="FlashVars" value="&amp;file=http://www.elsitioencuestion.ext/video.flv&amp;
width=450&amp;height=425&amp;displaywidth=355&amp;
displayheight=367&amp;overstretch=true&amp;
autostart=false&amp;showfsbutton=false&amp;
logo=http://www.elsitioencuestion.ext/logo.ext&amp;
link=http://www.elsitioencuestion.ext&amp;
linktarget=_blank&amp;
backcolor=0xFFFFFF" /></object>

Para WordPress, el plugin más extendido es WP-LaTeX.

En cuanto a otras plataformas, a partir de una consulta en los comentarios de la otra entrada, he descubierto cómo integrar LaTeX en Blogger a través de una nota que publicó Víctor Álvarez en su blog.

En el artículo de LaTeX en la Wikipedia, nos proporcionan algunos recursos sobre LaTeX, entre los que destaca la lista de símbolos de LaTeX, para no perdernos demasiado.

Espero que le ayude a alguien.

WCAG 10.4: Hasta que las aplicaciones de usuario manejen correctamente los controles vacíos, incluya caracteres por omisión en los campos de edición y áreas de texto. (Prioridad 3).

Según esto, todos los campos de edición y áreas de texto deben contener algún caracter porque existen ayudas técnicas que no pueden poner el foco en los controles vacíos.

Si nos interesa cumplir con todas las pautas pero no queremos que se vea por defecto ningún caracter y estamos desesperados porque el truco de colocar &nbsp; no nos funciona, he aquí una solución.

Una manera de incluir textos por defecto (y así cumplir con los estándares de accesibilidad) y al mismo tiempo evitar que sea un engorro para el visitante borrar el texto por defecto para introducir sus propios datos es utilizar JavaScript siguiendo la propuesta de HTML Source.

Lo que viene a decir es que, para conseguirlo, no hay más que descargar dos archivos .js: util-functions.js y clear-default-text.js

Luego, “llamamos” a esos archivos desde la cabecera de nuestro sitio (entre las etiquetas <head>):

<script type="text/javascript" src="util-functions.js"></script>
<script type="text/javascript" src="clear-default-text.js"></script>

Y luego, asociar la clase “cleardefault” a cada campo del formulario:

<input type="text" name="date" value="yy-mm-dd" class="cleardefault" />

Aunque se deshabilite JavaScript el sitio seguirá siendo usable, aunque no se borrarán los valores por defecto al colocar el cursor sobre ellos.

Espero que pueda ayudaros.