Necesito hacer un formulario web... validado con PHP, como hago?

Esta es una pregunta que muchos a podido llegar a hacerse, como hacer un formulario web, de contacto, por ejemplo, o de reservación o de cualquier otra cosa que necesitemos, pues muy simple, voy a explicar un poco los puntos importantes de un formulario web :) obviamente validado con PHP, para que sea mas interesante.
bueno comencemos con algo simple, necesito obviamente decirle al navegador que lo que sigue en la interpretación de mi pagina es un formulario, entonces debo escribir algo así

<form name="formulario" method="post" enctype="multipart/form-data" action="">
</form>

debemos tener claro, que la etiqueta form debe llevar ciertas reglas para que sea XHTML Strict y además que sea funcional, también debemos poner el método de captura de los datos, en este caso es "POST", los cual significa que los datos viajaran ocultos de la vista de el visitante de nuestra pagina, el enctype es el tipo de cifrado que tendran los datos cuando son enviados luego de hacer un "submit" (significa, que hacemos click en un botón, para enviar el formulario) en el formulario, en este apartado vemos 3 tipos de enctype estos son:

• multipart/form-data, este cifrado transmite cada uno de los campos como partes separadas de un documento compatible con MIME y automáticamente utiliza a POST para enviarlos
• application/x-www-form-urlen-coded, significa que el cliente convierte cada espacio en un signo de suma (+) y cada caracter que no sea alfanumérico en un signo de porcentaje (%) seguido por los dos dígitos hexadecimales que representan a tal carácter
• y por ultimo text/plain, el cual tomara todos los campos del formulario y los tratara como texto plano.

luego el action, el cual indicara a nuestro formulario la pagina donde debe redireccionarse para ser validado, guardar datos o si no enviar un correo, en nuestro caso, dejaremos este en blanco, puesto que nosotros necesitamos que el redireccione a la pagina actual, esto con el fin de validar si existe algún error y marcar el campo.
Bien una vez sabido esto, debemos comenzar con el diseño de apariencia de nuestro formulario, entonces utilizaremos CSS para hacer eso. En el head o en un archivo aparte debemos escribir algo parecido a esto para comenzar.

* { margin:0; padding:0;} //esto nos ayudara a limpiar un poco lo que ya tenga el navegador definido, para comenzar a hacer nuestros ajustes desde cero.
body { font-size:12px; font-family:Verdana, Arial, Helvetica, sans-serif;}
form { margin:0 auto; padding:5px; width:700px; } //esto nos ayudara a hacer el form de un tamaño y además a centrarlo un poco en la pantalla.
form fieldset { border:0; margin:5px 0 0 10px;}
form fieldset label { font-weight:bold; clear:both;}
em { color:#CC0000; font-weight:bold;}
form fieldset .campo { border:1px solid #999999; color:#333333; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px;}
form fieldset .campo_error { border:1px solid #CC0000; color:#CC0000; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px;}
form fieldset .boton_enviar { border:1ps solid #0000FF; background:#0066FF; color:#FFFFFF; padding:3px; margin:3px 0 3px 0;}
form fieldset .cajaerror { clear:both; border:1px dashed #CC3300; background:#FFCC66; padding:5px; color:#990000; font-weight:bold;}

Bueno esto es un poco el CSS que deberia llevar, ahora lo interesante, vamos con el codigo ;)

---------------------------------------------------------
<?
if($_POST['enviar']){


$msj = "<p>Existen errores, por favor verifique</p>";//titulo para el mensaje de error


//inicializo las variables de error
$error_campo1_msj="";
$error_campo2_msj="";
$error = "N";


//compruebo que si le quito los espacios y cuento la cantidad de caracteres cumple con lo necesario para pasar la validacion
if(strlen(trim($_POST['campo1'])) < 3)//si el campo1 es menor a tres caracteres
{
$error_campo1_msj = "&nbsp; El campo 1 debe ser mayor a 3 caracteres <br/>";
$error = "S";
}


if(strlen(trim($_POST['campo2'])) < 10)//si el campo1 es menor a 10 caracteres
{
$error_campo2_msj = "&nbsp; El campo 2 debe ser mayor a 10 caracteres <br/>";
$error = "S";
}


} //cierro el if del inicio
if ($error=="N") { //si no hubo errores
// hago lo que tengo que hacer con los datos, porque se que los requeridos son validos
} else{
if ($error=="S") { //si hubo errores
echo "<em>".$msj."</em>"; //muestro el mensaje de que hay campos con error
}
?>


<form id="formulario" name="formulario" enctype="multipart/form-data" method="post" action="">
<fieldset>
<label for="campo1">Campo 1 <em>*</em></label>
<?=($error_campo1_msj<>""? "<div class='cajaerror'>".$error_campo1_msj."</div>": '');?>


<input name="campo1" id="campo1" type="text" <? if($error_campo1_msj<>""){?> class="campo_error" <? }else{ ?> class="campo" <? } ?> size="30" maxlength="50" value="" />


<label for="campo2">Campo 2 <em>*</em></label>


<input name="campo2" id="campo2" type="text" <? if($error_campo2=="S"){?> class="campo_error" <? }else{ ?> class="campo" <? } ?> size="30" maxlength="50" value="" />


<label for="campo3">Campo 3 </label>


<input name="campo3" id="campo3" type="text" class="campo" size="30" maxlength="50" value="" />


</fieldset>


<fieldset>


<input class="boton_enviar" name="enviar" value="Enviar Formulario" type="submit"/>
<input class="boton_enviar" name="reset" value="Limpiar formulario" type="reset" />
<br/><br/><em>*&nbsp;</em>Indica que es un campo requerido y no podr&aacute;s continuar hasta que cumplas la condici&oacute;n<br />


</fieldset>


</form>
<? } ?>
---------------------------------------------------------

Bien, que tenemos aquí.... pues bueno, a ver desde el comienzo, tenemos un if, que valida que se haya enviado el formulario, mediante el botón "enviar formulario", como el mismo botón es un input, puedo validar con el porque de hecho para poder enviar el formulario, debes presionar el botón :)

Bueno luego que hay?? una variable $msj que tiene un mensaje... wow difícil de creer... pero si, esta variable tendría este mensajito y alertara al visitante de que esta cometiendo un ENORME y GRAVISIMO ERROR... al dejar alguno de los campos vacios o no completando sus requerimientos.

Ahja... y después, limpio las variables que van a contener los mensajes de error individualizados para cada uno de los campos... ok, además de una bandera, la variable error, la cual nos dirá si se tienen errores en la validación o todo esta de maravilla.

Luego un ya las validaciones de los campos, las cuales utilizan strlen, función de PHP que cuenta los caracteres de una cadena... y además de la función trim, también de PHP, la cual va a eliminar los caracteres " ", que haya tanto al inicio como al final de la cadena, esto porque?? pues con el fin de que no se puedan enviar caracteres en blanco en el campo. Luego de eso se comprueba que el campo tenga la cantidad mínima de caracteres como para que sea algo real... un nombre, un apellido, un telefono, etc, aunque se podrian poner algunas otras validaciones para el campo de un determinado tipo, pero como esto es un simple ejemplo con motivos educativos, no veo necesidad de ir mas haya.

Bien, en caso de que la condicion se cumpla y el texto del campo es menor a la cantidad minima de caracteres requeridos, entonces procedo a llenar variables con mensajes error y a poner la bandera en "S", esto tiene su utilidad mas adelante...
Una vez terminada la validacion de los campos y puesto nuestros mensajes de error, estamos listos contiunuar, ahora vemos otro if, el cual va a pregunta si se dio algun error, por medio de la bandera, interesante de esto es que si no se dio algun error, simplemente procede a tratar los datos, pero de lo contrario, continua mostrando el formulario y ademas los mensajes de error para los campos requeridos.
luego de esto, ya vemos nuestro genial formulario, el cual esta construido muy simple y manejado con nuestros estilos del inicio, vemos el fieldset el cual nos ayudara a englobar los elementos de manera que no anden por todo el formulario, ademas de la etiqueta label, la cual dara nombre al campo, en ella vemos algo como esto <em>*</em>, que mas abajo un mensaje indica que el campo tiene requerimientos, los campos que no tienen esto, son considerados opcionales, esto porque no es necesario que vayan llenos... es un "si quiere llenarlo, pues en horabuena", luego vemos un codigo que muestra el error para este campo si la variable que antes llenamos en caso de error es <> de " ", ademas vemos una etiqueta <div>, con un "class", bueno no me voy a meter mucho con esto, pero es una simple etiqueta para mostrar el error mas bonito :) esto es lo que se conoce como un if corto, donde yo mediante una simple sentencia, puedo tener un if completamente funcional "(condicion = valor ? verdadero : falso)", asi este pequeño codigo puede ser muy util.

Ajam... ya en el campo vemos que la sintaxis se ha alterado un poco, esto para que si la variable de error esta llena, no solo muestre el mensaje, si no que ademas muestre el campo un poco diferente con un color rojo, que haga constar de que el campo tiene un error y debe ser corregido para continuar, esto es mas que todo con fines de accesabilidad.

al final de todo vemos el fin del if, ese if es la parte else que comentamos hace poco, la cual nos pregunta si existia error o no.
Bueno creo que esto es todo por hoy, pronto vendre con algo mas interesante. Saludos :)