Crear paginas WEB

class_SRR_database_sim :: mi base de datos en PHP

noreply@blogger.com (Usher web) — Mon, 05 Oct 2009 04:18:00 +0000

Hacía mucho tiempo que quería compartir con vosotros mi "clase de base de datos" que llevo trabajándome en PHP desde hace ya 3 años largos! La idea nació de la necesidad de almacenar información para una aplicación web de un amigo sin poder usar MySQL ni otro tipo de base de datos tradicional, porque su plan de hosting era el más básico :S

Por fin, después de este tiempo, la base de datos ya está más o menos madura como para compartirla con otros. Lo que más me ha costado es darle propiedades de no "corruptibilidad" por coincidencia de dos threads PHP sobre la misma tabla de datos. Es decir, que ahora por fin la base de datos bloquea el acceso de lectura/escritura cuando algún "thread" está ESCRIBIENDO sobre alguna tabla. De esta forma no puede ocurrir que alguien empiece a leer una tabla cuando alguien la tiene a "medio escribir". Lo cuál aunque parezca muy improbable, empieza a volverse probable en cuanto la base de datos aumenta de tamaño ;)

Queda mucho por hacer, así que la he colgado como proyecto opensource en INDEFERO. Aquí tenéis el enlace:

http://imasdeweb.indefero.net/p/class-SRR-database-sim

Sois programadores y ya sabéis que cualqueir software siempre es mejorable, pero en fin, si no publico nunca ninguna versión el progreso de la misma irá tan lento como hasta ahora. Y confío que ahora una vez que alguien empieza a descargarla y usarla pueda tener feedbacks constructivos :))

Resúmen de características

No requiere en el servidor más que tener PHP instalado
Para empezar a usarla solo hay que copiar el directorio de la base de datos en donde más te convenga y tantas "instancias" como quieras.
Ocupa muy poco. Estando vacía menos de 50kb.
Lleva un archivo admin3.php al que puedes llamar para gestionar tu base de datos de forma básica online (al estilo phpmyadmin pero muuuuuho más humilde, jejejeje).
Los registros de cada tabla se almacenan en un archivo de texto plano en el mismo directorio, con lo cuál solo necesitas darle permisos de escritura al directorio ;)
La clase ofrece toda una serie de sencillos métodos del tipo: crear/modificar/eliminar tabla y crear/modificar/seleccionar/eliminar registros
Los campos de cada tabla pueden contener ilimitados caracteres (olvídate por fin de definir tipo y longitud de campo).
Las consultas (o "queries") no se escriben como en SQL en una cadena de texto y un chingo de comillas, sino que son llamadas parametrizadas usando siempre arrays ;)
Hacer un backup o migrar a otro hosting es tan fácil y rápido como "copiar y pegar el directorio"
Como no es necesario ejecutar un segundo servidor (por ejemplo el de MySQL) sino solamente leer y escribir en archivos de texto plano desde el PHP, la velocidad de respuesta es rapidísima (comparada con MySQL) para tablas con menos de 5.000 registros

Cosas que no tiene

índices
vínculos entre tablas
(un montón de cosas... jejejeje)

En fin, espero que lo pruebes y me digas qué te pareció. Y bueno, si además eres programador... bueno, una ayudita estaría genial!!! Sinceramente, aunque nadie más ponga ni una línea de código en este proyecto, ya estoy muy contento de compartir por primera vez algo realmente mío :)))) le debo tanto a la comunidad de programadores en general... !!!! me siento bien retornando algo de mi parte.

Por cierto, esta clase de base de datos es la que utilizo como pilar de mi CMS, el cuál llevo construyendo y utilizando desde hace también 3-4 años! muy prontito también lo publicaré como opensource, porque considero que a alguien le puede ir bien. Un CMS más, verdad?! jajajaja... pero en fin.. no os lo creeréis, pero ninguno de los CMS que habían en aquel entonces me venían bien! o eran muy complicados para el programador (si necesitaba hacer cambios en la funcionalidad del mismo) o bien tenían un panel de administración bastante complejo para el nivel de mis clientes. Conclusión: acabé programando mi propio CMS. La ventaja: si necesito cualquier cambio lo tengo en un instante. Y si aparece algún bug, enseguida sé de dónde viene ;)

Websites funcionando que usan mi CMS y la susodicha base de datos

Para que veáis que tanto la base de datos como el CMS funcionan a las mil maravillas, aquí os dejo el enlace a unas cuantas de mis páginas que los usan. Y las dos primeras os puedo asegurar que tienen tablas con más de 1.000 registros!

Para que veáis que tanto la base de datos como el CMS funcionan a las mil maravillas, aquí os
Un saludo!!
SERGI

Actualizaciones posteriores

versión 3.2 (3-NOV-2009): se corrigió un error en el método de DELETE_TABLE, y se añadieron unos archivos (test.htm y test.php) para hacer benchmark de acceso simultaneo desde diferentes navegadores (solo para uso de desarrollo de la clase).

modem 3G Nokia CS-10 en Ubuntu

noreply@blogger.com (Usher web) — Sun, 20 Sep 2009 05:00:00 +0000

El primer modem 3G de Nokia fue el Nokia Internet Stick CS-10, y según ponen en sus especificaciones (http://europe.nokia.com/find-products/accessories/all-accessories/home-and-office/imaging/nokia-internet-stick-cs-10), no es compatible con Linux. Sin embargo, eso no es cierto: yo he podido instalarlo después de leer y buscar por internet un día entero, y hacer mil y una pruebas.

Sé que la temática de este artículo se sale de la habitual en mi blog (desarrollo web), así que espero que mis lectores habituales me perdonen por incluirlo, pero he visto imprescindible hacerlo porque me ha llevado muchas horas gastadas para hacer algo tan sencillo, y creo que debe ser compartido. Y este blog es mi principal "ventana al mundo" ;)

Principal problema: reconocer el stick como MODEM

El primer problema es que al introducir el modem USB en la PC es reconocido como unidad de almacenamiento de tipo CD-ROM, porque este Stick contiene una pequeña memoria fija de 80Mb con software para Windows.

Después de leer en innumerables blogs y foros las más variopintas formas de "evitar" que Ubuntu reconozca al stick como memoria en lugar de cómo modem, descubrí ACCIDENTALMENTE (sí, sí... accidentalmente) que la solución al problema es SENCILLÍSIMA:

1. introduce el stick en la ranura USB

2. ubuntu te lo reconoce como unidad de CD-ROM y lo monta

3. te habrá aparecido un icono en el Escritorio o en Nautilus que se llama "Nokia modem", pero que no muestra ningún archivo (curiosamente no se ven los archivos que contiene... cosa que no entiendo ¿? porque en Windows se ven sin problema)

4. haz clic sobre el icono con el botón secundario del mouse y escoge la opción "EXPULSAR".

5. "mágicamente" verás como la "unidad" es "desmontada" y PLIS: se enciende de forma intermitente una luz naranja en el modem, bingo !! tu modem acaba de ser reconocido y activado!

Es importante que destaque que no sirve solamente "desmontar" la unidad. Eso lo estuve haciendo repetidas veces pero no servía para que el modem fuera detectado. Esto no sucedió hasta que no escogí la opción "expulsar" (increible, no?).

Segundo problema: configurar la conexión con Telcel

Una vez reconocido el modem como tal, el segundo y último paso es configurar la conexión con Telcel. Lo cuál es sencillo para versiones de Ubuntu a partir de la 8.10 en adelante, porque el Network Manager lleva un asistente para conexiones de "banda ancha móvil".

Si tienes una versión de Ubuntu anterior a la 8.10 (en mi caso en mi netbook tenía Ubuntu Remix basado en la 8.04), tampoco debes preocuparte, solamente tienes que actualizar tu Network manager:

1. debes añadir a tus orígenes de software los siguientes repositorios:

deb http://ppa.launchpad.net/network-manager/ubuntu hardy main
deb-src http://ppa.launchpad.net/network-manager/ubuntu hardy main

puedes hacerlo editando directamente el archivo que contiene la lista de repositorios

sudo gedit /etc/apt/sources.list (usa este comando desde la consola)

o bien abrir la aplicación "Gestor de paquetes Synaptic" (En Sistema / Administración) y allí ir al menú Configuración / Repositorios y en la pestaña "Software de terceros" puedes "Añadir" nuevos repositorios.

2. añade también la clave pública para estos repositorios. Para ello ejecuta en la consola este comando:

sudo aptitude update

y te va a dar un error porque le falta la clave pública del repositorio que acabamos de añadir. Te has de fijar bien en el mensaje de error que te aparezca, que será del tipo:

W: GPG error: http://ppa.launchpad.net intrepid Release: Las firmas siguientes no se pudieron verificar porque su llave pública no está disponible: NO_PUBKEY 5DC4E17435661D98

entonces ejecuta este otro comando:

gpg --keyserver subkeys.pgp.net --recv NO_PUBKEY

en donde en lugar de NO_PUBKEY has de escribir tu clave (en mi ejemplo: 5DC4E17435661D98), y entonces la consola te devolverá algo como esto:

gpg: solicitando clave 35661D98 de hkp servidor subkeys.pgp.net
gpg: /home/ubuntu/.gnupg/trustdb.gpg: se ha creado base de datos de confianza
gpg: clave 35661D98: clave pública "Launchpad PPA for GNOME Do Testers" importada
gpg: Cantidad total procesada: 1
gpg: importadas: 1 (RSA: 1)

a continuación ejecuta este otro comando:

gpg --armor --export 5DC4E17435661D98 | sudo apt-key add -

(obviamente escribiendo tu NO_PUBKEY), y si todo va bien la consola te devolverá un "Ok!".

3. desde consola actualiza el paquete de tu network manager:

sudo aptitude install network-manager

4. una vez actualizado, cargar el "gestor de actualizaciones" desde el menú del Escritorio (Sistema / Administración), y te detectará que puede actualizar 3 paquetes relacionados con el network-manager, dos de ellos justamente relacionados con las conexiones móviles, como una base de datos con las características de los diferentes operadores telefónicos de una gran lista de países ;)

5. por último, aunque no es necesario, te recomiendo que reinicies la computadora

Bueno, así que suponiendo que ya tengas bien actualizado tu Network Manager, el resto es muuuuy fácil:

1. haz clic con el botón secundario del ratón sobre del pequeño icono del gestor de redes que hay en tu barra (panel systray) junto al reloj y la fecha (normalmente).

2. escoge la opción "editar las conexiones"

3. ves a la pestaña "Banda ancha móvil" y haz clic en el botón "Añadir"

4. si tienes la versión actualizada del network manager se habrá iniciado un "asistente" que te va a guiar en el proceso de creación de la conexión móvil a internet. Además te va a preguntar por el país y te va a mostrar los operadores telefónicos para los que tiene datos en ese país. Tú deja todas las opciones de conexión que ponga el asistente, no hace falta que toques nada (al menos en el caso de Telcel-México). Como mucho, marca la casilla que pone: "Conectar automáticamente", porque así Ubuntu se conectará a esa red móvil en cuanto enchufes el modem USB 3G ;)

5. ya solo tienes que encajar tu stick en la ranura USB y tiene que funcionar! en todo caso, si ya lo tenías puesto, tendrás tal vez que retirarlo y volver a seguir los pasos del inicio ("expulsarlo" una vez sea reconocido por ubuntu como CD-ROM). O si eso no te va bien, mejor reinicia de nuevo la compu :( he experimentado que si introduzco y extraigo el modem USB más de una vez en una misma sesión, no siempre es reconocido adecuadamente ;)

Bueno, espero que estos consejos hayan servido a más de uno... espero que a muchos!!! lo más chistoso del tema es que acabo de recibir la respuesta del servicio de apoyo al cliente de Nokia (les pregunté sobre cómo usar sus modems USB en Linux), y lo único que dicen (me han respondido 2 personas diferentes) es la "ODIOSA" letanía de "Le recordamos que tal como puede leer en la página web de especificaciones del CS-10, este equipo solo es compatible con el sistema operativo Windows o Mac Os". ¿Increible, no? En fin, una vez publicado esta breve guía se la voy a enviar en respuesta a su "estúpida" respuesta de "ayuda". Porque además, cuando les escribí pidiendo ayuda les explicité que lo único que necesito es que me dieran un link en donde poder leer ALGO de documentación de como instalar en Linux alguno de sus modems USB 3G que SÍ SON COMPATIBLES CON LINUX (a partir de la CS-15). En fin...

Por cierto, si alguno/a de vosotros no conoce aún Ubuntu... le recomiendo que lo pruebe! lo recomiendo como usuario y como programador. Como veis, es un software totalmente ya maduro para el trabajo de los profesionales de la informática ;)

Un saludo,
SERGI

Di NO a las PATENTES DE SOFTWARE

noreply@blogger.com (Usher web) — Mon, 06 Jul 2009 18:56:00 +0000

Actualmente (2008-2009) se está desarrollando una campaña de recogida de firmas para solicitar al Parlamento Europeo medidas más contundentes que erradiquen de una vez por todas las patentes de software en Europa. Te invito a que te informes de porqué este cambio nos conviene no sólo a los informáticos, sino también a la industria del software en general y de forma indirecta a toda la sociedad. Mientras que las patentes sólo benefician el "lucro" a corto plazo de un número contado de empresas y retrasan enormemente la competitividad y el progreso del sector informático, y de rebote de toda la sociedad!

Te invito pues a:

Visitar la página oficial de recogida de firmas.

Dejar allí tu firma y leer alguno de los estudios científicos que hay en torno al tema

Divulgar este asunto, colocando un banner en algunas de tus webs ;)

Incluir un artículo en tu blog

Banners

Para que lo tengas más fácil, aquí te dejo el código para insertar un banner horizontal y otro vertical:

Comillas dobles y simples en HTML "input text"

noreply@blogger.com (Usher web) — Mon, 08 Jun 2009 20:17:00 +0000

Si eres desarrollador de aplicaciones web, sabrás ya que el tema de las comillas (simples y dobles) es siempre una fuente de problemas hasta que no descubres cómo lidiar con ellas. Voy a resumir ahora cuatro cosas que te van a funcionar siempre ;) si trabajas con PHP.

El problema principal es cuando queremos definir una cadena de texto que contenga unas comillas. Es un problema en sí mismo porque las cadenas de texto generalmente se delimitan usando comillas.

La mayoría de las veces es posible insertar comillas en una cadena de texto "escapando" esas comillas, es decir, usando un símbolo de "escape" (usualmente es la barra invertida \) delante de las comillas a escapar. Por ejemplo:

<input type='text' value='L\'Hospitalet' />

Sin embargo, este otro ejemplo (cuando delimitan comillas dobles) no funciona:

<input type="text" value="un \"gran\" hombre" />

Para incluir comillas dobles dentro de comillas dobles en HTML, tenemos que usar "carácteres especiales", así:

<input type="text" value="un "gran" hombre" />

La última cuestión es cómo hacer todo esto de manera fácil en PHP. Esto sería un ejemplo de cómo generar desde PHP el código HTML anterior suponiendo que la variable $value contenga una cadena con comillas dobles como un "gran" hombre:

<?php

echo "<input type=\"text\" value=\"".htmlspecialchars($value)."\" />";

?>

Como puedes suponer, la función htmlspecialchars transforma las comillas dobles (") en el código ".

Otro caso que podemos necesitar es cuando trabajamos con comillas simples (a mí me gusta más, aunque ya sé que no es la opción recomendada por el W3C):

<?php

echo "<input type='text' value='".addslashes($value)."' />";

?>

Esto produciría esta salida (que hemos puesto antes como ejemplo):

<input type='text' value='L\'Hospitalet' />

Y como te decía, a mí me gusta más porque si te fijas en el código del echo en PHP precisa de menos símbolos de escape, y por tanto el código HTML generado es más fácilmente "copiable" dentro de una cadena delimitada por comillas dobles en PHP. Pero ése es otro tema ;)

Estoy seguro de que a más de uno le habrá ayudado este breve resúmen :)))

De todas formas:

posiblemente se me escapa algo, pues continuamente salen cosas nuevas o uno descubre nuevos "trucos"
existen artículos mucho más extendidos y con más ejemplos. Éste me gustó particularmente para gente que se incia en PHP, pues da un repaso más a fondo del uso de comillas en este lenguaje de programación: http://www.dxpro.es/index.php?topic=181.0
si detectas que he cometido algún error en mis ejemplos o en mi explicación, please, comenta aquí abajo y lo corregiré para ayuda de otros :)) Gracias!

Un saludo!
SERGI

Cargar javascript desde JSON o AJAX con eval() en FF y execScript() en IE

noreply@blogger.com (Usher web) — Thu, 28 May 2009 04:04:00 +0000

¿Estás desarrollando una aplicación web en la que usas JSON o AJAX para cargar dinámicamente datos? ¿Además necesitas cargar dinámicamente no solamente datos sino también código javascript para ser utilizado en la página? A continuación te expongo el modo de hacerlo para que funcione en FireFox 3.X y IE7 (casualmente, también funciona en IE6).

Voy a partir de la base de que utilizas jQuery para la consulta JSON o AJAX al servidor. Y me voy a centrar en la "carga" del código javascript. Pero obviamente, no importa la librería o código que uses para el JSON o AJAX. Hay muchísima literatura en internet sobre ese tema.

Ejemplo de carga de datos

Empezaré con un ejemplo de carga de datos tipo texto, que es lo más habitual. Y luego pondré un ejemplo de carga de código javascript.

function js_actualizar_top_webs(){
var url_json = 'json_top_webs.php?mes='+$('#select_mes').val();
$.getJSON(
url_json,
function(datos){
$('#div_top_webs').html(datos.table_webs);
}
);
}

Imaginemos que en nuestra web de ejemplo tenemos un control tipo lista desplegable (select) que permite al usuario escoger un mes del año, y queremos que nuestra página recargue un <div id="'div_top_webs'"></div> con la lista del top 10 de webs de ese mes. Es un ejemplo clásico de recarga de datos dinámica usando JSON o AJAX.

Para ello construimos una función llamada js_actualizar_top_webs, que llamaremos al cambiar el valor de ese select. Esta función tal como está definida en el código de ejemplo hace una llamada JSON mediante el objeto $ de jQuery y cuando los datos se hayan recibido por completo ejecutará el código en rojo, en dónde "datos" es un objeto de javascript (no un array!!) que contiene diferentes "propiedades" con los datos enviados. En este caso, suponemos que el archivo de PHP que ha sido llamado devuelve un string llamado "table_webs" que contiene el código HTML de un "<table>" con la lista de webs que queremos mostrar.

Para "obtener" el valor de ese string HTML simplemente llamamos a datos.table_webs y lo colocamos como "contenido" de "div_top_webs" mediante el método .html() de jQuery. ¿Sencillo, no?

Ejemplo de carga de código javascript

Bueno, vamos ahora a algo que "cuesta" un poquitín más. Bueno, de hecho a mí me ha hecho gastar casi 8 horas de cansada búsqueda por internet y de leer mucho y probar mucho, hasta llegar a lo que te voy a poner aquí! ;)

Abajo tienes el código anterior ligeramente cambiado: hemos añadido unas líneas de código más, con el fin de poder cargar y ejecutar un código de javascript elaborado en el lado servidor.

function js_actualizar_top_webs(){
var url_json = 'json_top_webs.php?mes='+$('#select_mes').val();
$.getJSON(
url_json,
function(datos){
$('#div_top_webs').html(datos.table_webs);
if (window.execScript) window.execScript(datos.script_leyenda);
else window.eval(datos.script_leyenda);
}
);
}

Puedes ver en rojo dos nuevas líneas que corresponden a una sentencia condicional, y esto es necesario para ejecutar un código u otro según estemos en FireFox o en Internet Explorer (como mínimo estos dos navegadores). Para ambos casos el código de javascript pasado es el mismo y lo recuperamos de nuevo mediante jQuery con la propiedad datos.script_leyenda (que habremos rellenado desde el PHP con el código javascript que necesitemos ejecutar en nuestra web).

La diferencia radica en que Internet Explorer ejecutará el código de javascript mediante el método window.execScript(), mientras que FireFox ejecutará el código al usar el método window.eval(), en ambos casos pasando como argumento el código javascript que queremos ejecutar.

Otro aspecto importante y que tal vez pase desapercibido a primera vista es que en ambos casos ejecutamos sendos métodos sobre el objeto window. Eso es fundamental (me llevó más de una hora leyendo descubrirlo), para que el código javascript a ejecutar pase a estar "disponible" desde otros "ámbitos" de la misma página. De esta forma, si por ejemplo, dentro de ese código cargado dinámicamente definimos una función llamada "js_mostrar_leyenda()", si queremos usarla en el resto de la página, deberemos llamarla así: window.js_mostrar_leyenda();

Estoy seguro de que a más de uno le va a ir de perlas estas 3 líneas de código! al menos a mí me va a dar mucha potencia de programación con JSON y javascript. Y sinceramente, cuesta encontrar información "actualizada" en internet. Ya sabes que este tipo de información técnica (especialmente cross-browser) se desfasa con facilidad, con la salida de nuevas versiones de navegadores continuamente!! Así que lo que es válido hoy deja de serlo al cabo de 2 años :(

Te invito a que comentes cualquier sugerencia que tengas al respecto, eh! seguro que a todos nos interesa (temas de compatibilidad, por ejemplo). Si probando el código ves que te funciona en otros navegadores, por favor, coméntalo brevemente ;)

Un saludo!!!
SERGI

FireFox, solución a "Ha escogido abrir..."

noreply@blogger.com (Usher web) — Thu, 21 May 2009 23:28:00 +0000

Este artículo es un poco técnico, pero me veo obligado a publicarlo para compartir la solución a un problema que creo que es más común de lo que parece y sobre el que he encontrado muy poco escrito. Pienso que los desarrolladores de aplicaciones web que lo lean me lo agradecerán. Tal vez no te haya ocurrido nunca, pero ya llegará el día, jejejeje...

Signos del problema

- Cuando se intenta acceder a ciertas páginas de la aplicación, el navegador tarda en responder como casi un minuto y luego -al menos en FireFox- aparece una ventana en la que el mensaje dice "Ha escogido abrir este archivo..." y te da la opción de guardar el "supuesto" archivo PHP en lugar de mostrar el contenido de la web. Si pruebas a visitar la misma página desde IE la página quedará completamente en blanco y no mostrará nada.

- Es posible que algunas páginas de la web si vayan, porque sean HTML, pero también algunas de PHP también pueden verse mientras otras no. Después de leer el artículo entero entenderás porqué.

- El problema te ocurre tanto si visitas las web desde tu PC o desde cualquier otro. Aunque ten cuidado con las copias guardadas en caché!!! te pueden jugar "bromas pesadas": hacerte creer que una página se ve bien cuando realmente no es así, o al revés! Para estar seguro siempre de que el navegador te muestra la página devuelta por el servidor te aconsejo refrescar la página con CTRL+F5.

Causa del problema

- Tu aplicación web está teniendo algún "problema" en algún punto de sus "cálculos": en algún lugar del código se entra en una especie de "bucle infinito" que deja a la aplicación "pensando indefinidamente". Por esta causa el servidor da una respuesta "incoherente" al navegador, o digamos que el navegador no sabe interpretar la respuesta (¿curioso, verdad?).

- Por ejemplo, en mi caso se trataba de una clase que yo había programado para acceder a un archivo histórico, que cuando accede bloquea/desbloquea un archivo como señal de alerta para otros "hilos" de la aplicación, de que no pueden acceder en ese momento a la aplicación. La cuestión es que este sistema me funciona sin problemas (hasta ahora). Pero la empresa de hosting hizo una especie de restauración de backup en los servidores que debieron alterar los permisos de escritura sobre el directorio en el que está ubicado el archivo. En conclusión: mi aplicación se quedaba encallada en ese punto: intentando acceder a ese archivo permanentemente "bloqueado". Una vez que descubrí este fenómeno, la solución fue fácil: por FTP cambié los atributos del directorio para poderse escribir en él!

- Sin embargo, mi caso es muy particular y entiendo que difícil de repetir por otros programadores. Pero no así el problema de fondo: dejar a la aplicación en "stand by" (o en bucle) hasta resolver algo irresoluble. Por ejemplo, entre los comentarios que he leído en otros foros, hay gente que le ha pasado exactamente lo mismo cuando su aplicación web intenta hacer un "fopen", que es una lectura de un archivo remoto con PHP. Lo que quiero decir es que si no te ha pasado todavía (como desarrollador web) es muy posible que te pueda pasar en breve. Sobretodo hoy en día en el que la programación con webservices y consultas remotas está tan a la orden del día ;)

- [Nota añadida 8-ago-2009] Hoy me ha ocurrido otra vez un bucle de esos que me ocasionó el mismo error! Aunque esta vez, sabiendo que se trataba de un bucle infinito he ido haciendo "debugeo" hasta encontrar donde se me "colapsaba" la aplicación ;) El bucle era del tipo "función recursiva MAL HECHA":

function mi_funcion(){
if (condicion)
return mi_funcion();
else
return 'a otra cosa mariposa';
}

Con lo cuál, en los casos en que "condición" es verdadero se llama de nuevo a la misma función, en un bucle infinito!! ¿Cuál fue esta vez mi error...? pues que en realidad cuando escribí el código quería llamar a una "mi_segunda_funcion()" en el caso de que "condicion" fuera verdadero... en fin, que me equivoqué con el nombre de la función!!! :((( es uno de esos errores del "copiar y pegar", del que no hace falta que diga mucho más, verdad?! jejeje...

Bueno, en fin, cualquier comentario al respecto será bienvenido, si te ha pasado lo mismo o algo parecido. No dudes en comentarlo aquí... igual que tú has llegado hasta aquí con ese problema, detrás tuyo vendrá más gente a quien le podrá ser útil! no olvides escribir tu solución cuando la halles! ;)

Un saludo!
SERGI
PD: está lloviendo!!! jajajaja... se agradece en este tórrido territorio (desierto de Sonora, México) en donde solo ayer estabamos a 43 grados (a finales de Mayo...).

Redirección interna con RewriteRule, RewriteCond y paso de variables PHP

noreply@blogger.com (Usher web) — Sat, 11 Apr 2009 03:11:00 +0000

Llevo 5 horas leyendo, buscando, probando... y por fin hallé lo que necesitaba!!!!!!!! Lo más frustante ha sido encontrar apenas casos como el mío... lo cuál no acabo de entender pues creo que es de lo más normal.

Mi caso es el siguiente: tengo un site funcionando en inglés

http://midominio.com

y como es un CMS hecho en PHP tengo URLS del tipo:

http://midominio.com/index.php?pag=foro

Lo que necesito es convertir mi CMS en multi-idiomas con los menos cambios posibles y de una forma amigable para usuarios y buscadores. ¿Creo que es algo muy generalizado, verdad? Por eso no entiendo el porque me ha costado encontrar referencias que me ayudaran. Tal vez he estado buscando mal ;)

La solución que buscaba era la de poder tener URLS como

http://midominio.com/es/index.php?pag=foro

que llevara "internamente" (es decir, sin que el visitante se dé cuenta... es decir, sin que camb ie la URL en su navegador) a esta otra URL

http://midominio.com/index.php?pag=foro&idioma=es

De esta forma el visitante podría estar navegando siempre por el "subdominio" /es/ pero en realidad la aplicación de PHP que es llamada es siempre la misma solo que se le pasa la variable idioma y de esta forma puede mostrar los contenidos adecuados! ;)

La última condición que necesitaba cumplir es que el archivo PHP llamado fuera cualquiera y no solo index.php, y que las variables de la URL fueran cualesquiera y cuantas sean necesarias.

Y en fin, después de 5 horas de lecturas y pruebas hallé el contenido del archivo .htaccess que tengo que poner en la raiz de ese dominio:

Options +FollowSymLinks
RewriteEngine On
RewriteRule ^es/$ $1?idioma=es
RewriteRule ^es$ $1?idioma=es
RewriteCond %{QUERY_STRING} ^([^/]+)
RewriteRule ^es/(.+)\.php$ $1.php?%1&idioma=es
RewriteRule ^es/(.+)$ $1

No quiero hacer un tutorial aquí del tema, porque sería larguísimo y además no tengo los conocimientos adecuados. Posiblemente incluso la sintaxis que he utilizado podría mejorarse. Pero voy a detallar lo poco que he entendido de estas líneas de código y su función:

las dos primeras líneas son necesarias sí o sí si se quieren utilizar en APACHE estas reglas de redirección
la 3a y 4a líneas son para añadir "?idioma=es" a la URL cuando no menciona ningún archivo PHP: http://midominio.com/es
las líneas 5a y 6a van "ligadas". La primera "lee" el QUERY_STRING que son las variables $_GET que vienen después del "archivo.php?", y las insertamos en el output de la línea 6a como %1.
la línea 7 es para que se redireccionen todas las demás URLS, esta vez sin añadir nada del idioma, como las imágenes o las hojas de estilo CSS.

Para el que quiera saber más, decir que las sentencias RewriteRule manejan siempre la sintaxis:

RewriteRule input output

En donde input es una "expresión regular" (expresión que usa un lenguaje de comodines) que coincidirá solamente con algunas URLs concretas, y output es simplemente las URLS que finalmente debe construir y llamar Apache, utilizando normalmente "partes" del input. Esas partes son $1,$2,$3... (tal como se utilizan en la sintaxis del output), y se corresponden con el contenido de los diferentes paréntesis () que hay en la expresión regular del input.

Ejemplo:

RewriteRule ^es/(.+)\.php$ $1.php?%1&idioma=es

coincidirá con URLS del tipo:

es/index.php?pag=foro (pag=foro sería el QUERY_STRING,%1)

y será transformada en index.php?pag=foro&idioma=es
Como véis, el nombre del archivo php (index) es una variable! ;)
y el QUERY_STRING también aunque se lee en una línea RewriteCond previa.

La verdad es que el tema es un auténtico lío, jejeje... así que no dudo de que alguno de vosotros no haya entendido la mitad! Lo que si puedo aseguraros es que si queréis entender algo deberíais empezar por leer algún tutorial sobre el tema de .htaccess o de las expresiones regulares, que es de lo que va esto ;)

Suerte!
SERGI

Funciones y operadores en consultas MySQL

noreply@blogger.com (Usher web) — Sun, 14 Dec 2008 04:04:00 +0000

¿Necesitas consultar una tabla MySQL ordenada por un campo al que le aplicas una función? Por ejemplo, tal vez el tipo de datos de una columna es CHAR o VARCHAR, pero en realidad ahí almacenas "numeros decimales", y necesitas hacer un SELECT ordenado según el valor "decimal" de ese campo. En ese caso necesitarás conocer el "operador" MySQL adecuado ;)

Vamos a ver un ejemplo. Supongamos que en mi tabla 'vehiculos' tengo 2 registros solamente con los siguientes campos (los dos del tipo VARCHAR) y valores:

vehiculo	precio
v_1	120,44
v_2	82,33

Si yo ejecuto este query de MySQL:

SELECT * FROM vehiculos ORDER BY precio

Entonces, al ser el campo precio de tipo VARCHAR, los registros se me ordenarán de forma alfabética de menor a mayor, quedando así:

v_1	120,44
v_2	82,33

que no es lo que yo quería conseguir!!! Pues lo que yo quería obtener es los precios ordenados por su valor decimal, es decir, primero el vehiculo de precio=82,33. Entonces la solución pasa por utilizar el "operador" TRUNCATE(valor,num_decimales), dónde puedo utilizar el nombre del campo 'precio' (sin las comillas) como valor, y poner un 2 en num_decimales, con lo que MySQL me ordenará los registros de mi tabla por el valor numérico de 2 decimales correspondiente al campo 'precio' ;)

SELECT * FROM vehiculos ORDER BY TRUNCATE(precio,2)

Igual que este operador, hay una lista bastante larga de operadores numéricos y de cadena para transformar los valores almacenados en los campos de nuestras tablas y que podemos insertar en nuestras consultas MySQL. Y no sólo en el parámetro ORDER BY, sino también en el WHERE on el SET o dónde sea!!!! :D

En la página oficial de MySQL Operator and Function Reference encontraréis la lista completa y como se usa cada uno de ellos! Muy recomendable el echarle una lectura rápida... para al menos saber qué se puede y qué no se puede hacer, jejejeje...

Envía tus archivos encriptados con AES

noreply@blogger.com (Usher web) — Fri, 05 Sep 2008 15:59:00 +0000

Hola amigos. Voy a contaros cómo podemos encriptar muy fácilmente un archivo para poder enviarlo (por email, ftp, etc...) de manera totalmente segura, es decir con la certeza de que nadie que no conozca la contraseña pueda leerlo!!

Buscando por ahí he hallado que uno de los algoritmos de encriptación más populares se llama AES (Advanced Encryption Standard) y es tan seguro que lo utiliza el gobierno de USA para encriptar sus archivos ;)

Así pues, tenemos este algoritmo implementado en toda clase de librerías (PHP,java, C++, etc...) y en toda clase de programas (para windows, mac, Linux, etc..). En SourceForge.Net podéis encontrar 90 aplicaciones opensource (libres y gratuitas).

En concreto, aquí os dejo dos opciones, que son las que yo he encontrado más adecuadas a los usos que voy a hacer de AES.

Cypher, para windows

Tenéis una aplicación sencilla y potente: una vez cargada la aplicación tiene una única ventana sin menús en donde puedes arrastrar cualquier archivo con el ratón y automáticamente te "chupa" la ubicación del archivo. Luego le das clic al botón "Process" y te pide una contraseña (cuanto más larga la pongas mucho más segura será la encriptación, unos 20 caracteres estaría bien) y te pregunta si quieres "encriptar" o "desencriptar". Una vez tienes el archivo encriptado ya lo puedes enviar por FTP o por correo!!! como tú quieras!!! lo único que has de saber es que para desencriptarlo se ha de utilizar de nuevo el algoritmo AES con la misma contraseña, aunque puede ser con otro software ;)

El archivo encriptado ocupa casi lo mismo que desencriptado.. lo cuál es una gran noticia! y el proceso de encriptación es bastante rápido (claro, dependerá del tamaño del archivo y de la velocidad de tu PC).

Este programa del que os hablo se llama Cypher y es opensource. Aquí podéis descargarlo: http://sourceforge.net/projects/cypher

aespipes, para Linux

Para Linux, en concreto para Ubuntu, lo mejor que he encontrado que utilice AES es un programa que se utiliza desde la línea de comandos de la terminal. Para instalarlo haces (en Ubuntu):

sudo aptitude install aespipes

Y para encriptar con 256 bits (máximo):

aespipe -e aes256 -T <archivo_input> archivo_output

por ejemplo:

aespipe -e aes256 -T <mi_agenda.txt> mi_agenda_enc.txt

Si quieres conocer todas las opciones que tiene este comando:

aespipe --help

AES combinado con 7z, para windows-Linux

La aplicación Cypher (para Windows) tiene una limitación: no admite contraseñas de más de 15 caracteres :( Así que es incompatible para utilizar con aespipes (para Linux) puesto que este solo trabaja con contraseñas de como mínimo 20 caracteres.

La solución que he hallado es trabajar en windows con la aplicación (también opensource) Zeus Protection, que hace dos cosas a la vez: encripta con el algoritmo AES el archivo que le pasamos, y genera un archivo comprimido con el resultado utilizando el formato 7z.

"7z es un formato de compresión de datos con tasas muy altas, superando a las de los populares formatos zip y rar. La extensión de fichero para los archivos pertenecientes a este formato suele ser .7z. Puede utilizar diferentes algoritmos de compresión." (citando a Wikipedia)

Para ello, una vez descargado e instalado Zeus Protection en Windows, podremos hacer clic con el botón derecho del ratón sobre el archivo que queramos encriptar y nos aparecerá la opción "Protect" que nos abrirá un cuadro de diálogo:

En ella debemos definir no más de 4 parámetros:

- Protected file name: nombre del archivo comprimido que vamos a generar (se almacenará en la misma carpeta que el archivo que queremos encriptar)
- Compresion level: el grado de compresión que deseamos. Sabiendo que a mayor compresión el archivo ocupará menos kb pero tardará más tiempo en procesarse (lo cuál no se notará si el archivo es pequeño)
- Encryption Password: la clave de encryptación (el tamaño óptimo es de 20 caracteres de longitud)
- Encryption Strength: selecciona "AES 256b encryption" si usas una clave de 20 caracteres

Si los datos anteriores han sido correctamente escritos se te activará el botón "Ok" y podrás empezar a encriptar!

Lo bueno de este método es que a parte de ser muy cómodo (por usarlo con el botón derecho del ratón directamente sobre el archivo a encriptar), también se puede utilizar de igual modo para encriptar toda una carpeta!!! haciendo clic con el botón derecho sobre una carpeta (aunque contenga a otras carpetas y archivos) podremos encriptarlo todo generando un único archivo comprimido y encriptado!!! Genial, no?? para hacer buenos backups totalmente privados e indescifrables!!!

7z en Linux

Si hemos trabajado con Zeus Protection en Windows, podemos trabajar con 7z en Linux instalando dos paquetes, si es que no los tienes ya instalados. En Ubuntu sería así:

sudo aptitude install p7zip p7zip-full

Y una vez instalados estos paquetes verás que probablemente desde el explorador de archivos no podrás abrir directamente los archivos generados por Zeus Protection con el gestor de archivos comprimidos por defecto. Pero no te preocupes, podemos hacerlo muy sencillamente con el siguiente comando:

7z x archivo_7z_comprimido_y_encriptado

Por ejemplo:

7z x mi_agenda.7z

Evidentemente, te pedirá la contraseña ;)

A disfrutarlo amigos!!!
Viva el software libre.
SERGI

Asignación condicional abreviada en PHP

noreply@blogger.com (Usher web) — Wed, 03 Sep 2008 14:40:00 +0000

Para los que todavía estais empezando en esto del PHP, quiero compartir con vosotros, casi a modo de comentario una sintaxis de PHP muy útil para hacer asiganciones condicionales de forma muy compacta.

Codigo de ejemplo 1

<?php

if ($a==1) { $b=2; } else { $b=3; }

?>

Codigo de ejemplo 2

<?php

$b = ($a==1) ? 2 : 3;

?>

Estos dos códigos de ejemplo asignan el valor 2 o el valor 3 a la variable $b según si la variable $a vale 1 o no. Lo que pasa es que tal como podéis apreciar la sintaxis de la segunda asignación es mucho más compacta. De hecho, si es necesario este tipo de condicional se podría utilizar "sobre la marcha":

<?php

echo "Variable b = ".( ($a==1) ? 2 : 3);

?>

Eventos de teclado con Javascript: onKeyPress, onKeyUp y KeyCode

noreply@blogger.com (Usher web) — Wed, 03 Sep 2008 14:02:00 +0000

¿Has necesitado alguna vez controlar con javascript cuándo el visitante de tu web aprieta INTRO cuando está dentro de algún "input" tipo "text", por ejemplo para ejecutar un "submit" del formulario desde javascript en ese momento? La solución es sencilla y pasa por utilizar el evento onKeyPress y la propiedad KeyCode.

Cross-browser y cross-time

Antes que nada, hay que advertir que el mecanismo de hacer esta "captura de
pulsaciones de teclado" ha ido evolucionando al mismo ritmo que han ido evolucionando los diferentes navegadores. Es decir, que si queremos tener un script cross-browser (funcional en "todos" los navegadores), hay que ir con cuidadito y posiblemente el script que utilicemos hoy de aquí a 2 años ya no funcionará en los navegadores más modernos. Creo que es necesario advertirlo porque si uno busca este tema por internet encontrará mil y una soluciones no coincidentes y con resultados distintos. Así que mi consejo es doble: fijaros en la fecha del post y en todo caso, haced vosotros mismos unas cuantas pruebas del script que vayais a implementar ;)

Código HTML

<html>
<h3>Ejemplo de capturar la pulsacion de INTRO en una caja de texto</h3>
Danos tu email:
<input type='text' id='email' onkeypress="javascript:if (getKeyCode(event)==13) alert('Gracias.')" />
<script>
function getKeyCode(e){
e= (window.event)? event : e;
intKey = (e.keyCode)? e.keyCode: e.charCode;
return intKey;
}
</script>
</html>

Podeis comprobar el funcionamiento de este ejemplo aqui.

Yo he probado que funciona en IE6, IE7, FF2 y FF3, estando a Septiembre de 2008. No puedo comprobarlo en otros navegadores porque no tengo más instalados, pero si alguien lo hace, por favor, comenta aquí tu resultado ;)

Nota: en vuestros comentarios leo que también funciona sin problemas en Opera 9.62

Nota: la sintaxis utilizada en la línea e= (window.event)?event:e; se llama asignación abreviada. Si no las ha utilizado nunca, lee esta breve explicación que acabo de postear.

Ampliación 04-02-2009: onKeyUp

La semana pasada decubrí que se puede usar onKeyUp en lugar de onKeyPress, y ciertamente con mejores resultados. Voy a explicar brevemente la diferencia porque creo que a más de uno le va a interesar.

Obviamente ya sabemos todos los que hemos programado en otros lenguajes que contienen eventos que ambos son muy parecidos. Pero en concreto, me gustó más el resultado obtenido con onKeyUp porque detecta "mejor" el momento en el que los valores de la caja de texto cambian! He rehecho la página de ejemplo para que podáis probar la diferencia.

En donde se aprecia muy bien la diferencia es haciendo lo siguiente: escribimos algo de texto en la caja (probadlo en ambas cajas para ver la diferencia) y el texto se irá "copiando" automaticamente en una etiqueta span que tengamos debajo. Hasta aquí ambos eventos funcionan "aparentemente" igual: cada vez que escribimos una letra, se dispara el evento y replica el contenido de la caja en el span.

Sin embargo, una vez tengais escrito algo de texto, seleccionad parte del texto y pulsad una tecla cualquiera y veréis la diferencia entre ambos eventos: onKeyPress no actualiza el contenido del span, pero onKeyUp sí lo hace!. es decir, sí lo hace, pero solamente si luego seguimos pulsando más teclas, pero no lo hace inmediatamente :(

Jejeje, no me preguntéis el porqué ocurre eso, pero creo que nos es útil saberlo, verdad?! Yo lo descubrí proque estaba haciendo una especie de calculadora de precios: necesitaba que en el span saliera automaticamente el precio con IVA de un precio que yo introducía en un input, y necesitaba que funcionara sincronizadamente (como sucede usando onKeyUp).

En PHP recuperar el ultimo ID de un INSERT MySQL

noreply@blogger.com (Usher web) — Tue, 26 Aug 2008 19:49:00 +0000

Programando en PHP, ¿alguna vez has necesitado saber el valor generado para un ID autoincremental después de una consulta tipo INSERT? ¿eres de los que -como yo- se ha complicado la vida haciendo una consulta SELECT para encontrar el id más alto en esa tabla o el max(ID)? Pues anota la siguiente instrucción ;)

Te pondré un simple ejemplo de 3 líneas, y verás qué sencillo: supongamos que tienes una tabla llamada 'mi_tabla1' que tiene un campo ID de tipo AUTO_INCREMENT, y necesitas insertar un registro y luego saber inmediatamente cuál es el ID que se ha generado para él, con tal de poder aprovecharlo en otras tablas.

Veamos esas 3 líneas de código:

mysql_query("INSERT mi_tabla1 SET `mi_campo`='mi_valor'");
$ultimo_ID = mysql_insert_id();
mysql_query("INSERT mi_tabla2 SET `id1`='".$ultimo_ID."'");

Breve explicación: en la primera línea insertamos un nuevo registro en la tabla 'mi_tabla1'. En la segunda línea recuperamos CON UNA SOLA INSTRUCCIÓN el último valor "autogenerado" (tiene que haber un campo AUTO_INCREMENT en esa tabla) por la última inserción realizada en la conexión MySQL establecida por el script en ejecución. En la tercera línea utilizamos ese valor para añadir un nuevo registro con ese ID asociado a un campo que esta vez no será AUTO_INCREMENT, pero que permitirá relacionar los registros de ambas tablas.

Cómo habréis notado, el quit de la cuestión está en la función de PHP mysql_insert_id().

Cómo evitar que los buscadores indexen nuestras páginas seguras

noreply@blogger.com (Usher web) — Tue, 19 Feb 2008 12:10:00 +0000

¿Has incluido páginas SSL seguras en tu sitio web, y los buscadores han empezado a indexarte de nuevo todas tus páginas HTTP como HTTPS, cual duplicados? ¿Sabías que curiosamente eso puede penalizar la posición de tu web en los rankings de esos mismos buscadores?

Como este era mi caso, estuve buscando información para solucionarlo, y aquí os he traducido del inglés un articulo que detalla dos soluciones. El original podéis leerlo en www.seoworkers.com.

Muchos sitios web tienen páginas que utilizan SSL. Esto permite que el intercambio de información entre el servidor y el navegador del visitante suceda en una conexión encriptada, para garantizar la provacidad y la integridad de la misma.

Las URLs (direcciones) de páginas encriptadas con SSL comienzan con https en lugar de con http, para indicar que trabajan sobre un protocolo seguro.

El caso es que si las páginas seguras de tu sitio web han sido indexadas por los buscadores juntamente con el resto de páginas estandar, puedes experimentar serios problemas de canonicalización.

[NT: por ejemplo, que los buscadores consideren que tu página principal sea https://www.midominio.com antes que http://www.midominio.com -tal vez no conteniendo la misma información!!! O también -aún peor- puede que los buscadores interpreten que estás intentando "duplicar" el contenido de tu web con modos fraudulentos, y pueden penalizarte por ello!!! En cualquier caso, es perjudicial para la adecuada presencia de tu web en los buscadores.]

Estos problemas aparecen solo si tienes las páginas seguras dentro del mismo subdominio en el que tienes las páginas estandar.

En cambio, en el caso de que tus páginas seguras las tengas bajo un subdominio exclusivo [NT, por ejemplo: https://pagos.midominio.com] puedes fácilmente excluirlas de la indexación usando el archivo robots.txt en la raíz del directorio de ese subdominio.

En algunos casos solamente una página requiere el uso de SSL (como el formulario de contacto o de pagar). La opción más cómoda y habitual en esos casos es tener esa página siguiendo la estructura estandar del resto del sitio web. Cambiando solamente el "prefijo de protocolo" de la dirección de esa página (de http a https).

Sin embargo, esta técnica es la que nos puede llevar a los problemas de indexación en los buscadores que antes hemos comentado, puesto que los buscadores, si siguen los enlaces que salgan de esa única página SSL, son llevados a "duplicados" de las páginas estandar del sitio, pero con el prefijo https [NT: hay que recalcar aquí que para los buscadores la dirección http://www.midominio.com/servicios.htm es en principio diferente que https://www.midominio.com/servicios.htm, con lo cuál indexará las dos direcciones como páginas diferentes].

Esto sucede porque normalmente todos los enlaces internos dentro de un sitio web son enlaces relativos y por tanto heredan el protocolo y el dominio de la página en donde aparecen.En conclusión, Google -y posiblemente los otros buscadores- pueden considerar esta situación como un intento de "duplicación" de contenidos [NT: técnica que algunos desarrolladores de webs intentan de vez en cuando para engañar a los buscadores, y que por tanto está muy penalizado]. Y esto se traduciría en que los buscadores que quisiseran penalizarte rebajarían la posición de tu página en el ranking páginas en las búsquedas de los internautas.

Una vez indexadas, Google continuará visitando esas páginas seguras de tu sitio, a menos que las excluyas mediante el archivo robots.txt o con meta tags [NT: meta etiquetas] especiales en la cabecera de cada página.

Entonces, ¿cómo puedo evitar que Google visite esas páginas?

Si te encuentras en la posición descrita, te parecerá que no hay manera de solucionarlo fácilmente.

Hay una manera de que el archivo robots.txt redireccione las peticiones de páginas seguras a un segundo archivo que excluiría las páginas seguras a los programas de rastreo.

Para aplicar esta solución, sin embargo, debes usar el servidor Apache en tu hosting con el mod_rewrite activado [NT en inglés "enabled"].

Primero, deberías crear un segundo archivo robots.txt, llamándolo robots_ssl.txt (o el nombre que prefieras), asegurándote de que bloquea a los rastreadores de todos los buscadores. Súbelo a la raíz de tu dominio.

Para más información acerca del archivo robots.txt, qué es y cómo funciona, visita The web Robots Pages [NT: en habla hispana es recomendable WebRecursos - robots.txt].

Aquí tienes un ejemplo de este archivo:

User-agent: Googlebot
Disallow: /

User-agent: *
Disallow: /

Además, necesitarás añadir los siguientes comandos al archivo .htaccess que haya en la raíz de archivos de tu servidor [NT: root document folder]:

RewriteEngine on
Options +FollowSymlinks
RewriteCond %{SERVER_PORT} ^443$
RewriteRule ^robots.txt$ robots_ssl.txt

Resumidamente, este comando ordena al servidor web a dirigir cualquier petición para el archivo robots.txt que provenga del puerto 443 (usado para las conexiones SSL, en lugar del puerto 80 habitual para las conexiones web estandar) al segundo archivo que creamos, y que bloquea la indexación.

Para poder comprobar que está funcionando esta técnica, escribe la URL de tu archivo robots.txt en tu navegador para ver el comportamiento habitual del mismo para comandos estandar. Y luego prueba a escribir la misma URL pero con el prefijo de protocolo seguro (https) y deberías ver el contenido del segundo archivo, robots_ssl.txt.

¿Qué puedo hacer si no puedo utilizar mod_rewrite?

Si te es imposible activar mod_rewrite, ya sea porque no utilizas un servidor Apache, o porque no está habilitada esta función, todo lo anterior no te sirve de nada.

Si utilizas PHP para generar las páginas de tu site, puedes utilizarlo para comprobar si se está llamando a tu página mediante SSL, y en caso afirmativo puedes incluir un meta tag en la cabecera [NT: head] de tus documentos para desactivar la indexación por los buscadores.

El siguiente código, situado en cualquier parte de la cabecera de tu documento [NT: entre <head> y </head>] insertará el meta tag robots si el valor de la variable HTTPS del servidor está establecida a 'on':

<?php

if (isset($_SERVER['HTTPS']) && strtolower($_SERVER['HTTPS'])=='on'){

echo "<meta name='robots' content='noindex,nofollow'>"."\n";

}

?>

Para verificar el funcionamiento correcto de este código, visita cualquier página en la que lo hayas incluido utilizando SSL (https://www.midominio.com/archivo.php). Y luego usa el comando ver codigo fuente de tu navegador para comprobar que el metatag aparece insertado en la cabecera del documento.

Enlaces de interés

Preventing search engine indexing of secure pages (artículo original)

Redirección 301 en PHP para migraciones de dominio

JSON, contenidos dinamicos en tu web

noreply@blogger.com (Usher web) — Fri, 09 Nov 2007 17:25:00 +0000

¿Has intentado utilizar AJAX pero te parece muy complicado o tal vez sus librerías las encuentras muy pesadas de cargar? JSON es su hermano pequeño, y aunque es anterior en el tiempo es más que suficiente para la mayoría de aplicaciones web y es mucho más sencillo de utilizar. Veamos un sencillo pero operativo ejemplo a continuación, que tú podrás cambiar a tu medida, y además por lo que he probado funciona perfectamente en IE (Internet Explorer 6) y en FF (FireFox 2).

No ha sido una tarea fácil conseguir que este código funcionara. Me he pasado horas y horas buscando documentación oficial de los objetos utilizados, he consultado en foros, etc... y por fin, después de copiar y pegar de aquí y de allá, parece que el esfuerzo se concretó en algo operativo y multiplataforma ;)

Nuestro ejemplo consta de 4 archivos:

index.htm. Es el documento HTML que verá el visitante en el navegador y el que irá haciendo las llamadas al servidor SIN NECESIDAD DE RECARGARSE LA PÁGINA.
json_1.php. Es el archivo PHP al que llamará index.htm cuando necesite nuevos datos.
funciones.php. Contiene dos funciones en PHP necesarias para preparar los datos que quiera enviar json_1.php a index.htm.
smile.gif. Es una imagen que utilizaremos de ejemplo, para comprobar que con JSON podemos trabajar dinámicamente en nuestras aplicaciones web con texto y con imágenes.

Antes de mostraros el código, deciros que como veréis, es muy claro qué debéis adaptar a vuestro caso, y que las posibilidades son ilimitadas utilizando estas pocas funciones. Lo que más problemas me dió fue -como sucede a menudo- que funcionase todo bien en IE y en FF. Cuando me iba en uno no me iba en el otro... en fin... parece que ahora ya sí. Bueno, al menos hasta que alguno de esos dos navegadores vuelva a cambiar ("mutar" ?).

Para hacer funcionar el ejemplo, debéis poner los 4 archivos en una misma carpeta de vuestro servidor y desde un navegador llamar al archivo index.htm. Así de sencillo. Ah, y bueno, para que lo tengáis más fácil, os dejo este enlace para que podáis descargaros un RAR con el ejemplo listo para probar ;)

También podéis ver el ejemplo funcionando. No os podéis quejar :)

index.htm

<html>
<head>
<title>.: JSON - ejemplo sencillo :.</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>

<body>

<a href="javascript:remote_fill('json_1.php?color=rojo');">ROJO</a>
<a href="javascript:remote_fill('json_1.php?color=azul');">AZUL</a>
<br /><br /><br />
<span id='json_grafico'></span>
<span id='json_texto'></span>

<script>
// INTENTAR LA CREACION DE UNA CONEXION DIRECTA CON EL SERVIDOR MEDIANTE XMLHttpRequest

function createRequest() {
try {
request = new XMLHttpRequest();
} catch (trymicrosoft) {
try {
request = new ActiveXObject('Msxml2.XMLHTTP');
} catch (othermicrosoft) {
try {
request = new ActiveXObject('Microsoft.XMLHTTP');
} catch (failed) {
request = false;
}
}
}
if (!request)
alert('Su navegador no permite crear uns instancia de XMLHttpRequest, ni de Msxml2.XMLHTTP, ni de Microsoft.XMLHTTP. Esta característica es indispensable para seguir trabajando en esta aplicación web.');
}

var request = false;
createRequest();

// FUNCIONES DE TRABAJO CON EL SERVIDOR

function remote_fill(url_remote){
request = false;
createRequest();
if (!request){
alert('Su navegador no permite crear uns instancia de XMLHttpRequest, ni de Msxml2.XMLHTTP, ni de Microsoft.XMLHTTP. Esta característica es indispensable para seguir trabajando en esta aplicación web.');
return false;
}
request.onreadystatechange = handle_json;
request.open('GET', url_remote, true);
request.send(null);
}

function handle_json() {
if (request.readyState == 4) {
if (request.status == 200) {
var json_data = request.responseText;
var the_object = eval( '(' + json_data + ')' );
document.getElementById('json_grafico').innerHTML= the_object.grafico_pertinente;
document.getElementById('json_texto').innerHTML= the_object.texto_pertinente;
} else {
alert('Ha habido un problema con la URL ');
}
}
}

remote_fill('json_1.php?color=blanco');

</script>

</body>
</html>

json_1.php

<?php
if (!isset($_GET['color'])) return false;
include_once("funciones.php");

$ret = array();
switch ($_GET['color']){
case "rojo":
$ret['grafico_pertinente'] = "<img src='smile.gif' style='border:1px #ff0000 solid' />";
$ret['texto_pertinente'] = " borde rojo";
break;
case "azul":
$ret['grafico_pertinente'] = "<img src='smile.gif' style='border:1px #0000ff solid' />";
$ret['texto_pertinente'] = " borde azul";
break;
default:
$ret['grafico_pertinente'] = "<img src='smile.gif' style='border:0px #ff0000 solid' />";
$ret['texto_pertinente'] = " escoge un color para el borde, y el servidor devolverá la respuesta";
break;
}

echo php_json_encode($ret);

?>

funciones.php

<?php

// funciones JSON
function json_encode_string($in_str)
{
//$charset = "UTF-8";
$charset = "ISO-8859-1";
mb_internal_encoding($charset);
$convmap = array(0x80, 0xFFFF, 0, 0xFFFF);
$str = "";
for($i=mb_strlen($in_str)-1; $i>=0; $i--){
$mb_char = mb_substr($in_str, $i, 1);
if(mb_ereg("&#(\\d+);", mb_encode_numericentity($mb_char, $convmap, $charset), $match))
$str = sprintf("\\u%04x", $match[1]) . $str;
else
$str = $mb_char . $str;
}
return $str;
}

function php_json_encode($arr){
$json_str = "";
if(is_array($arr)){
$pure_array = true;
$array_length = count($arr);
for($i=0;$i<$array_length;$i++){
if(! isset($arr[$i])){
$pure_array = false;
break;
}
}
if($pure_array){
$json_str ="[";
$temp = array();
for($i=0;$i<$array_length;$i++)
$temp[] = sprintf("%s", php_json_encode($arr[$i]));
$json_str .= implode(",",$temp);
$json_str .="]";
}else{
$json_str ="{";
$temp = array();
foreach($arr as $key => $value)
$temp[] = sprintf("\"%s\":%s", $key, php_json_encode($value));
$json_str .= implode(",",$temp);
$json_str .="}";
}
}else{
if(is_string($arr)){
$json_str = "\"". json_encode_string($arr) . "\"";
}elseif(is_numeric($arr)){
$json_str = $arr;
}else{
$json_str = "\"". json_encode_string($arr) . "\"";
}
}
return $json_str;
}
?>

Evitar que envien SPAM desde nuestro site

noreply@blogger.com (Usher web) — Sun, 26 Aug 2007 13:55:00 +0000

Dos meses atrás alguien utilizó una de mis páginas web para enviar SPAM masivo desde mi servidor. Me di cuenta porque me venían miles de mails devueltos que me saturaban el buzón de correo continuamente. Con la inestimable ayuda de los responsables técnicos del hosting (www.hospedajeydominios.com) descubrimos donde estaba el agujero, analizando el registro (archivo LOG) de mi cuenta de hosting. Una vez descubierto el "agujero de seguridad" probé 2 ó 3 retoques de mi código PHP para evitar el ataque ;) A continuación doy los detalles.

Problema

Como dije, analizando el archivo del servidor que registra las llamadas a archivos de mi cuenta, descubrimos que alguien utilizaba los enlaces de mi aplicación web para pasar como argumento la dirección URL de una web maliciosa.

Es decir, mi aplicación de PHP utiliza links como éste:

<a href="index.php?pag=productos">productos</a>

y los que enviaban spam lo alteraban por:

index.php?pag=http://pagina.maliciosa.com/envio_spam

simplement llamando a esa dirección desde un navegador, o tal vez a través de alguna aplicación que hace las llamadas de forma automatica cada cierto tiempo. La cuestión es que cada vez que ellos llamaban a mi archivo index.php pasandole esa URL como argumento, mi servidor enviaba miles de mails de SPAM !!!!!

Solución

La buena noticia es que una vez es conocido el ataque y su funcionamiento, es rápido y fácil desarrollar una defensa. En concreto, basta con que el archivo index.php compruebe primero que la variable pag no contiene una cadena que comience por "http:".

if (strtolower(substr($_POST['pag'],0,5))=='http:' or
strtolower(substr($_GET['pag'],0,5))=='http:') return;

Fijaros que se comprueba que la variable pag -sea pasada con el método POST (normalmente desde formulario) o con el método GET (normalmente embebido en una URL)- no comience por http. En caso de que así sea se ejecuta return; con lo que se detiene la ejecución del script.

Ni que decir tiene que inmediatamente incorporé esta comprobación al inicio de todos mis archivos index.php o similares de todas mis aplicaciones web ;) Y bueno, ya hace más de dos meses de eso y no he vuelto a tener problemas con ese tipo de SPAM. Espero que a más de uno le sirva!!

Que es SEO?

noreply@blogger.com (Usher web) — Thu, 16 Aug 2007 08:37:00 +0000

SEO son las siglas inglesas que significan: Search Engine Optimization, que en español se traduciría literalmente por: Optimización para Buscadores, o de una forma más significativa: Optimización de una Web para su Posicionamiento en el Ranking de Páginas de los Buscadores.

Es decir, por SEO se entiende el conjunto de conocimientos y tareas necesarias para conseguir que un sitio web tenga más presencia en las búsquedas que realizan los internautas en los buscadores (todos en general, pero principalmente Google, Yahoo y MSN-Live). ¿Porqué ese interés? pues porque cuantas más veces salga un sitio web en las páginas de los buscadores, más visitas obtendrá el sitio en cuestión. Y no solo se trata de una cuestión cuantitativa, sino cualitativa: las tareas de SEO se enfocan habitualmente en promover la aparición de nuestro sitio en los buscadores para cuando los internautas busquen unas palabras clave concretas y no otras cualesquiera.

También es habitual llamar SEO al profesional que realiza estas tareas de optimización de webs para su mejor posicionamiento en buscadores. Son profesionales que conocen el funcionamiento de los buscadores, que conocen las técnicas de desarrollo web, y que tienen nociones de marketing. Por la rapidez con que cambian las cosas en internet, además estos profesionales están permanentemente implicados en la actualidad de la red, es decir, no solo actúan sino que también leen a diario noticias, articulos y blogs del sector.

En internet puedes encontrar muchos tutoriales de referencia y recopilaciones de técnicas SEO, para que puedas iniciarte o ampliar tus conocimientos. Si te vas a iniciar en ello, te recomiendo que empieces con el artículo de WIKIPEDIA dedicado al posicionamiento en buscadores.

Formulas matematicas en tu web

noreply@blogger.com (Usher web) — Wed, 01 Aug 2007 11:05:00 +0000

¿Has intentado alguna vez editar contenidos de texto o web con fórmulas matemáticas? Ya sea con un procesador de texto o para web, siempre ha sido una tarea compleja para la cuál una de las mejores soluciones ha venido siendo tradicionalmente LaTeX. Y para la web, te recomiendo mimeTeX que es una librería CGI fantástica: rápida y de resultados impactantes.

En este caso una imagen valdrá más que mil palabras: la fórmula matemática que aparece aquí abajo está generada con mimeTeX, y lo único que ha hecho falta es que yo incluya el siguiente código HTML:

<src="http://www.forkosh.dreamhost.com/mimetex.cgi?x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}">

Esta fórmula ha sido generada instantáneamente en el servidor de www.forkosh.com pero el uso de mimeTeX está recomendado de otra forma: te descargas el CGI que ellos ofrecen con licencia GPL y te lo instalas en tu propio servidor, y entonces las llamadas a mimeTeX de las fórmulas de tu web las haces apuntar a tu propio servidor.

Si analizamos la URL (src) de la imagen a la que llamamos:

http://www.forkosh.dreamhost.com/mimetex.cgi?
x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}

veremos que tiene dos partes. La primera es la dirección en dónde tenemos instalado mimeTeX, y la segunda es la fórmula que le pasamos para que traduzca a imagen. Esta fórmula utiliza las reglas del difundidísimo y tradicional LaTeX. Así que lo único que necesitas para utilizar un recurso como éste es aprender lo indispensable de LaTeX, lo cuál es bastante sencillo. En la página de Wikipedia dedicada a LaTeX podéis encontrar un artículo muy interesante y al final una sección de enlaces recomendados en los que aparecen varios tutoriales de diferentes niveles.

De todas formas, debe haber algún que otro plugin para editores web como FCKeditor, aunque lo desconozco, así que si alguno de vosotros lo descubre, por favor, comentadlo aquí ;)

Solamente una aclaración para terminar. Hay otras librerías aún de mayor calidad gráfica que permiten generar instantáneamente imágenes GIF o PNG a partir de fórmulas escritas en LaTeX, sin embargo, exigen que tu servidor tenga instalado ciertas librerías en la raíz del servidor, lo cuál sigue siendo impracticable si uno utiliza un servidor compartido. Por eso mimeTeX adquiere un valor extraordinario por su flexibilidad de uso. Disfrútenlo.

Tendencias de moda y de mercado

noreply@blogger.com (Usher web) — Sat, 21 Jul 2007 10:18:00 +0000

¿Te gustaría saber cuál es la tendencia del público en demandar tus productos (o los productos de otros)? ¿Te gustaría verlo en gráficas de colores que muestran la evolución de esas tendencias a lo largo de los últimos 3 años? Pues puedes disfrutarlo en Google Trends, el último juguete tecnológico de Google.

Esta gráfica de ejemplo muestra las veces que se ha buscado en Google desde España en los últimos años las palabras clave:

hotel barato
hoteles baratos
hostal
hostales
apartamentos

Ciertamente, esta herramienta permite explorar con agilidad las tendencias de moda y de mercado, y además permite filtrar los resultados por país!!! Así pues será de provecho para planificar la salida de nuevos servicios o productos, o para potenciar los mismos en nuestras páginas web (Search Engine Optimization, SEO) y/o en nuestras campañas de marketing online.

Google Page Creator GRATIS

noreply@blogger.com (Usher web) — Mon, 16 Jul 2007 14:54:00 +0000

Increíble pero cierto: Google ofrece gratis la posibilidad de crearte tu propio site. Todo es sencillo y sin gastar ni un céntimo: te hospeda la página en sus servidores (puedes subir imágenes para tus páginas!), te da un dominio (del tipo "midominio.googlepages.com") y todo se hace con un sencillo editor de páginas web que funciona en el navegador (es decir, no necesitas instalar nada en tu PC y puedes cambiar tu página web cuando quieras desde donde quieras!).

De momento he practicado poco con esta herramienta (Google Page Creator), pero puede dar mucho juego. Para que te hagas una idea, podemos buscar en internet cuantas páginas ya hay creadas con Google Page Creator.

Para ello ves al buscador de Google y escribe en la casilla de búsqueda lo siguiente: site:googlepages.com. Lo cuál te mostrará todas las páginas que el buscador tiene indexadas del sitio "googlepages.com" (a día de hoy casi medio millón!!... me sonrojo de darme cuenta que no he sido de los primeros en descubrir esta herramienta, jejejeje).

Sigo pensando que si uno necesita una página avanzada, este tipo de herramientas no son nunca lo ideal. No hay nada como el trabajo a medida de un equipo de diseñadores y programadores, sea cual sea el presupuesto que tengamos. Sin embargo, no se puede negar que esta herramienta permite disponer de una página web improvisada en unos pocos minutos, y para muchos usuarios es más que suficiente!.

Estos son unos cuantos ejemplos de páginas hechas con Google Page Creator, en ellas puedes ver hasta dónde se puede llegar:

http://diario.egipto.googlepages.com

http://javier.a.vinasco.googlepages.com/home

http://borgonoz.googlepages.com/jornadas

http://ahorronline.googlepages.com/depositos-y-cuentas.htm

Paginas web GRATUITAS

noreply@blogger.com (Usher web) — Thu, 12 Jul 2007 12:11:00 +0000

¿Estás empezando en esto de internet y las páginas web y quieres saber cómo se puede tener una página web gratuita? Déjame darte cuatro ideas.

Que necesitas para tener web

Los siguientes elementos nunca faltarán, aunque te la hagas tú o te la haga un profesional de internet, y sea del tipo que sea la página:

El conjunto de archivos que son en sí el material textual o gráfico que va a mostrarse o que va a estar detrás de la web (textos, imagenes, animaciones, videos, audio, bases de datos, código de servidor, etc...)

Un servidor de páginas web gratuito o de pago, dónde se colocan todos esos archivos para que luego sean accesibles en internet.

Un nombre de dominio (por ejemplo: www.midominio.com) para poder acceder a esos archivos en ese servidor desde cualquier navegador.

paginas GRATIS ???

Evidentemente que pagando uno puede tener todo lo anterior, pero también es cierto que de forma gratuita puedes acceder a tenerlo, aunque con alguna restricciones. De ti y de los objetivos que te hayas marcado dependerá de que sea suficiente o no.

En todo caso, para empezar, hay que decir que los tres puntos anteriores son independientes en este sentido: puedes contratar uno solo de ellos si lo crees conveniente. Es decir, podrías pagar a alguien para que te realice la página web, pero luego ponerla en un servidor gratuito y bajo un dominio genérico (terra, blogger, yahoo, geocities, etc...). O al contrario (mucho más común por supuesto), hacerte tú la página pero pagar un hosting mínimo (uno de calidad media los encuentras fácilmente por 2 euros al mes! eso todo el mundo se lo puede permitir) y registrarte un dominio a tu nombre (www.misuperweb.com) . El registro de un dominio cuesta entre 5-20 euros al año según quien te gestione el dominio, lo más recomendable es que te lo registre la misma empresa que te proporciona el hosting (por ejemplo, www.hospedajeydominios.com).

Además, si tú página es mínimamente visitada (al menos 2 visitas por día), puedes poner publicidad (anuncios textuales o banners gráficos de terceros) y posiblemente con lo que ganes costeas de sobras los gastos de hosting y de dominio. Es cuestión de hacer una página interesante y luego calcular un poco tus posibles ingresos.

Un BLOG es un buen inicio

A día de hoy casi todo el mundo sabe lo que es un blog, pero quiero resumirlo por si alguien realmente es nuevo en esto. Para empezar lo más cómodo es crearte tu propio blog en algún sitio que los oferten gratuitos, como por ejemplo BLOGSPOT, dónde está ubicado el presente blog. A día de hoy también, además muchos recursos están no solamente en inglés sino también en español, con lo cuál se trata de herramientas abiertas a cualquier tipo de usuario. Y es una solución no sólo gratuita sino rápida: en menos de una hora puedes tener tus textos e imágenes fácilmente publicadas en un una web que está hospedada gratuitamente y con una dirección (dominio) también gratuitos.

Normalmente, un blog creado en un sitio así gratuito suele tener una URL (dirección web) de acceso perteneciente al dominio del que ofrece el servicio gratis: miblogpersonal.blogspot.com, por ejemplo. Según con qué objetivo estés creando tu web esto puede ser un inconveniente, puesto que más bien preferirías que tu blog tuviera una dirección más cómo esta: www.miblogpersonal.com. De todas formas, eso es "corregible": siempre puedes registrar el dominio que más te guste y después redireccionarlo hacia tu blog, de forma que la gente al fin y al cabo accederá a tu blog por www.miblogpersonal.com. Hay varios modos de redireccionar una página a otra y eso será motivo de otro post otro día ;) Sin embargo, he leído que BLOGSPOT ya ofrece este servicio de "redireccionamiento" de forma fácil, e igualmente gratuita, para que puedas ubicar tu blog en cualquier otro dominio. Aunque como te digo, en la practica puedes hacerlo con cualquier tipo de blog, tal vez en el peor de los casos es un problema de leer y buscar un poco por ahí.

Por último, comentar que un blog tiene sus limitaciones en cuanto a distribución de contenidos: es una estructura bastante rígida, y para finalidades comerciales está un poco limitada, en el sentido de que no te dará mucho juego, sobre todo si además no tienes conocimientos de programación web (HTML, javascript, etc.).

Espero haberte ayudado a resolver alguna de tus dudas. Si quieres comentar algo, con gusto te daré mi opinión. Mucha suerte en tu proyecto y un consejo: lee y planifica tus pasos antes de hacer nada! ;)

Ciclo vital de cualquier WEB

noreply@blogger.com (Usher web) — Tue, 10 Jul 2007 15:15:00 +0000

DESARROLLO + PROMOCION + RENTABILIDAD

Si te preguntas, ¿y después de crear mi página qué hago? Si no tienes muy claro cómo es el mundo de la promoción en la web. Déjame resumirlo con tres imágenes bien sencillas pero muy potentes: 1) DESARROLLO de la web, 2) PROMOCIÓN de la misma (conseguir que la visiten), 3) RENTABILIZAR la inversión de dinero o tiempo (analizar y optimizar los ingresos o beneficios que genera o que debería generar).

	Si quiere tener presencia en internet, lo primero que necesita es una página web. Las hay de muchos tipos: blogs, páginas corporativas-catálogo, tiendas virtuales, aplicaciones web para clientes y proveedores, etc. Hay muchas maneras de conseguir tener una de estas páginas web, pero la más aconsejable, como en cualquier ámbito de empresa es contratar los servicios de profesionales del sector. En definitiva, repercutirá en el retorno de inversión de la misma.
	Una vez que tiene su página web terminada y publicada en un dominio, el siguiente paso es conseguir que le visiten su página personas que se adaptan a cierto perfil de su interés. Técnicamente es lo que se denomina generar tráfico cualificado. A día de hoy, un 75% de los internautas que llegan a una página web provienen de los buscadores (Google, MSN-Live, Yahoo, etc..). Eso sí, siempre que esa página web aparezca en las primeras posiciones del buscador por alguna palabra clave de su sector. A eso se le llama posicionamiento orgánico en buscadores. Precisamente a día de hoy hay miles de profesionales especializados en SEO (Search Engine Optimization), que dominan una amplia gama de técnicas que ayudan a que una página web aparezca en los buscadores cuando alguien busca en ellos algo relacionado con sus productos o servicios. Los buscadores también ofrecen la posibilidad de que una página web aparezca siempre en la primera página de búsqueda, eso sí pagando. Técnicamente se le llama posicionamiento inorgánico. Es más eficaz pero bastante más costoso que el método anterior. A parte de la promoción en buscadores, usted también puede generar tráfico hacia su web colocando publicidad en forma de banners gráficos en páginas de terceros; normalmente pagando bastante, pero controlando mejor el perfil de sus visitantes.
	La rentabilidad de una página web o retorno de inversión debe medirse siempre en función de los objetivos de la web. De hecho, el concepto de rentabilidad debería estar muy presente en las otras dos fases: desarrollo y promoción. Habrá casos en los que el retorno de inversión se traducirá en número de personas que alcanzan a entrar en nuestra web y llegan a conocer quienes somos. Habrá casos en los que el retorno de inversión se medirá por el número de productos que consigamos vender en ella, o por el número de afiliados que podamos conseguir. Además siempre hay la posibilidad de ganar un buen dinero extra a partir de poner anuncios publicitarios (sponsors) de terceros. Eso sí, siempre que nuestra página web sea suficientemente visitada y de calidad. Con un buen plan de gestión publicitaria en su web, probablemente podrá costear los gastos de mantenimiento de la misma con holgura.

Mail HTML con imagenes incrustadas en base64

noreply@blogger.com (Usher web) — Sun, 01 Jul 2007 19:11:00 +0000

¿Quieres crear un mail HTML con imagenes insertadas que los programas de correo no bloqueen antes de visualizar? Por ejemplo, ¿quieres utilizar una firma con una imagen y que la imagen siempre se visualice sí o sí, sin que aparezca como un archivo adjunto a tus emails? Vamos a ver cómo.

Igual que te habrá pasado a ti, antes de llegar a aquí habrás probado mil cosas: poner direcciones absolutas en los "src" de tus imagenes (en el codigo HTML), enviarte un mail para luego reenviarlo esperando que la segunda vez que lo envies la imagen ya vaya incrustada o embebida en el mail, etc... Posiblemente, además hayas leido mil y un métodos que habrás probado sin estar del todo satisfecho con los resultados. Muchos de ellos funcionan, pero parcialmente.

Quiero convertir con vosotros el siguiente método que hasta el momento me ha funcionado muy bien. Sentíos libres de comentar aquí vuestros resultados. Al final de mi explicación expondré lo que sé en cuanto a sus limitaciones.

Nuestro objetivo va a ser conseguir firmar nuestros mails con un logotipo de nuestra empresa, de forma que éste se cargue inmediatamente en el programa de correo del destinatario, sea cuál sea (outlook, thunderbird, webmail, etc...).

Básicamente, el "truco" consiste en que nuestra firma sea un pequeño trozo de código HTML que entre otras cosas incluya una etiqueta de imagen (<img src="..." />) con el logo de la empresa pero encapsulado o embebido codificado en base64. De esta forma, el mail pesará ligeramente un poco más, pero desde luego compensa por la efectividad del método: la imagen será decodificada en cuanto se intente visualizar el mail sea donde sea... en un programa gestor de correo local (outlook, thunderbird, etc...) o en una página de webmail (es decir, en un navegador).

Pasos:

Pasar la imagen (JPG o GIF) a base64

construir un archivo HTML conteniendo esa imagen en un tag <img>

insertar ese archivo HTML al final de nuestros mails como firma predeterminada

Para pasar la imagen (JPG o GIF) a base64, lo más fácil es utilizar algún recurso on-line que nos haga el trabajo. El que yo utilizo es Base64 online. Con el botón "examinar" indicamos cuál es el archivo del que queremos obtener su codificación en base64. Y luego clicamos el botón "convert de source data". Por ejemplo, si codificamos la siguiente imagen

obtenemos el siguiente código:

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
hYpzpaWlqWqdf//Z

Para copiarlo todo fácilmente te recomiendo que hagas un clic dentro del recuadro donde está el código a copiar, y utilices el menú que aparece al hacer clic con el botón secundario del ratón. Primero clica en "Seleccionar todo", y luego en "copiar".

El segundo paso consiste en construir un código HTML que inserte nuestro logotipo en base64. Para ello puedes simplemente elaborar ese código HTML trabajando con la imagen tal como lo harías habitualmente (src="http://....") y luego reemplazaremos el src por el código en base64 de esa imagen.

Este es un ejemplo de cómo podría ser esa firma:

<table style="border:1px #c5a500 solid;font-family:'trebuchet ms',verdana;font-size:14px;" cellpadding='15'>

<tr>
<td>
<img id='logo'
src="data:image/jpg;base64,/9j/4AAQSkZJRgABAQEASAB
IAAD/4QAWRXhpZgAATU0AKgAAAAgAAAAAAAD//gAXQ3JlYXRlZCB3
aXRoIFRoZSBHSU1Q/9sAQwADAgIDAgIDAwMDBAMDBAUIBQUEBAUKB
wcGCAwKDAwLCgsLDQ4SEA0OEQ4LCxAWEBETFBUVFQwPFxgWFBgSFB
UU/9sAQwEDBAQFBAUJBQUJFA0LDRQUFBQUFBQUFBQUFBQU
...
E+G4Fx5bSHB0AUof3Y0QUarvPL9GnN91JHQ+Cv8AvqS9FbPh9mvDkF
takqx6wxz8dbJSpO9QrfDo
hYpzpaWlqWqdf//Z" />
</td>
<td style="vertical-align:middel;">
<p><b>Mi nombre</b>
<br /><a href="http://www.imasdeweb.com" style="color:#c40000;">
<b>www.imasdeweb.com</b></a></p>
</td>
</tr></table>

Y el aspecto que tendría en el email es:

Sergio Rodríguez Ríos

www.imasdeweb.com

Lo último que quedaría es grabar este código HTML en un archivo con extensión .htm y configurar nuestro programa de correo para que utilice de forma predeterminada ese archivo como firma de nuestros emails. Espero que lo disfrutéis!!!

Quiero CREAR paginas WEB

noreply@blogger.com (Usher web) — Fri, 15 Jun 2007 10:44:00 +0000

¿Quieres crear páginas web y te preguntas hasta donde puedes llegar o qué puedes empezar a aprender para avanzar? Déjame darte la opinión de un humilde autodidacta con más de 7 años a la espalda metido en el mundillo.

Por orden iré enumerando algunos pasos que podrías seguir:

crear un Blog
aprender a retocar fotos
aprender HTML
aprender CSS
programación en Javascript
copiar y pegar DHTML ;)
bases de datos: PHP y MySQL
gestores de contenidos: Drupal, Joomla, PHPnuke, PostNuke, etc.

Déjame que explique un poco cada punto, por si alguno de vosotros se inicia en esto:

De buenas a primeras, sin ningún conocimiento específico ya puedes crearte un BLOG, como por ejemplo aquí en Blogger. Que nadie piense que un Blog solo sirve como "diario personal". Al contrario, si buscas por internet encontrarás gente que utiliza los blogs para las cosas más variopintas: carta de presentación de empresas, asociaciones, grupos musicales, etc; albumes de fotos (fotoblog), para artistas de la imagen o para tus viajes; promoción de tus productos o servicios; incluso si consigues -sea como sea- un número de visitas considerbale puedes albergar publicidad de otros en tu blog, ganando comisiones por ello!

En cuanto te pongas a generar contenidos en una web te darás cuenta de que lo que vas a necesitar es incluir alguna que otra imagen (dibujos, fotos, etc...) en tus páginas. Mi consejo es que sigas algún tutorial básico para aprender lo mínimo indispensable para editar fotos: cambiarlas de tamaño, recortarlas, mezclarlas para hacer un poster, y de ahí en adelante lo que quieras. En particular te aconsejo que te descargues GIMP que es gratuito (es el Photoshop Opensource, por llamarlo de alguna manera). En esta página encontrarás el programa y tutoriales en español de cómo utilizarlo.

Si los dos puntos anteriores ya los controlas, el siguiente paso lógico es aprender algo de HTML, con un tutorial básico te bastará, o con artículos sueltos que te introduzcan poco a poco. Mi mejor consejo: "aprende a medida que vayas necesitando", no te servirá de mucho leer 10 manuales completos de HTML. Mejor que cuando necesites aprender a hacer algo concreto busques en internet ayuda: descubrirás que en los foros están casi todas las preguntas respondidas. Eso sí, si quieres aprender vas a tener que leer muchos foros ;o) Para empezar te recomiendo que entres en la página de desarrolloweb.com en donde encontrarás de todo y en español!!!! Este enlace que te he dado lleva a la sección que ellos han llamado: Aprende a crear webs desde cero.

El complemento ideal para HTML es CSS, dedica tan solo 5 horitas a aprender algo de CSS, y tus páginas cobrarán vida y color; dedicale 50 horas y tus páginas serán tan atractivas como las de los profesionales!!! Claro, eso sí... también dependerá tu creatividad. Puedes empezar con este manual también de desarrolloweb.com (te dan la opción de descargartelo, creo que pagando, pero puedes leerlo sin pagar allí mismo... mira hacia la mitad de la página donde aparece el listado de capítulos.

Así como con CSS se trabajan aspectos como colores, tamaños, distancias, estilos de fuente, de párrafo, características de las tablas (colores de fondo, bordes, sangrados, márgenes, etc...), te encontrarás limitado en cuanto quieras darle un poco más de interactividad a tus páginas. Para ello tendrás que introducirte en la programación en Javascript. Esto puede parecer palabras mayores para algunos, especialmente por la palabra "programación". Sin embargo, como en los temas anteriores, aprender unas nociones básicas siempre es fácil y está al alcance de todo el mundo. Y como mínimo, siempre puedes utilizar y adaptar ejemplos de código de otros. Yo creo que así hemos aprendido todos: con ejemplos!!! Vamos, que lo que no te va a evitar nadie es invertir un montón de horas. Y aquí, más que nunca te recuerdo mi mejor consejo: "aprende a medida que vayas necesitando". Por ejemplo, supongamos que te gustaría crear un reloj que mostrara la hora en tu página, pues ves a un buscador y busca exactamente "javascript reloj" y verás que te aparecerán multitud de manuales, entradas en foros y artículos que te explicarán cómo hacerlo con código de ejemplo y todo.

Yo diría que el paso definitivo y profesional en el diseño de páginas web es aprender a mezclar el HTML, el CSS y el Javascript: aprende a incluir DHTML (HTML Dinámico) en tus páginas. Para que me entiendas, te permitirá hacer cosas como esos menús tan atractivos que se despliegan al pasar por encima. No es necesario que sepas programar en DHTML (lo cuál sólo está al alcance de gente con bastante experiencia en programación), sino que que bastará aprender a utilizar el código de otros en tus páginas. La mejor página con diferencia que he encontrado del tema es DHTMLgoodies en la que han puesto multitud de código ya listo para utilizar en tus páginas, para hacer de todo y del modo más profesional: menús, efectos de arrastrar y soltar, etc... increíble lo que hacen con DHTML. No dudes en gastar 15 minutos de tu tiempo en hacerle una visita rápida.

Llegados a un nivel de usuario avanzado (supongamos que más o menos ya sabes hacer todo lo anterior) lo que a uno le llama poderosamente es indudablemente la necesidad de trabajar con bases de datos y crear páginas dinámicas de gestión de contenidos: crear una base de datos en un servidor y crear las páginas HTML necesarias para acceder a ellas (grabar datos, leerlos, editarlos y eliminarlos). Y qué te voy a contar, en este campo las alternativas son innumerables!!!! A falta de datos fiables, pero en base a lo que veo en internet a diario, las dos plataformas más extendidas (diría que se comen más del 90% de las webs) son el paquete Microsoft (páginas ASP con bases de datos en SQLserver o Access) y el paquete Opensource (por tanto gratuito) PHP y MySQL. La principal diferencia es que el primero solo funciona pagando las correspondientes licencias, y el segundo es gratuito, lo cuál quiere decir que por defecto el 99% de los servidores del mundo pueden ejecutar tus páginas hechas en PHP y con MySQL, pero no al revés! Mi consejo es que si vas por libre (en todos los sentidos) te instales un paquete que integre toda una plataforma de desarrollo web opensource. Y después de varios años de probar varios, descubrí hace unos meses uno fantástico (para Windows): WAMP, que te instala de una vez el "servidor Apache", PHP, MySQL y otras herramientas (editores, etc.).

Cuando tengas una nociones básicas de PHP y MySQL podrás lanzarte a instalar completas aplicaciones opensource hechas con estos lenguajes listas para descargar, instalar y utilizar. Son los llamados gestores de conocimiento o CMS. Como te digo son un conjunto de archivos (normalmente centenares) que uno se descarga del portal de la comunidad que los desarrolla, uno los sube a su propio servidor (via FTP), te creas una base de datos (una vacía y un usurio con acceso a ella) desde el panel de tu hosting, y en un navegador llamas al archivo de instalación (del tipo install.php) y por sí solito empieza a rellenar tu base de datos con decenas de tablas y te crea un usuario "administrador" con el que podrás acceder a la gestión de tu nuevo "portal". A partir de ahí, según tus conocimientos en HTML, CSS, Javascript, PHP y MySQl, podrás personalizar ese portal a tu medida, aunque sin saber de todo eso ya se puede hacer mucho (como en un blog!). Los CMS más populares a día de hoy: Drupal, Joomla, Mambo, PHPnuke , PostNuke, etc.. Aunque claro, hay CMS muy especializados en campos como el e-commerce, el e-learning, etc... Para estar a la última de los mejores CMS opensource visita el portal OpenSource CMS.

Espero que este resumen te haya ayudado a entender algo más acerca de crear páginas web ;) ¿Sabes? estoy convencido de que nunca podré devolver a la comunidad de internautas todo lo que he aprendido de ellos. Con este blog quiero añadir mi granito de arena. Ánimo!