El código fuente pulula por toda la red y yo lo he tomado de aquí:

El gurú programador: Marcas de agua automáticas con PHP y GD

Se trata de crear una imagen de marca llamada water.png, colocarla en el lugar adecuado junto con el archivo PHP que he llamado watermark.php.

Cuando llamemos a una imagen, por ejemplo imagenoriginal.jpg lo haremos a través del código php que generará una nueva imagen llamada watermark.php.jpg con la marca insertada.

La llamada a la imagen sería algo así como:

ruta/del/archivo/watermark/watermark.php?i=ruta/de/la/imagen/imagenoriginal.jpg

Si, pulsando el botón derecho, intentamos descargar esta imagen nos descargaremos en realidad watermark.php.jpg, es decir la imagen con la marca de agua insertada.

No voy a entrar en más detalles, podéis ampliar la información en el enlace original. Lo que sí voy a hacer es explicar un poco más un detalle importantísimo que creo se queda un poco en el aire.

Cuando accedéis a una imagen mediante el archivo watermark.php, podemos ver en nuestro navegador una ruta de acceso a la imagen similar a esta:

ruta/del/archivo/watermark/watermark.php?i=ruta/de/la/imagen/imagenoriginal.jpg

Si conocemos estas técnicas de protección o simplemente poseemos un poco de intuición, podríamos intentar acceder a la imagen original quitando la referencia al php que introduce la marca:

ruta/de/la/imagen/imagenoriginal.jpg

y voilá … ya tenemos la imagen original sin marcas lista para ser descargada y copiada sin permiso.

Pare evitar esto debemos prohibir el acceso directo a nuestras imágenes desde el exterior. De esta forma, sólo se podrá acceder a ellas mediante el interior, mediante las peticiones que realice nuestra web.
Y esto se hace mediante un archivo .htaccess de configuración de Apache.

Abre un editor de texto y escribe lo siguiente:
#deny all access
deny from all

Nómbralo como htaccess y súbelo al directorio de imágenes que quieres proteger. Renómbralo como .htaccess y ya está. Ahora cada vez que alguien intente acceder a tus imágenes, utilizando la ruta directa desde el navegador, obtendrá como respuesta un error 403:

Forbidden
You don’t have permission to access [...]

Si quieres saber algo más de los archivos .htaccess hay un tutorial muy bueno aquí:
http://enespanol.com.ar/2006/04/03/tutorial-de-htaccess/

Technorati Tags: htaccess

Título:

CSS, Manual Avanzado

Autores:

Andy Budd
Cameron Moll
Simon Collison

Editorial:

Anaya Multimedia

Comprado en Callao en ese sitio francés que empieza por fffffff

Technorati Tags: css

• Unidades relativas:
  • Píxeles: px . Es “relativa” puesto que el tamaño que se ve depende del tamaño del pixel de tu monitor y, por tanto de la resolución de tu pantalla. Es pues “relativa entre dispositivos”.
  • em. “Más relativa” que la anterior. 1em es la altura del tamaño de fuente del elemento en que se utiliza. Así, si definimos el ancho de un elemento con 13em,
    #mielemento {
width:13em;
}
    lo que decimos es que su ancho es 13 veces la altura de la fuente que se emplea dentro de ese div (que puede estar definida explícitamente o ser un valor heredado)
• Unidades porcentuales. No es lo mismo definir unas medidas en em, que como hemos visto se refiere a la altura de la fuente, que definirlas de forma porcentual.
  #mielemento {
width:13%;
}
  Aquí lo que decimos es que mielemento tiene una anchura del 13% de su elemento padre. Las medidas porcentuales siempre están referidas a otras medidas anteriores y no siempre al tamaño de la fuente (aunque también se pueden establecer el tamaño de las fuentes con medidas porcentuales, referidas estas al primer tamaño definido o al predeterminado).

Nunca uso unidades absolutas como pt, mm o cm

Fuentes:

• http://www.librosweb.es/css/capitulo3/unidades_de_medida.html
• http://www.ignside.net/man/css/unidades.php
• http://www.csslab.cl/2008/01/16/medidas-en-css/

Technorati Tags: css, diseño web, em

• En el diseño líquido, no predefinimos en la CSS los anchos de los contenedores, por lo que la página tiende a ocupar, como si de un líquido se tratara, todo el espacio que cada pantalla proporciona. Y esto está muy bien … hasta cierto punto. Por un lado, aprovecha todas las posibilidades en cada sistema, reduce el scroll horizontal y muestra mucha información de un solo vistazo. Pero, por otro, en grandes resoluciones el resultado puede ser desastroso, con laaaargas líneas de información incómodas de leer y un diseño de aspecto desparramado.
• En el diseño elástico, los anchos de los contenedores están definidos en em, por lo que dependen y se adaptan al tamaño de fuente elegido por el usuario. En bajas resoluciones y con el tamaño de fuente predeterminado, aparecen esas bonitas barras de scroll que tanto nos gustan

Technorati Tags: css, diseño web, elástico, líquido

Introducción

Aunque la etiqueta <object> puede ser utilizada con multitud de propósitos: desde inserción de imágenes y otras páginas web hasta applets de java y aplicaciones Python , el uso que yo le doy está básicamente limitado a la inserción de archivos multimedia: vídeos de YouTube y Google, sonidos de GoEar y algunos vídeos caseros también en formato FLV. Por eso, no es mi intención hacer aquí un trabajo teórico, ni una aportación novedosa, sino más bien una compilación útil y práctica, basada en una lectura (más o menos) atenta de las recomendaciones del W3C y ampliada, en algunos casos, con información que he ido encontrado en Internet. El objetivo no es otro que conseguir un código XHTML válido para la inserción de nuestros contenidos multimedia, que funcione correctamente en los dos navegadores más comunes (IE Y Mozilla FIrefox). En concreto, las pruebas se han llevado a cabo con IE 7 y Firefox 2.0.
Hablar de “apuntes” no es casual; lejos de ser algo terminado, esta recopilación se ha concebido para que vaya cambiando en función de las ampliaciones y correcciones que vayan surgiendo.

La etiqueta <object> y sus atributos

La etiqueta <object> es una auténtica etiqueta multipropósito que sirve para insertar todo tipo de objetos:

• imágenes; si no queremos recurrir a su etiqueta específica <img />
• applets de Java; la etiqueta applet ha sido ya depreciada en favor de <object>
• documentos HTML; en vez de utilizar marcos con iframe, aunque este método no está exento de “pegas” con IE.
• scripts de Python
• archivos multimedia; los famosos vídeos de YouTube, las músicas de GoEar, una animación flash …
• … y un largo etcétera …

Estos son algunos de sus atributos más utilizados:

• data: la localización del archivo en cuestión, es decir un URI del tipo: http://la-direccion/del/archivo/animacion.swf (swf por tratarse en el ejemplo de una animación flash). La dirección puede ser relativa, del tipo: /micarpetaflash/animación.swf.
• codebase: si la dirección URI que proporcionamos en data es relativa, puede ser complementada con una dirección de base del tipo: http://misitio.com, pero esto no es necesario si el archivo se encuentra en el mismo sitio donde se encuentra la página web en la que lo insertamos. No es correcto, según el W3C, emplear este atributo para proporcionar una dirección de descarga del plugin necesario para ver nuestro “objeto”; lo correcto en este caso, es proporcionar esta información con un texto alternativo que se vería en lugar del objeto en el caso de no tener, por ejemplo, nuestro plugin de flash instalado.
• type: el tipo MIME al que pertenece el objeto especificado en data . Con este dato le estamos diciendo al navegador de qué archivo se trata: si es, pongamos por caso, un documento HTML, un sonido en MP3 o una animación Flash (SWF). Hay que tener cuidado, ya que el tipo que pongamos aquí ha de ser, lógicamente, el mismo que el correspondiente a la extensión del archivo al que nos hemos referido en data.
  Tenéis aquí más información acerca de los tipos MIME: http://es.wikipedia.org/wiki/Multipurpose_Internet_Mail_Extensions
  Y una lista de todos los tipos MIME aceptados aquí:
  http://www.utoronto.ca/webdocs/HTMLdocs/Book/Book-3ed/appb/mimetype.html
• standby: El mensaje que aparecerá mientras se carga el objeto en el navegador.
• classid: identifica el tipo de objeto. Especifica la localización de la implementación de un objeto mediante un URI. Según el W3C, este atributo puede utilizarse junto o como alternativa a data, dependiendo del tipo de objeto. Se recomienda utilizar <param /> en su lugar.
• codetype: Este atributo especifica el tipo esperado de contenido de datos cuando se carga el objeto especificado por classid. Este atributo es opcional pero se recomienda cuando se especifica classid ya que permite que el agente de usuario evite la carga de información de tipos de contenido que no soporta.

El URI utilizado en classid puede utilizar otro esquema de nombres que el habitual en HTML que, como se sabe, comienza con “http” .

El W3C da este ejemplo:

<object codetype="application/java-archive"
classid="java:program.start">
Texto alternativo.
</object>

En el que observamos que:

1. Al emplear el atributo codetype evitamos que el navegador intente ejecutar una aplicación, proporcionada por classid, que no soporta.
2. Para insertar un aplicación java se pueden emplear nombres que empiecen por “java”.

Si quisiéramos insertar un objeto utilizando la tecnología ActiveX propietaria de MS -esto es posible en el caso de una animación Flash o un vídeo Quicktime, entre otros formatos- usaríamos el esquema de nombres “clsid”. En este otro ejemplo, el atributo data localiza los datos a representar:

<object classid="clsid:663C8FEF-1EF9-11CF-A3DB-080036F12502"
data="http://www.acme.com/ole/reloj.stm">
Esta aplicación no está soportada.
</object>

El código proporcionado aquí por classid, es el identificador único del control ActiveX requerido por nuestro objeto. Más adelante diremos algo más acerca de estos controles ActiveX.

La etiqueta <param /> y sus atributos

Funcionando como “etiqueta hija” de object, con la etiqueta <param /> se especifican una serie de valores en tiempo de ejecución que el objeto utiliza para su funcionamiento.
Dos son sus atributos más utilizados:

• name: el nombre del parámetro.
• value: el valor del parámetro.

Un ejemplo de los más sencillos:
<param name="ancho" value="50" />

Estos atributos de <param /> , sus nombres y valores, dependen exclusivamente del objeto que se quiere mostrar en el navegador, de su fabricante, de la tecnología empleada … cada objeto usará unos parámetros determinados que se supone se pondrán a disposición de los usuarios.

Inserción correcta de archivos multimedia

Veamos ahora un ejemplo práctico y muy común del uso de <object>: la inserción de vídeos de Youtube.
Éste es el código que nos proporciona YouTube para insertar sus vídeos:

<object width="425" height="350"><param name="movie" value="http://www.youtube.com/v/PN11ao9HxCI"></param><param name="wmode" value="transparent"></param>
<embed src="http://www.youtube.com/v/PN11ao9HxCI" type="application/x-shockwave-flash" wmode="transparent" width="425" height="350"></embed></object>

Lo primero que nos llama la atención es el uso de la etiqueta <embed>. Creada por Netscape, la etiqueta <embed> permitió que los navegadores pudieran mostrar contenido multimedia mediante el uso de plugins específicos para cada tipo de archivo.
<embed> no sólo puede ser utilizada con navegadores tipo Netscape y Mozilla; IE también la soporta para invocar los plugins. De hecho, éste es el código que nos proporciona Google para insertar sus vídeos:

<embed style="width:400px; height:326px;" id="VideoPlayback" type="application/x-shockwave-flash" src="http://video.google.com/googleplayer.swf?docId=1746706928639180990&hl=es" flashvars=""> </embed>

W3C ignoró el éxito de la etiqueta <embed> y creó otra mucho más potente y flexible: <object>, por lo que <embed> no pertenece al estándar HTML 4.01 y evitaremos totalmente su utilización.

Por su parte, MS ha preferido recurrir a un uso no estándar de la etiqueta <object>. Veamos un ejemplo que ilustra muy bien de qué estamos hablando. Éste es el código que proporciona GoEar para insertar sus canciones:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="366" height="75"><param name="movie" value="http://www.goear.com/files/localautoplayer.swf" /><param name="FlashVars" value="file=4241382" /><param name="quality" value="high" />
<embed src="http://www.goear.com/files/localplayer.swf" flashvars="file=4241382" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="366" height="75"></embed></object>

Como ya se ha mencionado, no es correcto utilizar codebase para proporcionar un URI de descarga de los archivos requeridos por el navegador para la reproducción de nuestro objeto y eso es precisamente lo que se hace aquí, al enlazar directamente a un archivo CAB que contiene el control ActiveX propiedad de MS.
Un archivo CAB es, en realidad, un contenedor de archivos (CABinet) que contiene los componentes reales del OCX (OLE custom control), EXE o DLL necesarios para reproducir nuestro objeto. IE utiliza la información proporcionada por classid para saber si el componente ActiveX requerido está instalado en el ordenador; si no lo está, acude a la dirección proporcionada por codebase que apunta al archivo CAB correspondiente, lo descarga e instala (previo aviso) sin tener que reiniciar el navegador.
Las consecuencias de esto van más allá de una simple discusión teórica, ya que los navegadores basados en Mozilla no soportan este uso perverso de codebase (Windows Media Player es un excepción) y lo que hacen es ignorar totalmente la existencia de nuestro objeto. Esa es la razón por la que, tanto Youtube como GoEar incluyen además un código basado en <embed> éste sí, soportado por Mozilla.

Dicho todo esto y sin utilizar <embed>, ni codebase con oscuros propósitos ( ) , una propuesta de código correcto para insertar un vídeo de Youtube en nuestras páginas podría ser la siguiente:
<object type="application/x-shockwave-flash" data="http://www.youtube.com/v/PN11ao9HxCI" width="425" height="350">
<param name="movie" value="http://www.youtube.com/v/PN11ao9HxCI" />
<param name="wmode" value="transparent" />
Esto es un vídeo de Youtube. Necesitas el plugin de Flash para visualizarlo: <a href="http://www.adobe.com/software/shockwaveplayer/">

http://www.adobe.com/software/shockwaveplayer/</a></object>

Un vídeo de Google. Probad a buscar cualquier parte del vídeo antes de que el buffering se complete; esto es posible en Google pero no en YouTube. Ya que éste último no incluye el código de tiempos entre los metadatos del vídeo FLV:

<object width="400" height="326" type="application/x-shockwave-flash" data="http://video.google.com/googleplayer.swf?docId=-1746706928639180990" ><param name="movie" value="http://video.google.com/googleplayer.swf?docId=-1746706928639180990" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="quality" value="best" />
<param name="scale" value="noScale" />
<param name="wmode" value="transparent" />
<param name="salign" value="TL" />
<param name="FlashVars" value="playerMode=embedded" />
Esto es un vídeo de GoogleVideo. Necesitas el plugin de Flash para visualizarlo: <a href="http://www.adobe.com/software/shockwaveplayer/">

http://www.adobe.com/software/shockwaveplayer/</a></object>

Por último, nuestra canción de GoEar:

<object type="application/x-shockwave-flash" width="366" height="75" data="http://www.goear.com/files/external.swf?file=4241382">
<param name="movie" value="http://www.goear.com/files/external.swf?file=4241382" />
<param name="quality" value="high" />
Esto es un archivo de GoEar . Necesitas el plugin de Flash para visualizarlo ...y oírlo!:
<a href="http://www.adobe.com/software/shockwaveplayer/">

http://www.adobe.com/software/shockwaveplayer/</a></object>

Todos estos códigos funcionan aceptablemente en Firefox 2.0 e IExplorer 7.

Cambios en XHTML 2.0

La etiqueta <object> va a a cambiar bastante en el futuro estándar de XHTML-2.0. Los parámetros más importantes cambian de nombre cobrando este nuevo aspecto:
<object
xml:base="http://www.example.com/"
src="mymovie.mpg"
srctype="video/mpeg">
This user agent cannot process this movie.
</object>

• codebase se sustituiría por xml:base
• data por src
• type por srctype

Hay otras novedades con respecto a la sintaxis. Se puede consultar el documento completo aquí:
XHTML™ 2.0: Object Module

Fuentes:

1. Como no: http://www.w3c.es/.
2. Un artículo de obligada lectura: developer.mozilla.org: Usando el marcado correcto para llamar a los plugins.
3. Una buena herramienta para conseguir código XHTML válido en nuestros vídeos de Youtube es:
   http://www.griptapethumb.com/tools/youtube/
4. El futuro ya está aquí: http://www.w3.org/TR/xhtml2/
5. Un buen artículo par aclarar ideas sobre el formato FLV: http://es.wikipedia.org/wiki/FLV

1. Seguimos el excelente tutorial de http://www.ruzee.com y editamos los archivos index.php, album.php e image.php según se explica: importando las funciones de WordPress en zenphoto y conectando a las bases de datos de uno u otro gestor según se requiera.
2. Una vez hecho esto, retocaremos la hoja de estilos zen.css de nuestra plantilla de zenphoto para completar la integración y dejarlo más a nuestro gusto.
3. Habilitar comentarios tiene un serio inconveniente de todos conocido: para evitar el odiado spam hemos optado por instalar un sencillo Captcha en nuestra galería: http://www.zenphoto.org/support/topic.php?id=1074 siguiendo, uno a uno, los pasos que se detallan en el paquete de descarga y teniendo cuidado de dotar a la imagen que se genera, code.png, de permisos de escritura.
4. Haciendo estas tres cosas, observamos como, al mostrar cada imagen por separado, se genera un error en el área de comentarios apareciendo siempre este mensaje:There was an error submitting your comment. Name, a valid e-mail address, and a comment are required aunque el funcionamiento sea correcto. Como siempre, no soy la primera a la que le ha ocurrido esto y hay solución en el foro de soporte de zenphoto: http://www.zenphoto.org/support/topic.php?id=824. El error se produce porque la variable $error, que produce el mensaje, es utilizada también por WordPress y la solución pasa por cambiarle el nombre en zenphoto (en mi caso la he llamado $zp_error) pero no en el archivo template-funtions.php como se explica en el foro, sino el archivo functions-controller.php, cosas de la nueva versión.
5. Y ya para terminar, pensé que sería útil incluir un pequeño script en la barra lateral de la galería que permitiera conocer rápidamente si ha habido novedades. Para ello, he incluido el siguiente código que nos muestra cuál ha sido la última imagen que se ha subido a las galerías y los cinco últimos comentarios. Resulta un poco rudimentario ( y prometo pulirlo por si alguien está interesado y lee esto) pero creo que es útil. Ahí va el código:
   <h2>Vida en las Galerías</h2>
<?php db_connect(); // reconnect to zenphoto db ?>
<?php
$last_image = query_single_row(" SELECT * FROM `images` ORDER BY `images`.`id` DESC");
$title = $last_image['title'];
$desc = $last_image['desc'];
$albumid = $last_image['albumid'];
$filename = $last_image['filename'];
$last_image_album = query_single_row("SELECT folder FROM `albums` WHERE id=$albumid");
$last_image_folder =$last_image_album['folder'];
echo "<div class=\"lifeingallery\">";
echo "<h3>Ultima imagen</h3>";
echo "<div class=\"lastimage\"><a href=\""
. (zp_conf("mod_rewrite") ? "../galeria/$last_image_folder/$filename" : "../index.php?last_image_folder=".urlencode($last_image_folder)."
&filename=".urlencode($filename)). "\" title=\"on $last_image_folder / $title\"> $title</a>: $desc </div>";
?>
<h3>Ultimos comentarios</h3>
<ul>
<?php
$comments = query_full_array("SELECT c.id, i.title, i.filename, a.folder, a.title AS albumtitle, c.name, c.website,"
. " c.date, c.comment FROM ".prefix('comments')." AS c, ".prefix('images')." AS i, ".prefix('albums')." AS a "
. " WHERE c.imageid = i.id AND i.albumid = a.id ORDER BY c.id DESC LIMIT 5");
foreach ($comments as $comment) {
$author = $comment['name'];
$album = $comment['folder'];
$image = $comment['filename'];
$albumtitle = $comment['albumtitle'];
if ($comment['title'] == "") $title = $image; else $title = $comment['title'];
$website = $comment['website'];
$comment = truncate_string($comment['comment'], 60);
echo "<li><a href=\""
. (zp_conf("mod_rewrite") ? "../galeria/$album/$image" : "../index.php?album=".urlencode($album)."&image=".urlencode($image))
. "\" title=\"on $albumtitle / $title\">$author</a>: <em>$comment</em></li>";
}
?>
</ul>
</div> <!-- cierra lifeingallery -->
   Comparte este artículo:

   • 
   • 
   • 
   • 
   • 
   • 
   • 
   • 
   • 
   ]]> http://sisifodichoso.org/2007/04/06/integrando-zenphoto-en-sisifodichoso/feed/ 14 http://sisifodichoso.org/2007/03/13/una-guia-sobre-microformatos/ http://sisifodichoso.org/2007/03/13/una-guia-sobre-microformatos/#comments Tue, 13 Mar 2007 07:33:38 +0000 sisi http://sisifodichoso.org/2007/03/13/una-guia-sobre-microformatos/ Una excelente guía de microformatos: Microformatos: la web semántica para torpes

   Y otra también en español: http://www.webposible.com/microformatos-dublincore/introduccion-microformatos.html
   Una chuleta en inglés: http://suda.co.uk/projects/microformats/cheatsheet/

   Comparte este artículo:

   • 
   • 
   • 
   • 
   • 
   • 
   • 
   • 
   • 
   ]]> http://sisifodichoso.org/2007/03/13/una-guia-sobre-microformatos/feed/ 2 http://sisifodichoso.org/2006/11/13/downstairs/ http://sisifodichoso.org/2006/11/13/downstairs/#comments Mon, 13 Nov 2006 01:40:31 +0000 sisi http://sisifodichoso.org/2006/11/13/downstairs/ Le he dado un nuevo aspecto al blog como símbolo de nuevos vientos.
   He llamado al tema “Downstairs” y parece que funciona todo, pero ya sabéis que yo estoy siempre en pruebas y que hasta que no se utilizan las cosas no salen los fallos (espero que no os cortéis un pelo ante cualquier comportamiento irritante que observéis )
   El nombre, “Downstairs”, viene a cuento del título de la imagen de Eadweard Muybridge: “Woman walking downstairs” … y es un reflejo más de Sísifo …
   El fractal: no quiero ya prescindir de él. Ahora es doble.
   Las columnas: tres para aprovechar el espacio. Optimizado para 1024×768.
   Ahora el miniblog no es un plugin sino código php integrado en la barra lateral: se ve el título del minipost , un resumen del mismo y los comentarios.
   Éste es el código:
   <h2>MiniBlog</h2>
<div id="miniblog">
<?php rewind_posts(); ?>
<?php if ($posts) : foreach ($posts as $post) : start_wp();?>
<?php if (in_category(7)) { ?>
<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a><br />
<?php echo $post->post_excerpt ?>
<?php comments_popup_link(__('(0)'), __('(1)'), __('(%)')); ?>
<br />
<?php } ?>
<?php endforeach; else: ?>
<p><?php _e('No se han encontrado entradas con esos criterios.'); ?></p>
<?php endif; ?>
</div>

   La barra lateral muestra cosas distintas según en qué caso estemos: index o cada artículo o página por separado. (Corrección: 16-11-2006) El miniblog sólo se ve en la página de inicio, por ejemplo.
   He cambiado algo las páginas y el mensaje de presentación … y bueno, que a mí me gusta y espero que a vosotr@s también.
   Una cita¹ para acabar:

   Ha pasado algún tiempo. El tiempo pasa y no deja nada. Lleva, arrastra muchas cosas consigo. El vacío, deja el vacío. Dejarse vaciar por el tiempo como se dejan vaciar los pequeños crustáceos y moluscos por el mar. El tiempo es como el mar. Nos va gastando hasta que somos transparentes. Nos da la transparencia para que el mundo pueda verse a través de nosotros o pueda oírse como oímos el sempiterno rumor del mar en la concavidad de una caracola. El mar, el tiempo, alrededores de lo que no podemos medir y nos contiene.

   Notas

   1. José Ángel Valente: “Fragmentos de un libro futuro” [volver]
   Comparte este artículo:

   • 
   • 
   • 
   • 
   • 
   • 
   • 
   • 
   • 
   ]]> http://sisifodichoso.org/2006/11/13/downstairs/feed/ 10 http://sisifodichoso.org/2006/10/12/abreviatura-vs-abreviacion/ http://sisifodichoso.org/2006/10/12/abreviatura-vs-abreviacion/#comments Thu, 12 Oct 2006 20:22:03 +0000 sisi http://sisifodichoso.org/2006/10/12/abreviatura-vs-abreviacion/ LLevo ya unos cuantos días llevando una conversación con Cruzul, necesariamente fragmentaria y dispersa por razones de tiempo, acerca del futuro estándar XHTML 2.0¹.
   En uno de esos fragmentos, éste en forma de e-mail, Cruzul me llamaba la atención acerca de la desaparición de la etiqueta <acronym> en favor de la etiqueta <abbr>. No es ésta la única decisión para el futuro, tomada por el W3C , que considero discutible² , pero sí que me dio que pensar, porque reavivaba viejas discusiones acerca de la utilización de la etiqueta <acronym> ¿Qué es un acrónimo? ¿Es un tipo de abreviatura? ¿O es una realidad independiente?
   Para estas cosillas del lenguaje ya sabéis que soy aficionada a la consulta del oráculo…
   
   Dice la RAE:

   acrónimo.
   (Del gr. ἄκρος, extremo, y -ónimo).
   1. m. Tipo de sigla que se pronuncia como una palabra; p. ej.,
   o(bjeto) v(olante) n(o) i(dentificado).
   2. m. Vocablo formado por la unión de elementos de dos o más
   palabras, constituido por el principio de la primera y el final de la
   última, p. ej., ofi(cina infor)mática, o, frecuentemente, por otras
   combinaciones, p. ej., so(und) n(avigation) a(nd) r(anging), Ban(co)
   es(pañol) (de) (crédi)to.

   abreviatura.
   (Del lat. abbreviatūra).
   1. f. Tipo de abreviación que consiste en la representación gráfica
   reducida de una palabra mediante la supresión de letras finales o
   centrales, y que suele cerrarse con punto; p. ej., afmo. por afectísimo;
   Dir.a por directora; íd. por ídem; SS. MM. por Sus Majestades; D. por don.

   Uhmmmm, viendo esto la cosa parece confusa ¿no?
   Sin meternos en los acrónimos tipo “láser” o “sónar“, los otros acrónimos tipo NASA u ONU son siglas³ y no está del todo claro que las siglas sean abreviaturas, aunque ambas palabras compartan raíz latina con “cifras”:

   sigla.
   (Del lat. sigla, cifras, abreviaturas).
   1. f. Palabra formada por el conjunto de letras iniciales de una expresión compleja; p. ej., O(rganización de) N(aciones) U(nidas), o(bjeto) v(olante) n(o) i(dentificado), Í(ndice de) P(recios al) C(onsumo).
   2. f. Cada una de las letras de una sigla (ǁ palabra formada por letras iniciales). P. ej., N, O y U son siglas en ONU.
   3. f. Cualquier signo que sirve para ahorrar letras o espacio en la escritura.

   Pienso que si los señores de la RAE quisieran poner de manifiesto que las siglas son un tipo de abreviatura lo harían de una forma clara y explícita, pero no lo hacen así.
   Ahora bien, fijémonos por un momento en el comienzo de la definición de abreviatura:

   abreviatura.
   (Del lat. abbreviatūra).
   1. f. Tipo de abreviación [...]

   ¡Ajá! esta es para mí la clave: la abreviatura es un tipo de abreviación. Si alguien de fuera de “la academia” me hubiera hablado antes de “abreviaciones”, habría pensado que me estaba hablando de una especie de spanglish. Pero no. Resulta que “abreviación” existe en español:

   abreviación.

   1. f. Acción y efecto de abreviar.
   2. f. Ling. Procedimiento de reducción de una palabra mediante la
   supresión de determinadas letras o sílabas; p. ej., los acrónimos, los
   acortamientos, las abreviaturas y las siglas.

   Así pues todo son abreviaciones: las abreviaturas, las siglas, los acrónimos y otras cosas como los apócopes, por ejemplo.
   Si pensamos en la palabra española “abreviación” como la correspondiente traducción de la palabra inglesa “abbreviation”:

   Abbreviation – Wikipedia, the free encyclopedia
   “Types of abbreviations

   Apart from the common form of shortening one word, there are other types
   of abbreviations. These include acronym and initialism (including TLA),
   apocopation (that is, apocope), clipping (phonetics), elision, syncope,
   syllabic abbreviation, portmanteau.”

   Vemos que se ajustan mucho la una a la otra.
   Yo entiendo aquí:

   • abreviación — abbreviation
   • abreviatura — syllabic abbreviation
   • siglas — initialism
   • acrónimo — acronym

   y si hacemos caso del W3C⁴ :

   9.1. The abbr element

   The abbr element indicates that a text fragment is an abbreviation (e.g., W3C, XML, Inc., Ltd., Mass., etc.); this includes acronyms.

   parece claro que la etiqueta <abbr> se refiere a abreviaciones en general y no a abreviaturas en particular y resulta entonces correcto prescindir de la etiqueta <acronym> que, en todo caso tendría que ser un atributo de <abbr> aunque no parece que estén pensando en algo así …

   Notas:

   1. http://www.w3.org/…/xhtml2 …/elements.html. [volver]
   2. http://www.webnova.com.ar/articulo589 [volver]
   3. Según la Ortografía de la Real Academia Española, las siglas que se pueden pronunciar como una palabra y que, por tanto, constituyen ya un acrónimo, se pueden escribir sin puntos entre las letras e incluso con minúsculas. Es el caso de ovni o uvi [volver]
   4. http://www.w3.org/…/#edef_text_abbr [volver]
   Comparte este artículo:

   • 
   • 
   • 
   • 
   • 
   • 
   • 
   • 
   • 
   ]]> http://sisifodichoso.org/2006/10/12/abreviatura-vs-abreviacion/feed/ 3 http://sisifodichoso.org/2006/10/03/saltos-de-linea-en-firefox-opera-e-iexplorer/ http://sisifodichoso.org/2006/10/03/saltos-de-linea-en-firefox-opera-e-iexplorer/#comments Tue, 03 Oct 2006 15:43:36 +0000 sisi http://sisifodichoso.org/2006/10/03/saltos-de-linea-en-firefox-opera-e-iexplorer/ Es para voverse loc@. ¿Os acordáis cuando hablábamos de los saltos de línea Unix y Dos? bueno pues ahora acabo de descubrir otra peculiaridad más que afecta a nuestros navegadores favoritos.
   
   Nos situamos:

   Linux: Ubuntu-Dapper

   Sencilla página html con un sencillo formulario con un campo textarea (Corrección: 20-11-2006) que podría ser por ejemplo éste: demo de sp-quicktags3
   Abrimos la página en Firefox y Opera.
   Escribimos un texto en varias líneas.

   primera linea
   segunda linea
   tercera linea

   Lo seleccionamos con el ratón.
   Mediante un sencillo script de Javacript mostramos qué caracteres se utilizan, en uno y otro caso, como salto de línea:
   alert(escape(sel));
   Donde sel es aquí una variable donde se almacena el texto seleccionado.
   Ésta es la salida en Firefox:
   primera%20linea%0Asegunda%20linea%0Atercera%20linea
   Ésta es la salida en Opera:
   primera%20linea%0D%0Asegunda%20linea%0D%0Atercera%20linea

   Cambiamos ahora de escenario:

   Windows XP

   Salida de Firefox en Win XP:
   primera%20linea%0Asegunda%20linea%0Atercera%20linea
   Salida de Opera en WinXP:
   primera%20linea%0D%0Asegunda%20linea%0D%0Atercera%20linea
   Salida de IE:
   primera%20linea%0D%0Asegunda%20linea%0D%0Atercera%20linea

   Conclusión que saco yo (después de un rato de búsqueda totalmente infructuosa en Google):

   • En Firefox un salto de línea es u000A
   • En Opera, un salto de línea es u000Du000A

   Independientemente de la plataforma en la que estemos…

   Comparte este artículo:

   • 
   • 
   • 
   • 
   • 
   • 
   • 
   • 
   • 
   ]]> http://sisifodichoso.org/2006/10/03/saltos-de-linea-en-firefox-opera-e-iexplorer/feed/ 0