Easy PHP Reflections, reflejos fáciles en PHP

Sin duda la mejor forma de crear el famoso reflejo de las imagenes es hacerlo mediante photoshop o cualquier otro programa, pero si eres de los mios y no tienes ni idea de como conseguir esto, tendrás que optar por técnicas algo menos óptimas pero igual de eficientes.

imagen2miniatura.jpg

Si las creamos desde el servidor estamos facilitando el trabajo a los navegadores de los visitantes ya que no usamos la opción de javascript, para ello podremos usar Easy PHP Reflections, que se trata de un fichero php al que le pasaremos una imagen y usando la librería GD de PHP nos devolverá nuestro reflejo.

Modo de uso

Tan simple como esto:


<img src="picture.jpg" /><br />
<img src="reflect.php?img=picture.jpg" />

Osea, mostramos la imagen y debajo el reflejo de la misma.

Parametros

Tambien posee una buena lista de parametros que nos permite conseguir mejores efectos.

img (String)
Dirección de la imagen, puedes usar directorios y comandos de directorios, pero no URLs. Los formatos aceptados son: GIF, JPG o PNG.
height (integer)
Tamaño de la altura reflejo de la imagen. Acepta tanto valores numéricos que equivaldrán a pixeles como %.
bgc (hex) (#000000 – #FFFFFF)
Color de fondo del reflejo, por defecto es blanco. Pero puede cambiar usando el color HTML de nuestro fondo (#f45433)
alpha (integer) (1 – 127)
Valor alpha del fade. Se recomiendo usar un 80 para conseguir un efecto de reflejo óptimo, pero mejor ir probando.
fade (integer)
Controla que de rápido se ha de aplicar la reducción del nivel de alpha. Por defecto es 2, se recomienda mantener este valor, aunque dependerá de cada uno.
jpeg (integer) ) (1-100)
Por defecto la clase devuelve un fichero PNG, pero pasando este parametro podremos obtener un JPG con la calidad indicada.

[Descargar][Demo]

Buenas razones por las que utilizar urls amigables

Mucho se escucha sobre las famosas urls amigables y muchas veces los desarrolladores se plantea implementar en su sitio las urls amigables.

¿Por qué deberias poner urls amigables en tu sitio?

Pues hay varias razones pero lo que habrá que plantearse es si estos motivos son suficientes como para rediseñar tu sitio y adaptarlo al uso de urls amigables.

1. Marketing Viral

El marketing viral y la publicidad viral son términos que se utilizan para explicar aquellas tácticas que utilizan redes sociales para producir incrementos exponenciales en el conocimiento de tu sitio.

Obviamente es mucho mas sencillo recordar http://www.tufuncion.com/linea_comandos que http://www.tufuncion.com/node?id=17.

Del mismo modo será más sencillo recordar una url descriptica cómo la escrita anteriormente.

2. Optimización

La mayoría de los buscadores (pocas excepciones como Google) no indexa cualquier página que tenga símbolos raros (?,=,&) en la url.

Por eso muchas webs dinámicas no son correctamente indexadas, y obviamente no es bueno que no te indexen.

Efecto del cambio

El efecto que esto provocó en Google fue enorme, el buscador empezó a pasearse como Pedro en su casa por el Weblog e indexó casi todo su contenido. Pasamos de tener unas 5,000 páginas indexadas a más de 12,000… no me pregunten ¿por qué?, pero fue a consecuencia del cambio (de esto no hay duda).

Otro efecto positivo (si el afán es el posicionamiento en buscadores), fue la mayor atracción de visitantes pasajeros (no es mi intención hablar de estadísticas, pero aproximadamente hubo un incremento del 10% al 20% de tráfico por Google).

Baluart.net

3. Imagen de tu marca

La imagen de tu sitio sera mucho más transparentes aquellos id seran convertidos en palabras que diran en cada momento algo interesante sobre la página que albergan.

Es una de las principales características de las webs 2.0 lo que dice mucho sobre el futuro de esta técnica, está claro que si el objetivo de un buscador tan importante como Google es organizar la informacion del mundo terminarán premiando a aquellos que les faciliten el trabajo, CMS cómo Drupal, Joomla, WordPress, Moveable Type utilizan está técnica obteniendo unos resultados geniales.

Hacer URLs amigables

Voy a explicar dos técnicas para llevar a cabo esta mejora en nuestras páginas, ambas funcionan con PHP-Apache.

Método 1: PATH_INFO

Si echas un ojo a la barra de direcciones de webs cómo Sitepoint veras una URL como esta:

http://www.sitepoint.com/article/flex-2-internet-applications

Sitepoint utiliza este método para hacer sus URLs amigables.

Esta solución es la menos avanzada tecnologicamente pero la que requiere de menos recursos, va para aquellos que tienen una cuenta de hosting compartido o un servidor gratuito, habrá que colocar este script en la cabecera de todas nuestras páginas (recomendable el uso de include).

$var_array = explode(“/”,$PATH_INFO);
$num_param = count($var_array );

if($num_param % 2 == 0) {

$var_array [] = ”;

$num_param++;

}

for($i=1; $i<$num_param; $i+=2) {

$$var_array [$i] = $var_array [$i+1];

$total=$total + $$var_array [$i];

}

La clave de su funcionamiento está en que toma los números pares como variables y los impares cómo los valores.

Tomemos cómo ejemplo esta url:

http://www.tusitio.com/articulo.php/id/333/noticia/21&#8221;

Primeto separamos las diferentes partes en variables, usando la funcion explode de php.

Una vez realizado esto, obtendremos el siguiente resultado:

$var_array[0] = “articulo.php”

$var_array[1] = id

$var_array[2] = 333

$var_array[3] = noticia

$var_array[4] = 21

Podríamos renombrar los $var_array[1] por nombres más descriptivos como $id o $noticia y hacer una consulta a la base de datos con está información.

Si vas a utilizar este método asegurate de tener controlado el log de tu servidor para evitar las molestas “arañas”.

Método 2 .HTACCESS

Este método implica el uso del archivo .htaccess, si eres nuevo en esto, te puedo decir que es un archivo que se utiliza para administrar las opciones de acceso en el directorio en el que se encuentra alojado.

En primer lugar asegurate de tener activado el mod_rewrite esencial para el uso de este método, edita un fichero y pega este código:

phpinfo();

?>

Una vez comprobado que el mod_write está activado podemos pasar a configurar nuestro .htaccess:

Options +FollowSymLinks

RewriteEngine on
Rewriterule ^(.*)/(.*),(.*)/(.*),(.*)/$ $1.php?$2=$3&$4=$5

Rewriterule ^(.*)/(.*),(.*)/$ $1.php?$2=$3

En las dos primeras líneas comprobamos el correcto funcionamiento del mod_rewrite en el Apache (si esto no funciona vuelve al paso anterior y compruébalo).

En las líneas siguientes se establecen una serie de reglas que nos permitirán transformar nuestras URLs.

Analizemos la regla: Rewriterule ^(.*)/(.*),(.*)/(.*),(.*)/$ $1.php?$2=$3&$4=$5

Los valores precedidos por el símbolo dólar ($) reemplazan a los (.*) de las URL amigables.

Rewriterule ^(.*)/(.*),(.*)/(.*),(.*)/$ $1.php?$2=$3&$4=$5

Supongamos que tenemos esta url:

./index.php?seccion=coches&id=12345

obtendremos…

./index/seccion,coches/id,12345/

Por lo tanto nos quedamos con el nombre del script libre de extensión, y transformamos los valores en subcarpetas.

Sube el .htaccess y comprueba que todo funciona correctamente, una vez hecho esto edita todas las reglas que necesites.

Por último falta revisar nuestro antiguo código, tomando como comienzo que el resultado de la consulta a la base de datos esta en $rs nuestro código viejo sería:

while($row = @ mysql_fetch_array($rs)){

$category = $row[“category”];

$category = URLencode(htmlentities($category,ENT_QUOTES));

$subject= $row[“subject”];

$subject = URLencode(htmlentities($subject,ENT_QUOTES));

/*format for following HTML result
http://www.mysite.com/main.php?category=books&subject=biography

*/

echo “<‘a href=\”http://www.mysite.com/main.php?

category=$category&subject=$subject\”>”;

echo “$row[description]
\n”;
}

?>

Y nuestro código para URLs amigables quedaría:

while($row = @ mysql_fetch_array($rs){

$category = $row[“category”];

$category = URLencode(htmlentities($category,ENT_QUOTES));
$subject= $row[“subject”];

$subject = URLencode(htmlentities($subject,ENT_QUOTES));

/*format for the URL rewrite is as follows

http://www.mysite.com/type$category-$subject.htm

*/

echo “<‘a href=\”http:/www.mysite.com/type$
category-$subject.htm\”>”;

echo “$row[description]
\n”;

}

?>

Enlaces interesantes

Cómo consejo final conviene antes de comenzar conocer más sobre el uso del mod_rewrite en Apache.

SitePoint: Search-Engine Firendly Urls

Baluart.net

Devarticles: Make Dynamic URLs

Foro: Uso de URLs amigables

6 cosas que probablemente no conozcas sobre PHP

Via tufuncion.com

Hace no mucho publicamos este post 5 cosas que desconocía de php, esta podríamos decir es la segunda entrega con nuevas cosas que no conocía de PHP.

ip2long() y long2ip()

Estas dos funciones ip2long() y long2ip() sirven para almacenar las direcciones IP cómo enteros en vez de cómo cadenas en la base de datos, esto reducirá los recursos de almacenamiento conseumidos de los 15 bytes de un chasr(15) a los 4 bytes de un entero.

Validadción de direcciones de email

La validación parcial de direcciones IP es fácil gracias a la función checkdnsrr().
Esta función nos asegura que el dominio devuelto existe, por ejemplo muy útil en caso cómo este:

‘usuario@gmail.com’ Válida
‘usuario@wwwgmail.com’ No Válida

Cómo no hacer trabajo innecesario

Si no te gustaría estar trabajando en una determinada función durante un tiempo para luego darte cuenta que has reinventado la rueda… chequea PEAR antes de escribir las siguientes líneas de código.

PEAR – Un framework y sistema de distribución de utilidades Php. PEAR nos ofrece complementos php agrupándolos en “Packages”.

Formatea tu código

Una función que formatea una cadena pasada, especialmente pensada para código fuente, highlight_file().

Muy útil en caso de que queramos compartir dudas sobre nuestro código con algún amigo ya sea por el messenger, IRC o cualquier servicio parecido.

No muestres los errores

Evita mostrar los errores de mensajes con la función error_reporting(0). Útil en caso de tener hospedaje compratido deberás incluirlo en la primera línea de cada uno de tus scripts, esto evitará que información de conexiones PHP y usuarios MySQL sea mostrada.

Opcodes

PHP usa una mezcla entre interpretación y compilacion para intentar ofrecer a los programadores lo mejor entre rendimiento y flexibilidad.

PHP compila para tu codigo una serie de instrucciones (llamadas opcodes) siempre que estas son accedidas. Estas instrucciones son entonces ejecutadas una por una hasta que el script termina. Esto es diferente a la manera convencional de compilacion de lenguajes como C++ donde el código es compilado a código ejecutable que es despues ejecutado. Php es recompilado cada vez que se solicita un script.

Vía: 10 things you (probably) didn’t know about PHP

5 cosas que desconocía de php

Via tufuncion.com

Estos son algunos de mis curiosidades favoritas sobre php:

El tag ?> es opcional

Cada uno de los archivos php que has programado probablemente tengan este formato:


?>

¿Pero sabías que la etiqueta ?> es opcional? Elimínala y todo seguirá funcionando, no estoy seguro de que funcione con todas las versiones pero si funciona en PHP 5.1.
No hay ningún buen argumento que justifique su eliminación de nuestro código, pero es bastante curioso.

Enmascara otros lenguajes dentro de PHP

Java, Perl, Python y .NET son algunos ejemplos de lenguajes que puedes utilizar dentro de código PHP. El soporte para otros lenguajes puedes encontrar en PECL.

Hacer a los objetos parecerse a arrays

Puedes usar la libreria estándar de php SPL para convertir objetos en array de la siguiente manera:

$object = new MyObject();
$object[‘name’] = ‘Hello World’;

object = new MyObject();

foreach ($object as $k=>$v) {
echo “$k = $v\n”;
}

Require es más rápido que require_once

En versiones anteriores a PHO 5.2 usando require en vez de require_once puedes conseguir un incremento de velocidad especialmente en aplicaciones pesadas. La razón es que require_once hace un llamada extra al sistema para validar que tu no has incluido este archivo previamente. Require incluye un archivo sin comprobación alguna.

Manejar tus errores es fácil

El resumen de errores programado por PHP ciertament no es de lo mejor. EL famoso “headers already sent” o “call to undefined function” que te aparece en negrita y con un número de línea que puede o no puede ser correctos.

Pero puedes programar tu propio manejador de errores.s:

function mis_errores ($numero, $mensaje, $archivo, $linea) {
// Añade el CSS para tu codigo
echo ‘

El siguiente error ocurrio en linea ‘ . $linea . ‘ del archivo ‘ . $archivo . ‘: ‘ . $mensaje . ‘
‘;
echo ‘

Las actuales variables son:

‘ . print_r($GLOBALS, 1) . ‘

‘;
}

Entonces usaras tu propio manejador por defecto y no el de PHP diciendoselo a PHP en la funcion set_error_handler().

set_error_handler(‘mis_errores’);

Entonces ya la mayoría de los errores seran manejados por tu función (pero hay algunas excepciones). Con el anterior ejemplo los errores son imprimidos con formato html.

Deberia incluso plantearte la posibilidad de enviar estos errores via mail con la funcion mailto y de esta manera tendras un control en tiempo real de tu sitio, o incluso manejar errores en la conexión a una base de datos.

try {
if (!@mysql_connect(‘localhost’, ‘username’, ‘password’))
throw new Exception (mysql_error());
} catch (Exception $e) {
echo ‘Imposible conectar a la base de datos: ‘ . $e->getMessage();
}

Por supuesto estos son ejemplos muy básicos; hay muchas más funcionalidades que le puedes añadir.

Más Layouts para tu web

la segunda patita, vía Dinamic Drive, ya habia publicado otra web con la misma intención.

xq siempre tan cortos los posts ?

falta tiempo, como siempre

Algunas propuestas interesantes del XHTML 2

Por Helena J. Heidenreich

El siguiente artículo reflexiona acerca del último borrador de la W3C para la futura especificación de XHTML 2.

El pasado mes de julio salió el último borrador de la W3C para la futura especificación de XHTML 2. Si bien todavía puede faltar mucho para que se lance como estándar oficial (suponiendo que algún día lo sea) y en ese tiempo pueden decidir realizar cambios en el borrador, creo que merecen ser destacadas algunas de las propuestas que son de lo más interesantes.

Hipertexto

Hasta ahora los enlaces (links) de hipertexto han sido algo exclusivo del elemento a. Con la Modularización de XHTML se crearon módulos independientes para agrupar distintos elementos y sus atributos.

El módulo para el hipertexto define al elemento a y a sus atributos; XHTML 2 en cambio define al elemento a en su módulo de hipertexto pero sus atributos, son definidos en un módulo aparte (Módulo de atributos de hipertexto XHTML) que es agregado también al resto de elementos XHTML; esto quiere decir que XHTML 2 permite a cualquier elemento ser un hiperlink.

XHTML 2 otorga la misma función a cualquier elemento agregándoles la misma colección de atributos (el href entre ellos). A pesar de que el elemento a se vuelve totalmente innecesario, éste va a ser conservado como elemento explícito para el marcado de links; eso sí, perdiendo todo sentido semántico pasando a tener el mismo sentido semántico que el elemento span.

Listas

Hasta el momento HTML y XHTML ofrecían 3 tipos de listas:

  • Ordenadas (ol)
  • No ordenadas (ul)
  • De definición (dl)

XHTML 2

Amplía en 1 estos tipos de listas entrando en escena un elemento nuevo: el nl (navigation list) el  cual pretende definir un listado de elementos para la navegación, vamos, para el clásico listado de links que usamos habitualmente como menú o barra de navegación.Cada elemento de la lista se define mediante un elemento li al igual que las listas ordenadas y no ordenadas. Sin embargo algo obligado que debe agregarse es un elemento label al inicio de cada lista de navegación que describa el contenido de la lista.

<nl>
	<label> Maestros del web </label>
	<li href=”principal.php”> Página principal </li>
  	<li><nl>
        <label> Editorial </label>
  		<li href=”editorial/”> Todos los editoriales </li>
  		<li href=”editorial/leido/”>Lo más leído </li>
  		<li href=”editorial/comentado/”> Lo más comentado </li>
  	</nl>
  	</li>
</nl>

Imágenes

XHTML 2 otorga a cualquier elemento la capacidad de ser una imagen clásica (img). Cualquier elemento puede en XHTML 2 tener un atributo src.

<p src=”imagen.gif”> Este texto <strong>sólo</strong> se mostrará en el caso de no ser 
cargada la imagen </p>

En el caso de que el recurso al que hace referencia el atributo src no se cargara por alguna razón (no se encuentra, el servidor no responde, o el navegador no soporta el formato de archivo o tiene las imágenes desactivadas) se procesaría entonces el elemento (en este caso el párrafo) con el aspecto presentacional que queramos usando hojas de estilo, algo que no podemos hacer actualmente con el texto alternativo (atributo alt) del elemento img.

El elemento img tiene una consecuencia similar al elemento a. A pesar de que ya no es estrictamente necesario el elemento img se mantiene con motivo de facilitar la transición hacia XHTML 2. Sin embargo no se mantiene como elemento vacío.

Tendrá su tag de cierre con un contenido que será mostrado en el caso de que el recurso al que hace referencia (la imagen) no se cargue por la razón que sea al igual que se comporta el elemento object.

<img src=”maestrosdelweb.gif”>Maestros del web </img>

Secciones

Entra en escena también un nuevo elemento para definir secciones dentro del documento. Hasta ahora veníamos definiendo las distintas secciones agrupando elementos dentro de elementos div. XHTML 2 integra un elemento estructural específico para tal fin: el elemento section.

Encabezados

Se mantienen los 6 niveles de encabezados (headings) que se vienen usando hasta ahora (h1, h2, h3 …) pero además XHTML 2 agrega un nuevo encabezado h para ser utilizado conjuntamente con el elemento section mencionado anteriormente y cuyo nivel es aplicado automáticamente dependiendo del nivel de anidamiento del elemento section dentro del cual se encuentre.

<body>
	<h>Maestros del web </h>
	<section>
		<h> Nuestro Editorial </h>
		<section>
			<h> Historia de ASP </h>
			<p> … contenidos </p>
		</section>
		<section>
				<h> Semblanza </h>
				<p> … contenidos </p>
		</section>
	</section>
	<section>
		<h> Notas de Actualidad </h>
		<section>
				<h> Nace grupo de flasheros peruanos y GarageFlash </h>
				<p> … contenidos </p>
		</section>
		<section>
				<h> Google compra Youtube </h>
				<p> … contenidos </p>
	</section>
	</section>
</body>

Separadores

Tradicionalmente venimos usando el elemento hr para separar distintas partes de un texto entre sí. El nombre de este elemento proviene de las iniciales de horizontal rule (regla horizontal).

Ahora se han percatado de que regla horizontal no es una denominación apropiada para este elemento puesto que ni necesariamente es horizontal (en texto vertical ésta es vertical) ni necesariamente es una regla (los libros a menudo utilizan otros métodos tipográficos tales como una línea de tres asteriscos para representar separadores).

Así que pretendiendo enfatizar su naturaleza estructural, para hacerlo más ampliamente usable y para que quede claro que esencialmente no tiene direccionalidad (vertical u horizontal) han decidido cambiarle el nombre a este elemento renombrándolo como separator.

Bloques de código

Hasta ahora venimos usando el elemento code para marcar un fragmento de código de computadora. XHTML 2 introduce el elemento blockcode para marcar un bloque de código (no sólo un fragmento).

Saltos de línea

El elemento br usado para ‘romper’ un texto en varias líneas desaparece para dar paso al elemento l. La idea es un elemento que dé estructura al texto que ha de ser partido en varias líneas.

Una de las ventajas que tendrá será el poder numerar las líneas  de forma automatica desde una hoja de estilos, algo muy útil para quienes escribimos líneas de código fuente.

Un ejemplo podría ser:

<blockcode>
			<l>function pepe(){</l>
			<l>    alert(‘¡Hola soy pepe!’)</l>
			<l>} </l>
</blockcode>

Y aplicar los siguientes estilos CSS:

l:before {
    counter-increment: linenumber;
    content: counter(linenumber);
}

Role

Entra en acción otro nuevo atributo cuyo rol es, precisamente, definir el rol de elementos que usemos en el documento; proveer información sobre el propósito de alguna parte de una página web: el atributo role.

Pretende añadir semántica a los elementos a los que se aplique definiendo el papel que está jugando en el contexto del documento. Por ejemplo un párrafo que contiene una nota podría ser marcado como <p role=”note”>.

Por supuesto el borrador incluye muchos más detalles dignos de mención pero, como primer acercamiento, estos que he mencionado son los que más me han llamado la atención.  El resto podría formar parte de un futuro artículo.

 

Me voy al Punto.cl

Estimados Lectores :

Les cuento que, despues de mucho esperar (no se porque la verdad) me compre mi sitio .cl , así es que me voy con camas y petacas a mi nuevo sitio.

Espero seguir posteando de vez en cuando x aca, pero quizá el giro de este Blog tome otra orientación, aun no lo decido, de todas maneras agradezco las visitas, que espero ahora se vayan a JuanJorquera.cl