Primer día: Talleres

El primer día fué de talleres, y aunque no me gustó tanto, rescato cosas importantes de ellas:

• Primer taller: “Extreme Javascript” por Sebastián Gamboa. No me gustó mucho por que todos los ejemplos que nos mostró ya estaban hechos (muchos sacados de la web) y la verdad es que no aprendí nada de código. Aquí rescato que supo explicar las ventajas de NodeJS y Coffescript, especialmente una: te permiten conectarte con la API de un servidor externo (como la twitter, facebook, tumblr, etc.) mediante javascript (sin necesidad de usar un lenguaje de servidor como PHP), y por tanto, que el servidor cargue lo que tiene que cargar desde tu servidor sin que se tenga que esperar la respuesta del servidor externo.
• Segundo taller: “Hace lo mínimo y luego hace menos...” por Britt Servitelle. Lección aprendida: Diego, aprende inglés.
• Tercer taller: “Desarrollo móvil multiplataforma” por Andrés Villagran. Fué interesante conocer otra forma de desarrollar aplicaciones para distintos sistemas operativos con la herramienta Appcelerator, me gusta el concepto de la interfaz nativa, pero todo el proceso de compilación y testeo de la aplicación en emuladores a mí no me pareció cómodo, tampoco me gustó eso de empezar a aprender un lenguaje específico para desarrollar sobre Appcelerator, además de que se debe desarrollar sobre OSX para poder emular el iOS (en windows solo puedes emular android). A pesar de estas desventajas, yo ya tenía clara mi visión: hoy es HTML5. ¿Qué pasará cuando salga otro sistema operativo? ¿desarrollar otra app especificamente para ese OS?. Las ventajas de un lenguaje estándar son claras: todos los dispositivos modernos las están respetando, crearás con un lenguaje una sola aplicación para todo e ¡incluso Windows 8 ya permite incluir tu aplicación HTML5 en el metro!.
• Cuarto taller: “Diseño para hackers” por David Kadavy. Nuevamente una nota para mí: Diego, aprende inglés. David Nos mostró varios conceptos interesantes, de los cuales rescato el “espacio en blanco” en el que nos mostró una página con HTML y sin CSS, y a medida que explicaba fué agegando propiedades a los elementos del HTML sin meterse con colores ni estilos complejos, sólo usando “espacios en blanco” básicamente con las propiedades margin, padding, text-decoration, word-spacing, letter-spacing, line-height y font-size. Fué una maravilla sutil, solo con esto pudo formatear una página que luego se veía muy bien. Claro está que esto no significa que hagamos páginas sin colores ni estilos más bonitos, si no que nos llamó a mejorar significativamente los estilos que usamos en todos los textos que le ofrecemos al lector usando bien la jerarquía de elementos.

Al final de esta jornada, me fuí a saludar a Cvander que acababa de terminar un taller de introducción al HTML5 en otra sala. Aproveché de mostrarle un ejercicio que hice el día anterior de unos audiocuentos para iPad en HTML5, le encantó, me ofreció su apoyo y hasta me dijo que quería ser nuestro cliente (XD).

Segundo día: Conferencia

Primero tengo que destacar que la conferencia de Webprendedor es sin fines de lucro!

El día de la conferencia fué mas cool, con muchas charlas motivadoras e historias interesantes de cómo surgieron algunos emprendimientos. Quiero comentar dos de ellos:

• OVIA por Ignacio Rovirosa: que surgió por una necesidad de una empresa X. Consiste en una plataforma donde se pueden crear entrevistas de trabajo lo más cercano a la realidad. Conoce más de OVIA.
• Hablalot por Robin Osorio: que surgió por las ideas de Averigualo.cl (donde se puede averiguar de qué compañía es un teléfono móvil). Básicamente consiste en llamar de un teléfono móvil a otro de forma más económica sin preocuparse por la compañía a la que estás llamando. Conoce más de Hablalot.

Estas dos historias me parecieron super interesantes, porque no estuvieron planeadas desde un principio, surgieron en el camino por una necesidad específica y se transformaron en lo que son ahora. Me encanta que las buenas ideas empiezen de esa forma, y que vayan creciendo constantemente.

Por otro lado, me encantó la historia de Nico Orellana y la razón de por qué hizo todo esto de Webprendedor, de cómo su vida fue transformándose a partir de ello y como empezaron a surgir las relaciones con otras personas y todo el surgimiento de Welcu. Tomar desiciones y aperrar con un emprendimiento son las ideas que rescato de él.

Comentarios finales

Me encantó estar conociendo gente interesante, y sobre todo porque estaba “en mi salsa” rodeado por laptops, iphones, androids, tablets y cámaras reflexs! ♥

De toda la conferencia destaco mucho la idea de vender un producto o servicio por internet que se pueda vender (casi) solo, que desarrolles un producto que pueda ir escalando en cuanto a su uso, cantidad de usuarios y que por supuesto genere plata. Todos queremos la independencia económica (o mucho más que eso) y ese es uno de los principales puntos de un emprendimiento.

El proceso de emprender es demasiado interesante, pero muy duro y ciertamente se le debe dedicar todo nuestro tiempo. Amar el proceso lo hace más liviano y entretenido. Se debe pasar muchos retos y aprender casi todo en el camino.

Eventos como este nos ayudan a motivarnos, y además, hacer muchos contactos!

¡Gracias Webprendedor!

Tengo entendido que ajax y symphony  son framework, pero no veo cual es su función, su objetivo o aporte al desarrollo web, porque realmente nose que es lo que hacen xD.

Espero me ayuden con esta duda. Gracias.

Saludos :)

Espero me aclaren esta duda.

Saludos, gracias :)

Espero sus respuestas ^^

Saludos a todos, Gracias :P

Me hice una cuenta de Webhosting gratuito, subi e instale wordpress en el servidor ftp,

y quiero personalizar mi pagin creandole un theme, ya hice (segun yo) una "plantilla"

utilizando SOLO un archivo html y un css, esta dentro de la carpeta Themes de wp-content de wordpress.

Ahora mi pregunta es... como creo los archivos php necesarios para que funcione como un blog normal, por ejemplo este, donde pueda publicar articulos, subir imagenes etc. o como los adapto para que funcionen bien con wordpress??? no tengo ni idea de programacion en php y menos de base de datos MySQL, no se si sean necesarios.

Muchas gracias de antemano.

Yo he creado un toogle que lo dejo abierto y al recargar se vuelve a cerrar, que tengo que hacer para que guarde la ultima accion que hice?

Gracias de antemano

Haga clic en el menú Herramientas en el punto Opciones de Internet:

En la ficha Seguridad haga clic en el botón Nivel personalizado:

En la configuración de seguridad en Automatización active el punto Automatización de los subprogramas de Java (punto 1), y también Secuencias de comandos ActiveX (punto 2):

Guarde los ajustes pulsando cada vez la tecla de Aceptar.

bueno eso es lo que yo opino ya que hay tecnicas en css tanto en 2.1 como css 3 que no son soportados, y creo que con la aparicion de windows7 ya nadie usa el IE6, bueno yo e ido a varios cafeces intenet y antes si se veian cafeces internets con esos exploradores, pero ahora ya no veo nunguno

otra cosa es que si mi web usa imagenes png entonces por culpa de los navegadores no devo de usar png? o_O ya se que hay escripts y tecnicas pero es como si creara otra web, porque ensi la pagina no seria la misma

YO DIGO QUE SI LE VAN A DAR SOPORTE A IE6 que sea para moviles como lo ase twitter detodas formas solo faltan 2 años para que el navegador desaparesca

CONSULTAR ARTICULOS

http://nexxuz.com/no-mas-internet-explorer-redirecciona-tu-pagina.html

IE6 se le dara dando soporte asta el 2014

http://bitelia.com/2009/08/nadie-quiere-ie6-pero-microsoft-seguira-dandole-soporte-hasta-el-2014

el IE6 desaparecera para siempre en el 2014

pero ya savemos que las grandes redes sociales como youtube y flick ya no le dan soporte a esa porqueria que microsoift invento

esta es mi solucion, bueno pueden redireccionar su sitio a donde selespegue la gana yo diria en una pagina de error, pero eso es lo que yo opino

<!--[if lt IE 7]>
<script>location.href="http://www.nexxuz.com/noie/?lang=es" </script>
<![endif]-->

tambien otra solucion seria tratar al IE6 como movil, tal como lo ase el twitter, que le da soporte a IE6 pero como si fuera un celular, y lo redirecciona, y pensandolo detenidamente esa es la mejor opcion

Alguien sabe como solucionarlo?

Os dejo el codigo html

    <div id="bloque contenedor">
       <div id="izquierda">
         <h1>Sidebar</h1>
         <p>Aquí se encontraran enlaces del sub menu
          </p>
        </div>
        <div id="derecha">
           <h2>Script Liberty</h2>
         <p>Liberty es un sistema personalizable capas de ser adaptado a los gustos de las personas. Liberty es un sistema personalizable capas de ser adaptado a los gustos de las personas. Liberty es un sistema personalizable capas de ser adaptado a los gustos de las personas. Liberty es un sistema personalizable capas de ser adaptado a los gustos de las personas. Liberty es un sistema personalizable capas de ser adaptado a los gustos de las personas. Liberty es un sistema personalizable capas de ser adaptado a los gustos de las personas.
          </p>
        </div>
    </div>

Y aqui el CSS

#bloque contenedor{
   margin:0 auto;
   width:970px;
   padding:10px;
   height:auto;
}

#izquierda{
   display:block;
   float:left;
   margin:0 auto 20px 0;
   width:200px;
}

#derecha{
   display:block;
   float:right;
   margin:0 auto 20px 0;
   width:750px;
}

• css
• javascript
• xhtml
• html5
• html
• php
• otro

 ¿Es necesario saber php o algo de base de datos para publicar una pag web?

Espero sus repuestas xD Saludos.. 

¿Que me recomiendan: profundizar en CSS o aprener CSS3?

Digamos que tengo los conocimientos basicos de CSS, pero me gustaria profundizarlos, por otro lado conoci esta nueva version CSS3, que es muy interesante, pero nose si es conveniente aprenderla ahora o más adelante, digo esto por el tema de los navegadores que aceptan CSS3.

Espero sus respuestas :D 

Saludos :)

¿Cuales son las diferencias entre las 3 versiones de HTML? (XHTML estricto, XHTML transicional, HTML5)

Saludos :D

 Me eh dado cuenta que en algunas paginas ponen:

<!DOCTYPE html>   y algunas ponen fechas y la version del html, tenia entendido que esto hay q ponerlo para que se vea tu pagina, pero ¿Como se que Doctype poner en mi archivo html?.

Un saludo a todos :D, espero sus respuestas :)

Gracias, Saludos :D

Saludos y gracias :D

me gustaria q porfavor me pudieran decir sus pro y contras para tener una mejor idea.

Gracias a todos, Saludos :D 

tengo una página creada en dreamweaver, pero maneja una base de datos

con zobyhost configure el servidor ftp y ya logro ver los archivos que en mi sitio existen

sin embargo, a la hora de ingresar a algun archivo me manda un error:

Warning: mysql_pconnect()[function.mysql-pconect]:Can't connect to local MySql server through socket '/var/run/mysqld/mysqld.sock' (2) in
/home/vol9/zobyhost.com/zoby_8046438/htdocs/Connections/videocentro.php
Fatal error: Can't connect to local Mysql server through socket
'/var/run/mysqld/mysqld.sock' (2) in
/home/vol9/zobyhost.com/zoby_8046438/htdocs/Connections/videocentro.php

que puedo hacer?

gracias

Cufón es una librería JavaScript que te permite insertar de manera limpia cualquier tipografía en una página web, reemplazando mediante JavaScript los textos indicados por imágenes, con la única desventaja de que será dificil seleccionar el texto reemplazado y en consecuencia es casi imposible copiarlo al portapapeles.

En este tutorial aprenderás cómo usar cufón, algunas recomendaciones y ejemplos reales donde lo hemos utilizado. Vamos por lo primero:

1. Obtener los archivos de cufón

Cufón funciona con 2 archivos:

1. La librería cufón
2. Un archivo js que incrusta tu fuente y que se genera en la página oficial de cufón.

1.1. La libería cufón

En el sitio oficial de cufón puedes descargar la última versión de cufón, y en estos momentos la última versión es la 1.09i que puedes descargar directamente desde este enlace.

1.2. Tu archivo con tu fuente incrustada

El generador de cufón te permite crear el archivo. Es fácil seguir el proceso, aquí va una imagen explicativa de cómo generar tu archivo:

Luego de rellenar las opciones correctamente y aceptar los términos, dale al botón celeste "Let's do this!" y se generará y descargará tu archivo con la fuente incrustada.

Recomendaciones:

• No uses más de una variante de la misma fuente: Si al generador le entregas las variantes de fuente Bold, Italic y Bold Italic, el archivo generado pesará 4 veces más aproximadamente. Es recomendable que sólo uses la variante Regular de la fuente, de esta forma, sólo pesará lo mínimo (15 a 40 kb, dependiento de tu fuente).
• Agrega caracteres especiales como los latinos con tildes cómo "áéíóúüÑñ" y los carácteres para abrir exclamación "!" y abrir interrogación "¿" que no están considerados en los packs de caracteres seleccionados del ejemplo.
• Si usas una fuente comercial, en el cuadro "Security" agrega el dominio en donde se usará la fuente, de esta forma, sólo funcionará ahí y en ninguna parte más.

2. Incrustar cufón

Debes incrustar ambos archivos descargados de cufón en el <head> de tu html, de la típica forma:

<script type="text/javascript" src="/ruta/cufon.js"></script>
<script type="text/javascript" src="/ruta/cufon.nombredetufuente.js"></script>

Y listo. Si eres más pro, me imagino que se te ocurrirá unificar estas librerías junto a otras como jquery para que no existan tantas peticiones http.

3. ¡Cufón cobra vida!

Con este pequeño código le darás vida a cufón, indicándole sólo la etiqueta que quieres que reemplaze: 

Cufon.replace('h1');

Varias etiquetas:

Cufon.replace('h1, h2, h3');

Soportando hasta con identificadores o clases del html:

Cufon.replace('ul#menu li a, #sidebar h3, p.marcar');

Con sombras:

Cufon.replace('#menu a',{ textShadow: '1px 1px #17232b' });

O incluso sombras + efecto hover:

Cufon.replace('#menu a',{ textShadow: '1px 1px #17232b', hover: { color: '#CCC' } });

Todo eso se deja a tu creatividad :).

Si Internet Explorer se retrasa un poco al reemplazar los textos, puedes probar insertar al final del código cufon.now(); o incluso situarlo al final de </body>. Ejemplo:

...

<script type="text/javascript">

Cufon.replace('h1',{textShadow:'1px 1px #000'});
Cufon.replace('h2, h3, #menu, #sidebar h3, #sidebar span');
Cufon.replace('#sidebar a',{ hover: { color:"#FFF" } });
Cufon.replace('#texto h2, #texto h3',{textShadow:'1px 1px #17232b'});
Cufon.now();

</script>

</body>
</html>

Recomendación final:

• Usa cufón con cuidado, recuerda que es dificil seleccionar textos reemplazados por imágenes y por lo tanto dificil copiarlos. Es recomendable sólo utilizarlo en títulos o textos que no interfieran tanto con la interacción de ellos por parte del visitante.

Ejemplos reales usando Cufón

Algunos sitios desarrollados con HábitatWeb en los que hemos usado cufón son los siguientes:

• camasdebronceado.com
• conseguridad.com.mx
• exactoacuacorte.mx
• infuzion.mx

Si desean, pueden investigar en su código fuente cómo lo hemos insertado :)

Muchos saludos, espero que el tutorial se disfrute y sea bastante claro.
Tutorial pedido por @iadrian.

<form method="get">
<textarea cols="50" rows="10" name="hello"></textarea><br /><br />
<input type="submit" value="caca"/>
</form>
<?php
$hello= $_GET["hello"];
$ejemplo = strlen($hello);
echo "La longitud de la cadena es: $ejemplo.";
$tt="http://translate.google.es/translate_tts?q=".cortar($hello,100)."&tl=es";
$matriz = array('uno','dos','tres','cuatro');
echo "<a href='$tt'>$hello</a> ";
function cortar($text0, $limite){
$comp = strlen($text0);
if($comp > $limite){
return substr("$text0", -0, $limite);
}
else{return "$text0";
}
}
?>
<embed src="<?php echo $tt;?>" autostart="true" loop="true" width="0" height="0" >

Null te amo!

He utilizado el primer codigo de texto para hacer una prueba. No he tenido dificultad, gracias a que el editor de texto es fantástico.

Las ventajas en la utilizacion de tablas estriba en que tenemos nuestra informacion bien organizada. tenemos tambien algo concreto  y es que esta informacion puede ser en cierta medida modificada en su presentacion. Porque modificando el modo de formato de tabla, modificamos el contenido.

Uno de los incovenientes de la tabla, es su codigo: el codigo tabla nos hace la pagina más cargada, y muchas veces menos limpio.

La verdad es que han salido buenísimos sumandole mi tarjeta de video Nvidia Geforce 9800gt, al final va un video con pruebas de rendimiento :)

Intel Core i7 2600 Sandy Bridge

 Corsair DDR3 XMS3 4Gb 1600Mhz

ASUS Motherboard P8P67-M

Componentes instalados

Prueba de rendimiento

Saludos estimados!

veras yo tengo un sitio web y estaba en la carpeta de www que trae wampserver por defecto :P

ya ay aseia mis pruebas pero decidi crearme otra web  y para poder configurar mis dositios me cree un alias con wampserver

ahora la carpeta www esta basia :p

y mis sitios webs los tengo en mi escritorio y corren perfecto con el localhost

el unico problema es el htaccess ._. que no funciona como deveria y esque la ur de mis sitios cambio con el alias ejemplo

http://localhost/webmia/

http://localhost/webtuya/

en el archchivo de htaccess antes asi configurava la pagina de error

ErrorDocument 404 http:../../error.php

con vaios ../../ asi si la pagina servira en todas mis carpetas :p

pero cuando puse el alias me direcciona a http://localhos/error.php <-- archivo que no existe porque no esta dentro de www

esto se arregla cuando pongo una regla normal de htaccess

ErrorDocument 404 http:error.php

pero si en la barra de direcciones escribo http://localhost/webmia/hola/sssss

me da error porque la regla del htaccess dice que redirecionar al archivo error.php y no que me saque de la carpeta pero si le digo que me saque cuando escribo htt://locahost/webmia/cacacacacaca

me redirecciona a localhost y me saca del sitio ._.

O CLARO ESTO SE PUEDE SOLUCIONAR SI EN LUGAR DE

http://localhost/webmya/

podremos cambiarla por

http://webmia

asi el servidor local funcionaria bien :P

<input onkeyup="document.getElementById('salida').innerHTML = eval(this.value)" /> = <b id="salida"></b>

Clase 1: Primeros pasos en PHP
Clase 2: Variables y Constantes
Clase 3: Estructura condicional (if/elseif/else)
Clase 4: Tipos de bucles (while, Do while, for y foreach)
Clase 5: Envío de datos de un formulario
Clase 6: Vectores, Array, Arreglos en PHP
Clase 7: Funciones en PHP
Clase 8: Base de Datos
Clase 9: MySQL – Crear conexión
Clase 10: MySQL – Introducción SQL
Clase 11: MySQL – Insertar datos
Clase 12: MySQL – Consultar datos en MySQL

no dejen de vistar el mejor sitio de todos los tiempos sobre Diseño y Desarrollo Web Estándar (www.documentoweb.com)

;)

Problema

RewriteCond %{HTTP_HOST} !^www\.
RewriteRule ^(.*)$ http://www.domino.tdl/$1 [R=301,L]

Solución:

RewriteCond %{HTTP_HOST} ^([^\.]+\.[^\.]+)$
RewriteRule ^(.*)$ http://www.%1/$1 [R=301,L]
RewriteCond %{HTTP_HOST} ^([^\.]+\.(com|org|gob|edu|net)\.[^\.]+)$ [NC]
RewriteRule ^(.*)$ http://www.%1/$1 [R=301,L]

Las máquinas leen el HTML y como el email está incrustado ahí, éste forma parte del texto, texto que posiblemente puede ser usado maliciosamente por un agente X, por ejemplo, para enviarte correos basura o spam. También, tus emails pueden ser indexado por buscadores, por lo que las posibilidades aumentan en que una máquina encuentre ese correo y le de ese indeseado uso (y que luego lamentamos).

Pero bueno, hoy después de varias semanas les traigo este artículo con una posible y sencilla solución a este problema: ofuscar tus correos electrónicos con javascript. 

El javascript no es ejecutado por estas malditas máquinas, programas o lo que sean, así que una sencilla solución es insertar el correo electrónico indirectamente, es decir, con algún tipo de codificación por el lado del cliente.

He aquí el código:

<?php
function ofuscarcorreo($correo){
echo "<script type=\"text/javascript\"> document.write(\"".str_rot13("<a href='mailto:".$correo."'>".$correo."</a>")."\".replace(/[a-zA-Z]/g, function(c){return String.fromCharCode((c<=\"Z\"?90:122)>=(c=c.charCodeAt(0)+13)?c:c-26);})); </script>";
}
?>

<?php ofuscarcorreo("micorreo@mipagina.com") ?>

Y así obtenemos directamente en el HTML algo parecido a esto, en que el JavaScript se encarga de decodificar lo que PHP ha codificado:

<script type="text/javascript"> document.write("<n uers='znvygb:newzewavfgen@dsdadwex.py'>newzewavfgen@dsdadwex.py</n>".replace(/[a-zA-Z]/g, function(c){return String.fromCharCode((c<="Z"?90:122)>=(c=c.charCodeAt(0)+13)?c:c-26);})); </script>

¿Ves el correo? ¡Ja! así lo verán los malditos bots.

Estoy iniciando en esto de crear paginas web con Dreamweaver CS3, y tengo un ordenador con la version XP Home edition y no puedo utilizar el ordenador como un sevidor local por lo cual no puedo trabajar con páginas dinámicas intenté instalar XAMPP pero por alguna razón no funciona.

Agradesco todas las ayudas posibles.

Lo que hace esta función es leer todos los nombres de los archivos que están en la carpeta dada y retorna uno al azar.

Usos:

• Banner cambiante.
• Imagen de fondo cambiante, etc.

La función

<?php
function imagenAlAzar($ruta = 'imagenes') {
$fotos = scandir($ruta, 1); // Extrae todas los archivos que están en la carpeta $ruta.
$cantidad = count($fotos) - 3; // Elimina los puntos '.' y '...'.
return $ruta '/' . $fotos[rand(0, $cantidad)]; // Selecciona una foto al azar del arreglo fotos.
}
?>
<html>
<head>
<title>Mi Banner</title>
</head>
<body>
<h1>Mi Banner</h1>
<img src="<?php echo imagenAlAzar() ?>" alt="banner" />
</body>
</html>

Notas

Falta comprobar si el archivo es realmente una imagen, pero tengo sueño.

características:

• Impide la inyección SQL
• Funciona para MySQL, Oracle, PostgreSQL, SQLite, Microsoft SQL Server, etc...

Forma de uso (ejemplo)

Un formulario que permite recuperar información a través del correo y la contraseña.

<?php
// incluir archivos
include_once 'alguna_ruta/BD.php';
include_once 'alguna_ruta/configuracion.php';
 
// Instancer la clase
$bd = new BD();
 
// Hacer una consulta
$resp = $bd->preparar('SELECT nombre, ciudad, genero
    FROM usuarios
    WHERE (correo = ?) AND (clave = ?)');
 
// Ejecutar la consulta
$resp->ejecutar($_POST['correo'], $_POST['clave']);
 
// Recoje la información en forma de matriz.
$info = $resp->getMatriz();
 
// Usar la información de alguna forma.
foreach ($info as $fila) {
    echo '<h2>Tus datos</h2> <ul>';
    echo '<li> nombre: ', $fila['nombre'], '</li>';
    echo '<li> ciudad: ', $fila['ciudad'], '</li>';
    echo '<li> genero: ', $fila['genero'], '</li>';
    echo '</ul>';
}
?>
<html>
    <head>
        <title>Test</title>
    </head>
    <body>
        <form action="test.php" method="post">
            <label for="correo">Correo: </label>
            <input type="text" name="correo" id="correo" />
            <label for="clave">Clave: </label>
            <input type="password" name="clave" id="clave"/>
            <input type="submit" value="OK" />
        </form>
    </body>
</html>

Clase Principal

Esta clase contiene el constructor que permite hacer el "new BD()"

Guardarlo en un alguna carpeta dentro del proyecto.

<?php
 
/**
 * Este proyecto esta bajo la licencia
 * Creative Commons Atribucion-NoComercial-LicenciarIgual 3.0
 * ver http://creativecommons.org/licenses/by-nc-sa/3.0/deed.es
 */
 
// Importar la clase BdSentencia.
include 'BdSentencia.php';
 
/**
 * BD es una capa de abstracción para usar bases de datos de manera más cómoda.
 * Utiliza PDO.
 *
 * @author <a mailto="rodrigo.gonzlez@gmail.com">Rodrigo González</a>
 */
class BD extends PDO {
 
    /**
     * El constructor.
     * @param <string> $nombre el nombre de la base de datos, en el caso de que
     * esté vacío toma el valor del archivo de configuración (configuracion.php)
     * correspondiente a BD_PRINCIPAL_NOM.
     */
    public function BD($nombre = BD_PRINCIPAL_NOM) {
 
        // (Data Source Name)
        $dsn = BD_MOTOR . ':host=' . BD_HOST . ';dbname=' . BD_PREFIJO_NOM . $nombre;
 
        // Instancear la conexión con la base de datos.
        parent::__construct($dsn, BD_USUARIO_NOM, BD_USUARIO_CLAVE);
 
        // Asigna la clase BdSentencia para crear los objetos que representen
        // sentencias y que heredan de PDOStatement.
        parent::setAttribute(PDO::ATTR_STATEMENT_CLASS, array('BdSentencia', array($this)));
 
        // Hace que se lancen errores, en caso de que se produzcan.
        parent::setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
 
        // Cambiar el juego de caracteres de la conexión a UTF-8, no se
        // hace a través de MYSQL_ATTR_INIT_COMMAND por un bug en PHP 3.0 y 3.1
        parent::exec('SET NAMES \'utf8\'');
 
    }
 
    /**
     * Prepara una sentencia SQL para ser ejecutada posteriormente, puede aceptar
     * parametros ? que se reemplazarán con la función enlazarParametro.
     * @param <string> $sql una sentencia SQL.
     */
    public function preparar($sql) {
        return parent::prepare($sql);
    }
 
    /**
     * Envía una consulta no preparada a la base de datos. Equivale a la
     * función query.
     * @param string $sql la consulta SQL.
     * @return <BdSentencia> el objeto que representa la respuesta.
     */
    public function consultar($sql) {
        return parent::query($sql);
    }
 
    /**
     * Ejecuta una sentencia SQL. No se use para SELECT, para tales casos
     * está consultar, o preparar, para preparar sentencias.
     * @param <string> $sql la sentencia SQL.
     * @return <int> el numero de filas afectadas por esta acción.
     */
    public function ejecutarRapido($sql) {
        return parent::exec($sql);
    }
 
}
 
?>

Clase "Interna"

Esta clase representa la sentencia preparada SQL.

Guardarla en la misma carpeta que la clase principal.

<?php
 
/**
 * Este proyecto esta bajo la licencia
 * Creative Commons Atribucion-NoComercial-LicenciarIgual 3.0
 * ver http://creativecommons.org/licenses/by-nc-sa/3.0/deed.es
 */
 
/**
 * Representa una sentencia preparada según la clase BD.
 *
 * @author <a mailto="rodrigo.gonzlez@gmail.com">Rodrigo González</a>
 */
class BdSentencia extends PDOStatement {
 
    /**
     * Una referencia al objeto BD.
     * @var <BD> la base de datos.
     */
    private $pdo;
 
    /**
     * Constructor.
     * @param <BD> $pdo una referencia a la base de datos.
     */
    protected function BdSentencia($pdo) {
        $this->pdo = $pdo;
    }
 
    /**
     * Ejecuta una sentencia preparada, si se le pasan argumentos entonces estos
     * se reemplazan en los '?' de la sentencia preparada en el mismo orden.
     * @param <string [,string[,...]]> los argumentos a reemplazar.
     * @return <bool> true si la acción fue exitosa, false caso contrario.
     */
    public function ejecutar() {
        // Si hay argumentos entonces pasarselos como array al método nativo
        // execute.
        if (func_num_args() > 0) {
            return parent::execute(func_get_args());
        }
        return parent::execute();
    }
 
    /**
     *
     * @return <string[]> una matriz que representa la tabla consultada en la
     * base de datos.
     */
    public function getMatriz() {
        return parent::fetchAll(PDO::FETCH_ASSOC);
    }
 
    /**
     *
     * @return <object[]> un vector de objetos en donde cada posición es un
     * objeto que representa una fila de la tabla (producto de la consuta a la
     * base de datos), y cada atributo de los objetos son los correspondientes a
     * las columnas de dicha tabla.
     */
    public function getObjetos() {
        return parent::fetchObject();
    }
 
    /**
     *
     * @return <int> el número de filas de la consulta.
     */
    public function contarFilas() {
        return parent::rowCount();
    }
 
}
 
?>

Archivo de configuración

Contiene constantes sobre el entorno de la base de datos. Ponerla en cualquier parte y llamarla junto con la clase principal en un include.

<?php
 
/**
 * Este proyecto esta bajo la licencia
 * Creative Commons Atribucion-NoComercial-LicenciarIgual 3.0
 * ver http://creativecommons.org/licenses/by-nc-sa/3.0/deed.es
 */
 
 
// Datos para la base de datos.
 
/**
 * El motor de la base de datos, puede ser
 * 'mysql', 'postgresql', 'orale', etc.
 */
define('BD_MOTOR', 'mysql');
 
/**
 * El host.
 */
define('BD_HOST', 'localhost');
 
/**
 * Algunos host compartidos tienen un prefijo para sus bases de datos.
 */
define('BD_PREFIJO_NOM', '');
 
/**
 * El nombre de la base de datos del sistema.
 */
define('BD_PRINCIPAL_NOM', 'sistema');
 
/**
 * El nombre del usuario.
 */
define('BD_USUARIO_NOM', 'admin');
 
/**
 * La clave del usuario.
 */
define('BD_USUARIO_CLAVE', 'macoy123');
 
/**
 * Texto que se agrega a los hash para aumentar su seguridad.
 * En el caso de que se transporte el sistema y se use el instalador, es
 * necesario copiar este valor, de otro modo las contraseñas no funcionarán.
 */
define('HASH_SALT', 'd+ñsdop'); // Aún no implementado.
 
?>

Eso. Porfavor, comenten cualquier duda o sugerencia para poder mejorarla.

Saludos

Soy nuevo aquí y quería preguntar sobre un buen tutorial de html/css apenas estoy iniciando.

Bueno muchas gracias de antemano por las sugerencias!

Disclaimer: Este artículo fue escrito en noviembre de 2010 y espero que quede obsoleto muy pronto.

La razón principal para escribir este artículo es que Internet está sobrepoblado de chismes y alardes sobre el video HTML5 y su “impecable” soporte en dispositivos de Apple, pero a mi parecer falta información verdaderamente útil a la hora de querer implementar esta característica en proyectos reales. Lo que a continuación leerán es básicamente una recopilación de aprendizaje de primera mano, de los problemas y sorpresas con los que me he ido encontrando. En la segunda parte “Con las manos en la masa” (próximamente) entraremos de lleno a las soluciones.

<video>

Una de las novedades del HTML5 más difundidas es la capacidad de reproducir video dentro del navegador sin necesidad de utilizar plugins, mediante el uso de la etiqueta <video>. La especificación es bastante simple, pero en estos momentos la realidad es más bien compleja.

Con un poco de suerte, dentro de un par de años, algo así será suficiente para utilizar exitosamente este recurso:

<video src=”el_archivo”  width="300" height="150" controls autoplay loop></video>

¿Cuál es el problema?

Lo primero que hay que mencionar es que Internet Explorer 8 y anteriores simplemente no soportan la etiqueta <video> (despues platicaremos cómo darle la vuelta a este problema). Por otra parte, la mayoría de dispositivos pequeños (incluyendo todos los aparatos con Safari mobile sobre iOS 3.x) no son capaces de mostrar video directamente en el navegador web, sino que puede verse sólo en pantalla completa, por medio del Quicktime Player.

Y les voy a contar un secreto (pues no encontré información oficial al respecto), pero todas mis pruebas indican que Safari por sí sólo (incluyendo la versión de escritorio) no es capaz de reproducir audio ni video, sino que lo hace utilizando a quicktime como motor multimedia. Simplemente hagan la prueba de desinstalar quicktime de sus máquinas.

Cuando escribimos “src” nos enfrentamos al segundo inconveniente, ya que no existe a la fecha un formato estándar, sino que diferentes navegadores requieren distintos códecs, además de que hay que ajustarse a especificaciones particulares en el modo de codificar el video para que pueda mostrarse en la mayoría de dispositivos.

El atributo “controls” funciona en todos los navegadores con soporte HTML5, pero cada navegador pondrá los controles “como se le antoje”, por lo que si queremos tener una interfaz unificada (teniendo control de la apariencia y colores), habrá que construir nuestro propio kit de controles con javascript y css, o utilizar algún script o aplicación que lo haga por nosotros.

En el caso de dispositivos como el iPhone4 y iPad al parecer aún no es viable construir controles personalizados avanzados, por lo que servicios como youtube, vimeo y el ya famoso jw player utilizan los controles por default del dispositivo. Por su parte, Flarevideo (librería javascript que permite de forma sencilla hacer tus propias interfaces de video html5 compatibles con todos los principales navegadores de escritorio y con fallback a Flash para IE), falla rotundamente al intentar usarlo en dispositivos con Safari Mobile.

Existen otros atributos opcionales disponibles que funcionan más o menos bien según el navegador y versión de que estemos hablando. La única recomendación en este punto es no confiarse, y hacer las pruebas necesarias. Vale la pena mencionar que el autoplay está intencionalmente deshabilitado en todos los dispositivos con Safari Mobile, por lo que hay que tener presente que sin controles simplemente no funcionará.

In Safari on iOS (for all devices, including iPad), where the user may be on a cellular network and be charged per data unit, autobuffering and autoplay are disabled. No data is loaded until the user initiates it.

Update: Resulta que, contrario a lo que encuentro documentado, y también contrario a mis pruebas anteriores, hace unos días usé un iPod Touch con una versión reciente de iOS y el autoplay funcionaba de manera normal, así que nuevamente, no se fíen por lo que diga yo ni nadie.

Esto no se acaba aquí

Esperen muy pronto la segunda parte de este artículo: “Con las manos en la masa” donde nos ensuciaremos las manos para realmente poner a funcionar este asunto. Mientras tanto son bienvenidos sus comentarios en este sitio o via @roccons

Un agradecimiento especial a Null por la ilsutración original para este artículo.

Problema

Crear un campo textarea que se ajuste al contenido. Por ejemplo, si se tiene una línea debería ser así:

Si luego se escribe otra sería así:

Y asi iría creciendo (sólo la altura) automáticamente mientras más se escribe.

Además si se borra el contenido debe auto-ajustar su altura a la altura original.

Si se fijan es muy útil para formularios y campos de comentarios, personalmente me molesta tener que mover la barra para desplazarme dentro de un campo de texto.

Como todo se hace de lado del cliente es evidente que se tiene que hacer uso de javascript (no todo es php :P).

Plazos

1 semana desde ahora si más de 3 personas envían su código, caso contrario el próximo domingo (5 diciembre).

Forma de envío

Ni idea, tenemos plazo para ver como hacerlo. (Null, ¿podrías recibirlos a través de documentosweb@gmail.com XD ? )

Premios

Por confirmar

Restricciones

No usar librerías externas, no sean flojos, que así no se aprende ;)

Ejemplo de código malicioso javascript (muy molesto).

Otro ejemplo de código malisioso (hace editable la página)

Actualmente Internet Explorer 8 no reproduce vídeo HTML5 mientras que Apple pretende mostrar "video nativo" en Safari siendo que lo incrusta mediante Quicktime. Los demás, siguen en la fiesta, aunque aún no se decide el codec estándar.

Inspirado y dedicado para @roccons.

<?php
$imagen="
iVBORw0KGgoAAAANSUhEUgAAACMAAAAjCAIAAACRuyQOAAAACXBIWXMAAAsTAAALEwEAmpwYAAABNmlDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjarY6xSsNQFEDPi6LiUCsEcXB4kygotupgxqQtRRCs1SHJ1qShSmkSXl7VfoSjWwcXd7/AyVFwUPwC/0Bx6uAQIYODCJ7p3MPlcsGo2HWnYZRhEGvVbjrS9Xw5+8QMUwDQCbPUbrUOAOIkjvjB5ysC4HnTrjsN/sZ8mCoNTIDtbpSFICpA/0KnGsQYMIN+qkHcAaY6addAPAClXu4vQCnI/Q0oKdfzQXwAZs/1fDDmADPIfQUwdXSpAWpJOlJnvVMtq5ZlSbubBJE8HmU6GmRyPw4TlSaqo6MukP8HwGK+2G46cq1qWXvr/DOu58vc3o8QgFh6LFpBOFTn3yqMnd/n4sZ4GQ5vYXpStN0ruNmAheuirVahvAX34y/Axk/96FpPYgAAACBjSFJNAAB6JQAAgIMAAPn/AACA6AAAUggAARVYAAA6lwAAF2/XWh+QAAAGKklEQVR42rxXX0xSbxj+TlCKqxwKCMl04bxgbLQZcQj/1QVjcyZJzUl/ttxqa9OKpU222mRctLprudqkP2Nd2A1rNqV0imCoF86ii3Q2raMTDhQsdaXnNDi+v4vDiAiVuvi9F4zv/Z7vPOd7v/O+7/Mh9H8ZtiNi//79KpXq2LFjWq22vLxcIBDs2bMnFotFo9GFhYWJiYmxsbHp6enV1dV/ZyoqKjpz5kxbW5tMJqMoanZ2dmZmJhAIbGxs8Hg8qVSqUCgUCgWPx1tcXLx///7z58/D4fBfb7a5uTkYDALA4ODg6dOnDxw4kBEmkUiMRqPL5QIAkiTPnj37Fxx8Pr+npwcAvF5vTU1NlquqqqrcbjcAPHnypKCgYOcFYrF4ZGQEACwWC4fD+dtIdHR0AMDo6OhWMUhYfn6+2+1mGMZoNCadJSUlOp1Oo9FkSWYwGDY3N71eb2Fh4ZYgu90OAI2NjanLQqEQAACA0+kUCATZkJ04cQIAHA5H5ummpiYA6OzsTHqKi4vD4TCkmNVqzXJn7e3tAGAymdInRCJRIBCYnJxMPRudTge/2+TkZPZn5vF4vnz5IhQKf/Nev34dANIOo6KiIo3pxYsX2TOp1WoA6Ojo+OXau3fv58+fh4eH/0Q7HI4kzfr6enV19TaPvnbtmlarTfW8fv06GAzy+fzEuLa2FgCampqSCLlcXlFRIRKJSkpKKIr6+PHjo0ePKisrt6FRqVQA0NXVlepsaGgAAJ1Olxjfvn2bpmmJRJJEvHz5kmEYi8WCEFpZWbl79+6OsXK5XNFoVCwWp2UnTdN37txBCHERQjU1NX6/PxQKJRF+v7+hoUEulyOEFhcXcRw/fPhwolBiGADs2rUrGo0SBME6NRpNXV2d2WxOq3vhcPj9+/e/ghEOh+12eyqisbERAHw+H0Kot7cXMtmDBw+S+MHBwUgkkjHb7HY7uwcuQqigoCAYDKZOz83NxePxgwcPIoSWl5dpmm5pafn58ycAbGxsxONxDMOWlpZYcHV1tV6vb2tri0ajfzIFAgG2WHARQhwOh6KotGmCIMrKyiQSCUEQOTk5brc7EokghEwmk1KpxDBs9+7dOTk5bNotLy/39vZmPD+Kotgc5SKEGIbJzc1Nnf7+/fvbt2/Ly8ulUumnT58wDJNKpSzT8ePH6+rqkkgul0vT9K1bt1ZWVjIy5ebmMgyTYPr27VtxcXEaYmpqqrm5ubS0dHZ2FiEkk8mCwSCGYVar1WazIYQAAMOw1dVVLpe7TcOVSqXsS3ARQgsLC0qlMg3x7t07hFBZWdmbN28QQk6nk6ZphNDm5ib7RSCE1tfXL1++3NfXt83Xf+jQofn5+QSTz+czm81isTj1G52fn4/FYnK5/OvXrxcvXszPz+dwOADA4XAwDGPD0tLS0tXV5XK5YrHYVvpAqVR2d3cnmIaGhiwWS1VVldPpTIJIkpybm9NqtQaDgSAIdisYhrH5hBD68OGD3+/v6+vT6/UDAwNbFQ4ej+d2uxPjffv2EQQxNDSUhnv48CFsbVeuXGHzemxsbKvQDQwMkCT5q+4luzKO42mHqVarcRxXq9VWqxUAjEajRqPBcRzHcalUihBqbW0FALawCoXCVAVx5MgRALhx40Z6fyJJcnx8fCvtYDQaASC92SAkEAjC4XB/f39raytJkqmtcmRkJBKJiESiDLLrz1dQKpU2m81ms/X39wNAd3e3zWa7efNmKmVnZycbz1evXtXW1rJOs9kMAOfOncsc1sePHwPAyZMnU7dCURRFUWtrayRJ/vjxg6KoSCTCFirWZDLZvXv3UrtofX09ADx79mw7pefxeBiGMRgMrCcvL6+oqEgkErG/7B+hULiNQKuvr2cYxufz7SBvxGKx1+sFgPb29n+Q+VevXgWA8fHx1G63pRUWFj59+hQAPB7P0aNHs+TAcXx0dJQVX1lp2KSZTCaSJFldfurUqWx0eSgUOn/+/L/cNcRi8YULFy5dusTeNaanp2dmZoLBIE3TPB5PIpEoFAqVSpWXl7e0tNTT0+NwOFIb97/cn9RqtV6vr6ysLC0t5fP5XC43Ho+vra0RBDExMTE8PDw1NbXj/en/s/8GALokZd2BTL3JAAAAAElFTkSuQmCC 
";
header("Content-type: image/jpeg");
$archivo = base64_decode($imagen);
echo $archivo;
?>

Me propuse hacer todo este rollo con un par de líneas de javascript, siendo el PHP el motor principal.

De esta forma y un par de horas por la noche, llegué a un método que me impresionó. La facilidad para implementarlo es demasiada: ¡3 líneas de código!.

Ahora les mostraré mi método.

1. PHP, el motor principal.

PHP se encargará de hacer las consultas en la base de datos como siempre lo has hecho: con los datos ingresados y enviados a través de un campo de formulario (elemento padre). Sus respectivos condicionamientos if y else más algún bucle determinarán los resultados en un elemento hijo.

Nota: El método GET será lo que utilizaremos para los formularios (aún no sé si se puede implementar con POST).

2. HTML, los identificadores son importantes.

Necesitamos mínimo 3 identificadores en el HMTL: un identificador "padre", un identificador "hijo" y un identificador "recargar" para actualizar el "hijo" (pues el hijo depende del padre, y si el padre cambia el hijo también).

Lo que hará nuestro script es justamente eso: actualizar el div donde se encuentra el resultado. Nada más ni nada menos.

3. Jquery

Este método funciona con jquery, y lo primero que debemos hacer es enlazar jquery en nuestro <head>.

<script type="text/javascript" src="jquery.js"></script>

Y lo que usamos de él en el script es el evento change o keyup dependiendo del caso y el famoso load().

4. ¡El script!

Y finalmente, este es el script de tres líneas. Lo podemos poner antes del </body>.

<script type="text/javascript">
$('#padre').keyup(function(){
$('#recargar').load('prueba2.php?busqueda='+$('#padre').val().replace(/ /g,"+")+' #hijo');
});
</script>

El script hace lo siguiente: recarga el elemento "recargar" del html y de paso envía a través del método GET una variable que nosotros definamos (en el ejemplo es "busqueda"). Por ello, tenemos la libertad de hacer lo que se nos dé la gana con PHP dentro del div "hijo" tomando en cuenta y condicionando siempre la variable "busqueda".

A final lo que se ve es muy sencillo. La idea es que al presionar el botón de envío obtengamos exactamente el mismo resultado que se nos muestra con javascript, y este último, se encargue de mostrarnos ese mismo ressultado antes de que presionemos el botón.

Y sin Javascript, todo funciona cool.

Ejemplos

Ejemplo 1: Combobox encadenado. El elemento hijo cambia según el elemento padre. Nota: aquí usamos el evento "change".

Ejemplo 2: Búsqueda instantánea. Cada vez que presionamos una letra los resultados de búsqueda se actualizan. En este caso mostramos sólo lo que se escribe.

Ejemplo 3: La misma búsqueda instantánea, pero implementado correctamente con la base de datos de DocumentoWeb. Prueba con la búsqueda "CSS", "PHP" o "Tutorial".

Descarga todos estos ejemplos.

Espero que les sirva y no se estresen con otros métodos que usan datos de XML, archivos javascripts dinámicos, etc. que he visto por ahi.

Actualización

Agregando otra línea fácilmente podemos poner el mensaje "Cargando..." mientras se cargan los resultados.

$('#padre').keyup(function(){
$('#recargar').html("Cargando...");
$('#recargar').load('prueba3.php?busqueda='+$('#padre').val().replace(/ /g,"+")+' #hijo');
});

La siguiente función es la que más estoy usando, es muy simple y la llamo simplificador de código.

<?php

// Simplificador de código

function html($consulta,$html){

    // Caracter que identificará la fila de la base de datos
    $caracter_separador = "%";

    // En la consulta puedes omitir SELECT * FROM, esta parte lo agrega
    if(substr($consulta,0,7)!="SELECT "){
    $consulta="SELECT * FROM ".$consulta;
    }

    // Arreglo que saca el dato entre el $caracter_separador
    $array = explode($caracter_separador,$html);
    $contar_array = count($array)-1;
    
    // Se hace la consulta
    $c = mysql_query($consulta) or die ("Error de consulta (4)");
    
    // Finalmente armamos el HTML con while para cambiar los datos en cada recorrido
    while($d=mysql_fetch_array($c,MYSQL_ASSOC)){
            $imprimir.= $array[0];
            for($i=2;$i<=$contar_array;$i=$i+2){
            $imprimir.= $d[$array[($i-1)]].$array[$i];
            }
    }
    
    // Y se imprime
    echo $imprimir;
    
}

?>

Lo que hace esta función es tomar dos variables: la consulta y el html al cual le aplicaremos los datos que sacaremos de la base de datos.

Se usa de la siguiente forma:

<?php html("consulta mysql","tu codigo html"); ?>

Ejemplo de base de datos:

Ejemplo del código:

<ul>
<?php html("SELECT * FROM paginas LIMIT 3","<li><a href='/%url%'>%texto%</a></li>\r"); ?>
</ul>

Podemos omitir el SELECT * FROM para dejarlo aún más simple:

<ul>
<?php html("paginas LIMIT 3","<li><a href='/%url%'>%texto%</a></li>\r"); ?>
</ul>

Todo lo que está encerrado por % se reemplazará por el dato correspondiente de la fila con el mismo nombre en la base de datos.

Esto imprime el siguiente HTML:

<ul>
<li><a href='http://www.pc.com/producto'>Subwoofer creative A500</a></li>
<li><a href='Modd.com/Review'>Review en Modd</a></li>
<li><a href='www.Hard.cl/09/05/Probamos'>Hard.com - Probamos el nuevo sw a500</a></li>
</ul>

De esta forma sólo cambiamos la forma en que aplicamos nuestras consultas para generar código html, pero el código interno PHP sigue siendo el mismo.

OJO: la función solo sirve para SELECT, ya que vamos a seleccionar datos para mostrar en el html.

NOTA: primero debes conectarte a tu base de datos.

y en le directorio queda asi

localhost/men/index.php

lo que quiero es cambiar la url para que quede asi

localhost/mensaje/mensaje/

lo cual ya lo logre con la siguiente regla

RewriteBase /

ErrorDocument 404 http:../../imagenes/index.php

Options +FollowSymLinks
RewriteEngine on

RewriteRule mensaje/mensaje$ men/index.php

pero cuando escribo la url

localhost/men/index.php

tienen acceso a ese fichero y lo que quiero es que tengan solo acceso por esta url

localhost/mensaje/mensaje/

¿como puedo aser eso? ¿alguien save?

Se como desactivarlo en Firefox pero no en Internet Explorer.

Si nos va bien con este primer concurso, haremos más cada semana. Así que vamos con el primero.

No es necesario inscribirse ni nada engorroso/tradicional.

Primer concurso: Crear palabras con sus letras

La idea es ingresar en un campo de texto una palabra y que al presionar el botón de envio aparezca esta misma palabra o frase pero más grande y formada con sus propias letras. Viendo la siguiente imagen se aclara la idea:

Requisitos:

• Código a usar: PHP.
• Código opcional: HTML y CSS
• No usar imágenes. Exclusivo usar solo texto (se acepta el código &nbsp;).
• No es necesario seguir el ejemplo.
• El código debe funcionar no importando el número de caracteres que se ingresa.
• Cantidad de letras horizontal/vertical de cada letra en el resultado a tu gusto.
• Ingenio.

Recomendación: usar tipografía de tamaño fijo (monospace) o si te atreves a jugar con CSS sorpréndenos.

Los códigos listos los recibiré en documentoweb@gmail.com (más adelante quizás cree algún sistema para subir ficheros de forma automática, por ahora lo haremos así) y serán publicados online aquí mismo en DocumentoWeb (si prefieren los cuelgan en sus propios sitios). Los que me lleguen al correo sólo los revisaré y publicaré el próximo Jueves 2 de Septiembre, porque yo también participaré y no quiero copiar sus ideas.

Cualquier duda la aclararé. Si tienen ideas para el próximo concurso mándenme un mensaje personal (a través del icono de mensaje en la barra superior para los que no saben).

¡Anímate a participar!

Acabo de enterarme de varias combinaciones de teclas que no sabía de Photoshop y quiero compartirlas aquí junto a las que ya sabía.

1. F cambia en los modos de pantalla (maximizado quitando la barra de tareas y botones, fullscreen y normal)
2. Manteniendo presionada la Barra espaciadora se puede mover el diseño con el mouse si es muy grande, está en modo maximizado o fullscreen.
3. Tab permite esconder todas ventanas de herramientas más la barra de herramienta para dejar más espacio de trabajo.
4. Shift+Tab permite esconder solo las ventanas de herramientas.
5. Tab permite cambiar entre el modo del pincel (normal y de precisión)
6. Ctrl+0 muestra el diseño ajustado en toda el area de trabajo disponible
7. Ctrl+1 muestra el diseño en el tamaño real (también haciendo doble click sobre la lupa en la barra de herramientas).
8. Ctrl+E combina la capa actual con la de abajo
9. Ctrl+T permite usar transformación libre.
10. Manteniendo presionado Shift, permite filtrar las rotaciones (por ejemplo de la transformación libre) dejando como opción rotar solo cada 15º, por lo que puedes rotar fácilmente entre 90º, 180º y 270º que es lo más común. También cuando redimensionas te permite mantener el aspecto y no deformar el diseño. Si presionas Shift+Alt te permite redimensionar el diseño siempre desde el centro.
11. Scroll (del mouse) te permite navegar verticalmente en el diseño si es muy grande. Scroll+Ctrl permite navegar horizontalmente. Shift+Scroll navega de forma exagerada.
12. Alt+Scroll te permite aumentar/disminuir el diseño en donde se sitúa el puntero.
13. Con cualquier herramienta de dibujo presionando shift+click los trazos seguirán la dirección indicada solo horizontal o verticalmente.
14. Puedes hacer un guía para maquetación web en Ver > Preferencias > Guías, cuadrículas y sectores con cuadrícula de 100 píxeles con 10 divisiones con un color deseado (gris muy claro recomiendo si el diseño es blanco). Así puedes tener tu referencia para diseñar sitios con medidas más precisas con cuadritos de 10 por 10 píxeles. Para mostrarla/ocultarla puedes hacerlo con Ctrl+?.
15. Ctrl+Alt+Q abre la opción para redimensionar el diseño.
16. F8 abre la información. Genial para saber cuantos píxeles seleccionamos o en que pixel nos situamos.
17. Las capas las podemos mover con los cursores con la herramienta de mover. Si presionamosShift+Cursor podemos mover por mayor cantidad de píxeles. Si usamos Click+Shift podemos mover el diseño solo en direcciones cada 45º, genial para mover en linea recta.
18. Con la herramienta recorte podemos agregar o quitar más área de recorte con las distintas herramientas que nos ofrecen (circular, cuadrada, personalizada, etc.). Presionando Alt quitamos área y con Shift agregamos más área de recorte.
19. Casi cualquier herramienta tiene combinaciones con Alt, Shift y Ctrl, la mayoría yo las descubrí sólo experimentando.
20. Algunas herramientas más usadas expresan sus propias combinaciones, fíjate al momento de seleccionarla en el menú superior, ahí está su combinación de teclas en el lado derecho de su nombre.

Espero que sean de mucha ayuda. Hasta la próxima.

Veremos algunas funciones básicas del PHP que nos permitirán trabajar con las cadenas de texto, ya sea para editarlas, cortarlas, reemplazarle caracteres, etc.

Ya que existen demasiadas funciones no las veremos todas. Puedes buscarlas en la documentación oficial de PHP.net donde se explican en detalle cada una de ellas.

Funciones para cadenas

explode('.','a.b.c')

Convierte una cadena en una matriz, tomando como referencia un caracter '.' para separar la cadena 'a.b.c' en diferentes elementos (a, b y c).

nl2br()

Una "función HTML". Inserta etiquetas <br /> después de cada salto de línea.

htmlentities()

Función para documentos HTML, en el que se cambian carácteres HTML como las letras con acentos, paréntesis angulares y comillas por sus entidades HTML. Utilizado especialmente en sistemas de comentarios para no arruinar el código fuente por los carácteres que utilizan los usuarios.

str_replace('a','b','abc')

Reemplaza todos los carácteres 'a' aparecidos en 'abc' por 'b'. Sensible a mayúsculas y minúsculas.

strtolower() y strtoupper()

La primera convierte la cadena a minúsculas, y la segunda a mayúsculas.

strlen() y str_word_count()

La primera cuenta el número de carácteres que tiene una cadena y la segunda el número de palabras que contiene.

Ejemplo de funciones de cadenas

Ahora veamos un ejemplo para ver como se le da uso a algunas funciones para trabajar las cadenas dentro del lenguaje PHP.

Ejemplo PHP:

 <?php
 
 $cadena = "Lorex ipsux dolor sit axet.";
 $cadena = strtoupper(str_replace('x','m',$cadena));
 $letras = strlen($cadena);
 $palabras = str_word_count($cadena);
 
 echo "La cadena '$cadena' tiene $letras letras y $palabras palabras.";
 
 ?> 

Resultado PHP:

La cadena 'LOREM IPSUM DOLOR SIT AMET.' tiene 27 letras y 5 palabras.

En cada artículo de un blog, los lectores tienen la capacidad de dejar sus comentarios. A su vez, estos pueden ser contestados por el autor de manera que se va creando un diálogo. 

Otra característica de los Blogs es que suelen tener una temática específica. El autor escribe con total libertad y la temática es particular, los hay de tipo personal, periodístico, empresarial o corporativo, tecnológico, educativo (edublogs), políticos, etc.
 

Las herramientas de mantenimiento de weblogs se clasifican, principalmente, en dos tipos:

1. Aquellas que ofrecen una solución gratuita (como Freewebs, Blogger y LiveJournal), que son sencillas, fáciles de utilizar y ofrecen gratuitamente alojamiento del blog. Cualquier persona puede acceder a este tipo de blog y tener su diario listo en menos de 10 minutos de haberse registrado.
2. Soluciones profesionales como es el caso de WordPress o de Movable Type. Ambos Softwares – que también son gratuitos- se instalan en el servidor de hosting y son una alternativa más completa a Blogger y LiveJournal. Estos poseen una flexibilidad mayor a la hora de configurar cada aspecto del blog. Sin embargo, quienes utilicen este software necesitan de ciertos conocimientos en tecnologías web -y un mínimo de programación- para la instalación y mantenimiento del software.

¿Para qué lo usan las Empresas?

Cada vez más, las empresas apuestan blogs como herramienta de Marketing Directo. De esta manera, es posible una retroalimentación más efectiva. Es decir, es una forma de obtener opiniones e investigación de los consumidores, una especie de estudio de mercado.

Parte del atractivo de estos diarios online  es que la persona que contribuye se puede expresar libremente.

Mc Donalds, una de las pioneras del blogging, tiene su blog corporativo en el que los CEOs se contactan con sus empleados. "Son de uso interno –aclara Luciano Parola, director de sistemas de la filial argentina– y su principal ventaja es que, mientras la página Web comunica en una sola dirección, el blog lo hace en mútliples direcciones".

Una empresa que tenga un blog, por otra parte debe estar dispuesta a soportar las críticas de los consumidores.

"Los diarios en línea tienen mucho que ver con la autenticidad, con ir más allá de la jerga corporativa y las relaciones públicas y establecer un verdadero diálogo", dice Michael Wilesy, director de nuevos medios en General Motors. En ese sentido, agrega, "es esencial no ser tan susceptible ante las críticas y aceptar las cosas negativas".

De antemano Gracias

Veremos algunas funciones en PHP que nos permitirán trabajar las variables según la URL de la página, el navegador que utilizemos, cookies del navegador y otras más muy interesantes que a menudo y en cualquier página web son utilizadas para generar dinamismo dentro del sitio dependiendo de estos factores de quien la visita.

$_POST['abc']

Obtiene el texto ingresado en un campo de formulario con el valor 'abc' en el atributo name del HTML luego de enviar un formulario con el método POST.

Ejemplo (example.php):

<form method='post' action='example.php'>
   <p><input name='abc' type='text' /></p>
   <p><input type='submit' value='enviar'></p>
</form>

<?php
   echo '<p>'.$_POST['abc'].'</p>';
?> 

Si en el campo del formulario escribimos 'nuestronombre' y presionamos enviar, este mismo archivo debajo del formulario imprimirá 'nuestronombre' en el HTML.

$_GET['abc']

Obtiene el valor de la variable 'abc' expresada en la URL de la página. Esta URL se puede crear de forma manual  (a través de un enlace por ejemplo) o automáticamente por un formulario de método GET que traspasa todos sus valores del atributo name a la URL después de presionar submit.

Ejemplo de una URL:

http://www.example.com/example.php?abc=minombre&def=miapellido

Ejemplo de example.php

<?php
   echo '<p>'.$_GET['abc'].' '.$_GET['def'].'</p>';
?> 

El archivo example.php imprimirá en un párrafo 'abc' junto a 'def', es decir, 'minombre miapellido' si la URL anterior se mantiene. Si cambiamos los valores, obviamente el resultado de la página cambiará.

$_COOKIE['abc']

Obtiene el valor de la cookie 'abc' que ha sido creada anteriormente por nuestro sitio Web (pues no podemos obtener una cookie creada por otro sitio).

$_SERVER['PHP_SELF']

Obtiene la página en que nos situamos desde la perspectiva del servidor, incluyendo el directorio en la que se encuentra. No puede obtener el dominio en el que se encuentra, pues es una petición interna.

$_SERVER['HTTP_REFERER']

Obtiene la URL completa de la página que visitamos anteriormente. Ideal por ejemplo para saber con qué búsqueda de Google se llegó a tal página. Si se ha accedido directamente a la página no imprimirá nada.

$_SERVER['REMOTE_ADDR']

Obtiene la dirección IP del visitante.

$_SERVER['HTTP_USER_AGENT']

Obtiene el "User AGENT" o la información del navegador que usa el visitante.

Ejemplo PHP:

<?php
 
$pagina_ahora = $_SERVER['PHP_SELF'];
$pagina_anterior = $_SERVER['HTTP_REFERER'];
$tu_ip = $_SERVER['REMOTE_ADDR'];
$tu_navegador = $_SERVER['HTTP_USER_AGENT'];

echo "Estás en $pagina_ahora y anteriormente visitaste $pagina_anterior.
Tu IP es $tu_ip y tu navegador es $tu_navegador";

?>

Esta es una técnica que descubrí hace poco para "recortar" las imagenes con CSS que están incrustadas en el HTML, y es muy pero muy sencilla. Se trata de usar el overflow:hidden para ocultar el resto de la imagen que no se quiere mostrar más margenes negativos para dar un punto de recorte.

No es para usarla como sprites CSS, pero es parecido. Quizás pueda llegar a parecer como las esquinas redondeadas por sus propiedades de margenes negativos.

No creo que sea necesario decir que es compatible con todos los navegadores (IE6 también por si tienes dudas).

Ve la presentación de como recortar imágenes con CSS que he creado.

Los creadores de esta herramienta crearon suficientes funciones para cubrir todas las necesidades de un sistema, phpDataMapper es reciente y todavía esta en desarrollo, pero va por buen camino.

Pueden visitar su pagina y guía oficial phpDataMapper.

Consultas Personalizadas

$lista_registros=$persona->select()->from('persona')->where(array('id' => '3'));

Podriamos hacerlo así:

$lista_registros=$persona->query('SELECT * FROM persona WHERE id=3');

Más sencillo:

$lista_registros = $persona->all(array('id' => 3));

Seleccionamos la persona con el id 3.

Relaciones

En caso de que una tabla tenga relacion con otra por una clave foranea podemos hacer algo muy sencillo:

En caso de que persona tenga relación con publicación:

Ejemplo:

Archivo: Persona.php

<?php

class Persona extends phpDataMapper_Base {//inicio de la clase de mapeo

    // definir la fuente de  datos (tabla para el adaptador)
    protected $_datasource = "persona";

    // definir los atributos como propiedades de la clase con visibilidad publica
    public $id = array ('type' => 'int', 'primary' => true, 'serial' => true );
    public $nombre = array ('type' => 'string', 'required' => true );
    public $email = array ('type' => 'string', 'required' => true );
    public $web = array ('type' => 'string' );

    public $publicaciones = array(
        'type' => 'relation',
        'relation' => 'HasMany',
        'mapper' => 'Publicacion',
        'where' => array('personaid' => 'entity.id')
        );
   
}//fin de la clase de mapeo

?>

No es necesario modificar la tabla persona en la base de datos, $publicaciones hará las veces de una función.

El 'mapper' como sabemos, será la clase mapeo la cual vamos a usar para ese atributo en este caso Publicacion de tipo 'relation' donde personaid de la publicación sea igual al id de la persona: 'where' => array('personaid' => 'entity.id')

Archivo: Publicacion.php

Para crear este mapeo debemos crear en la base de datos: tabla publicacion, atributos: id int, nombre varchar, personaid int.

<?php

class Publicacion extends phpDataMapper_Base {//inicio del mapeo

    protected $_datasource = "publicacion";

    // definir los atributos como propiedades de la clase con visibilidad publica
    public $id = array ('type' => 'int', 'primary' => true, 'serial' => true );
    public $nombre = array ('type' => 'string', 'required' => true );
    public $personaid = array('type' => 'int', 'key' => true, 'required' => true);

}//fin del mapeo

?>

Para definir una clave foranea: array('type' => 'int', 'key' => true, 'required' => true);

Archivo: index.php

<?php

include 'Conexion.php';
include 'Persona.php';
include 'Publicacion.php';

$persona = new Persona(Conexion::getConexion());

$lista_registros = $persona->all();

foreach ( $lista_registros as $registro ) {

    echo 'Id: '.$registro->id.'<br/>';
    echo '&nbsp;&nbsp;Nombre: '.$registro->nombre.'<br/>';
    echo '&nbsp;&nbsp;Email: '.$registro->email.'<br/>';
    echo '&nbsp;&nbsp;Web: '.$registro->web.'<br/>';
    echo '<br/>';

    //Para mostrar todas las publicaciones
    foreach($registro->publicaciones as $publicacion) {

        echo "<p> ID: ".$publicacion->id.' Nombre: '. $publicacion->nombre. "</p>";

    }

}

?>

Ejemplo de una salida:

Id: 2
  Nombre: Alguien
  Email: alguien@alguienweb.com
  Web: www.alguienweb.com

ID: 3 Nombre: primera publicacion

ID: 4 Nombre: segunda publicacion

El alcance de este patrón de diseño se nota en las relaciones de las tablas, en el ejemplo anterior pudimos mostrar rápidamente los registros de publicaciones asociados a persona.

Otros frameworks también usan el Mapeo, yo recomiendo esta herramienta, ya que no se necesita depender de un frameworks para usarla, simplemente lo copiamos y empezamos a usarlo con nuestra aplicación, sin necesidad de modificar mucho nuestro código.

En este pequeño artículo traigo dos add-ons: uno para Firefox y otro para Chrome, que permiten modificar el tamaño del navegador según una resolución escojida.

• Yet Another Window Resizer para Firefox
• Window Resizer para Chrome

En Firefox la suma de pixeles de sus barras (de título, direcciones, marcadores, pestañas y estado) lo hacen más estándar en tamaño por el área visible real de la página respecto a los demás navegadores. Recuerda que Chrome no tiene barra de título ni de navegación, lo que lo hace más pequeño y agranda considerablemente su área de página visible.

Yet Another Window Resize para Firefox conocido gracias a @roccons.

Veremos algunas funciones del PHP que nos permitirán trabajar en las condiciones del PHP, como en los bucles y la estructura if-else. No solo existen métodos con operadores lógicos, existen muchas funciones para trabajar de las cuales veremos algunas.

Funciones para condiciones

*Estas son solo algunas funciones para condiciones.

Recuerda: En la documentación oficial de PHP.net están disponibles todas las funciones y muy bien explicadas. Las funciones para condiciones no están en ninguna sección y se deben encontrar según el propósito que se desea lograr. Por ejemplo, para el manejo de variables o de cadenas.

Ejemplo de funciones en condiciones

Veremos un ejemplo para ver como se le da uso a algunas funciones para trabajar las condiciones dentro del lenguaje PHP.

Ejemplo PHP:

<?php
 
$cadena = "Lorem ipsum";

if(eregi('em',$cadena) && file_exists('../index.php')){

   echo "Bien!";
   // se imprime solo si 'em' está dentro de 'Lorem ipsum' y el archivo index.php existe

}else{

   echo "Mal =(";
   // se imprime solo si 'em' no se encuentra dentro de 'Lorem ipsum'
   // o si el archivo index.php no existe

}
 
?> 

Resultado PHP:

Bien!

Archivo: index.php

<?php

    include 'Conexion.php';
    include 'Persona.php';

    $persona = new Persona(Conexion::getConexion());

    $registro = $persona->get(1);

    $registro->nombre='Webmaster';
    
    $persona->save($registro);    
   
        echo 'Id: '.$registro->id.'<br/>';
        echo '&nbsp;&nbsp;Nombre: '.$registro->nombre.'<br/>';
        echo '&nbsp;&nbsp;Email: '.$registro->email.'<br/>';
        echo '&nbsp;&nbsp;Web: '.$registro->web.'<br/>';
        echo '<br/>';      

?>

Primero obtenemos el registro que deseamos actualizar:

$registro = $persona->get(1);

Luego cambiamos los datos:

$registro->nombre='Webmaster';

Y guardamos:

$persona->save($registro);

Salida:

Id: 1
  Nombre: Webmaster
  Email: null@documentoweb.com
  Web:  www.documentoweb.com

Eliminación

Archivo: index.php

<?php

    include 'Conexion.php';
    include 'Persona.php';

    $persona = new Persona(Conexion::getConexion());

    $persona->delete(array('id' => 1));//Eliminacion

    $lista_registros = $persona->all();
    
    foreach ( $lista_registros as $registro ) {

        echo 'Id: '.$registro->id.'<br/>';
        echo '&nbsp;&nbsp;Nombre: '.$registro->nombre.'<br/>';
        echo '&nbsp;&nbsp;Email: '.$registro->email.'<br/>';
        echo '&nbsp;&nbsp;Web: '.$registro->web.'<br/>';
        echo '<br/>';

    }
    

?>

Para eliminar un registro usamos la función delete(condición):

$persona->delete(array('id' => 1));

Donde la condición es un arreglo en el cual se expresan los valores que debe tener el registro para ser eliminado, en este caso el registro con el id 1.

Salida:

Id: 2
  Nombre: Alguien
  Email: alguien@alguienweb.com
  Web:  www.alguienweb.com

Archivo: index.php

<?php

    include 'Conexion.php';
    include 'Persona.php';

    $persona = new Persona(Conexion::getConexion());

    $lista_registros = $persona->all();

    foreach ( $lista_registros as $registro ) {

        echo 'Id: '.$registro->id.'<br/>';
        echo '&nbsp;&nbsp;Nombre: '.$registro->nombre.'<br/>';
        echo '&nbsp;&nbsp;Email: '.$registro->email.'<br/>';
        echo '&nbsp;&nbsp;Web: '.$registro->web.'<br/>';
        echo '<br/>';

    }

?>

Para cargar todos los registros usamos la función all(), luego recorremos el arreglo con un foreach.

Salida:

Id: 1
  Nombre: Null
  Email: null@documentoweb.com
  Web:  www.documentoweb.com

Id: 2
  Nombre: Alguien
  Email:  alguien@alguienweb.com
  Web: www.alguienweb.com

Obtener un registro

Archivo: index.php

<?php

    include 'Conexion.php';
    include 'Persona.php';

    $persona = new Persona(Conexion::getConexion());

    $registro = $persona->get(1);

    
        echo 'Id: '.$registro->id.'<br/>';
        echo '&nbsp;&nbsp;Nombre: '.$registro->nombre.'<br/>';
        echo '&nbsp;&nbsp;Email: '.$registro->email.'<br/>';
        echo '&nbsp;&nbsp;Web: '.$registro->web.'<br/>';
        echo '<br/>';
    

?>

Para obtener un registro especifico usamos la función get($id), le pasamos por parámetros el id de el registro deseado.

Salida:

Id: 1
  Nombre: Null
  Email: null@documentoweb.com
  Web:  www.documentoweb.com

Nuevo Archivo: index.php

<?php

    include 'Conexion.php';
    include 'Persona.php';

    $persona = new Persona(Conexion::getConexion());

    //Nuevo Registro

    $nuevo_registro = $persona->get ();
    $nuevo_registro->nombre = "Null";
    $nuevo_registro->email = "null@documentoweb.com";
    $nuevo_registro->web = "www.documentoweb.com";
    
    $persona->save($nuevo_registro);

    echo 'Registro Guardado <br/>';

    //Nuevo Registro

    $nuevo_registro = $persona->get ();
    $nuevo_registro->nombre = "Alguien";
    $nuevo_registro->email = "alguien@alguienweb.com";
    $nuevo_registro->web = "www.alguienweb.com";

    $persona->save($nuevo_registro);

    echo 'Registro Guardado <br/>';

?>

Creamos 2 registros, usamos la función get() para obtener un nuevo id, el lo hace automáticamente por ser incrementable:

$nuevo_registro = $persona->get ();

Luego completamos los otros datos:

$nuevo_registro->nombre = "Null";
$nuevo_registro->email = "null@documentoweb.com";
$nuevo_registro->web = "www.documentoweb.com";

Para finalizar usamos la función save($nuevo_registro), para guardar en la base de datos el registro y sus datos:

$persona->save($nuevo_registro);

Salida:

Registro Guardado 
Registro Guardado

Archivo: Conexion.php

<?php

//Archivos necesarios
require 'phpDataMapper/Base.php';
require 'phpDataMapper/Adapter/Mysql.php';

class Conexion {//Inicio de la clase

    public function getConexion() {
        try {
            //parametros: ip, base de datos, usuario, pass
            $conexion = new phpDataMapper_Adapter_Mysql ( 'localhost', 'prueba', 'root', '' );
        } catch ( Exception $e ) {
            echo $e->getMessage ();
            exit ();
        }
        return $conexion;
    }

}//Fin de la clase

?>

El primer archivo requerido es el Base.php este es para las tablas, el mapeo.

El segundo es la interfaz de conexión para MySql.

El bloque try-catch es una estructura que se usa cuando es necesario capturar excepciones (errores).

try {
//Sentencias a ejecutar
} catch ( Exception $e ) {
//Sentancias a ejecutar en caso de una excepcion
}

En este caso la excepción seria que no se pudo hacer la conexión con MySql.

Mapeo

Archivo: Persona.php

<?php

class Persona extends phpDataMapper_Base {//inicio de la clase de mapeo

    // definir la fuente de datos (tabla)
    protected $_datasource = "persona";

    // definir los atributos como propiedades de la clase con visibilidad publica
    public $id = array ('type' => 'int', 'primary' => true, 'serial' => true );
    public $nombre = array ('type' => 'string', 'required' => true );
    public $email = array ('type' => 'string', 'required' => true );
    public $web = array ('type' => 'string' );
   
}//fin de la clase de mapeo

?>

Estructura:

• La Clase lleva el nombre de la tabla que va a representar (mapear).
• La variable $_datasource es el nombre de la tabla.
• Todos los atributos deben ser representados.
• Los id (claves primarias), deben ser autoincrementables en la base de datos, su representación estándar es: array ('type' => 'int', 'primary' => true, 'serial' => true );
• Los atributos requeridos (not null) poseen el estatus 'required' => true
• Los demás atributos solo llevan el tipo.
• Cada tabla debe ser representada por su modelo.
• El modelo hereda de phpDataMapper_Base.
• La idea simplemente es llevar la tabla a código PHP.

Uso

Archivo: index.php

<?php

    include 'Conexion.php';
    include 'Persona.php';

    $persona = new Persona(Conexion::getConexion());
    
?>

Al instanciar el modelo pasamos por parametro la conexión.

La sentencia Conexion::getConexion() significa una auto-instanciación de Conexion(), (no se necesita el new), y llamado de la función getConexion() inmediatamente.

También podría ser:

<?php

    include 'Conexion.php';
    include 'Persona.php';

    $conexion = new Conexion();
    $persona = new Persona($conexion->getConexion());

?>

Para aplicar este patrón usaremos phpDataMapper, una herramienta creada bajo el ORM , nos facilitará en gran manera el manejo de nuestra base de datos.

Es una herramienta de gran utilidad para cuando se necesite crear una aplicación rápidamente, además suma robustez a nuestra aplicación, ayuda mantener un código elegante y entendible.

Links Relacionados

• Mapeo objeto-relacional
• phpDataMapper Home
• OOP
• Descarga: phpDataMapper

Uso

Para poder implementar la herramienta necesitamos descargarla, descomprimirla y pegarla en el directorio raíz de nuestra aplicación.

Importante:

• Esta herramienta necesita que los id de cada entidad sean autoincrementables, por ello se necesita MySql como administrador de base de datos (Hasta ahora esa es la interfaz de conexión que usa phpDataMapper).

Antes de Empezar

• Para este Tutorial usaremos MySql.
• Base de Datos: prueba.
• Tabla: persona.
  
• Atributos: id (int), nombre (varchar), email (varchar), web (varchar).
• Tabla: publicacion.
• Atributos: id (int), nombre (varchar), personaid (int).
  

Unidades

• Unidad I: Conexión y Mapeo
• Unidad II: Creación de un Registro
• Unidad III: Obtención de un Registro
• Unidad IV: Actualización y Eliminación de un Registro
• Unidad V: Otras Caracteristicas

Si quieres aprender programación web, sólo en la web aprenderás

 

Así, podemos saber qué elemento está muy pesado, qué podemos comprimir, cual es el archivo que nos retrasa, cual tiene una URL rota o simplemente darse cuenta del tiempo en que carga el sitio.

No te que los navegadores cachean archivos, por lo que si ya has visitado un sitio, su carga puede ser muy inferior a la del test.

DocumentoWeb tiene un tiempo de carga aproximado de 3.5 segundos (4.6 dice el test, pero abajo hay unas urls de la página web defecto del mi servidor).

Gracias a calizman por darme el dato :).

Artículos relacionados

• Optimizar tu sitio y acelerar la carga web

• Herramientas para webmasters
• Instalar en Firefox: yslow & Firebug
• Optimizar y limpiar los CSS: Cleancss
• Page Speed (Tiene Addons para firefox)

Si eres como yo que no me importa como se vea el código HTML en el browser, comprimelo al máximo eliminando los espacios innecesarios, y modificando el HEADER.

Coloca esto al principio de la página:

<?php
// NO TOCAR
header('Accept-Ranges: bytes');
$ExpStr = 'Expires: '.gmdate("D, d M Y H:i:s", time() + 14400) . " GMT"; // 14400 = 4 horas
header($ExpStr);
header("Cache-Control: maxage=14400");
header("Cache-Control: public, must-revalidate");
header("Cache-Control: public");
header("pragma: public");
header("Content-Transfer-Encoding:gzip;q=1.0,identity;q=0.5,*;q=0");
header("Cache-Control: cache");
header("Pragma: cache");
header('Content-Type: text/html; charset=iso-8859-1');
setlocale(LC_TIME, 'es_VE'); # Localiza en español es_Venezuela
// FIN NO TOCAR
// elimina los espacios en blanco
function compress_page($buffer) { $search = array('/\>[^\S ]+/s','/[^\S ]+\</s','/(\s)+/s'); $replace = array('> ',' <','\\1'); return preg_replace($search, $replace, $buffer); }
ob_gzhandler(ob_start("compress_page"));
?>

Y al final luego del tag<html>:

<?php ob_end_flush(); ?>

Al usar archivos .htaccess se maximiza la carga (más sobre los .htaccess en Apache). 

<IfModule mod_expires.c>
 ExpiresActive On 
 ExpiresDefault A86400 
 ExpiresByType image/x-icon A2592000 
 ExpiresByType application/x-javascript A2592000 
 ExpiresByType text/css A2592000 
 ExpiresByType image/gif A604800 
 ExpiresByType image/png A604800 
 ExpiresByType image/jpeg A604800
 ExpiresByType text/plain A604800
 ExpiresByType application/x-shockwave-flash A604800
 ExpiresByType video/x-flv A604800
 ExpiresByType application/pdf A604800
 ExpiresByType text/html A900
 </IfModule>
 #Header
 <IfModule mod_headers.c>
 # YEAR
 <FilesMatch "\.(ico|gif|jpg|jpeg|png|flv|pdf)$">
 Header set Cache-Control "max-age=29030400"
 </FilesMatch>
 # WEEK
 <FilesMatch "\.(js|css|swf)$">
 Header set Cache-Control "max-age=1604800"
 </FilesMatch>
 # 45 MIN
 <FilesMatch "\.(html|htm|txt)$">
 Header set Cache-Control "max-age=2700"
 </FilesMatch>
 <FilesMatch "\.(xml|txt|html)$">
 ExpiresDefault A71400
 Header append Cache-Control "private, must-revalidate"
 </FilesMatch>
 </IfModule>
 ################## GZip Files ###################
 <FilesMatch "\.js$">
 AddHandler application/x-httpd-php .js
 php_value default_mimetype "text/javascript"
 </FilesMatch>
 <FilesMatch "\.css$">
 AddHandler application/x-httpd-php .css
 php_value default_mimetype "text/css"
 </FilesMatch>
 <FilesMatch "\.(htm|html|shtml)$">
 AddHandler application/x-httpd-php .html
 php_value default_mimetype "text/html"
 </FilesMatch>
 # ejemplo: /var/www/vhosts/tu_sitio/httpdocs/gzip.
 php_value auto_prepend_file ruta_real_de_tu sitio_/gzip.php
 

el código del archivo gzip.php

<?php
  if(isset($_SERVER['HTTP_ACCEPT_ENCODING']) && substr_count($_SERVER['HTTP_ACCEPT_ENCODING'], 'gzip')) ob_start('ob_gzhandler'); else ob_start();
  ?> 

Para observar si en verdad mejora, prueba en estas páginas la carga de tu sitio, y luego de hacer los cambios prueba de nuevo, observarás gran mejora.

1. http://www.webpagetest.org/test RECOMENDADO
2. http://www.jpwebsystems.com/utilidades-web.php
3. http://www.velocidadtotal.com/es/speed_test.html
4. http://analyze.websiteoptimization.com/ Importante
5. http://webwait.com/ útil

Además hay que tener en cuenta algunos otros detalles:

• Minimizar Peticiones HTTP
• Optimizar las imagenes, usar la menor cantidad de colores posibles, el Addons recomendado arriba te da la opción de guardar la imagen optimizada. 
• En el código HTML evitar los comentarios en lo máximo posible
• Optimizar los javascript, llevarlos a su máxima compresion
• Optimizar los CSS 
• Invocar las imágenes desde las hojas de estilo (css)

Dale una mirada a este enlace: High Performance Web Sites.

También sería bueno añadir en el .htacces lo siguiente:

# evita el User-Agent libwww-perl

RewriteEngine on
RewriteCond %{HTTP_USER_AGENT} libwww [NC,OR]
RewriteCond %{QUERY_STRING} ^(.*)=http [NC]
RewriteRule ^(.*)$ – [F,L]

# mejora el mime para el expire

RewriteRule (.*)-cb\d+\.(.*)$ $1.$2 [L]

Best Practices for Speeding Up Your Web Site
http://developer.yahoo.com/performance/rules.html

Estos consejos te ayudaran a mejorar el rendimiento de carga de tu sitio web hasta en un 20% lo que tus usuarios lo agradeceran.

Fuente:
http://www.xombra.com

Este patrón es muy útil sobre todo si se trabaja con grupos grandes de desarrolladores, ya que se pueden crear estructuras de manera que deban ser seguidas, para que así asegurar el perfecto funcionamiento de la aplicación al ser fusionada.

¿Cómo definimos este patrón?, es un método por el cual los desarrolladores pueden crear y organizar entidades, estas entidades son una simulación del mundo real, y por ende simulan soluciones a problemas reales, en otras palabras se imita de alguna forma como hacemos las cosas a mano, pero en un estructura programada.

Caracteristicas

• Simula actividades del mundo real.
• El usuario crea sus propios tipos de datos.
• Reutilización del código.
• Permite la portabilidad, compatibilidad y robustez, de ahi la creación de FrameWorks.
• Capacidad de encapsular la información y procedimientos.
• Construción de sistemas complejos, con la participación de muchos desarrolladores.
• Mejor mantenimiento y adaptabilidad de modulos.
• Es más entendible.

Pilares Fundamentales

• Encapsulamiento.
• Herencia.
• Clase (Entidad).
• Objeto.
• Polimorfismo.

Analisis

Existe un concepto para el análisis de patrones y de aplicaciones, este se llama Cohesión y Acoplamiento, nos ayuda a observar el grado de funcionalidad del código y de la implementación de una aplicación, son conceptos un tanto dificiles, la cohesión es la capacidad de que los módulos o funciones resuelvan un problema por si solas, generalmente estas son agrupadas, en librerías, en nuestro caso en clases, de manera que simulen la realidad, por ejemplo los usuarios, estos pueden ser eliminados, actualizados, y generados, todos esos módulos (funciones) están evocados hacia una misma entidad, pero cada una resuelve un problema distinto y por si solo, al organizarlos y unirlos creamos la clase Usuario, el acoplamiento se refiere a la dependencia que tiene un módulo de otro, al cambiar uno es necesario hacer cambios en el otro, esto es malo, debemos intentar tener el menor grado de acoplamiento posible en nuestras aplicaciones, solo lo necesario y obligatorio, por ejemplo si en vez de usar una clase Usuario usáramos una función que recibiera el tipo de procedimiento, proceso($proceso), donde $proceso seria, "eliminar", "crear", "actualizar", podría a futuro generar molestias, y perdida de tiempo al intentar hacer grandes modificaciones, y lo peor es que los problemas generalmente aumenta exponencialmente. El diseño orientado a objetos también conocido como programación orientada a objetos nos permite crear estructuras poco acopladas, para así asegurar la compatibilidad y portabilidad de nuestro código, es una muy buena opción implementarla, por supuesto que lleva tiempo, pero a la larga se notará su flexibilidad.

Unidades

• Unidad I
• Unidad II
• Unidad III
• Unidad IV

Recuerda hacer preguntas si tienes dudas en algo...

Constructor

El constructor de una clase tiene como principal objetivo el de inicializar el objeto al ser instanciado, colocando así sus atributos en los valores deseados.

El constructor es una función, y como tal puede o no recibir párametros.

En PHP un ejemplo de constructor de una clase seria el siguiente:

public function __construct() {

}

Notemos que la función esta denotada así: __construct(), dos underscore ( __ ) y la palabra construct.

Destructor

El destructor de una clase es muy similar a el constructor, la diferencia radica en que este es llamado cuando es destruido el objeto, en otras palabras eliminado de la memoria, claro es solo en teoria, su objetivo principal es devolver algún objeto o situación a su estado original, por ejemplo, cerrar conexiones con base de datos, o limpiar archivos temporales, o eliminar plantillas usadas, entre otras, ahora el concepto destructor no existe en PHP4 así que cuidado con eso.

El destructor no recibe parámetros.

Un ejemplo seria el siguiente:

public function __destruct() {
        
}

Posee una estructura igual al constructor pero con la palabra destruct, el destructor no funciona muy bien si se hereda esa clase, así que cuidado, dependiendo de lo que se haga sirve o no, y para saberlo se necesita experiencia.

Ejemplo:

Archivo: Estudiante.php

<?php

class Estudiante {//Inicio de la clase

    //Atributos
    private $id;
    private $nombre;

    //Funciones
    public function __construct() {
        $this->id=0;
        $this->nombre="Null";
        echo 'Construyendo <br/>';
        echo 'Nombre: '.$this->nombre.', ID: '.$this->id.'<br/>';
    }

    public function __destruct() {
        echo 'Destruyendo';
    }

}//Fin de la clase

?>

Archivo: index.php

<?php

include 'Estudiante.php';

$estudiante = new Estudiante();

?>

Salida:

Construyendo 
Nombre: Null, ID: 0
Destruyendo

Mejoremos el código, le colocaremos parámetros predefinidos al constructor:

Nuevo Archivo: Estudiante.php

<?php

class Estudiante {//Inicio de la clase

    //Atributos
    private $id;
    private $nombre;

    //Funciones
    public function __construct($id=0,$nombre="Null") {//Parametros predefinidos
        $this->id=$id;
        $this->nombre=$nombre;
        echo 'Construyendo <br/>';
        echo 'Nombre: '.$this->nombre.', ID: '.$this->id.'<br/>';
    }

    public function __destruct() {
        echo 'Destruyendo';
    }

}//Fin de la clase

?>

¿Para qué se usan estos parámetros?, bueno si al instanciar el objeto no se pasan datos por parámetros estos serán los valores que tomaran las variable.

Ejemplo:

Nuevo Archivo: index.php

<?php

include 'Estudiante.php';

$estudiante = new Estudiante(2,"Pedro");

?>

Salida:

Construyendo 
Nombre: Pedro, ID: 2
Destruyendo

Salida sin usar parámetros:

Construyendo 
Nombre: Null, ID: 0
Destruyendo

Recuerda hacer preguntas si tienes dudas en algo...

Veremos como utilizar funciones para determinar y usar las fechas y horas a nuestro favor con el lenguaje PHP.

La función por excelencia de las horas y fechas es date().

Función date()

La funcióne date()que se utiliza de la siguiente forma:

$fecha = date('d M Y');

Donde los carácteres incluidos dentro de las comillas de la función date() son reemplazados si existe un equivalente para dicho carácter. En la siguiente tabla [ver completa en PHP.net], se muestran las equivalencias de cada letra para utilizarlas dentro de esta función.

Más en función date() de PHP.net.

Veremos un simple ejemplo con caracteres que aparecen en la tabla superior. Recordemos que solo los que aparecen en la tabla oficial de PHP.net son los que se reemplazan en la sintaxis de date().

Ejemplo PHP:

 <?php

 $hoy = date('d M Y, H:i:s a');
 echo "Hoy es: ".$hoy;

 ?> 

Resultado PHP:

Hoy es: 19 Jul 2010, 12:01:46 pm

Caracteres como la coma, los espacios y dos puntos no son reemplazados por PHP.

Función time()

La función time() muestra los segundos que han transcurrido desde el primero de enero de 1970 (00:00 GMT). Con ella podemos calcular diferentes cosas, por ejemplo, cuantos segundos han transcurrido entre ayer y hoy, o menor aún, cuantas horas entre el mismo intervalo siempre y cuando le restemos o hagamos algún cálculo con el dato de time().

Ejemplo PHP:

<?php

$una_semana = 60 * 60 * 24 * 7 ;
// 60 segundos * 60 minutos * 24 horas * 7 días nos da los segundos transurridos
durante una semana.

$un_dia = 60 * 60 * 24 ;
// 60 segundos * 60 minutos * 24 horas nos da los segundos transurridos durante un día.

$la_semana_pasada = time() - $una_semana;
$la_semana_antepasada = time() - ($una_semana * 2);
$la_semana_siguiente = time() + $una_semana;
$en_ocho_dias = time() + $una_semana + $un_dia;
$en_diez_dias = time() + ($un_dia * 10);

// así podemos calcular diferentes tiempos en segundos

?>

Ahora, podemos utilizar nuestra función date() junto a time() para obtener fechas, de la siguiente forma:

echo date('d M Y',$en_diez_dias)."<br />";
echo date('d M Y',$la_semana_antepasada);

Resultado PHP:

29 Jul 2010
05 Jul 2010

Artículo relacionado:

Función PHP para calcular hace cuanto pasó aquello.

Clase Abstracta

En la Unidad I expliqué que una clase era un concepto o plantilla y que esta al ser instanciada se transformaba en un objeto en memoria, una clase abstracta sigue siendo un concepto, pero a diferencia de la clase normal (clase concreta) esta no puede ser instanciada.

Una clase abstracta posee funciones abstractas, son métodos que no han sido escritos, sólo está su cabecera, y sólo estas clases pueden representarlos, su objetivo es ser escritos (implementados) por las subclases, y así aplicar el polimorfismo explicado en la Unidad II.

Explicaré mejor las diferencias entre clases abstractas y clases concretas mediante una tabla:

Para crear una clase o función abstracta usaremos la palabra reservada abstract.

Ahora mejorando el código de la Unidad II, la nueva superclase:

Nuevo Archivo: Figura.php

<?php

abstract class Figura {//Inicio de la clase abstracta

    //Atributos
    private $color;
    private $nombre;

    //Funciones
    public function getColor(){
        return $this->color;
    }

    public function setColor($color){
        $this->color=$color;
    }

    public function getNombre(){
        return $this->nombre;
    }

    public function setNombre($nombre) {
        $this->nombre=$nombre;
    }

    abstract public function area();//Funcion sin implementacion

}//Fin de la clase

?>

Notemos la sintaxis, en la cabecera de la clase se colocó abstract class, y ahora la función area() también es abstracta, notemos que no tiene llaves {...}, la función termina en punto y coma ;

abstract public function area();//Funcion sin implementacion

Si intentaramos instanciar Figura generaría un error ( $figura = new Figura(); )

Fatal error:  Cannot instantiate abstract class Figura in...

Este dice que no se puede instanciar una clase abstracta.

Los otros archivos quedarían igual.

Interfaz

Una interfaz es una colección de funciones sin implementación, son similares a las clases abstractas, no pueden ser instanciadas, pero además todas las funciones son abstractas, su objetivo principal es obligar a las clases concretas a que implementen todos sus métodos abstractos, así se asegura que todas las clases que la usen o mejor dicho que implementen la interfaz tengan los métodos que deben ser comunes, y asegurar el polimorfismo de los mismos. Si una clase abstracta implementa una interfaz no necesita implementar las funciones de la misma.

Para declarar una interfaz usaremos la palabra reservada interface.

Archivo: IFigura.php

<?php

interface IFigura {//Inicio de la interfaz

    public function area();
    
}//Fin de la interfaz

?>

Ahora cambiemos la clase abstracta Figura, simplemente eliminamos el método area();

Luego veamos como quedaria la clase Rectangulo, para usar una interfaz usaremos la palabra implements:

Nuevo Archivo: Rectangulo.php

<?php

class Rectangulo extends Figura implements IFigura {//Inicio de la clase

    //Atributos
    private $ladoA;
    private $ladoB;

    //Funciones
    public function getLadoA(){
        return $this->ladoA;
    }

    public function setLadoA($ladoA){
        $this->ladoA=$ladoA;
    }

    public function getLadoB(){
        return $this->ladoB;
    }

    public function setLadoB($ladoB){
        $this->ladoB=$ladoB;
    }

    //Funcion Polimorfica
    public function area(){
        return ($this->ladoA*$this->ladoB);
    }
    
}//Fin de la clase

?>

Si no implementaramos area() cuando corrieramos el codigo pasaría esto:

Fatal error:  Class Rectangulo contains 1 abstract method and  must therefore be declared abstract or implement the remaining methods  (IFigura::area) in...

Nos dice que hay un método abstracto declarado en la interfaz y que en Rectangulo no ha sido implementado.

Recordemos incluir la interfaz en el index:

Nuevo Archivo: index.php

<?php

include 'Figura.php';
include 'IFigura.php';//Nueva inclusion
include 'Triangulo.php';
include 'Rectangulo.php';

.
.
.

?>

Recuerda hacer preguntas si tienes dudas en algo...

Me encantaría estar como mi logo, pero no tengo portátil =(.

Herencia

La herencia se refiera a que una clase B (subclase) puede usar la estructura de una clase A (superclase), igual que en el mundo real las personas heredamos los rasgos físicos de los padres, y no solo los rasgos físicos sino por ejemplo los apellidos.

La herencia es útil para tener un mejor entendimiento de los procesos de un programa de forma jerarquica o para clasificar una serie de clases rehusando el código ya escrito.

Las clases que hereden obtendran todos los atributos y funciones de sus padres, y podran acceder a ellos si son public o protected, como explique en la Unidad I los atributos y funciones private solo se pueden acceder dentro de la misma clase que los usa.

Las clases que hereden pueden agregar a su estructura nuevos atributos y funciones sin afectar a la superclase.

Polimorfismo

El polimorfismo se refiere a funciones que se llaman igual, pero se comportan diferente, básicamente buscan solucionar el mismo problema de diferentes formas.

Primero crearemos la superclase:

Archivo: Figura.php

<?php

class Figura {//Inicio de la clase

    //Atributos
    private $color;
    private $nombre;

    //Funciones
    public function getColor(){
        return $this->color;
    }

    public function setColor($color){
        $this->color=$color;
    }

    public function getNombre(){
        return $this->nombre;
    }

    public function setNombre($nombre) {
        $this->nombre=$nombre;
    }

    public function area(){
        return 0;
    }

}//Fin de la clase

?>

Ahora creamos la primera herencia, para ello usaremos la palabra reservada extends:

Archivo: Triangulo.php

<?php

class Triangulo extends Figura {//Inicio de la clase

    //Atributos
    private $base;
    private $altura;

    //Funciones
    public function getBase(){
        return $this->base;
    }

    public function setBase($base){
        $this->base=$base;
    }

    public function getAltura(){
        return $this->altura;
    }

    public function setAltura($altura){
        $this->altura=$altura;
    }

    //Funcion Polimorfica
    public function area(){
        return ($this->base*$this->altura/2);
    }

}//Fin de la clase

?>

Analizando el código vemos que en la cabecera se escribe extends luego de darle nombre a la subclase  en este caso Triangulo, e inmediatamente después el nombre de la superclase.

El Triangulo ahora obtiene los atributos y funciones de Figura.

La función area() se sobrescribe y se le da la nueva forma.

Creando otra subclase:

Archivo: Rectangulo.php

<?php

class Rectangulo extends Figura {//Inicio de la clase

    //Atributos
    private $ladoA;
    private $ladoB;

    //Funciones
    public function getLadoA(){
        return $this->ladoA;
    }

    public function setLadoA($ladoA){
        $this->ladoA=$ladoA;
    }

    public function getLadoB(){
        return $this->ladoB;
    }

    public function setLadoB($ladoB){
        $this->ladoB=$ladoB;
    }

    //Funcion Polimorfica
    public function area(){
        return ($this->ladoA*$this->ladoB);
    }

}//Fin de la clase

?>

Analizando la función area() podemos ver que su comportamiento cambia para ambas clases, pero siguen siendo la misma función heredada.

//Triangulo
    public function area(){
        return ($this->base*$this->altura/2);
    }

//Rectangulo
    public function area(){
        return ($this->ladoA*$this->ladoB);
    }

Para finalizar:

Archivo: index.php

<?php

include 'Figura.php';
include 'Triangulo.php';
include 'Rectangulo.php';

$triangulo = new Triangulo();
$triangulo->setNombre("Triangulo");
$triangulo->setAltura(2);
$triangulo->setBase(2);

echo 'Nombre: '.$triangulo->getNombre().', Area: '.$triangulo->area();

echo '<br/>';

$rectangulo = new Rectangulo();
$rectangulo->setNombre("Rectangulo");
$rectangulo->setLadoA(2);
$rectangulo->setLadoB(2);

echo 'Nombre: '.$rectangulo->getNombre().', Area: '.$rectangulo->area();

?>

La salida seria algo así:

Nombre: Triangulo, Area: 2
Nombre: Rectangulo, Area: 4

Recuerda hacer preguntas si tienes dudas en algo...

Los patrones de diseño se refieren a la arquitectura de un programa, a la forma en la que está construidos, ellos se crean por la necesidad de solucionar algún  problemas de forma efectiva y reusable, además pretenden estandarizar el modo en que se desarrolla e implementa el software, facilitar el aprendizaje de las nuevas generaciones de diseñadores, y generar un criterio de codigo eficiente y la optimización de una aplicación.

Un Diseñador de Software (mejor conocido como programador) demuestra su madurez profesional aplicando dichos patrones que son variados y evocados a distintas soluciones o distintos software.

OOP (programación orientada a objetos)

La oop (object-oriented programming) es una abstracción del mundo real, en otras palabras intenta imitar los objetos y circunstancias de la vida real, así como los objetos de nuestro mundo poseen características (atributos) como: color, peso, tamaño, estatura, entre otros, y comportamientos (funciones, métodos o procedimientos) como: caminar, correr, disparar, buscar, entre otras, estos objetos también los tienen, en forma de código, este código que le da forma a un objeto se le llama "clase" (class).

La oop también es conocida como paradigma de programación orientada a objetos.

PHP es un lenguaje de programación que soporta la oop y es de gran utilidad crear objetos.

Los atributos siempre serán sustantivos y las funciones verbos.

Class

Antes de empezar con el código, se puede decir que un objeto tiene dos niveles, uno que es la clase y otro que es su implementación (instancia) o creación, la clase es la plantilla por la cual se regirá la forma del objeto, por ejemplo la clase Persona, esta tiene atributos como color de cabello, estatura, nacionalidad, nombre entre otros, pero no es ninguna Persona en particular, es solo el concepto de lo que debe ser una Persona, una instancia o creación de esta clase eres tu, y yo, el escritor de este articulo, ambos tal vez con nombres, nacionalidades, y color de cabello distintos, pero los dos somos tangibles, existimos, esa es la diferencia principal entre una clase (concepto) y una instancia (realidad).

La clase es un tipo de dato creado por el desarrollador.

Ahora ¿Cómo transformamos todo esto en código PHP?:

Archivo: Persona.php

 Recomiendo que cada clase se escriba en un archivo con su nombre, es posible crear varias clases en un solo archivo PHP.

<?php

class Persona {//Inicio de la Clase

    //Atributos
    private $nombre;
    
    //Funciones generalmente Públicas
    public function getNombre(){//Puede ser cambiado por obtenerNombre()        
        return $this->nombre;
    }

    public function setNombre($nombre){//Puede ser cambiado por insertarNombre()        
        $this->nombre=$nombre;        
    }

    private function pensar($pensamiento){
        echo $pensamiento;
    }

}//Fin de la Clase

?>

Observemos que tanto los atributos como las funciones están dentro de la clase, eso se llama encapsulamiento.

Las funciones get y set son utilizadas siempre para obtener e insertar los valores de los atributos de la clase, generalmente cada atributo posee estas dos funciones asociadas.

Las funciones y atributos public son la información a la cual se puede acceder desde la instancia de la clase, (el patrón OO, exige que los atributos sean private, pero a nivel de programación se pueden hacer publicos) ejemplo, otra persona puede pedirte tu nombre, pero no puede pedirte tus pensamientos (es solo para ejemplificar), por ende las funciones y atributos private solo pueden ser accedidas dentro de la clase.

La palabra reservada $this-> se utiliza para llamar atributos y funciones de la misma clase, en este caso el nombre.

Mejorando el código:

<?php

class Persona {//Inicio de la Clase

    //Atributos
    private $nombre;
    
    //Funciones generalmente Públicas
    public function getNombre(){//Puede ser cambiado por obtenerNombre()
        $this->pensar('Entrego mi nombre<br/>');//Llamando a la función Privada
        return $this->nombre;
    }

    public function setNombre($nombre){//Puede ser cambiado por insertarNombre()
        $this->pensar('Cambio mi nombre<br/>');//Llamando a la función Privada
        $this->nombre=$nombre;        
    }

    private function pensar($pensamiento){
        echo $pensamiento;
    }

}//Fin de la Clase

?>

Así podemos ver el uso de la función privada.

Ahora:

Archivo: index .php

<?php

   include 'Persona.php';
   $objeto = new Persona();
   $objeto->setNombre('Pedro');
   echo 'Nombre '.$objeto->getNombre();

?>

Para poder darle vida a nuestro objeto primero incluimos el archivo donde se encuentra la clase, luego con la palabra reservada new instanciamos el objeto:

$objeto = new Persona();

Este sentencia crea un objeto Persona en la variable $objeto (esta variable puede tomar cualquier nombre).

y para finalizar usamos sus funciones públicas:

$objeto->setNombre('Pedro');
echo 'Nombre '.$objeto->getNombre();

el resultado seria:

Cambio mi nombre
Entrego mi nombre
Nombre Pedro

Recuerda hacer preguntas si tienes dudas en algo...

Mi pregunta es como comprar un domini de .com

Necesito targeta de credito?

Como se hace eso?

Si no trabajo ya que soy estudiante como le hago?

No se puede pagar por celular?

Ayuda a mi

Y después solo llaman a la funcion =)

tambien ago edicion de video en 3D

si alguien necesita ayuda consultarme

Aprende a utilizar los bucles, otra estructura impresindible del lenguaje PHP para repetir bloques de código fuente.

Un Bucle, también llamados ciclos o loop es un un tipo de función/estructura en cualquier lenguaje de programación que permite repetir líneas de código determinadas veces por una condición dada.

Existen varios tipos de bucles, entre ellos encontramos:

• while
• do... while
• for
• foreach

Bucle while

El bucle while lo podemos utilizar generalmente combinado con matrices, en la que su condición asigna un valor para una variable que contendrá el elemento actual de la matriz, y en que cada recorrido este elemento cambiará y se detendrá hasta terminarse los elementos de la matriz.

Ejemplo PHP:

 <?php

 $matriz = array('uno','dos','tres','cuatro');

 while($ahora=current($matriz)){
 echo $ahora."<br />";
   next($matriz);
 }

 ?>
Al menos me ejecuto $i vez
 
"; // la condicion es falsa pero al menos me muestro una vez
	}
	while ($i == 10 );

	/*
		Uso de While:
			Se evalúa la condición al comienzo  para decir si se ejecuta
			otra vez el bucle o se termina su ejecución. 
	*/

	$j = 0;

	while ($j < 10):
			$j++;
			if ($j == 5):
				echo "<h2>Ya te salude $j veces creo que esto es un adios.</h2>";
				break; // salimos del bucle
			endif;
		echo "<p>Hola $j</p>";
	endwhile;
?>

Resultado PHP:

uno
dos
tres
cuatro

La variable $ahora contiene el elemento actual de la matriz, y next($matriz) indica que ahora se utilizará el elemento siguiente de la matriz para el nuevo rrecorrido.

Bucle for

El bucle for pemite hacer ciclos con números. En su condición, se debe seguir el orden de inicio, mientras y aumento. Generalmente se utiliza la variable $i para iniciar el bucle.

Ejemplo PHP:

 <?php
 for($i=0;$i<=20;$i=$i+2){
 echo $i."<br />";
 }
 ?> 

Resultado PHP:

0
2
4
6
8
10
12
14
16
18
20

Aquí se recorrerá el código entre paréntesis siempre y cuando se cumpla la condición de que la variable $i sea menor o igual a 20, en el que en cada recorrido se le suman 2. Esto quiere decir que se imprimirán todos los números pares desde 0 a 20.

Hay que tener cuidado en programar los bucles, porque a veces estos ciclos pueden ser infinitos y colapsan la carga de la página o el programa.

bueno espero sus respuestas y que el dueño de la web quiera regalarnos un subdominio :)

Adios

Aprenda a utilizar las arrays multidimensionales del lenguaje PHP, combinando diferentes tipos de arrays en una general.

Las arrays multidimensionales son nada más y nada menos que arrays dentro de arrays. Son el tipo de matrices en las cuales sus elementos deben ser llamados por dos o más corchetes dependiendo de cuantas matrices disponga el array, que pueden ser indexadas o asociativas.

Así, pueden recibir distintos nombres como arrays bidimensionales o tridimensionales.

Sintaxis de un array multidimensional

 array(
 'clave uno' => 'valor uno',
 "clave dos" => "valor dos",
 $elemento_tres => 'valor 3',
 'clave 4' => $valor_4
 ) 

Donde cada valor puede obtenerse mediante el nombre de la variable que contenga al array y la clave correspondiente.

 $nombre_del_array["valor dos"] 

Ejemplos de arrays multidimensionales

Aquí veremos un ejemplo para dejar más claro el uso de una matriz bidimensional, en el que se utiliza una matriz base y dos matrices anidadas dentro de ella.

Ejemplo PHP:

 <?php
 
 $fruta = array(
 'naranja' => array(
                   'propiedad' => 'jugosa',
                   'color' => 'naranja',
                   'sabor' => 'dulce'
                   ),
 'limón' => array(
                   'propiedad' => 'jugoso',
                   'color' => 'amarillo',
                   'sabor' => 'cítrico'
                   )
 );
 
 echo $fruta['limón']['color'];
 
 ?> 

Resultado PHP:

amarillo

Así podemos obtener "el color del limón", "la propiedad de la naranja", "el sabor del limón", etc.

Ahora veremos una matriz tridimensional, compuesta por matrices asociativas e indexadas.

Ejemplo PHP:

 <?php
 
 $marca = array(
 'software' => array(
                   'buscador' => array('Google','Yahoo','Baidu','Bing'),
                   'CMS' => array('Wordpress','Joomla','Blogger')
                   ),
 'hardware' => array(
                   'PC' => 'Mac',
                   'celular' => array('Black Berry','Iphone')
                   )
 );
 
 echo $marca['software']['buscador'][0];
 
 ?> 

Resultado PHP:

Google

Así podemos obtener el "software de buscador numero 1" (que sería el 0), "el hardware de celular numero 1 y 2", "el software de CMS 11, 2 y 3", etc.

Aprenda a utilizar las arrays asociativas del lenguaje PHP, asociando claves y valores para los diferentes elementos de un array.

Las arrays asociativas son el tipo de matrices en las cuales sus elementos se forman por pares de clave-valor, en el que la clave corresponde al nombre con el cual se accederá al elemento que no necesariamente debe ser un número y el valor al elemento en sí.

Así, podemos obtener un array en el que una clave se asocia a su valor.

Sintaxis de un array asociativa

La sintaxis de una matriz asociativa también se crea mediante la función array(), pero a diferencia de una array indexada, sus elementos separados por comas conformados por el par clave-valor, deben separarse por los carácteres "=>". Ejemplo:

 array(
 'clave uno' => 'valor uno',
 "clave dos" => "valor dos",
 $elemento_tres => 'valor 3',
 'clave 4' => $valor_4
 ) 

Donde cada valor puede obtenerse mediante el nombre de la variable que contenga al array y la clave correspondiente.

 $nombre_del_array["valor dos"] 

Ejemplo de array asociativa

Aquí veremos un ejemplo para dejar más claro el uso de una matriz asociativa.

Ejemplo PHP:

 <?php
 
 $mineral = array(
 'dorado' => 'Oro',
 'plateado' => 'Plata',
 'brillante' => 'Diamante',
 'negro' => 'Carbón'
 );
 echo $mineral['brillante'];
 
 ?> 

Resultado PHP:

Diamante

Así, podemos obtener y trabajar la nueva variable que se ha generado por el array, siempre y cuando la clave encerrada entre corchetes exista dentro del array.

Aprende a utilizar las arrays indexadas del lenguaje PHP, ordenando los elementos de un array mediante números.

Las arrays indexadas son el tipo de matrices que más se utilizan, en las cuales el valor del primer elemento equivale a cero, y los demás siempre aumentan en una unidad.

Así, podemos obtener un conjunto de elementos ordenados desde cero hasta un determinado valor, que dependerá del número de elementos que se dispongan en dicha matriz.

Sintaxis de un array indexada

La sintaxis de una matriz indexada se crea mediante la función array(), en la cual sus elementos deben separarse por comas (,) y pueden ser cadenas, números o variables siempre respetando la sintaxis básica de ellos. Un ejemplo de solo un array con sus respectivos elementos sería:

 array('elemento', "otro elemento", $elemento_tres, 'elemento 4') 

Donde el valor del primer elemento llamado 'elemento' es 0, el del segundo 'otro elemento' es 1, el de $elemento_tres es 2 y el de 'elemento 4' es 3.

Esto puede escribirse de la siguiente forma para ver la equivalencia entre los elementos y sus valores:

 array(
 0 => 'elemento',
 1 => "otro elemento",
 2 => $elemento_tres,
 3 => 'elemento 4'
 ) 

Así, podemos obtener un elemento de la matriz mediante la variable que contenga al array y el valor del elemento.

 $nombre_del_array[2] 

Ejemplo de array indexada

Una matriz que tenga, por ejemplo, 5 elementos, se ordenará desde 0 hasta 4. Lo veremos en el siguiente ejemplo en el que también se obtendrá un valor del array.

Ejemplo PHP:

 <?php
 
 $ciudad = array('Santiago', 'Madrid', 'New York', 'París', 'Berlín');
 echo $ciudad[3];
 // El número entre corchetes indica el número del elemento
 
 ?> 

Resultado PHP:

París

Así, podemos obtener y trabajar la nueva variable que se ha generado por el array, siempre y cuando el número entre corchetes esté dentro del rango de elementos disponibles.

Aprende a utilizar las arrays o matrices en PHP, una estructura impresindible para programar en PHP y otros lenguajes.

Un Array o Matriz (en español, también llamados 'tablas' o 'arreglos') es un tipo de estructura que almacena y ordena un conjunto de datos bajo un mismo nombre, al cual posteriormente en PHP se le darán diferentes usos para sus diferentes elementos.

Existen diferentes tipos de arrays que veremos en detalle: idexadas que son las más comunes, asociativas y multidimensionales.

• Arrays asociativas
• Arrays multidimensionales
• Arrays indexadas

Puede encontrar mucha más información para trabajar con funciones en sus arrays en la documentación oficial de PHP.net.

Hola me di cuenta que si creo una hoja de estilo dinámicamente en PHP y la pongo en firefiox no funciona :( y en internet explorer si.

Así llamo a la hoja de estilo:

<link href="Estilo.php?nombre=yo" type="text/css" rel="stylesheet" media="screen" />

Otra opcion fue llamar al .htaccess

Intente usar el archivo .htaccess para cambiar la extensión del archivo pero no funciono en firefox no se ve

// Llamamos la hoja de estilo

<link href="nombre_Estilo.css" type="text/css" rel="stylesheet" media="screen" />

 //Archivo .htaccess

RewriteRule (.*)_Estilo\.css$ Estilo.php?nombre=$1 [L]

AYUDA A MI =)

Nota mi hoja de estilo es compatible con todos los exploradores.

También pueden crear su propia hoja de estilo en php ya llamarla como yo la puse y van a ver el problema de firefox.

SI ALGUIEN PUEDE AYUDARME SE LOS AGREDECERIA.

Se trata simplemente de aplicar un outline visible a todos los elementos del CSS, de la forma:

* { outline: 1px dotted #CCC; }

De esta manera se marcarán todos los elementos como divs, párrafos, listas, campos de formularios y todo lo que se tenga presente en el documento con una linea de tamaño 1 pixel con color hexadecimal #CCCCCC (gris claro) y que no se suma a los tamaños establecidos.

Así puedes observar qué elementos están desalineados o tienen menos separación que otros cuando pensabas que todo estaba perfectamente maquetado.

Aprende a utilizar la estructura if-else en PHP, quien nos permite determinar si se cumple (if) o no (else) una condición.

La famosa estructura de control if-else permite ejecutar trozos de código según la condición que se aplique (que incluye variables). La parte de if indica que la condición se cumple, y por lo tanto, su trozo de código se ejecuta. Por el otro lado, else indica que la condición no se cumple, y por ello su trozo de código se ejecuta.

Ninguna de estas dos estructuras pueden ocurrir al mismo tiempo y solo puede ocurrir una. Else puede no definirse, por lo tanto su valor correspondería a vacío.

Su sintaxis es particular: Seguido de if se escribe la condición entre paréntesis (( y )) y cada trozo de código de if y else se encierran entre llaves ({ y }) sin terminar la línea fuera de ellas con un punto y coma (;).

Ejemplo PHP:

 <?php
 if ( $alfa > $beta ) {
 echo "Correcto";
 } else {
 echo "Incorrecto";
 }
 ?> 

En este caso de condición numérica (porque una letra no puede ser menor o mayor a otra), se leería: Si la variable alfa es mayor a la variable beta, ocurrirá la impresión de la cadena 'Correcto', de lo contrario, ocurrirá la impresión de la cadena 'Incorrecto'.

Existen muchos tipos de funciones para crear condiciones como isset(), eregi() o file_exists().

Ahora veremos un ejemplo de comprobación de variable con la función isset(), en el que si la variable existiese, se ejecutará el código de if, si no, el de else.

Ejemplo PHP:

 <?php
 $lorem_ipsum = "Lorem ipsum dolor sit amet.";
 
 if ( isset($lorem_ipsum) ) {
 echo "La variable $lorem_ipsum si existe.";
 } else {
 echo "La variable $lorem_ipsum no existe.";
 }
 ?> 

Resultado PHP:

La variable $lorem_ipsum si existe.

Generalmente, esta función se utiliza para comprobar si los campos de formulario están definidos mediante la variable $_POST[] o $_GET[].

No hay duda de que sea difícil empezar algo desde cero. Quizás el tema del Diseño y el Desarrollo Web también está dentro del saco, pero solo leyendo, entendiendo, investigando y experimentando se aprende al igual que cualquier otro tema. Esa no es la razón de esta guía, pues eso es lo que tú por tu propia cuenta debes hacer. Nosotros podemos ofrecerte todo el material y ayuda que desees, pero sin tu parte, el tema no sería tan interesante como ya lo es.

El propósito es, que esta lectura sea lo primero que leas antes de lanzarte a la aventura. Vamos a empezar de lo más básico hasta irnos por las ramas.

1. Diseño Web

El diseño web agrupa diversas tecnologías y técnicas que deberemos dominar en el tiempo para crear páginas web, y con ellas, un sitio web. Estas no se aprenden de un día para otro, ni las encontrarás inmediatamente. Aunque todos los conceptos estén agrupados, algunos deben aprenderse antes que otros debido a su complejidad y jerarquía.

2. Sitio web

Es el conjunto de páginas web y archivos enlazados entre sí bajo un nombre de dominio como www.google.com o www.documentoweb.com. Cada sitio en Internet está alojado o hosteado en alguna computadora a la que llamamos el servidor o hosting.

3. Página Web

Es la principal forma que da vida a internet. Corresponde a una plana que contiene diversos elementos insertados, primordialmente:

• Información
• Enlaces

Solo he puesto dos, porque realmente solo esto es lo que se rescata para darle sentido a un sitio: La información porque sin ella no habría sentido en entrar a algún sitio (principio básico, y muchas veces se olvida de ello) y los enlaces porque sin ellos nos quedaríamos estancados en lo primero que vemos quitándonos la valiosa navegación.

De forma secundaria, podemos encontrar:

• Imágenes
• Vídeos
• Archivos
• Y todo tipo de formatos multimedia

Esto último también es importante ya que da el apoyo para lo primero. Ya sea visual, audiovisual o cualquier tipo de apoyo en otro formato como PDFs o animaciones Flash, nos sube de forma muy agradable la experiencia dentro de cualquier sitio. ¡Navegar solo con texto es aburrido no?

Detrás de una página web, existe toda una estructura y códigos (invisibles hasta ahora) a seguir para lograr mostrar todo lo mencionado y mucho más.

4. Estructura de una Página Web

Ya tenemos los conceptos básicos y necesarios, ahora veremos la parte más técnica como mencionamos en el punto 1 y al final del 3.

Una página web se crea con diversos códigos. El primero se llama HTML, el "esqueleto" de una página web. El segundo es el CSS, quien le da todo el estilo a este esqueleto.

4.1. HTML

El HTML es un lenguaje de marcas. Identifica cada elemento dentro de la página web con su significado. Para dar ejemplos concretos: marca qué parte del texto escrito es el título, cual parte es un párrafo, dónde estan los enlaces, cual es una lista de items, donde está una imagen o un formulario. Todos estos elementos y muchos más son parte del HTML, que se pueden escribir y configurar a nuestro antojo dentro de la página.

El lenguaje puede ser leído por cualquier medio, ya sean los distintos navegadores que existen en internet, el de tu teléfono móvil o algunos que ni siquiera se ven, como los lectores de pantalla, el mismísimo Google que recopila datos de las páginas o un futuro software o hardware. Por ello, es indispensable utilizar correctamente el lenguaje, utilizar cada cosa para lo que fue hecha y no para el uso que estimes conveniente, ya que en un futuro, ese código mal configurado acarreará consecuencias.

Hoy en día el HTML ha evolucionado. Ya hemos pasado la versión del HTML 4 y actualmente nos encontramos en la versión del XHTML 1.0 (podría decirse un HTML extendido) que es la que oficialmente se recomienda. En el futuro, el nuevo HTML será el HTML5 (o bien eso es lo que queremos) que está en fase experimental y tiene muchas cosas prometedoras (pero no nos saldremos de nuestras casillas).

4.2. CSS

El CSS es otro lenguaje y complementa al anterior, identifica los elementos del HTML para otorgarles una apariencia y así lograr una agradable presentación.

El llamado estilo CSS se crea en una Hoja de estilo, un documento independiente del documento HTML. Esta es una de las grandes ventajas, pues, al modificar tu hoja para cambiar alguna apariencia que ya no te ha gustado, esta se aplicará en todas las páginas que la tengan enlazada (y pueden ser millones).

Aunque los antiguos navegadores que aún se utilizan no respetan bien la sintaxis de nuestro código CSS, es indispensable para un diseñador dominar las técnicas para lograr buenos resultados y en todos los navegadores que el mundo utiliza.

En la actualidad nos encontramos con la versión CSS 2.1, aunque solo la llamamos CSS. Está en implementación el CSS3 que es bastante prometedor, pero aún no es soportado por todos los navegadores webs, así que nos quedaremos y bastará con el mencionado.

5. Ideologías y técnicas

Si bien luego de aprender estos dos maravillosos lenguajes complementarios, no basta para completar un sitio. Se necesitan ciertos conocimientos como base para empezar a trabajar con ellos, tales como:

• Accesibilidad
• Usabilidad
• Experiencia del usuario
• Cross-browser
• Web 2.0

5.1. Accesibilidad

Se refiere a que no se restrinja el acceso a un sitio web. Que cualquier persona incluso con discapacidades de cualquier tipo, pueda tener el acceso.

Este principio es usado por todo el mundo y la web no se queda afuera. Quizás has notado que en los costados de las escaleras hay subidas planas (sin escalones) con barandas, que en los baños hay uno mucho mas grande con barandas o que en el autobús siempre hay reservado un asiento para personas con discapacidades.

Ya sea por ceguera, daltonismo, discapacidades motrices, el dispositivo que se use o incluso la edad, nuestro deber como diseñador es que ninguna persona se quede afuera, que el diseño no sea débil y que sea útil para nuestros usuarios o clientes. Para ello el uso óptimo del XHTML y CSS es extremadamente esencial.

Un sitio debe poder utilizarse en las condiciones más extremas: como sin javascript, sin imagenes o incluso sin hoja de estilo.

5.2 Usabilidad

El uso óptimo de la navegación dentro del sitio, la facilidad con que se llega a alguna parte de él o lo resumido que están sus contenidos ofreciendo más, es parte de esta técnica llamada usabilidad, que no es más como la palabra lo dice.

Si nuestros visitantes pueden llegar a algún contenido de nuestro sitio con muy pocos clics, se dice que es usable. Si completaron un formulario sin complicaciones, también se dice que es usable. Si leyeron un texto en 5 segundos, se dice lo mismo. Si tuvieron que esperar una semana para recibir un "no" como respuesta, eso no sería nada de usable.

El término se relaciona mucho con la facilidad, la intuitividad y la efectividad. No aburrir a alguien dándole lo que quiere de una forma muy fácil y que no se necesite explicar es muy cómodo para el visitante, y también para tí.

5.3. Experiencia del usuario

Se relaciona mucho con la usabilidad. A medida que un visitante navega por tu sitio, reconoce y va aprendiendo como funciona.

Entregarle nuevas cosas cuando el hace clic sobre algo o invitarlo y conversar con el hará que su experiencia sea maravillosa, que se sienta como en casa desde la primera vez que entra en el sitio.

Cuando alguien abandona tu sitio, debe llevarse una muy buena impresión y saber bien qué te ofrecía aquel sitio, para contarle a sus amigos o sus colegas empresarios, que se yo.

5.4. Cross-browser

Ya nos topamos con este tema. Se refiere a diseñar para todos los navegadores sin exclusión de alguno.

Para lograrlo debemos dominar el CSS, saber los defectos de los navegadores, sobre el uso correcto de las tipografías o los formatos de imagen que son admitidos por ejemplo.

5.5. Web 2.0

Uno de los puntos más importantes es este. Si bien la web 2.0 no se puede definir específicamente se puede tratar. Me gusta explicarla como una ideología, ya que es un conjunto de ideas para sacarle provecho a las nuevas tecnologías web sobre nuestro sitio más el uso por sus usuarios.

En una Web 2.0 existe una multidirección de información. Si antes una persona o un grupo selecto de ellas administraba un sitio subiendo contenidos, hoy ocurre algo distinto: todas las personas forman la web.

Alguna vez dije que la web 2.0 fue causada por el campo de formulario, y sigo pensándolo. Un campo de formulario del HTML permite a una persona escribir, y ello conduce a usar sus escritos para formar un sitio web completo y dinámicamente, que crece con la comunidad de personas.

6. Más allá del diseño: el Desarrollo Web

Detrás del diseño y su estructura hay algo aún más importante: se trata del Desarrollo Web. 

Este término se emplea para el uso de las tecnologías del lado del servidor y del cliente que involucran algunos o muchos procesos a fin de realizar tareas para el usuario o simplemente mostrar información.

Por el lado del servidor se refiere a aquellos lenguajes que actúan y son interpretados desde la computadora (el servidor) y que arrojan un resultado para que sea leído por el navegador. Entre los más usados y en la mejor combinación está el PHP y el SQL.

Por el lado del cliente se refiere a aquellos que actúan en el navegador (el cliente) donde su interpretación depende totalmente de él (y de ningún estándar). Sin duda aquí entra aquí el JavaScript.

6.1. PHP

Es uno de los grandes lenguajes de programación. Se caracteriza por su dinamismo y flexibilidad.

PHP interpreta el código y entrega un resultado, por defecto en HTML. Se utiliza principalmente para captar y jugar con los datos dentro de una página en conjunto de una base de datos. Para explicarme mejor, podemos por ejemplo guardar los datos de un formulario de registro y posteriormente mostrarlos en una tabla del HTML en el orden y con los datos que quisiésemos, o guardar un comentario y mostrarlo si se cumple una fecha determinada. También validar un formulario si no se escribe un campo o mostrar resultados según la URL de la página.

En fin, podemos crear infinidades de cosas con el y cuando se domina, tenemos una gran herramienta de trabajo con la que sería innecesario crear tantas páginas en HTML cuando podemos hacerla con un poco de PHP.

PHP es algo mayor, no lo recomiendo para aprenderlo en conjunto del HTML y CSS. Primero se debería dominar muy bien ambos para lanzarse a este nuevo nivel. 

6.2. MySQL

MySQL es un gestor de bases de datos basado en el lenguaje SQL. Es una muy buena ayuda visual con toda su interfaz gráfica para entender como funciona y se estructuran todas las bases de datos.

En conjunto de PHP es tremendamente poderoso: nos entrega organización y mucha más flexibilidad en la obtención de datos por medio de ambos lenguajes.

El SQL un lenguaje muy simple comparado con PHP, y lo recomiendo enormemente trabajarlo en conjunto asi como se hace con el HTML y el CSS.

6.3. JavaScript

JavaScript nos permite controlar con dinamismo la experiencia dentro del sitio modificando o agregando elementos dentro del código HTML como efectos visuales o manipulación de los elementos.

El uso de JavaScript está presente en todos lados, siendo el AJAX su nueva implementación. Ajax nos permite manejar ciertas cosas dentro de una página web sin recargar la misma, siendo esto una muy buena experiencia para el visitante.

Existen muchas librerías que nos permiten usar JavaScript de forma muy fácil, y que se han dedicado para que los resultados sean los mismos en todos los navegadores (recordar javascript es interpretado con diferencias en cada navegador, pues no es un estándar).

Si utilizas JavaScript, asegúrate de que no sea intrusivo, es decir que aunque lo eliminemos, el sitio siga funcionando perfectamente [accesibilidad]. No todo en el mundo usa o tiene JavaScript.

7. ¿Quién está detrás de todo esto?

La organización que implementa el HTML, el CSS y otros lenguajes, es el consorcio de la red global mundial o W3C, quien pone todas las normas a seguir y es nuestra autoridad en la web. Ellos nos ofrecen materiales y herramientas que podemos usar para construir nuestros sitios.

La organización de PHP es otra, ubicada en PHP.net quien nos ofrece toda su documentación al igual que MySQL.

8. Software

Existe distinto software para crear todo lo mencionado. Pero, algunos crean demasiado, siendo que el aprendizaje no evolucione mucho que digamos.

• Procesadores de texto actuales además de permitirnos escribir y guardar archivos en muchos formatos, nos ayudan visualmente coloreando la sintaxis de los lenguajes. Tales como Notepad++ o alguno otro gratuito.
• Software de "Diseño Web" te permiten "diseñar" páginas web de forma automática, sin mucha interferencia tuya. He aquí un programa que a muchos les duele (incluyéndome): el llamado Dreamweaver. Si realmente deseas aprender, no lo utilices.
• Navegadores Web los necesitas todos ya que tus diseños deben visualizarse correctamente (no necesariamente igual, pero sin errores) en todos ellos [cross-browser]. Existe IETester para comprobar diseños en las distintas versiones de Internet Explorer.
• Programa de diseño gráfico como Photoshop o Gimp para crea gráficos o editar imágenes.
• Apache XAMPP server u otro para utilizar PHP y MySQL.

Y no necesitas nada más, a excepción de Google.

Aprenda el funcionamiento de los operadores lógicos en PHP con ejemplos y a utilizarlos a voluntad.

Los operadores lógicos, nos permiten trabajar en la condición de alguna estructura del PHP para hacerla más específica, siempre y cuando se traten dos o más condiciones. Se pueden incluir por ejemplo, en la estructura if-else o los bucles. Así, podemos ahorrar mucho código fuente.

A continuación, se muestra una tabla con el operador lógico junto a su funcionamiento.

Cada uno de estos operadores se deben incluir entre las dos condiciones tratadas, las cuales podrían contener un operador condicional.

Operador and ó &&

El operador and ó && indica que ambas condiciones siempre deben cumplirse para ejecutar verdadero, de lo contrario, se ejecutará falso. No importa si escribimos and ó && porque son exactamente lo mismo.

Ejemplo PHP:

 <?php
 $cadena1 = "Lorem ipsum";
 $cadena2 = 24;
 if( $cadena1 == "Lorem ipsum" && $cadena2 >= 12 ) {
 // Si la variable $cadena1 es identica a "Lorem ipsum" y $cadena2 es mayor o igual a 12 se ejecutará verdadero, es decir, el código de IF y no de ELSE.
 echo "Correcto";
 } else {
 echo "Todo mal";
 }
 ?> 

Resultado PHP:

Correcto

Operador or ó ||

El operador or ó || indica que si una o ambas condiciones se cumplen, se ejecutará verdadero, de lo contrario, se ejecutará falso.

Ejemplo PHP:

 <?php
 $cadena1 = "Lorem ipsum";
 $cadena2 = 6;
 if( $cadena1 == "Lorem ipsum" || $cadena2 > 12 ) {
 // Si la variable $cadena1 es identica a "Lorem ipsum" y/ó $cadena2 es mayor a 12 se ejecutará verdadero.
 echo "Correcto";
 } else {
 echo "Todo mal";
 }
 ?> 

Resultado PHP:

Correcto

Operador xor

El operador xor indica que se debe cumplirse solo una condición para que se ejecute verdadero, de lo contrario, se ejecutará falso.

Ejemplo PHP:

<?php
 $cadena1 = "Lorem ipsum";
 $cadena2 = 546;
 if( $cadena1 == "Lorem ipsum" xor $cadena2 < 123 ) {
 // Si la variable $cadena1 es identica a "Lorem ipsum" ó $cadena2 es menor a 123 se ejecutará verdadero.
 echo "Correcto";
 } else {
 echo "Todo mal";
 }
 ?>

Resultado PHP:

Correcto

1. Como deberia de empezar a crearla, tengo el dreamwear cs3 .
2. Estoy algo confuzo , primero ago el diseño y despues codigo y viceversa? 

Bueno la mayor duda es que no se como empezar a la creación de mi web , si tienes algún videotutorial o algo que me puedan facilitar, o alguien que se preste a ayudar se lo agradecería...

Saludos.

Aprende el funcionamiento de los operadores condicionales del PHP con ejemplos para utilizarlos a voluntad.

Los operadores condicionales nos permiten trabajar en la condición de alguna estructura del PHP. Se pueden incluir por ejemplo, en la estructura if-else o los bucles para especificar como se debe cumplir dicha condición.

A continuación, se muestra una tabla con el operador condicional junto a su funcionamiento.

Estos operadores son fáciles de utilizar, pues sus funciones son de matemática simple. El operador == indica que dos variables son identicas, el != indica que son completamente contrarios. Por otro lado, el < indica menor que, <= menor o igual que, > mayor que y >= mayor o igual que. Veremos tan solo un ejemplo de este tipo para ver su funcionamiento.

Ejemplo PHP:

<?php

$cadena = 24;

if( $cadena <= 88 ) {
   // Si la variable $cadena es mayor o igual a 88 se ejecutará "verdadero"
   echo "Correcto";
} else {
   // Si la variable $cadena es menor a 88 se ejecutará "falso"
   echo "Todo mal";
}

 ?> 

Resultado PHP:

Correcto

Los operadores de asignación, al igual que los aritméticos en el PHP nos permiten trabajar matemáticamente con valores numéricos, y a diferencia de éste, también se puede trabajar con cadenas compuestas por cualquier carácter.

En este tipo de operaciones, a la variable que participa en la izquierda en dicha operación se le asigna el valor resultante.

A continuación, se muestra una tabla con el operador de asignación junto a su funcionamiento.

Operador de asignación básico

El primer operador =, lo hemos visto desde un principio, pues participa en la sintaxis básica y necesaria del lenguaje PHP.

Podemos asignar el valor de una variable a otra las veces que queramos.

Ejemplo PHP:

 <?php
 $cadena_uno = "Lorem Ipsum";
 $cadena_dos = $cadena_uno;
 $cadena_tres = $cadena_dos;
 echo $cadena_tres;
 ?> 

Resultado PHP:

Lorem Ipsum

En este ejemplo, el valor de la variable $cadena_uno ("Lorem Ipsum") se le asigna como valor a la variable $cadena_dos, y esta última le asigna su valor a la variable $cadena_tres, por lo que $cadena_tres ha heredado el valor de $cadena_uno.

Operadores de asignación aritméticos

En estos operadores híbridos (también un término mío), partes de asignación y parte aritmético, nos permiten hacer operaciones matemáticas mediante su particular sintaxis. En el ejemplo, utilizaremos una división por ser no-conmutativa (que importa el orden).

Ejemplo PHP:

 <?php
 $uno=27; 
 $dos=3; 
 $uno/=$dos; 
 echo $uno;
 ?> 

Resultado PHP:

9

En este ejemplo, la variable $uno que participa en la cuarta línea y que tiene como valor 27, se le asigna el valor obtenido de 27/3, y por ello la cadena resultante es 9.

Operador de asignación para concatenar

El operador .= es muy utilizado en los bucles, ya que permite concatenar (o unir) una cadena de carácteres. Por ahora, veremos solo como funciona.

Ejemplo PHP:

 <?php
 $cadena_uno = "Lorem ipsum"; 
 $cadena_dos = " dolor sit amet"; 
 $cadena_uno .= $cadena_dos; 
 echo $cadena_uno;
 ?> 

Resultado PHP:

Lorem ipsum dolor sit amet

Al igual que en los operadores anteriores, la variable $cadena_uno que participa en la cuarta línea y que tiene como valor Lorem Ipsum, se le asigna el valor obtenido de "Lorem Ipsum" concatenado a " dolor sit amet" (que es igual a "Lorem ipsum"." dolor sit amet"), y por ello la cadena resultante es "Lorem ipsum dolor sit amet".

Quizás este es un problema que nos ha causado un gran dolor de cabeza y por el cual muchos programadores (incluyéndome) ya han pasado o lo están haciendo. Se trata de la codificación de caracteres: cuando nos aparecen esos caracteres extraños y que no deberían estar ahí.

Primero que nada, hay que tener claro las diferencias de cada una de las codificaciones más utilizadas y que más acarrea a este problema.

¿UTF-8 o ISO-8859-1?

• La codificación UTF-8 corresponde a un juego de caracteres universales, contiene signos de la mayoría de los lenguajes del mundo.
• Por otro lado ISO-8859-1 maneja caracteres del lenguaje latino como el español, portugués, alemán, francés y otros.

Técnicamente cualquiera de las codificaciones nos sirve, ya que a nivel de nuestro uso en las páginas webs, al comparar una codificación con la otra en el tamaño de los bits que son transferidos, es demasiado inferior para decir cual es la mejor.

Preferentemente, yo elijo UTF-8 por seguir la línea y el posicionamiento que ha tomado esta codificación sobre la gran mayoría de sitios que existen. Esto ha acarreado otras cosas, por ejemplo, que existan sitios que al obtiener la información de tu sitio, surge el famoso problema al mostrarla por no ser compatibles con tu codificación.

La solución

La solución al problema radica al momento de guardar el archivo. Si en el <meta> del <head> especificas una codificación, esta debe coincidir con la cual codificas tu archivo.

Es muy simple, pero cuesta descifrarlo. Quizá con algo de experimentación te darás cuenta de que trata.

Solución a la codificación UTF-8

Metatag en la cabecera del HTML (entre <head> y </head>):

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

Codificación al momento de guardar tu archivo: UTF-8.

Si existe la opción UTF-8 sin bom, úsala. En mi experiencia he tenido problemas sin esta opción con archivos PHP independientes que se conectan a través de la función include().

Solución a la codificación ISO-8859-1

Metatag en la cabecera del HTML (entre <head> y </head>):

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

Codificación al momento de guardar tu archivo: ANSI.

Aclaraciones

No es necesario utilizar las entidades HTML para lograr lo que se quiere a exepción de &gt;, &lt; y &quot; que pueden interferir en la sintaxis del mismo. Lo menciono porque algunos las utilizan convirtiendo todos sus textos para dar solución al problema erróneamente.

En conclusión: Asegura que la codificación del archivo guardado coincida con la especificada en el metatag. Puedes usar todos los acentos y caracteres extraños que quieras.

Estas condiciones valen para cualquier tipo documento.

Mugtug nos trae dos herramientas web gratuitas para editar imágenes y dibujar: Darkroom y Sketchpad. Ambos funcionando sobre el navegador con HTML5 y principalmente canvas.

• Darkroom podría asemejarse a Photoshop y Gimp, te permite abrir una imagen de tu computadora para luego jugar con ella: modificar niveles de colores, cortar, rotar, aplicar filtros y otros.
• Sketchpad podría asemejarse a Paint, aunque algo mejor. Puedes crear figuras geométricas, escribir, pintar, aplicar degradados, transparencias y más. 

Qué fácil, genial para momentos en que necesitemos hacer algo en una computadora ajena.

Ir a mugtug, darkroom o a sketchpad.

Dos interesantes e-book desarrollados bajo licencia creative commons que tratan sobre la ideología de la Web 2.0: se trata de Web 2.0 de la fundación orange y Planeta Web 2.0 de PlanetaWeb2.

Perfectos para entender cómo desarrollar proyectos que cumplan las ideas de esta interesante idea de la nueva web.

Adicionalmente puedes ver este mapa de la Web 2.0 si deseas saber más acerca de esto término tan usado en este tiempo con ejemplos claros de sitios que pueden caber dentro del saco.

Para descargar estos dos e-book:

• Planeta Web 2.0
• Web 2.0

¿Qué más claro que el siguiente video para entender de qué trata la Licencia Creative Commons?. Mejor que leer, una entretenida animación flash muy informativa e inspiradora de la licencia Creative Commons con ejemplos más que reales.

Video desde cyber.law.harvard.edu.

Aprenda el funcionamiento de los operadores aritméticos en PHP con ejemplos y a utilizarlos a voluntad.

Los operadores aritméticos en el PHP nos permiten trabajar matemáticamente con valores númericos. Así, mediante reglas básicas aritméticas y la sintaxis del PHP podemos usar y realizar cálculos a voluntad con los valores obtenidos, por ejemplo, para sacar porcentajes, el IVA de un producto, la edad de una persona, utilizar fechas, y todo lo que se nos ocurra.

A continuación, se muestra una tabla con el operador aritmético junto a su funcionamiento.

Operadores aritméticos básicos

Esta es una clasificación propia, ya que la suma, resta, multiplicación y división son parte de nuestro lenguaje matemático básico y cotidiano. Veremos un ejemplo de estos operadores para dejar constancia de como se utilizan.

Ejemplo PHP:

 <?php
 $calculo1=12/4; // 12/4=3
 $calculo2=3*2; // 3*2=6
 $calculo3=20%3; // 20/3=6, resto=2
 echo $calculo1+$calculo2-$calculo3;
 ?> 

Resultado PHP:

7

Operadores aritméticos interesantes

Esta también es una clasificación propia, pues yo nunca había visto semejante sintaxis. Ésta es muy simple, una trata de sumar una unidad al valor y la otra, restar una. Me refiero a la sintaxis de $numero++ y $numero-- respectivamente, en la que la primera es equivalente a $numero=$numero+1 y la siguiente a $numero=$numero-1.

Ejemplo PHP

 <?php
 $numero=24;
 $numero++; // 24+1=25
 $numero--; // 25-1=24
 $numero++; // 24+1=25
 $numero++; // 25+1=26
 echo $numero;
 ?> 

Resultado PHP:

26

Ejemplo con todos los operadores

Ahora veremos todos los operadores aritméticos en un solo ejemplo.

Cuando utilizamos varios operadores en una línea, estos se ejecutan en forma lineal sin respetar reglas de prioridad matemática, de izquierda a derecha. Si queremos lograr alguna prioridad de algún calculo, debemos asociarlo entre paréntesis.

Ejemplo PHP

 <?php
 $uno = 1;
 $dos = 10%8; // 10/8=1, en lo que el resto es 2
 $tres = 3;
 $cuatro = 4;
 $uno++; // la variable $uno ahora vale 2, ya que 1+1=2
 $dos--; // la variable $dos ahora vale 1, ya que 2-1=1
 $calculo = $tres*($cuatro/$uno)-$dos+$cuatro;
 // Esto resulta ser 3*(4/2)-1+4
 echo $calculo;
 ?> 

Resultado PHP

9

Este pequeño artículo presenta la guía de optimización para motores búsqueda creada por el mismísimo Google para principiantes en español y formato PDF encontrada en el Centro de Herramientas para Webmasters.

La guía está bastante simple pero muy bien explicada y detallada, tiene mucho contenido sobre cómo describir bien el sitio web en el código fuente HTML.

Contenido destacado de esta guía SEO:

• Mejorar la etiqueta <title>
• Mejorar las metaetiquetas
• Mejorar la URL de los contenidos de las páginas
• Mejorar la navegación
• Mejorar los enlaces dentro de los contenidos
• Formas de escribir los contenidos
• Usar las cabeceras de forma correcta
• Mejorar las etiquetas de las imágenes con el atributo alt
• Usar el nofollow
• Usar robots.txt
• Prácticas para promocionar el sitio
• Recursos SEO adicionales

Como ven, tiene bastante contenido, y muy bueno. Ir a la guía SEO de google.

Este tutorial lo dividiré en 3 partes:

1. Uso de tipografías estándares web.
2. Uso de fuentes no estándares con Cufón.
3. Uso de fuentes no estándares con @fontface.
4. Comparación entre @fontface y Cufón.
5. Opinión personal.

Uso de tipografías estándares web

Para visualizar correctamente una fuente de Internet esta debe estar instalada en el equipo del visitante. Hay una serie de tipografías instaladas por defecto en prácticamente todos los sistemas operativos, estas son las tipografías estándares.

Las tipografías estándares son:

• Arial
• Arial Black
• Comic Sans
• Georgia
• Impact
• Lucida console
• Lucida Sans unicode - Lucida Grande*
• Palatino
• Tahoma - Geneva
• Times New Roman - Times
• Helvatica
• Verdana

*Los nombres separadas por un guión representan la misma fuente pero con distintos nombres en diferentes sistemas operativos.

Las tipografías estándar pueden servir perfectamente para crear una web en su totalidad (por ejemplo esta misma web) pero si queremos lograr efectos diferentes como los de otras web (por ejemplo Domestika.com) tendremos que usar alguno de los siguientes métodos.

Fuentes genéricas

Adicionalmente en cada declaración de font-family en la hoja de estilo, necesitamos agregar una fuente genérica, es decir, una familia de fuente a la cual pertenece la tipografía seleccionada, para que en los casos de que la fuente usada no se encuentre en el dispositivo en que se lea, se use una fuente "parecida".

Las 5 fuentes genéricas son:

• monospace
• Sans
• Sans-serif
• fantasy
• cursive

Cada una de estas fuentes genéricas se distinguen entre sí. Podemos ver la siguiente imagen para saber sus diferencias.

Así, por ejemplo, podemos declarar font-family de la siguiente forma:

body      {font-family:tahoma,arial,sans-serif;}
h1         {font-family:georgia,serif;}
pre,code {font-family:'lucida console',monospace;} 

Uso de fuentes no estándares con Cufón

Cufón es una libreria JS que permite cambiar la fuente mostrada en pantalla por una subida anteriormente al servidor, respeta la accesibilidad del sitio así como su contenido jerárquico.

Primero, debemos descargar Cufón aquí. (Clic derecho >> Guardar como)

Para usar Cufón tendremos que usar este generador. En él subimos los archivos de la fuente que deseamos incluir, rellenamos todos los datos y aceptamos las condiciones generales. 

<script src="cufon-yui.js" type="text/javascript"></script>
<script src="***Nombre de tu tipografía***.font.js" type="text/javascript"></script>
<script type="text/javascript"> 
Cufon.replace('h1');
Cufon.replace('h4');
</script> 

Este script se coloca en el head de tu web y sustituye por tu fuente lo s encabezados de nivel h1 y h4 (A estos encabezados se les puede dar cualquier estilo CSS).

Uso de fuentes no estándares con @fontface

@font face es una propiedad CSS3 que permite cambiar la fuente mostrada en pantalla por una subida anteriormente al servidor, respeta la accesibilidad del sitio así como su contenido jerárquico. 

Para usar @fontface debemos usar este generador. Elegimos easy y seguimos las instrucciones.

Usaremos este código css:

@font-face {
	font-family: 'Nombre de tu tipografía';
	src: url("Nombre de tu tipografía.eot');
	src: local('Nombre de tu tipografía'), local('Nombre de tu tipografía'), url('') format('woff'), url(Nombre de tu tipografía.ttf') format('truetype'), url('Nombre de tu tipografía.svg#') format('svg');
}

h1 {
font-family: 'Nombre de tu tipografía';
}
h4 {
font-family: 'Nombre de tu tipografía';
}

Comparación entre @fontface y Cufón

Cufón

Ventajas:

1. Compatible con todos los navegadores.
2. Contenido jerarquizado y ordenado.
3. Se pueden dar estilos CSS.

Desventajas:

1. No se puede copiar el texto directamente al portapapeles.

@fontface

Ventajas:

1. Contenido jerarquizado y ordenado.
2. Se pueden dar estilos CSS.
3. Se puede copiar el texto directamente al portapapeles.

Desventajas:

1. Sólo compatible con navegadores con soporte CSS3.

Opinión personal

Yo, personalmente, me inclino por usar siempre tipografías estándares. Considero que una página cuyo logotipo sea solo el nombre con una tipografía especial, en vez de usar imágenes GIF con etiqueta ALT usar Cufón con encabezado de nivel h1.

El uso de @fontface no lo recomiendo en la mayoría de los casos, aunque se podría utilizar en casos en los que no sea estrictamente necesario utilizar ese tipo de letra en particular, como por ejemplo en encabezados de nivel h3, siempre con un tipo de letra alternativo en el atributo fontfamily.

Gracias a Null por su apoyo y su ayuda, gracias a aquellos que soportaron mi ignorancia y los cuales la siguen soportando.

Anrdresuchop

Domingo, 30 de mayo de 2010

Tabla de contenidos de los distintos operadores usados en PHP: aritméticos, de asginación, lógicos y operadores condicionales.

Los operadores en PHP, nos permiten trabajar con valores, ya sea comparando, diferenciando, sumando, restando, multiplicando y/o haciendo diferentes operaciones con cadenas numéricas o alfanuméricas.

Operadores aritméticos

Podemos ver en detalle cada operador aritmético.

Operadores de asignación

Podemos ver en detalle cada operador de asignación.

Operadores condicionales

Podemos ver en detalle cada operador condicional.

Operadores lógicos

Podemos ver en detalle cada operador lógico.

Transformar las URLs de un sitio web ya sea para mejorar el SEO de nuestra web o la simple apariencia de la URL es tan fácil de lograr y no todo el mundo lo hace. Es una muy buena ventaja que debe ser aprovechada y que puede ser combinada a la perfección con el lenguaje PHP más el simple HTML.

El archivo llamado .htaccess de Apache es el encargado de esta magnificencia. Aparte de lograr restringir el acceso a archivos específicos o redireccionar URLs, en este artículo sólo veremos lo relacionado al reescribimiento de las URLs.

El .htaccess contiene su propia sintaxis. A continuación en el primer ejemplo, las dos primeras líneas son para activar el "reescribimiento" de las URLs. Luego, está escrita una regla a respetar con expresiones regulares para guiar a las URLs donde nosotros queremos. 

Options +FollowSymLinks
RewriteEngine on

RewriteRule ^(.*)/$ pagina.php?miurl=$1 [L]

Con esta regla, a páginas como www.example.com/pagina.php?miurl=miperfil ahora se podrán acceder como www.example.com/miperfil/.

Options +FollowSymLinks
RewriteEngine on

RewriteRule ^(.*)-(.*)/$ pagina.php?categoria=$1&subcategoria=$2 [L]
RewriteRule ^pagina$ pagina.php [L]

Y con esta otra, a páginas como www.example.com/pagina.php?categoria=trabajos&subcategoria=PDFs ahora se podrán acceder como www.example.com/trabajos-PDFs/. Por otro lado, a www.example.com/pagina.php se puede acceder simplemente como www.example.com/pagina.

En conclusiones:

El lado izquierdo de la regla de reescribimiento (RewriteRule) indica la URL formada, y el derecho indica la URL original. Parte de la expresión regular como (.*) y $1 indican variables, por ello, las reglas que utilizen estas combinaciones servirán para todas las URLs que cumplan tal condición.

El uso de sesiones nos proporciona una forma fácil de guardar datos del usuario sin tener que recurrir a mysql o archivos de texto plano, claro está, de forma temporal. Con sesiones se puede realizar:

• Saber si un usuario a ingresado en el a través de login.
• Cambio de Hoja de estilos CSS por parte del usuario.
• Cualquier cosa que requiera una variable temporal en relación a la visita del usuario.

Las sesiones se crean de forma bastante sencilla:

<?php 
 session_start(); 
 ?>

A través de esto crearemos una sesión. OJO: Para poder usar la variables de sesión creadas hay que colocar esto al principio de nuestro script en PHP antes de cualquier sentencia HTML o generará un error.

Para definir una variable de sesión (que se guarda de manera temporal, usaremos lo siguiente:

<?php session_start()
if (isset ($_SESSION["variable"] {
	echo "Usted ha introducido la variable $_SESSION["variable"]
} else {
//Remitente de datos (Index.php)
<form action="capturador.php" method="POST">
<label for="variable">Introduzca la variable que quiere introducir a la sesión: </label>
<input type="text" id="variable">
</form>
?>

//Receptor de datos (capturador.php)
<?php 
session_start();
$_POST["nombre"] = $_SESSION["variable"];  ?>
<script type="text/javascript">
window.location="index.php"; 
</script>

Con ese script lo que realizamos es lo siguiente:

• Colocamos un IF en el index y si no existe damos un formulario para crearla.
• En el capturador recibimos los datos y definimos variable de sesión.
• Con el código javascript redireccionamos al index sin alterar el PHP.

Como ves es bastante sencillo, ahora solo nos falta borrar esa sesión:

<?php
 session_start();
session_destroy();
header("Location: index.php");
?>

Podríamos definir una variable de sesión para un estilo css, seleccionado mediante un form. 

En el siguiente tutorial sobre el uso de sesiones enseñaré a hacer con ellas un sistema para modificar páginas php con contraseña para mantener actualizado el sitio web sin MYSQL.

Aprenda a escapar caracteres con PHP, técnica usable para imprimir caracteres sin romper la sintaxis de su código fuente.

Ciertos carácteres en el PHP no son posibles imprimirlos y para ello existe la técnica llamada escape de carácteres o carácteres de escape.

Esta técnica o función se utiliza cuando no podemos incluir un caracter dentro de una cadena porque altera su sintaxis o para incluir una función extra dentro de ésta.

Por ejemplo, al insertar una comilla doble en una cadena encerrada entre comillas dobles crearía un error dentro de la línea de código, o un signo peso que se quiere imprimir y que no sea interpretado como una variable.

Las combinaciones a utilizar para lograr un escape de caracter se hacen junto al slash invertido (). A continuación se muestra una tabla con las combinaciones posibles.

Ejemplos de escape de caracteres

Si queremos incluir comillas dobles en una cadena encerrada entre comillas dobles, debemos usar un escape de caracter porque si se incluyera solo, la cadena terminaría y la sintaxis de la línea se perdería, provocando un error.

Ejemplo PHP:

 <?php
 echo "Lorem ipsum \"dolor sit\" amet.";
 ?> 

Resultado PHP:

Lorem ipsum "dolor sit" amet.

Lo mismo sucede con las comillas simples insertadas en una cadena encerrada entre comillas simples.

Ejemplo PHP:

 <?php
 echo 'Lorem ipsum \'dolor sit\' amet.';
 ?> 

Resultado PHP:

Lorem ipsum 'dolor sit' amet.

Si quisieramos imprimir un precio cuya cifra esté junto al signo pesos, debemos escapar este signo pues se tiende a leer como una variable.

Ejemplo PHP:

 <?php
 echo "El vestido me costo \$xxx";
 ?> 

Resultado PHP:

El vestido me costo $xxx

Otro ejemplo sería el siguiente, en el que incluimos un salto de línea en el código fuente del archivo para que no se nos vea todo amontonado.

Ejemplo PHP:

 <?php
 echo "<ul>\n<li>Una cosa</li>\n<li>Otra cosa</li>\n</ul>";
 ?> 

Resultado PHP:

• Una cosa
• Otra cosa

Resultado en el código fuente:

 <ul>
 <li>Una cosa</li>
 <li>Otra cosa</li>
 </ul> 

Aprenda a concatenar las cadenas imprimibles del PHP para diferenciar cadenas de variables y así obtener un código PHP impecable.

La concatenación es una regla de cualquier lenguaje de programación que permite diferenciar una cadena de una variable conservando su unión.

Esta técnica nos sirve en casos de que nuestra variable incluida dentro de una cadena de carácteres no se diferencie de ésta, cuando se incluye dentro de una cadena de carácteres encerrada entre comillas simples o en casos más particulares en que no se pueda imprimir una cadena.

El caracter para concatenar una cadena en PHP es el punto (.) y se utiliza entremedio de la cadena (que puede estar entre comillas) y la variable a concatenar.

Un ejemplo sin concatenación puede darnos un resultado óptimo:

Ejemplo PHP:

 <?php
 $numero = 4;
 echo "Yo tengo $numero casas.";
 ?> 

Resultado PHP:

Yo tengo 4 casas.

Pero si fuese una variable "confundida" entre el texto, no sería lo mismo porque identificaríamos a una variable que no existe y podría dar un resultado no esperado.

Ejemplo PHP:

 <?php
 $numero = 4;
 echo "Yo tengo $numero20 casas.";
 ?> 

Resultado PHP:

Yo tengo  casas.

De lo que queríamos obtener el siguiente resultado y no el anterior, pues la variable $numero20 no es la misma que $numero:

Yo tengo 420 casas.

Para obtener este resultado, debemos entrar a concatenar la cadena. Utilizamos el caracter punto dicho en parrafos anteriores para separar la cadena (que está entre comillas dobles) de la variable. En total necesitaremos dos.

Ejemplo PHP de concatenación:

 <?php
 $numero = 4;
 echo "Yo tengo ".$numero."20 casas.";
 ?> 

Resultado PHP:

Yo tengo 420 casas.

Otros ejemplos de concatenación

Si la variable está al principio o al final de la cadena, nos ahorraremos una concatenación. Ahora veremos otros ejemplos de concatenación para dar algunas ideas de lo que se puede lograr.

 echo $edad." años llevo en esta ciudad"; 

 echo 'Necesito llegar a '.$metros; 

 $frase_ahorro = "Estoy ahorrando ".$pesos." pesos hace ".$meses." meses para tener en total ".$dinero; 

El Sistema Hexadecimal es un sistema de numeración posicional de base 16 que procura hacernos más fácil la tarea a la hora de trabajar con códigos fuentes de programas, creación de colores y codificación de carácteres que usamos a diario en nuestra computadora.

En este artículo, trabajaremos sólo con los colores hexadecimales y aprenderemos a crearlos sin necesidad de utilizar un programa adicional.

De esta manera, podemos ahorrar mucho tiempo, sin mencionar que es algo entretenido.

Los colores hexadecimales

Los colores hexadecimales forman parte de nuestra vida informática por donde le miremos. Absolutamente todos los colores que vez en tu computadora, están basados o se pueden traducir a este sistema, y es muy fácil usarlo cuando ya se tiene dominado.

Composición de colores hexadecimales

Se dice que es un sistema de base 16 porque para su funcionamiento el sistema hexadecimal utiliza 16 caracteres no solo numéricos: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, y F. Las letras fueron agregadas en reemplazo de los números que siguen después del 9 para no crear confusión al combinarlos: 10=>A, 11=>B, 12=C, 13=>D, 14=>E y 15=>F.

Los colores hexadecimales constan de 6 caractares: los dos primeros indican el nivel de rojo, los dos siguientes el nivel de verde y los últimos dos el nivel de azul, identificados cada uno con su correspondientes carácteres en hexadecimal.

Así podemos hacer combinaciones de colores "rellenando cada nivel" con la cantidad de color que deseamos. Vea la siguiente ilustración para analizar los colores hexadecimales.

¿Y donde uso los colores hexadecimales?

En muchas partes. Por ejemplo: en las selecciones de colores de Photoshop o Gimp, en las hojas de estilo CSS, en el mismísimo Paint (abria que traducir cada nivel de hexadecimal a decimal con la calculadora en modo científico), en páginas webs que permiten modificar su apariencia, y en general, en casi todo software que tenga que ver con el color.

Esta misma web, contiene colores hexadecimales. Los enlaces son de color #008888.

Aprenda a utilizar correctamente las comillas dobles y simples en las cadenas de carácteres de sus líneas PHP.

El uso de las comillas dentro del código fuente PHP nos permite determinar una cadena de caracteres. Estas pueden variar según los caracteres que utilizamos dentro de ella o según el tipo total de caracteres que la conforman.

Existen 3 formas de utilizar las comillas: comillas dobles, comillas simples y sin comillas.

Comillas dobles

En una cadena compuesta por cualquier caracter encerrada entre comillas dobles podemos incluir comillas simples sin escaparlas, pero si se incluye una comilla doble, obligatoriamente se debe escapar este caracter. No hay necesidad de concatenar las variables.

Ejemplo PHP

 <?php
 $visitas = "400 visitas";
 echo "Bienvenido al restaurán "Lorem's ipsum". $visitas hoy.";
 ?> 

Resultado PHP:

Bienvenido al restaurán "Lorem's ipsum". 400 visitas hoy.

Comillas simples

En una cadena compuesta por cualquier caracter encerrada entre comillas simples podemos incluir comillas dobles sin escaparlas, pero si se incluye una comilla simple, obligatoriamente se debe escapar este caracter. En esta cadena las variables siempre deben concatenarse.

Ejemplo PHP:

 <?php
 $visitas = '400 visitas';
 echo 'Bienvenido al restaurán "Lorem's ipsum". '.$visitas.' hoy.';
 ?> 

Resultado PHP:

Bienvenido al restaurán "Lorem's ipsum". 400 visitas hoy.

Sin comillas

Una cadena no se encerrará necesariamente entre comillas dobles o simples, siempre y cuando contenga solo carácteres numéricos o se trate de una variable.

Ejemplo PHP:

 <?php
 $xyz = 400;
 $visitas = $xyz;
 echo $visitas.' visitas hoy.';
 ?> 

Resultado PHP:

400 visitas hoy.

Creando un sitio Web estándar ficticio con lenguaje XHTML 1.0 strict, CSS 2.1, PHP 5, Accesibilidad Web (WAI) AAA y Cross Browser (diseño para todos los navegadores).

Se trata de la creación de una Web con un código fuente semántico, totalmente accesible y visualmente correcta en todos los navegadores Webs (firefox, google chrome, opera, safari, internet explorer 6, 7 y 8). Incluyendo textos, imágenes creadas con Photoshop, fotografías retocadas, formularios, estilos CSS bien definidos, archivos independientes y algunas líneas de PHP.

Varias horas de trabajo comprimido en un video de 10 minutos.

Puedes ver el ejemplo del código o descargártelo si quieres analizarlo mejor. En incluidos/cabecera.php recuerden modificar la etiqueta <base> como se menciona dentro del código.

*** Rescatando contenidos de documentoweb (25 de julio de 2009).

Existen dos formas de comentar su código fuente PHP para informarse en el futuro de qué trata el código fuente.

Al igual que en cualquier otro lenguaje, ya sea de programación o de marcado como el XHTML, dispone de su propia forma para incluir comentarios informativos directamente en el código fuente.

Los comentarios son muy útiles a la hora de volver a leer nuestro código fuente, porque nos entrega y facilita nuestra propia información acerca del código que hemos creado.

Comentarios de una línea

El PHP nos entrega dos formas para incluir nuestros comentarios. La primera forma, es para comentar el código de forma simple y en una línea. Esta se puede incluir solo antes o después de terminar una línea de código para que no irrumpa en el código real.

Para comentar en un línea, se debe anteponer dos barras (//) al principio de la línea, la que se delimita por el salto de línea de la misma.

Ejemplo PHP:

<?php

// El siguiente código es para imprimir la frase "Hola mundo".
echo "Hola mundo";

?>

Comentarios de varias líneas

La segunda forma, es para incluir un comentario de varias líneas. Este es generalmente usado para mostrar códigos fuentes eliminados o textos largos de varias líneas.

Para comentar en varias líneas, se deben encerrar esta líneas por los carácteres "/*" al principio y "*/" al final.

Ejemplo PHP:

<?php

/* En el código:
echo "Hola mundo";
puedo cambiar la frase entre comillas por cualquier otra. */

echo "Hola mundo";

?>

En un procesador de textos, generalmente, los comentarios son presentados de color verde.

Resultados de los comentarios

No existe un resultado para el comentario, pues es solo visible en el código fuente. El comentario solo sirve para tu lectura o para alguien que tenga acceso a tu código PHP.

Las variables en el PHP son los elementos básicos y escenciales para trabajar cualquier código PHP.

Las variables, no solo en PHP sino que en cualquier otro lenguaje de programación, es el elemento más básico y escencial para crear un código y sacarle provecho. La función de una variable es almacenar valores, que pueden ser cualquier tipo de combinación entre letras, caracteres y/o números, los cuales estarán disponibles para usarlos con posterioridad.

Estructura de una variable

Una variable se forma por dos partes. La primera, es el nombre de la variable inventado por tí (sensible a minúculas y mayúsculas, sin caracteres extraños), a la que se le antepone el signo peso o dolar ($). Luego está el valor de la variable, encerrado entre comillas dobles o simples ("" o '').

Estas dos estructuras que conforman a la variable en sí deben estar separadas por el signo igual (=) que identifica la asignación del lado derecho al izquierdo y terminada en el último caracter por un punto y coma (;), como cualquier otra línea en el PHP que siempre debe cerrarse.

Ejemplo de una variable PHP:

$nombre_mio = "Secreto";

Ejemplo de uso de una variable PHP:

<?php

$nombre_mio = "Null";
echo "Mi nombre es $nombre_mio";

?>

Al ejecutar este ejemplo en el navegador mediante localhost como hemos dicho en páginas anteriores para que el servidor local interprete nuestro código PHP nos entregará un resultado.

Resultado del ejemplo:

Mi nombre es Secreto

Ejemplo de una variable numérica

Trabajar con números en PHP es de gran utilidad y podemos sacarle provecho a nuestras necesidades. Sumar, restar, dividir, multiplicar, sacar porcentajes y redondear números son algunas de las operaciones que podemos lograr con PHP [Véase operadores aritméticos]. Por ahora, veremos una suma.

Ejemplo PHP de suma de variables

<?php
 
 $numero_uno = 45;
 $numero_dos = 106;
 $suma_total = $numero_uno+$numero_dos;
 echo "La suma es  $suma_total";
 
 ?>

Lo que se propone en este ejemplo es sumar el valor numérico de la variable $numero_uno que es 45 con el de $numero_dos que es 106. El total de esta suma se almacena como valor de la variable $suma_total y esta es la que se imprime junto con un pequeño texto en la línea siguiente.

Resultado del ejemplo:

La suma es 151

Y así puedes jugar con cualquier variable en tus códigos PHP, ya sea de números o con letras. En el caso de las letras recuerda encerrarlas entre comillas dobles o simples [Véase uso de comillas].

¿Como se escribe el PHP? Sigue los primeros pasos para aprender y usar el lenguaje con su correcta sintaxis.

El PHP se ejecuta siempre y cuando esta instalado el servidor local como lo hemos visto en como utilizar el PHP.

Sintaxis

La sintaxis del PHP es simple. Pero a media que vallamos avanzando en las diferentes funciones y ejemplos del PHP no hay que idearse que todo será fácil.

La siguiente estructura se debe incluir siempre en un código o "script PHP". Esta compuesta por un código de apertura y uno de cierre:

<?php
 
 ?>

Consideraciones para la sintaxis

• Cada línea de código PHP se debe escribir entre estas dos lineas que te he presentado.
• Cada línea siempre debe cerrarse con un punto y coma (;)
• El orden jerárquico de las líneas siempre influye en la siguiente, y nunca en la anterior.
• Los múltiples espacios y saltos de línea son comprimidos a uno.

El famoso "imprimir"

Imprimir en PHP significa presentar el resultado en el documento, es decir, por ejemplo, el código HTML que queremos mostrar en la página Web.

El código para imprimir un valor por excelencia en PHP es echo. No está categorizado como una función del PHP, más bien, es una sentencia del lenguaje.

Cada echo debe estar acompañado de la cadena a mostrar. En el siguiente ejemplo se debe encerrar entre comillas lo que se desea y cerrar con punto y coma al final de la línea como escribí en las consideraciones.

<?php
 
 echo "Hola mundo";
 
 ?>

Crear el archivo PHP

Pongamos en práctica el código anterior. Debes abrir tu procesador de texto, escribir o copiar (no es muy buena idea, trata siempre de escribir tú el código y aprenderás en poco tiempo) el código que he puesto más arriba o con alguna modificación, por ejemplo con un poco de HTML:

Ahora procedemos a guardar el documento con la extensión .php después del nombre del archivo a elección en la carpeta de destino. Si usas Apache XAMPP en Windows sería C: > XAMPP > htdocs.

Ahora procedemos a ejecutar el documento creado desde tu navegador con la dirección http://localhost/nombre_archivo.php.

El producto de este código será solo la parte de echo, ninguna otra más. Esta es una de las grandes características de un lenguaje de servidor como el PHP en que le mostrará al lector solo lo que nosotros queremos mostrale. Al generar dinámicamente una página Web por el servidor, el usuario no verá absolutamente nada del código PHP que has creado.

Deberías ver el código fuente de tu página generada dinámicamente desde el navegador para que compruebes lo dicho.

Si todo te ha resultado correctamente, te felicito, porque has credo tu primera página en PHP.

Notepad++ es un procesador de textos gratuito, que soporta muchos lenguajes de programación y se ejecuta en Windows.

Incorpora una interfaz muy clara y de diseño intuitivo, con soporte para abrir varios documentos al mismo tiempo, visualización en ventana doble que te permite editar dos documentos simultáneamente, código de colores para los comandos de cada lenguaje de programación, soporte para drag-and-drop y muchas otras funciones.

Notepad++ incluye además una utilidad de zoom y te permite usar marcadores para moverte mejor dentro de los larguísimos ficheros de código.

En definitiva, un editor similar al Bloc de Notas de Windows en tamaño y velocidad, pero con muchísimas más funcionalidades.

A continuación enumeraremos algunas características de Notepad++ :

• Sintaxis coloreada y envoltura de sintaxis
• WYSIWYG
• Sintaxis coloreada a elección del usuario
• Autocompletado
• Multi-Documento
• Multi-Vista
• Soporte para Buscar/Reemplazar expresiones regulares
• Soporte completo para Arrastrar y colocar
• Posición dinámica de las vistas
• Deteción automática del estado del documento
• Herramienta de Zoom
• Funcionamiento bajo entornos multilingües
• Puntos de marca
• Resaltado de paréntesis y sangría
• Grabación y reproducción de macros

Puedes descargarlo gratuitamente desde la Web de Notepad++.

Rescatando contenidos de documentoweb.

Veremos cómo utilizar el PHP: el procesador de textos y el servidor local así como las diferentes versiones del PHP.

El procesador de texto

Necesitas de un procesador de textos para escribir el código PHP en él y guardar los archivos con formato .php, como lo es el bloc de notas que viene instalado en Windows o alguno otro más completo como Notepad++ que incluye coloramiento del código y funcionalidaes de teclado y texto muy útiles para manejar mejor el código que crearemos.

El servidor local

Para que el PHP funcione, debes instalarlo en tu computadora como un servidor local. No te preocupes, es muy fácil. Existen organizaciones dedicadas a ello como Apache, quien ofrece de forma gratuita Apache XAMPP (multiplatarforma), un paquete de utilizades que entre ello incluye PHP y MySQL (que te servirá en el futuro).

Cuando tenemos instalado el servidor local, podemos acceder fácilmente al servidor local escribiendo localhost o http://localhost/ en el navegador, si funciona correctamente, podemos proceder a experimentar con nuestros propios códigos PHP.

Versiones del PHP

Actualmente se utiliza PHP 5.3.2, versiones similares a 5.x.x son suficientes para desarrollar scripts más una iterpretación correcta. Inferiores a 5, mejor actualizate, porque los desarrolladores de PHP cambian o descartan algunas funciones aconveniencia y perfeccionamiento del lenguaje.

Este tutorial de PHP estará conforme a las funciones y sintaxis de la versión mas actual. Se informará si las funciones pueden ser eliminadas en un futuro.

Acabo de probar cómo conectarme con twitter para twittear desde documentoweb los artículos que aquí se publican y nunca pensé que sería tan fácil, porque no necesita de ningún "add on" extra como la librería cURL del PHP activada.

Desde PHP lo podemos hacer de la siguiente forma con la API de Twitter, reemplazando los datos de la cuenta y el mensaje a twittear:

<?php

$twit=urlencode('tu nuevo estado en twitter');
$usuario = 'micuenta';
$password = 'miclave';

$salida = "POST http://168.143.171.84/statuses/update.json HTTP/1.1rn"
  ."Host: 168.143.171.84rn"
  ."Authorization: Basic ".base64_encode ("$usuario:$password")."rn"
  ."Content-type: application/x-www-form-urlencodedrn"
  ."Content-length: ".strlen ("status=$twit")."rn"
  ."Connection: Closernrn"
  ."status=$twit";
$fp = fsockopen ('168.143.171.84',80);
fwrite ($fp, $salida);
fclose ($fp);

?>

Así y desde ahora, cuando se publique un artículo como este mismo, también saldrá en el twitter de documentoweb con un enlace hacia acá.

Aprendido desde pratham.name.

Ya que el CSS3 sólo está disponible en algunos navegadores y la propiedad border-radius es parte de ella, no podemos utilizarla si queremos que nuestro sitio web se vea estupendo en todos los navegadores.

Es por ello que utilizamos técnicas CSS (versión 2.1) junto con alguna imagen para provocar el efecto de las esquinas redondeadas sin sufrir tanto.

Mi técnica se las mostraré a continuación más unos ejemplos bien completos y concretos donde podrán ver y analizar el código CSS.

Bien, yo utilizo una sola imagen, 6 divs del HTML y porsupuesto que CSS. Quizás sean demasiados divs, pero no encuentro otro método más simple, además, no interfiere en el funcionamiento. Lo bueno es que utilizo una sola imagen que contiene las cuatro esquinas juntas formando un circulo, la que en los primeros cuatro divs se posiciona con CSS sin repetirse en cada una de las esquinas. El quinto div cubre 1/2 de cada imagen con rellenos (padding) laterales de tamaño de la mitad de la imagen más un color de fondo, y el último cubre 1/2 de las partes de las imagenes restantes con un margen negativo superior e inferior con las mismas características del anterior.

Se puede interpretar de la siguiente forma:

En general, los últimos dos divs son los encargados de cubrir 3/4 de la imagen posicionada en cada esquina (contenida en los 4 divs anteriores).

Y así se puede crear el efecto de las esquinas redondeadas que funciona en todos los navegadores (hasta en IE 5.5) con ventajas de agregar bordes CSS, a partir de 6 divs, una sola imagen más un poco de estilo. Creo que es mejor esto en vez de usar 4 divs y una imagen para cada uno como he visto y experimentado en otros ejemplos: menos peticiones para el servidor, menor tiempo de carga.

Puedes ver una presentación que he creado con 4 tipos de cajas de esquinas redondeadas.

Llevo muchos años combatiendo la inmoralidad de las técnicas del SPAM con varios métodos y el que te presentaré a continuación es el más efectivo que he creado.

La efectividad de este captcha se basa en el giro de las letras o números más la dirección en que indica una flecha.

El hecho de que haya que introducir un código ya evita gran parte de los robot de SPAM, pero en el otro porcentaje se utilizan técnicas de un nivel superior, como un software OCR (pueden reconocer carácteres a partir de las imágenes). Contra estos, ya es más difícil vencerlos, pues pensábamos que sólo el ojo humano podía reescribir el texto de una imagen, entonces, necesitamos introducir otro elemento que no tienen los robots: la capacidad de razonar.

Es justamente lo que hace este y otros buenos captchas: Te induce a pensar y escribir.

Creo que un poco más fácil de descifrar que los que tienen letras muy distorsionadas como en los ejemplos de la imagen.

Integrar el captcha en el código PHP

El código PHP está creado con la librería GD del mismo PHP (si ya tienes instalado PHP, no necesitas instalar nada adicional).

Primero, necesitamos el código que crea la imagen independiente con caracteres aleatorios (cada carácter, es una imagen) en posiciones especificas:

<?php

// cabecera
header("Content-type: image/png");

// crear la imagen (anchura,altura)
$img=imageCreate(100,60);

// colores
$blanco=imagecolorallocate($img,255,255,255);
$negro=imagecolorallocate($img,0,0,0);

// variables obtenidas por GET

$sentido=rand(1,2);

$tcaptcha=$_GET['captcha'];
$tcaptcha=base64_decode($tcaptcha);
$tcaptcha=substr($tcaptcha,1,-1);
$tcaptcha=base64_decode($tcaptcha);

$caracter1=substr($tcaptcha,0,1);
$caracter2=substr($tcaptcha,1,1);
$caracter3=substr($tcaptcha,2,1);
$caracter4=substr($tcaptcha,3,1);
$caracter5=substr($tcaptcha,4,1);


if($sentido==1){
// flecha
$string=imagecopy($img,imagecreatefrompng('flecha1.png'),31,26,0,0,40,30);

// caracteres
$string=imagecopy($img,imagerotate(imagecreatefrompng("caracteres_0/$caracter1.png"),90,$blanco,0),3,36,0,0,22,22);
$string=imagecopy($img,imagerotate(imagecreatefrompng("caracteres_45/$caracter2.png"),0,$blanco,0),13,12,0,0,22,22);
$string=imagecopy($img,imagerotate(imagecreatefrompng("caracteres_0/$caracter3.png"),0,$blanco,0),39,0,0,0,22,22);
$string=imagecopy($img,imagerotate(imagecreatefrompng("caracteres_45/$caracter4.png"),270,$blanco,0),65,12,0,0,22,22);
$string=imagecopy($img,imagerotate(imagecreatefrompng("caracteres_0/$caracter5.png"),270,$blanco,0),75,36,0,0,22,22);
}
if($sentido==2){
// flecha
$string=imagecopy($img,imagecreatefrompng("flecha2.png"),31,6,0,0,40,30);

// caracteres
$string=imagecopy($img,imagerotate(imagecreatefrompng("caracteres_0/$caracter1.png"),270,$blanco,0),8,6,0,0,22,22);
$string=imagecopy($img,imagerotate(imagecreatefrompng("caracteres_45/$caracter2.png"),270,$blanco,0),14,31,0,0,22,22);
$string=imagecopy($img,imagerotate(imagecreatefrompng("caracteres_0/$caracter3.png"),0,$blanco,0),39,36,0,2,22,20);
$string=imagecopy($img,imagerotate(imagecreatefrompng("caracteres_45/$caracter4.png"),0,$blanco,0),64,31,0,0,22,22);
$string=imagecopy($img,imagerotate(imagecreatefrompng("caracteres_0/$caracter5.png"),90,$blanco,0),70,6,0,0,22,22);

}


// mostrar la imagen
echo imagegif($img);

// destruir la imagen
imagedestroy($img);
?>

(libreria-captcha/imagen.php)

Luego, el archivo donde vamos a generar la clave aleatoria y que incluirá el código anterior, es decir, donde se encontrarán todas las variables que necesitemos:

<?php

$abcnumeros=array(0,1,2,3,4,5,6,7,8,9,"a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z");

$caracter1=$abcnumeros[rand(0,35)];
$caracter2=$abcnumeros[rand(0,35)];
$caracter3=$abcnumeros[rand(0,35)];
$caracter4=$abcnumeros[rand(0,35)];
$caracter5=$abcnumeros[rand(0,35)];

$captcha=$caracter1.$caracter2.$caracter3.$caracter4.$caracter5;

// codificacion propia
$captcha_cod=base64_encode($captcha);
$captcha_cod="a".$captcha_cod."E";
$captcha_cod=str_replace("=","",$captcha_cod);
$captcha_cod=base64_encode($captcha_cod);

$tu_captcha=md5(strtolower($_POST['tu_captcha']));
$mi_captcha=$_POST['mi_captcha'];

// variables con HTML
$img_captcha='<label for="captcha"><img src="libreria-captcha/imagen.php?captcha='.$captcha_cod.'" alt="Captcha" title="El código de verificación o captcha permite verificar si eres un humano o una máquina de SPAM" /></label>';
$input_captcha='<input type="text" name="tu_captcha" id="captcha" size="10" /><input type="hidden" name="mi_captcha" value="'.md5($captcha).'" />';

?>

(libreria-captcha/variables.php)

Por último, en el formulario HTML de una página cualquiera, donde queremos integrar el captcha necesitamos incluir a las variables (variables.php) e imprimir la varible que contiene el html de la imagen ($img_captcha) y la que tiene el campo donde se debe ingresar el capcha ($input_captcha).

<?php

include('libreria-captcha/variables.php');

echo "<p>".$img_captcha."</p>";
echo "<p>".$input_captcha."</p>";

?>

Luego, solo faltaría tu código, en el cual puedes verificar si el código de verificación está correctamente escrito o no de la siguiente forma:

<?php

if($mi_captcha==$tu_captcha){
        // Aquí incluyes tu código si es que el captcha se pasa exitosamente. 
}else{
        // Aquí incluyes tu código si es que el captcha NO se pasa exitosamente.
}

?>

Las variables son enviadas por 2 medios codificados: md5 y uno creado por mi que usa base 64.

Vea el captcha en funcionamiento.

• Descarga el código, dentro del comprimido hay un ejemplo de uso.
• Ejemplo de demostración del captcha.

He aquí 2 sitios de los cuales he obtenido muy buenas texturas de madera de alta calidad para trabajar junto a un sitio web.

• Texturas de madera en flickr
• Texturas de madera en defcon-x.de

Posibles usos: Sitios web elegantes. Específicamente si están relacionados con la madera como las mueblerías o empresas que trabajen con ella.

Combinación de colores: Blanco, negro, marrón, verde o naranja y sus derivados. Colores tibios.

Muy útil para conservar una página en un solo archivo sin perder imágenes o estilos que generalmente suelen omitirse al guardar una página y que molesta con tantos archivos por separado.

Ir a PDFcrowd.com.

Aprende a crear un sitio web dinámico con PHP de forma sencilla, correcta, con buen uso y excelentes ejemplos.

El lenguaje PHP, "Hypertext Preprocessor" o "Preprocesador de Hipertexto", es el lenguaje de programación del lado del servidor más usado para crear páginas o sitios Web completos de forma fácil y dinámica.

¿Que es una página web dinámica?

Se refiere a una página web dinámica a un documento web (de cualquier tipo) que puede cambiar su código según variables entregadas, como el tiempo o los datos de un formulario, produciendo un resultado esperado. Me refiero a cualquier tipo de documento porque no solo trabaja con HTML, si no que con PDFs, imágenes, archivos XML, entre otros.

¿A qué se refiere que PHP es del lado del servidor?

PHP trabaja en una computadora llamada el servidor, la cual contiene el intérprete del PHP. Éste es el encargado de "interpretar" nuestro código para entregarnos el resultado que deaseamos. Es por esto que se dice que el PHP es un lenguaje de programación del lado del servidor.

¿Para que sirve una página Web dinámica?

¡Infinidad de cosas!... Tú con este verdadero lenguaje de programación tienes una inmensa gama de posibilidades de desarrollar en la Web lo que se te dé la gana para la internet.

Por ejemplo, puedes crear:

• Un sitio Web muy flexible. Con códigos independientes puedes separar el encabezado, los menus y el contenido de cualquier página en archivos independientes.
• Sistemas de alamacenamiento de información. Para crear tus propios libros de visitas u otras utilizaciones como foros y blogs.
• Manejar y entregar textos según las características de la condición del usuario.
• Crear tu propio buscador de información.
• Manejar archivos y directorios (crear, copiar, eliminar, etc.).
• No solo crear páginas Webs en HTML: también archivos zip, PDF, feed RSS, imágenes y otros.
• Y lo más importante: su utiliza en conjunto de bases de datos MySQL.

Siendo estos unos ejemplos míninimos que puedes hacer con PHP, debes saber que no existe límite para crear lo que se te venga a la cabeza. No importa que seas novato, todo se puede aprender y ese es el fin de este tutorial, que aprendas y saques provecho a este gran lenguaje de programación.

El desarrollo Web

El tema del desarrollo Web esta muy ligado al lenguaje PHP. Este término se emplea para el uso de las tecnologías del lado del servidor y del cliente que involucran algunos o muchos procesos a fin de realizar tareas para el usuario o simplemente mostrar información.

De seguro más adelante te toparás con este término, como por ejemplo, aquella persona que sabe utilizar el PHP en una aplicación concreta podría considerarsele un Desarrollador Web.

¡Intégrate al desarrollo Web!

El PHP te ofrece posibilidades de desarrollar tus proyectos a tús medidas y necesidades. Te invito a seguir leyendo para que aprendas un verdadero lenguaje de programación.

Eh! Un momento. ¿Cómo sé que aquí se enseña PHP correctamente?

Los creadores del lenguaje ofrecen en PHP.net (tu biblia para este tutorial) toda la documentación oficial del PHP. Dentro del tutorial siempre se hará referencia a este sitio.

Vamos a dar un paseo por las obsoletas y desaprobadas etiquetas del lenguaje HTML haciendo referencia al porqué no se utilizan hoy en día y para que servían. Generalmente, se han desaprobado las que tienen un fin de presentación visual y no estructural.

Etiquetas de estilos visuales

Se desaprobaron muchas etiquetas que lógicamente no pretendían seguir la estructura básica del html: crear sentido y no estilo. Ahora fácilmente podemos lograr estos estilos con con líneas de código CSS:

• <center>
• <font>
• <i>
• <s>
• <strike>
• <u>

La etiqueta <center> centra horizontalmente a un elemento, <font> un tipo, color y tamaño de fuente, <i> crea un estilo cursivo de texto, <s> y <strike> el estilo tachado sobre el texto y <u> proporciona el estilo de subrayado a un texto.

Se sugiere utilizar cualquier propiedad CSS como text-align para las alineaciones horizontales, font para los estilos de fuentes, text-decorationpara los subrayados y tachados y color para los colores de elementos en ves de utilizar estas etiquetas obsoletas del HTML.

Equitueta apple

Esta etiqueta se utilizaba para insertar applets java en nuestros documentos. Quizás se podría comparar con la etiqueta <object>.

• <applet>

Incluia un archivo externo .class y era una tremenda complicación para instalar plug-ins y poder visualizar lo que pretendía el código, que generalmente eran efectos visuales. Actualmente, no cuenta con el apoyo con casi ningún navegador.

Etiqueta basefont

La etiqueta <basefont> pretendía establecer el tamaño base de una fuente, pero por la aparición de CSS y solo el apoyo de Internet explorer, se desaprobó. Se escribía de la forma:

• <basefont>

Etiquetas relacionadas con listas (dir y menu)

Esta etiqueta se utilizaba para crear un directorio de lista. Esta etiqueta está obsoleta en HTML 4.01, y no es compatible con XHTML 1.0 Strict DTD. Realmente esta etiqueta es inútil, se sugiere utilizar estilos CSS en nuestras listas. Se escribe de la forma:

• <dir>

Y la siguiente etiqueta se utiliza para crear una lista de opciones de menú:

• <menu>

Ambas, realmente inutilizables.

Etiquetas muy obsoletas (insidex y xmp)

Las siguientes y últimas dos etiquetas creo que nunca las usarás ni para probar para que funcionan, pues están tan obsoletas que no hay mucha información de ellas en internet... se escriben de la siguiente forma:

• <isindex>
• <xmp>

Puedo rescatar lo siguiente: La etiqueta <isindex> define una entrada de línea simple y <xmp> define texto preformateado.

Etiquetas que nunca fueron estándares (marquee y blink)

Esta etiqueta transforma en un caos un documento HTML bien formado, NUNCA utilizes estas etiqueta:

• <marquee>
• <blink>

Estas etiqueta NO HAN SIDO DESAPROBADAS, es más, NUNCA formaron parte de los estandares webs, eran unas etiquetas que fueron creadas por Microsoft e implementadas en Internet Explorer. Con el paso del tiempo se fue implementando en casi todos los navegadores, pero de seguro nunca pasarán a formar parte de las etiquetas estándres, porque se preocupan solo de presentar un texto atractivo (pero a la ves molesto) y no de una estructura adecuada.

La etiqueta <marquee> crea un texto con movimiento horizontal (por defecto) la que contaba con una serie de atributos para modificar velocidad y dirección, por el otro lado, la etiqueta <blink> creaba un texto parpadeante.

Actualmente todo lo ago con editores bbcode, y gual en javascript pero uso codigo php para campbbiar el contenido de bb code a etiquetas html

El problema es que no se como funciona el editor wysiwyg es decir como guarda el documento? y como lo instalo en mi web

ejemplo

<script type="text/javascript">
<!--
function imprimir_para_mi(){
var imprimir_documento= document.getElementById("yo").innerHTML;
//document.write(imprimir_documento)
window.print(imprimir_documento);

}
//-->
</script>

<a href="javascript: imprimir_para_mi()">imprimir documento</a>
<div id="yo">esto se imprime</div>
<p>esto no se imprime</p>

Pero me imprime todo ¿como le ago para que NO me imprima  el renglon que dice "esto no se imprime"?

Gracias

Este es un sencillo código que deberíamos tener dominado para respetar la estructura lógica de la heredación y anidación de elementos en el HTML. Siendo que el XHTML es una variación del HTML como una variación más estricta del mismo, tendremos el beneficio de que nuestras listas se vean perfectas tanto estructural como visualmente (con CSS) en cualquier vanegador y/o dispositivo.

Ya sea <ol> o <ul> aveces la dificultad está entre los items de lista <li>, porque no todos saben con certeza dónde ubicar la sublista.

Propuse ejemplos con enlaces ya que es lo más común que se puede encontrar en las listas y en lo que más se complica.

¿Cómo crear listas de la forma correcta?

Esta sería la estructura más básica, que corresponde a una simple lista:

<ul>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a></li>
</ul>

Luego, si queremos agregar una sublista al segundo item debemos abrir </a> y </li> del mismo:

<ul>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a>

    </li>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a></li>
</ul>

Para poner la sublista que queramos en el mismo orden que se muestra al principio.

<ul>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a>
        <ul>
            <li><a href="..." title="...">...</a></li>
            <li><a href="..." title="...">...</a></li>
            <li><a href="..." title="...">...</a></li>
        </ul>
    </li>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a></li>
</ul>

Así sucesivamente, podemos jugar con las listas y hacer muchas dentro de ella.

<ol>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a>
        <ul>
            <li><a href="..." title="...">...</a></li>
            <li><a href="..." title="...">...</a></li>
            <li><a href="..." title="...">...</a>
                <ul>
                    <li><a href="..." title="...">...</a></li>
                    <li><a href="..." title="...">...</a></li>
                    <li><a href="..." title="...">...</a></li>
                </ul>
            </li>
            <li><a href="..." title="...">...</a></li>
        </ul>
    </li>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a>
        <ul>
            <li><a href="..." title="...">...</a></li>
            <li><a href="..." title="...">...</a></li>
        </ul>
    </li>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a></li>
</ol>

La idea no sería hacer algo tan grotesco como el ejemplo.

¿Cómo NO crear listas de la forma correcta?

Este constituiría un mal ejemplo, donde la sublista se agrega después del item y no dentro de él:

<ul>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a></li>
        <ul>
            <li><a href="..." title="...">...</a></li>
            <li><a href="..." title="...">...</a></li>
        </ul>
    <li><a href="..." title="...">...</a></li>
</ul>

Ya está, no hay otra forma de equivocarse, solo hay que respetar las respectivas anidaciones en el orden <ul> <li> <ul> <li>.

<ul>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a>
        <ul>
            <li><a href="..." title="...">...</a></li>
            <li><a href="..." title="...">...</a></li>
            <li><a href="..." title="...">...</a></li>
        </ul>
    </li>
    <li><a href="..." title="...">...</a></li>
    <li><a href="..." title="...">...</a></li>
</ul>

Para obtener todos los datos, la consulta debe ser algo parecido a lo siguiente: "Seleccionar todas las filas de la tabla 'nombre_tabla'".

SELECT * FROM nombre_tabla

Para obtener algunos de los datos, la consulta puede ser así: "Seleccionar las filas 'id', 'producto' y 'precio' de la tabla 'nombre_tabla'".

SELECT id,producto,precio FROM nombre_tabla

Para obtener los datos que cumplan una condición dada: "Seleccionar todas las filas de la tabla 'nombre_tabla' donde la celda de la columna 'dato' sea igual a 'algo'".

SELECT * FROM nombre_tabla WHERE dato='algo'

Para obtener los datos de forma ordenada: "Seleccionar todas las filas de la tabla 'nombre_tabla' y ordenarlas por 'fecha' de forma descendiente".

SELECT * FROM nombre_tabla ORDER BY fecha DESC

Para obtener y limitar los datos: "Seleccionar 5 filas de la tabla 'nombre_tabla'".

SELECT * FROM nombre_tabla LIMIT 5

Para obtener datos limitados que cumplan una condición dada más un ordenamiento: "Seleccionar 15 filas de la tabla 'nombre_tabla' donde la celda de la columna 'dato' sea mayor a 'algo' y ordenarlas por 'fecha' de forma ascendiente".

SELECT * FROM nombre_tabla WHERE dato>'algo' ORDER BY fecha ASC LIMIT 15

Y así lógicamente podemos seguir creando las consultas SQL.

Ahora, estas consultas deben ir dentro de un pequeño código PHP que permite enviarlas al servidor y almacenar la información en una variable. La función se llama mysql_query().

$consulta = mysql_query("SELECT FROM * tabla_productos WHERE precio<15000") or die ("Error en la consulta");

Así en este ejemplo seleccionamos de la tabla_productos todas las filas donde los productos tengan un precio menor a $15000. Si la consulta está erronea muestra el mensaje "Error en la consulta" y detiene el procesamiento del código siguiente y lo entrega hasta donde alcanza a ejecutarse.

Luego, debemos transformar los datos de la variable a un array para trabajarla mejor en conjunto de un blucle while:

while($fila=mysql_fetch_array($consulta)){
$id = $fila['id'];
$nombre = $fila['nombre'];
$precio = $fila['precio'];
echo "<p>E producto $nombre ($id) vale $ $precio</p>";
// se obtienen multiples párrafos variando con los datos de los distintos productos 
}

Y así logramos obtener e imprimir los datos de una tabla de una base de datos.

<form method="post" action="">
<input type="text" name="yo" />
<!--
<input type="submit" value="hola" />
-->
<input type="button" value="hola" />
</form>
 <?php
 echo $_POST['yo'];
 ?>

<script type="text/javascript">
var nombre='Juan';
edad=10;
document.write(nombre);
document.write('<br>');
document.write(edad); 
</script>

Vemos que es exactamente lo mismo.

Me explico. Por ejemplo, un comentario que fué publicado a las 4:30 y ahora son las 4:45. Pasaron 15 minutos desde que se publicó, y eso es lo que calcula la función, el tiempo en el que fue guardado algo comparado con el tiempo del momento en que se lee.

La función que yo llamo "hace_tiempo" está basada en la función time() del PHP. Lo que hace time es calcular la cantidad de segundos que hay desde el primero de enero de 1970 hasta los segundos del momento en que se ejecuta. Si guardamos en nuestra base de datos esta cifra generada adjunta al comentario (siguiendo el ejemplo) podremos jugar con esta función.

<?php

function hace_tiempo($valor){

// FORMATOS:
// segundos    desde 1970 (función time())        hace_tiempo('12313214');
// defecto (variable $formato_defecto)        hace_tiempo('12:01:02 04-12-1999');
// tu propio formato                        hace_tiempo('04-12-1999 12:01:02 [n.j.Y H:i:s]');

$formato_defecto="H:i:s j-n-Y";

// j,d = día
// n,m = mes
// Y = año
// G,H = hora
// i = minutos
// s = segundos

if(stristr($valor,'-') || stristr($valor,':') || stristr($valor,'.') || stristr($valor,',')){

    if(stristr($valor,'[')){
        $explotar_valor=explode('[',$valor);
        $valor=trim($explotar_valor[0]);
        $formato=str_replace(']','',$explotar_valor[1]);
    }else{
        $formato=$formato_defecto;
    }

    $valor = str_replace("-"," ",$valor);
    $valor = str_replace(":"," ",$valor);
    $valor = str_replace("."," ",$valor);
    $valor = str_replace(","," ",$valor);

    $numero = explode(" ",$valor);

    $formato = str_replace("-"," ",$formato);
    $formato = str_replace(":"," ",$formato);
    $formato = str_replace("."," ",$formato);
    $formato = str_replace(","," ",$formato);

    $formato = str_replace("d","j",$formato);
    $formato = str_replace("m","n",$formato);
    $formato = str_replace("G","H",$formato);

    $letra = explode(" ",$formato);

    $relacion[$letra[0]]=$numero[0];
    $relacion[$letra[1]]=$numero[1];
    $relacion[$letra[2]]=$numero[2];
    $relacion[$letra[3]]=$numero[3];
    $relacion[$letra[4]]=$numero[4];
    $relacion[$letra[5]]=$numero[5];

    $valor = mktime($relacion['H'],$relacion['i'],$relacion['s'],$relacion['n'],$relacion['j'],$relacion['Y']);

}

$ht = time()-$valor;
if($ht>=2116800){
$dia = date('d',$valor);
$mes = date('n',$valor);
$año = date('Y',$valor);
$hora = date('H',$valor);
$minuto = date('i',$valor);
$mesarray = array('','Enero','Febrero','Marzo','Abril','Mayo','Junio','Julio','Agosto','Septiembre','Octubre','Noviembre','Diciembre');
$fecha = "el $dia de $mesarray[$mes] del $año";
}
if($ht<30242054.045){$hc=round($ht/2629743.83);if($hc>1){$s="es";}$fecha="hace $hc mes".$s;}
if($ht<2116800){$hc=round($ht/604800);if($hc>1){$s="s";}$fecha="hace $hc semana".$s;}
if($ht<561600){$hc=round($ht/86400);if($hc==1){$fecha="ayer";}if($hc==2){$fecha="antes de ayer";}if($hc>2)$fecha="hace $hc días";}
if($ht<84600){$hc=round($ht/3600);if($hc>1){$s="s";}$fecha="hace $hc hora".$s;if($ht>4200 && $ht<5400){$fecha="hace más de una hora";}}
if($ht<3570){$hc=round($ht/60);if($hc>1){$s="s";}$fecha="hace $hc minuto".$s;}
if($ht<60){$fecha="hace $ht segundos";}
if($ht<=3){$fecha="ahora";}
return $fecha;

}

// Ejemplos

echo hace_tiempo("1271201645")."<br />";
echo hace_tiempo("20:34:05 13-04-2010")."<br />";
echo hace_tiempo("2010-04-13 20:34:05 [Y-n-j H:i:s]")."<br />";

?>

Forma de utilizar la función

Primero que nada guardar el código integrándolo al principio del documento. Al obtener el número (el time() que se guardó con anterioridad) de la base de datos e ingresandolo en una variable ($numero) solo debemos llamar a la función para que trabaje y de el resultado de la siguiente forma:

<?php echo hace_tiempo($numero); ?>

Así podría decir: hace 20 segundos, hace 1 minuto, hace 2 horas, hace 1 semana, hace más de 1 hora, etc. dependiendo del número. Está programado hasta 3 semanas, si el tiempo exede se muestra como "el dia X del mes X del año X". El tiempo se puede extender si se sigue la misma lógica del código PHP con un estudio de cuantos segundos hay en un mes, dos meses, un año, etc.

Conveniencia

Es muy conveniente usar esta o una función similar porque elimina la complejidad de los distintos horarios que hay en el mundo. No en todo el mundo son las 5 de la tarde, pero 5 minutos o 5 horas transcurridos son igual para todos.

Si decimos en la web "publicado el 08 de abril del 2010 a las 5:05pm" siendo que hoy es 08 de abril del 2010 y son las 9:00pm, es mucho pero mucho mejor para el lector decirle que transcurrieron 4 horas a darle tanta molestia de leer esa catastrófica frase para compararla con la fecha actual y calcular hace cuanto tiempo pasó aquello.

Actualización del código

Ahora en el código puedes ingresarle cualquier formato de fechas. En el mismo están las instrucciones.

<?php

$tabla = "tabla_productos";
$servidor = "sql.servidor.com";
$usuario = "nombredeusuario";
$clave = "clavedeusuario";

mysql_select_db($tabla,mysql_connect($servidor,$usuario,$clave)) or die("Error de conexión con la base de datos.");

?>

La parte de "or die()" se muestra solo si hay algún error al conectarse con la base de datos, que sólo puede deberse a datos incorrectos o mala sintaxis.

La idea del código es usarlo al principio de todo el PHP y usarlo sólo con una tabla MySQL.También se puede aplicar un código más directo como siempre lo hago (ventaja del PHP):

mysql_select_db("tabla_productos",mysql_connect("sql.servidor.com","nombredeusuario","clavedeusuario")) or die("Error de conexión con la base de datos.");

Según mi experiencia no hay necesidad de cerrar la conexión como en otros códigos que he visto en otros sitios webs.

Problemas con la codificación de caracteres

Si hay problemas con la codificación de caracteres, usa la siguiente línea con tu codificación después de la conexión:

mysql_query("SET NAMES 'utf8'");

Mejoramos el rendimiento del sitio porque se hace sólo una petición HTTP en vez de que se pidan una por cada imagen. Si tenemos por ejemplo 50 imágenes pequeñas dentro del sitio, cuando un visitante abre la página se consultan en el servidor toda esta cantidad de imágenes. ¿No sería mejor que se pida solo una vez?. Pues es mejor, porque la imagen es cargada solo una vez por el navegador y el CSS (que actúa en el cliente y no en el servidor) se encarga de mapear la imagen. 

Un ejemplo de un mapa de imagen es el siguiente:

Iconos gratis obtenidos desde pictoico.

Quienes usan más los sprites CSS son aquellas webs que tienen demasiadas consultas al minuto, y que buscan reducir en lo posible el tráfico generado paraque sus servidores no colapsen. Google usa sprite, y lo usa muy bien:

Creando un Sprite CSS

Lo que haremos con el CSS será "recortar" esta imagen, como se ilustra en las siguientes figuras.

Debemos saber la coordenada de la esquina superior izquierda del icono a utilizar más su anchura y altura correspondiente para utilizarla luego en el CSS. Se puede obtener con programas gráficos como Photoshop (F8 para abrir la información) o el mismísmo Paint (en la barra de estado).

Las propiedades del CSS que utilizaremos en conjunto de un documento XHTML semántico y accesible para el sprite son:

• background
• display
• width
• height
• overflow
• line-height

Comenzemos con el Sprite CSS. Vamos a hacer un menú como el siguiente.

<ul id="menu">
<li><a href="/#enlace1" title="Portada, título del enlace 1">Portada</a></li>
<li><a href="/#enlace2" title="Carrito de compra, título del enlace 2">Carrito</a></li>
<li><a href="/#enlace3" title="Buscar, título del enlace 3">Buscar</a></li>
<li><a href="/#enlace4" title="Guardar, título del enlace 4">Guardar</a></li>
<li><a href="/#enlace5" title="Eliminar, título del enlace 5">Eliminar</a></li>
</ul>

En la hoja de estilo, cada enlace se convertirá en imagen teniendo como fondo el mapa de imagen, junto con su anchura y altura correspondiente. Se puede apreciar la propiedad float para hacer que cada enlace flote frente al anterior y así quede un menu horizontal. También las propiedades overflow y line-height para hacer desaparecer el texto. El menu tendrá la misma altura y color de fondo de los enlaces para hacerlo más interesante y largo.

ul#menu {
    height:63px;
    background-color:#212121;
}

ul#menu li {
    display: inline;
}

ul#menu li a {
    background: url('sprite.png') no-repeat;
    display: block;
    width: 63px;
    height: 63px;
    float: left;
    overflow: hidden;
    line-height: 10em;
}

Y a continuación, viene lo que se llama sprite, el mapa de las coordenadas para cada uno de los enlaces segun su clase asignada. Algunos enlaces cambiarán según el estado :hover (cuando el mouse esta por encima del enlace) o :active (cuando se presiona). Las coordenadas deben ir en negativo porque la imagen de fondo debe retroceder para posicionarse donde se quiere (para entenderlo y acostumbrarse es mejor experimentarlo).

ul#menu li a.portada {
    background-position: 0 0;
}


ul#menu li a.carrito {
    background-position: 0 -64px;
}
ul#menu li a.carrito:hover {
    background-position: -64px -64px;
}


ul#menu li a.buscar {
    background-position: -192px 0;
}


ul#menu li a.guardar {
    background-position: -128px -128px;
}
ul#menu li a.guardar:hover {
    background-position: -64px -128px;
}
ul#menu li a.guardar:active {
    background-position: 0 -128px;
}


ul#menu li a.eliminar {
    background-position: -256px 0;
}
ul#menu li a.eliminar:hover {
    background-position: -256px -64px;
}

Podemos hacer lo que se nos ocurra. Podemos por ejemplo tener todas las imagenes del sitio en una sola y se gastarán menos recursos. Además, cargará mucho más rápido.

¿Olvidé decir que funciona para todos los navegadores?

Descarga el ejemplo.

Podemos crear menus horizontales ubicados bajo el banner del sitio tanto como arriba para la navegación dentro de las principales secciones. Los menus verticales ubicados en algun costado del contenido podemos utilizarlos para los enlaces relacionados a la página que se está visitando, o utilizarlo para lo que se estime más conveniente.

Estos son unos ejemplos de como se vería el resultado de una buena maquetación de menu con XHTML+CSS válida para todos los navegadores.

Creando el menú con CSS

Las propiedades para maquetar el menu tanto horizontal como vertical son:

• display
• float
• width
• height (opcional)

Más todas las propiedades que se desee para darle un estilo definido.

La gracia es aplicar todas estas propiedades los enlaces para aprovechar sus distintos estados (:hover, :active, :visited o :focus) y para que estos puedan ser visualizados correctamente por cualquier navegador. Recuerda que Internet explorer 6 no admite dichos estados en otros elementos que no sean los hipervínculos.

Utilizaremos el siguiente XHTML para los dos menús de ejemplos:

<ul id="menu">
<li><a href="#enlace1" title="Inicio, título del enlace 1">Inicio</a></li>
<li><a href="#enlace2" title="Servicios, título del enlace 2">Servicios</a></li>
<li><a href="#enlace3" title="Clientes, título del enlace 3">Clientes</a></li>
<li><a href="#enlace4" title="Galería de imágenes, título del enlace 4">Galería</a></li>
<li><a href="#enlace5" title="Contacto, título del enlace 5">Contacto</a></li>
</ul>

El menu CSS horizontal

La propiedad display en conjunto de su valor block nos permite transformar un elemento a en bloque, hablamos de los propios enlaces o del selector "a". Float más un valor right o left nos permite hacer que el enlace convertido a en bloque quede junto a otro formando una cadena horizontal. Width y height ayudan para formatearlo con la medida que queramos.

El siguiente código CSS identifica las principales propiedades que mencionamos para maquetar el menu horizontal:

ul#menu {
    height: 25px;
}

ul#menu li {
    display: inline;
}

ul#menu li a {
    display: block; 
    width: 120px;
    height: 25px;
    float: left;
}

Hecho esto tendremos inmediatamente lista la maquitación y solo deberíamos empezar con la creatividad aplicando las propiedades que queramos para estilizar el menu. Es relativamente simple.

El menu CSS vertical

En este ejemplo se cumple el mismo rol pero algo cambiado. La propiedad width debe estar definida en el menu y no en los enlaces (ellos se adaptan a esta medida). Además, el menu es el que flota a la izquierda del contenido y los enlaces solo se deben convertir a elementos en bloque.

Agregamos un nuevo div en el ejemplo del XHTML para el contenido, para que este, quede con un margen igual a la medida del menu, mas un padding para separarlos.

ul#menu {
    float: left;
    width: 130px;
}

ul#menu li {
    display: inline;
}

ul#menu li a {
    display: block;
    height: 25px;
}

#contenido {
    margin-left: 130px;
    padding-left: 20px;
}

Y bien, como dijimos antes, se debe aplicar la imaginación para hacerlo más elegante.

Puedes descargar el ejemplo del menu vertical y el del menu horizontal. Ambos estan más producidos en código y explicados con comentarios.

 Que cuando alguien se registre con un nombre de usuario y otra persona quiera registrarse con el mismo nombre no se pueda registrar ejemplo

Juan <-- un usuario que ya se registro

Si me registro con el nombre mismo nombe JUAn no me deje rejistrame

El problema es el siguiente: Tengo un formularo en html y php que inserta a los usuarios registrados.

Si escribo un nombre en mayusculas me crea un nuevo usuario, el problema empiesa si escribo el mismo nombre en minusculas me crea otro usuario

¿Cómo ago para que esto no pase?

Me encanto la iniciativa de esta pag y busco cambiar mi sitio en html, que hice hace unos meses, a uno en php que me permita modificar más fácilmente el contenido, agregar fácilmente contenido, cambiar la apriencia, cargar más rápido y etc beneficios del php.

Mi pregunta es si es q puedes subir un video que explique la forma de editar alguna plantilla wordpress para hacer tu propio diseño o hacerlo desde cero de alguna manera, como lo del panda pero un poco más lento.

Cuando estés listo no dudes en contestar mis dudas y publicar mas tutoriales

¿Como crea sus sitemaps?

URGE UN TUTORIAL DE SEO YAAAAAAAAAAAAAAAAAAA

tambien no acepta si le cambiamos la extencion de php a xml con htaccess e_e

la unica solucion es aser un script que cree un xml

<?php

include('conexion.php');

$query_preguntas= mysql_query("SELECT *FROM $table_preguntas order by id DESC");
while($id_preguntas= mysql_fetch_array($query_preguntas))
{$mensaje= "<url><loc>$web/Pregunta$id_preguntas[id]/</loc></url>\n";
$abrir= fopen("sitemap.xml","a");
fputs($abrir,$mensaje);
fclose($abrir);
}

?>

pero hay un error ya que cadaves que visitemos este escrip se ensimaran las urls

¿Porque pasa eso?

Sitemap.php Pero google no lo acepto, después con htaccess cambie la extensión a sitemap.xml pero google tampoco lo quiso, ¿Qué puedo hacer?

Aqui esta el codigo que utilizo:

<?php
include('conexion.php');
echo "<?xml version=\"1.0\" encoding=\"UTF-8\"?>
<urlset
      xmlns=\"http://www.sitemaps.org/schemas/sitemap/0.9\"
      xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\"
      xsi:schemaLocation=\"http://www.sitemaps.org/schemas/sitemap/0.9
            http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd\">
";
echo "<url><loc>$web</loc></url>\n";

$query_usuarios= mysql_query("SELECT *FROM $table_usuarios order by id DESC");
while($user= mysql_fetch_array($query_usuarios))
{echo "<url><loc>$web/$user[nombre].html</loc></url>\n";}

$query_preguntas= mysql_query("SELECT *FROM $table_preguntas order by id DESC");
while($id_preguntas= mysql_fetch_array($query_preguntas))
{echo "<url><loc>$web/Pregunta$id_preguntas[id]/</loc></url>\n";}

$query_tutorial= mysql_query("SELECT *FROM $table_tutorial order by id DESC");
while($id_tutorial= mysql_fetch_array($query_tutorial))
{echo "<url><loc>$web/tutorial/$id_tutorial[tipo]/$id_tutorial[id]/</loc></url>\n";}

echo "</urlset>";
?>

NOOOOOOOOOOOOoooooooooooooooooo

me anduve matando investigando para poder crear las urls accessibles y mi hosting no admite hatccess

que significa este signo [L] en htaccess ????????

Para crear una categoría se debe seguir la sigguiente sintaxis:

[categoría]: Título de tu publicación

O mejor aún más una subcategoría:

[categoría]: [subcategoría]: Título de tu publicación

Ejemplos:

Photoshop: Crear gifs animados

Guía: Photoshop: Crear gifs animados

Las categorías o subcategorías póngase en plural, singular, mayúsculas, minúsculas o con acentuaciones dan el mismo resultado en la página de dicha categoría. Si la categoría es por ejemplo "Guía", "guías" o "GUIAS" se almacenará en esa categoría, pero note que las URLs permacenecen sin acentuaciones y se desprecia la escritura mencionada para mostrar los mismos resultados para todas ellas.

Desde crear publicaciones, darles una categoría, conectarlas con otro artículo, seguir el feed RSS, editarlas, tener tu propia mensajería, dar puntos, eliminar y editar mensajes, hacer búsquedas y más características que señalaré ahora junto a sus propiedades.

Crear

Crea todo tipo de publicaciones. Desde extensos tutoriales con páginas conectadas hasta pequeños tips en un editor de "lo que ves es lo que obtienes".

• Categorías y subcategorías: Cada publicación puede almacenarse en una categoría y una subcategoría. Es muy simple: antes del título de la publicación se escribe la categoría y/o subcategoría junto con dos puntos. 
• Preguntas: Para preguntar se debe usar obligatoriamente el signo de interrogación y así se alamacenará en la categoría de preguntas.
• Conectar: Conecta tus publicaciones con otras mediante "más opciones" en el momento de crear o editar una publicación.
• Diseño: Puedes elegir entre el diseño estándar de publicación o el amplio en "más opciones" para, por ejemplo, presentaciones de imágenes grandes o vídeos de alta definición.
• Mensajes: Puedes dejar mensajes en absolutamente todas las publicaciones.
• Favoritos: Almacena tus publicaciones favoritas en tu perfil a través del icono de corazón.
• Puntuar: Puedes puntuar cada publicación y mensaje una vez por día como bueno (+) o malo (-).

Editar

Puedes editar todos los artículos y mensajes con algunas limitaciones.

• Publicaciones: Los amigos pueden editar libre y mutuamente sus publicaciones. Si no, sólo pueden recomendar ediciones para que luego sean aceptadas o rechazadas por sus publicadores.
• Mensajes: Puedes editar y eliminar cualquier mensaje tuyo o que estén en tus publicaciones.

Perfiles

Tienes tu propio perfil donde se muestran todo lo que públicamente haces.

• Historia: Es un registro de lo que haces en el sitio como los momentos en que publicas o dejas mensajes en otras publicaciones. Puedes comentar en cualquier historia de cualquier usuario.
• Agregar amigos: Envía peticiones de amistad desde el perfil que quieres agregar como amigo.
• Seguir: Puedes "seguir" lo que un usuario o amigo haga desde tu perfil para saber lo que él hace (si publica o agrega mensajes por ejemplo).

Buscador

Busca entre los artículos del sitio junto a resultados de Google.

Mensajería privada

Envía y recibe mensajes privados a cualquier usuario del sitio.

Feed RSS

Por cada publicación, perfil y categoría existe un canal de sindicación. Sólo agrega /feed al final de la URL y podrás acceder a ello. EL feed general se encuentra en www.documentoweb.com/feed.

Privacidad

La privacidad es mínima:

• Tu contraseña permanece encriptada.
• Si proporcionas tu e-mail puedes elegir entre dejarlo público o no. 
• Tus publicaciones guardadas sólo las puedes ver y editar tú.
• Tu mensajería privada, es privada.

Toda la información que circula es y debe ser pública, por lo tanto, debes cuidar o simplemente no proporcionar tu información personal, porque no la necesitamos.

Licencia

Todos las publicaciones están bajo la Licencia Creative Commons Atribución - No Comercial - Licenciar igual. Quiere decir que, puedes copiar y editar las publicaciones haciendo referencia a sus autores siempre y cuando no sea con fines comerciales y licencies bajo esta misma licencia.

Otras características

• URLs muy limpias
• Código XHTML 1.0 y CSS válido
• Código PHP listo para agregar fácilmente nuevas funciones.

Hace un tiempo deseaba un lugar donde todos pudiésemos intercambiar el conocimiento con la posibilidad de corregir lo incorrecto de otro o que me corrigiesen lo incorrecto, mostrar los errores, las preguntas y experiencias que conllevan a aprender y mejorar nuestro conocimiento. Como humanos tenemos la gran capacidad de aprender y, ¿de qué serviría nuestra vida si no fuese para aprender?.

Quiero aumentar nuestros conocimientos y para ello creé esta herramienta.

No es un nuevo Wikipedia con información neutral, un blog unipersonal, una red social ni un foro de discusión. No sé como llamarlo, pero posee las ideas que tienen ellos y que nos permitirán satisfacer este propósito:

Transmitir

Constantemente estamos transmitiendo conocimientos. Nuestros padres lo hacen, nuestros amigos, los blogueros, los foreros y casi cualquier persona que domine el tema más que el otro transmitirá su conocimiento.

Corregir

Cuando alguien te transmite un mensaje tú lo analizas y en caso de un fallo corriges porque no puedes aceptar algo diferente a lo que ya sabes, si te parece extraño o no tiene ninguna base.

Buscar y/o preguntar

Si no sabes algo, buscamos en información transmitida y/o corregida, en fuentes externas y si no, simplemente se pregunta para recibir respuestas y luego transmitir este nuevo conocimiento a otros y así volver al primer punto.

Las personas

Sin este concepto, ninguno de los tres anteriores funcionaría para realizar nuestro objetivo. Todo funciona con nosotros y siempre será así: una red interconcectada, una comunidad que transmite el conocimiento, corrige los errores, busca información, pregunta y lo más importante: aprende.

Bajo un simple sistema, un diseño aireado y distintas funciones espero que éste sea nuestro nicho de aprendizaje multidireccional.