Archivo del mes Febrero, 2007

Entradas siguientes »

Herramientas (con hache) para escribir bien (con b)

Herramientas (con hache) para escribir bien (con be)
Por Calítoe.:. (Cristina MJ)
Publicado por primera vez en Maestros del Web.

Cuidar nuestra redacción a la hora de elaborar contenidos para páginas web es primordial para lograr la credibilidad de nuestros visitantes y clientes. En este mundo globalizado donde parece que sólo exista el inglés (o más bien, la versión del inglés que hemos configurado entre todos) aún quedan muchas lenguas, y cuidar la nuestra no sólo es un ejercicio de cultura, sino también una auténtica estrategia de mercadotecnia.

Si nos paramos a pensarlo, en muchas ocasiones resulta realmente muy fácil reconocer cuándo un mensaje es engañoso (como los famosos “hoaxes” o bulos de Hotmail). Están plagados de faltas de ortografía, de anacolutos y de anglicismos léxicos y sintácticos (en muchos casos no son más que burdas traducciones literales del inglés). Por muchos fallos que pueda cometer Microsoft, nunca intentaría convencernos de manera tan iletrada de que Hotmail va a cerrar nuestra cuenta.

Es seguro que muchos de nosotros no compraríamos nada en una tienda en línea cuyos artículos estuvieran descritos de modo ilegible, no sólo por las dudas que provoca a veces no estar seguro de lo que se lee, sino por las dudas acerca de la clase de persona que puede manejar ese negocio. Entendemos que si no ha cuidado la redacción de su sitio web, es probable que tampoco tenga mucho cuidado a la hora de manejar nuestro pedido o nuestro dinero.

Por supuesto, no siempre tiene por qué darse esa relación, pero la impresión que provoca un sitio mal escrito ejerce un efecto más bien negativo sobre nuestros clientes o usuarios potenciales.

Ser analfabeto (no saber leer y escribir) es muy triste. Si estás leyendo esto, es porque has recibido cierta educación y, además, dispones de un ordenador y conexión a Internet, es decir: tienes mucha suerte. Pero quedarse anquilosado delante de la pantalla y escribir de cualquier modo no es aprovechar la suerte que nos ha tocado. Si no pulimos nuestra educación, empezando por lo más básico: escribir bien, veremos cerradas muchas puertas que algún día nos puede interesar abrir.

Con los mismos ordenadores que estamos usando ahora mismo podemos encontrar algunas herramientas útiles que nos ayudarán a comunicarnos mejor con los demás y, en consecuencia, lograr mejor nuestros objetivos.

La Real Academia de la Lengua Española

La primera “autoridad” que nos puede ayudar es la Real Academia de la Lengua Española. Pueden criticarse muchas de sus decisiones, pero lo queramos o no, ella es la que manda; y del mismo modo que no podemos cambiar las reglas del Tetris aunque no nos gusten, si queremos jugar o escribir, hay que atenerse a ciertas normas. No sólo podemos consultar en línea el DRAE, sino también el Diccionario panhispánico de dudas, que resulta particularmente interesante.

Si ya nos sabemos la gramática y la ortografía general del español pero necesitamos buscar términos en el diccionario de la RAE, no hace falta abrir su página para consultarlos. Los que usen Firefox, pueden hacerlo a través del motor de búsqueda del DRAE que viene instalado por defecto en la versión de Firefox en español. Si no encontramos dicha extensión, podemos descargar aquí el motor de búsqueda en el DRAE de Firefox.

Wordreference y la Universidad de Cambridge

Otros motores de búsqueda en diccionarios que podemos instalar en Firefox y que resultan interesantes para un hispanohablante son los diccionarios de Wordreference.com y el diccionario inglés-español de la Universidad de Cambridge.

Firefox 2

Unos complementos muy útiles también son los correctores ortográficos en inglés y en español que vienen por defecto en Firefox 2. Siempre que escribamos en un campo de texto, subrayará en rojo las palabras escritas incorrectamente, y haciendo clic con el botón derecho podremos ver alternativas. Con el botón derecho también podemos cambiar la lengua del corrector. Podemos instalar más idiomas (y variantes, como “español de Argentina”, por ejemplo). Nos corrige mientras escribimos del mismo modo que lo hacen las herramientas de corrección de Word cuando las tenemos activadas. Es realmente útil incluso para los que dominan la lengua, pues nadie se libra de los errores tipográficos (¡ni siquiera yo, para mi desgracia :D!).

Stilus

Si por la razón que sea no podemos utilizar estos correctores, Stilus, de la empresa Daedalus, nos ofrece corregir la ortografía de pequeños párrafos a través de su herramienta “Revisión interactiva”, aunque hay que registrarse (gratuitamente) para disfrutarla.
Pero en la página de Stilus podemos encontrar otras herramientas gratuitas que no necesitan registro para utilizarse. Podemos usar libremente el analizador de palabras y el conjugador de verbos.

Con sus herramientas principales (analizador de palabras, conjugador verbal, diccionario inverso y juego de letras) podemos resolver varias dudas y de paso aprender o incluso jugar un rato.

Otra herramienta interesante de Stilus que no necesita registro en su demostración es el extractor automático de resúmenes, con el que podemos resumir el texto que introduzcamos en el formulario según los parámetros que indiquemos.

Si estamos dispuestos a pagar, podemos instalar estas y otras herramientas en nuestro servidor. Esto es interesante para compañías que generen muchos textos y quieran cuidar su redacción.

Traductores

Por otra parte, a la hora de traducir, no conviene fiarse demasiado de las máquinas, pero entre otras utilidades, el traductor del Instituto Cervantes nos puede echar una mano.

Algunos términos en otras lenguas, anglicismos (y extranjerismos en general) son inevitables, otros sí lo son y otros conviene evitarlos. Convendría también desterrar otros barbarismos cuanto antes, especialmente los sintácticos, que modifican totalmente la lengua y pueden llegar a ser verdaderamente confusos para el lector. Nada de “remover ficheros” (se remueve el café :P), sino eliminar ficheros”; o “los más interesantes juegos del momento” sino “los juegos más interesantes del momento”.

Fundación del español urgente

Y para estar al tanto de las últimas convenciones. Las herramientas de la Fundéu (Fundación del español urgente) son nuestra referencia.

Al igual que embellecemos nuestras páginas con un diseño limpio y gráficos espectaculares, deleitaremos a más visitantes con una redacción cuidada, empezando por una ortografía correcta nada difícil de conseguir usando alguna de las ayudas que se han enumerado.

“Themes” para Wordpress: oferta de realización

Lo de “realización” es un juego de palabras: acabo de terminar mi primer “theme” o plantilla para Wordpress :grin:

Bueno, o cierto es que no he hecho más que modificar (guiada e inspirada por mi amigo del alma) una gráfica ya existente y la he adaptado a WP.

No voy a publicarla para disfrute general porque está destinada a un proyecto comercial que nos traemos entre manos, pero me apetece hacer algún tema de Wordpress para regalarle al mundo, así que si habéis visto por ahí alguna gráfica CSS que os haya gustado mucho y queréis que alguien la adapte a Wordpress, pedidlo en los comentarios y es posible que lo haga. Últimamente estoy de humor y de paso me servirá para adquirir práctica :wink:

Lo prometido es deuda

Volvemos (Plural mayestático :p), con foros y todo ;)

Inclusiones PHP

Inclusiones PHP
Por Calítoe.:. (Cristina MJ)

Publicado por primera vez en Maestros del Web.

Mediante este tutorial aprenderemos a usar PHP (sin tener por qué saber programar en PHP) para optimizar nuestro sitio y facilitar su actualización cada vez que queramos hacer cambios.

PHP nos ayuda en nuestra tarea de construcción de páginas web. Se inventó para eso, pero no es necesario saber programar para usarlo. Si sabemos copiar y pegar, este tutorial nos arreglará un poco la vida.

Las ventajas son muchas:

  1. Obtendremos menos páginas para editar/subir al servidor. Todo el contenido estará en un único archivo.
  2. Con este tutorial en concreto obtendremos URLs más cortas, del tipo index.php?poemas en lugar de index.php?z=poemas.php
  3. Las partes que siempre se repiten (cabecera y pie) se almacenarán en archivos separados, de modo que sólo habrá que construirlos o modificarlos una vez y luego se mostrarán en el navegador en todas las páginas gracias a las inclusiones.
  4. Las páginas se cargarán más rápido gracias a la menor cantidad de código. Este método emplea una única línea de PHP para cada sección de nuestro sitio, de manera que apenas hay nada que editar, lo tendremos todo listo en cuestión de minutos.

Antes Después

Yo aprendí a hacer esto con Codegrrl y lo uso prácticamente en todos mis sitios, así que me he basado en su tutorial para facilitarles la tarea a los hispanohablantes que empiezan el mundo de la construcción de sitios web.

Primer paso: comprobar que tenemos PHP instalado en el servidor
Antes de aprender a efectuar inclusiones con PHP deberemos asegurarnos de que el servidor en el que van a estar alojadas nuestras páginas tiene instalado PHP. Si ya estamos seguros, podemos saltarnos este paso. Si no disponemos de un servidor de tales características, podemos encontrar una lista de servidores gratuitos que soportan PHP aquí.

Si no estamos seguros si en nuestro servidor podemos hacer experimentos con PHP, podemos hacer la prueba siguiente: abrimos el Bloc de notas u otro editor de texto similar y escribimos en él “Funciona, ¡genial!”; guardamos el archivo como “test.php”; lo subimos al servidor y abrimos en el navegador ese archivo. Si podemos ver “Funciona, ¡genial!” es que PHP funciona en nuestro servidor. Si no, desafortunadamente este tutorial no nos servirá para mucho…

Pero bueno, partamos entonces suponiendo que sí podemos jugar con PHP en nuestro servidor.

Comenzamos
Mostraré cómo emplear esta técnica mediante ejemplos.

Digamos que ya tenemos una página personal con seis secciones: “bienvenida” “sobre mí”, “mi poesía” “mis fotos” “enlaces” y “créditos”.

Abrimos todas esas páginas en un editor de textos y luego creamos un nuevo archivo también en el editor de textos (tendremos un montón de ventanas/pestañas abiertas, pero eso da cierto aire “profesional”, así que lo disfrutamos). Copiamos entonces el siguiente código en el archivo nuevo y lo guardamos como index.php (o cualquier otro nombre, siempre y cuando la extensión sea .php):

index.php

< ? php
//Copia el HTML que se repita en todas las páginas del sitio, esto es: la cabecera y el pie de la página. Guárdalos en archivos separados y nómbralos cabecera.inc y pie.inc respectivamente.
//Ambos se incluirán automáticamente cada vez que se acceda a las secciones del sitio, de modo que sólo tendrás que modificar esos dos archivos cada vez que quieras modificar la interfaz (layout).
include(’cabecera.inc’);
if(!$_SERVER['QUERY_STRING']) { ?>
//Borra este comentario y pega aquí el HTML de tu página principal. Esta sección es la que se verá por defecto cuando se acceda a index.php.
< ? } elseif ($_SERVER['QUERY_STRING'] == "apartado1") { ?>
//Borra este comentario y pega aquí el HTML de uno de los apartados de tu sitio (sin la cabecera ni el pie, obviamente).
< ? } elseif ($_SERVER['QUERY_STRING'] == "apartado2") { ?>
//Borra este comentario y pega aquí el HTML de uno de los apartados de tu sitio (sin la cabecera ni el pie, obviamente).
< ? } elseif ($_SERVER['QUERY_STRING'] == "apartado3") { ?>
//Borra este comentario y pega aquí el HTML de uno de los apartados de tu sitio (sin la cabecera ni el pie, obviamente).
< ? } elseif ($_SERVER['QUERY_STRING'] == "apartado4") { ?>
//Borra este comentario y pega aquí el HTML de uno de los apartados de tu sitio (sin la cabecera ni el pie, obviamente).
< ? } elseif ($_SERVER['QUERY_STRING'] == "apartado5") { ?>
//Borra este comentario y pega aquí el HTML de uno de los apartados de tu sitio (sin la cabecera ni el pie, obviamente).
< ? }
include(’pie.inc’); ?>

Lee el código y busca las líneas que empiezan por //. Son comentarios y explican qué tienes que hacer o cambiar. Cambia el texto entre comillas (“apartado1”, “apartado2”, etc.) para que se adapte a las secciones de tu sitio. Hay que tener en cuenta que el archivo donde escribamos todo esto tiene que tener la extensión .php, si no, no funcionará.

Adaptación
Adaptemos entonces este código a nuestro “sitio personal de ejemplo”:
Empezamos por localizar las partes de HTML que se repiten al principio y al final de todos nuestros archivos. Tomemos como ejemplo la hipotética página fotos.html. Las partes comunes con otras páginas se han marcado en negrita:

fotos.html

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">

<head>
<title>Mi sitio güeb</title>
<link rel="stylesheet" href="estilo.css" type="text/css" />
<script type="text/javascript" src="external.js"></script>
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="content-Type" content="application/html; charset=iso-8859-1" />
</head>

<body>

<div id="general">
<div id="cabecera"><h1>Mi sitio güeb</h1></div>

<div id="menu">
<h3>Menú</h3>
<ul>
<li><a href="yo.html">Sobre mí</a></li>
<li><a href="poemas.html">Mi poesía</a></li>
<li><a href="fotos.html">Mis fotos</a></li>
<li><a href="enlaces.html">Enlaces</a></li>
<li><a href="creditos.html">Créditos</a></li>
<li><a href="index.html">Inicio</a></li>
</ul>
</div>

<div id="contenido">
<h1>Fotos</h1>
<p>No viajo mucho, pero cuando tengo esa oportunidad, hago muchas fotos. Aquí están las de mis últimos viajes:</p>

<p>
<img src="imagenes/foto1.jpg" alt="Foto 1" width="500" height="300" />
<img src="imagenes/foto2.jpg" alt="Foto 2" width="500" height="300" />
<img src="imagenes/foto3.jpg" alt="Foto 3" width="500" height="300" />
</p>
</div>

<div id="footer">
Construido por <strong>C</strong> inspirada por mi webcolega <a href="http://www.dominiodehache.ext/">H</a> - <a href="http://jigsaw.w3.org/css-validator/check/referer"> CSS válido</a> &amp; <a href="http://validator.w3.org/check?uri=referer">XHTML válido</a>. <a href=" http://es.creativecommons.org/licencia/">Algunos derechos reservados</a>.
</div>

</div>

</body>

</html>

Copiamos entonces esas partes en negrita y las pegamos en los archivos cabecera.inc y pie.inc respectivamente:

cabecera.inc

< !DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
<head>
<title>Mi sitio güeb</title>
<link rel="stylesheet" href="estilo.css" type="text/css" />
<script type="text/javascript" src="external.js"></script>
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="content-Type" content="text/html; charset=iso-8859-1" />
</head>

<body>

<div id="general">
<div id="cabecera"><h1>Mi sitio güeb</h1></div>

<div id="menu">
<h3>Menú</h3>
<ul>
<li><a href="yo.html">Sobre mí</a></li>
<li><a href="poemas.html">Mi poesía</a></li>
<li><a href="fotos.html">Mis fotos</a></li>
<li><a href="enlaces.html">Enlaces</a></li>
<li><a href="creditos.html">Créditos</a></li>
<li><a href="index.html">Inicio</a></li>
</ul>
</div>

<div id="contenido">

pie.inc

<div id="footer">
Construido por <strong>C</strong> inspirada por mi webcolega <a href="http://www.dominiodehache.ext/">H</a> - <a href="http://jigsaw.w3.org/css-validator/check/referer"> CSS válido</a> &amp; <a href="http://validator.w3.org/check?uri=referer">XHTML válido</a>. <a href=" http://es.creativecommons.org/licencia/">Algunos derechos reservados</a>.
</div>

Suele usarse la extensión .inc para archivos que se van a incluir, pero también podemos usar la extensión .html o .php si nos apetece. Si vemos un archivo .inc directamente en el navegador se mostrará como texto simple, así que no es muy conveniente poner nada confidencial en ese tipo de archivos.
Vamos ahora a ocuparnos del contenido: copiamos la parte relevante de cada archivo .html que tengamos abierto (es decir: todo menos la cabecera y el pie) y lo pegamos en los lugares reservados a cada sección.

< ?php
//Copia el HTML que se repita en todas las páginas del sitio, esto es: la cabecera y el pie de la página. Guárdalos en archivos separados y nómbralos cabecera.inc y pie.inc respectivamente.
//Ambos se incluirán automáticamente cada vez que se acceda a las secciones del sitio, de modo que sólo tendrás que modificar esos dos archivos cada vez que quieras modificar la interfaz (layout).
include(’cabecera.inc’);
if(!$_SERVER['QUERY_STRING']) { ?>
<h1>¡Hola!</h1>
<p>Bienvenidos a mi sitio. Encantada de recibiros</p><p>.
< ? } elseif ($_SERVER['QUERY_STRING'] == "yo") { ?>
<h1>Sobre mí</h1>
</p><p>Me llamo C.:. tengo N años y vivo en X. <br />Las cosas que más me gustan en este mundo son A y B. <br />Reconozco que no me gustan demasiado ni M ni T ni V, pero bueno, así es la vida etc.</p>
< ? } elseif ($_SERVER['QUERY_STRING'] == "poemas") { ?>
<h1>Poemas</h1>
<p>En mis ratos libres escribo poesía. <br />He aquí una selección de los poemas que más les gustan a mis amigos: etc.</p>
< ? } elseif ($_SERVER['QUERY_STRING'] == "fotos") { ?>
<h1>Fotos</h1>
<p>No viajo mucho, pero cuando tengo esa oportunidad, hago muchas fotos. Aquí están las de mis últimos viajes:</p>

<p>
<img src="imagenes/foto1.jpg" alt="Foto 1" width="500" height="300" />
<img src="imagenes/foto2.jpg" alt="Foto 2" width="500" height="300" />
<img src="imagenes/foto3.jpg" alt="Foto 3" width="500" height="300" />
</p>
< ? } elseif ($_SERVER['QUERY_STRING'] == "enlaces") { ?>
<p>Me gusta visitar las páginas de mis colegas en la Red. Comparto con vosotros mis enlaces:</p>
<ul>
<li><a href="http://un.colega.ext">Colega 1</a></li>
<li><a href="http://otro.amigo.ex">Amigo 2</a></li>
<li><a href="http://enlace.ext">Interesante 3</a></li>
</ul>
< ? } elseif ($_SERVER['QUERY_STRING'] == "creditos") { ?>
<p>Yo misma he diseñado y confeccionado el sitio gracias a cosas que he aprendido en ><a href="http://www.maestrosdelweb.com">Maestros del Web</a>, etc. </p>
< ? }
include(’pie.inc’); ?>

He escrito “creditos” sin tilde a propósito porque desgraciadamente el código no funciona si se incluyen caracteres especiales del español: conque sólo letras simples y números.

Podemos añadir tantas líneas “elseif” como queramos según el número de secciones del sitio, y darles cualquier nombre siempre y cuando no se repitan ni tengan caracteres especiales.

Para acceder a cada sección de modo que se muestren en páginas diferentes, no hay más que enlazarlas de este modo index.php?nombreseccion, con lo que tengáis entre comillas en el código en lugar de nombresección.
Si se usa el código del ejemplo, las URL que tendremos que poner en el menú de navegación serán estas:
* Sobre mí: index.php?yo
* Mis poemas: index.php?poemas
* Mis fotos: index.php?fotos
* Páginas amigas: index.php?enlaces
* Créditos: index.php?creditos

La página de bienvenida, la que aparece por defecto, es index.php, como ya sabemos.

De esta forma, al final nuestro archivo cabecera.inc del ejemplo tendrá este aspecto:

<head>
<title>Mi sitio güeb</title>
<link rel="stylesheet" href="estilo.css" type="text/css" />
<script type="text/javascript" src="external.js"></script>
<meta http-equiv="imagetoolbar" content="no" />
<meta http-equiv="content-Type" content="text/html; charset=iso-8859-1" />
</head>

<body>

<div id="general">
<div id="cabecera"><h1>Mi sitio gúeb</h1></div>

<div id="menu">
<h3>Menú</h3>
<ul>
<li><a href="index.php?yo ">Sobre mí</a></li>
<li><a href="index.php?poemas">Mi poesía</a></li>
<li><a href="index.php?fotos ">Mis fotos</a></li>
<li><a href="enlaces.html">Enlaces</a></li>
<li><a href="creditos.html">Créditos</a></li>
<li><a href="index.html">Inicio</a></li>
</ul>
</div>

<div id="contenido">

Para sitios más largos, con secciones principales y subsecciones dentro de ellas es más conveniente dividir el sitio entre varios archivos correspondientes a las secciones principales e incluir las subsecciones por medio de los “elseif”.
De este modo evitaremos encontrarnos con un index.php gigantesco para el que necesitaremos mover la barra de desplazamiento varios kilómetros para encontrar las partes que queremos editar.

En mis sitios plurilingües uso ese sistema: un archivo php con sus respectivas subsecciones para cada lengua: esp?yo – esp.php?poemas // fra.?moi – fra.php?poems // por.php?eu –por.php?poemas…

Nota
Se suele pensar que las inclusiones se utilizan únicamente para controlar cabeceras y pies. Lo cierto es que se pueden usar para incluir el contenido de cualquier archivo en cualquier archivo PHP. Por ejemplo, si queremos insertar un formulario de contacto en algunas secciones, guardamos el formulario en un archivo separado (por ejemplo, direcc.inc) e insertarlo de este modo:

direcc.inc

< ?php include(’cabecera.php’);?>
<h1>Hola a todos</h1>
<p>Hoy hablaremos de las propiedades físicas de la naranja ibérica. Blah, blah.</p>
<p>Si quieres sugerir temas escríbenos utilizando el siguiente formulario:</p>
< ?php include(’direcc.inc’);?>
<p>La próxima semana hablaremos del tomate de la llanura y la zanahoria africana.</p>
< ?php include(’pie.php’);?>

¡Listo!

Entradas siguientes »