Archive for month: March, 2010

Creando grupos de opciones con combos html

Categories: html - Tags: , ,

En este post voy a hablar de un tema muy básico nada de ajax ni trucos extraños pero aunque es una función muy simple rara vez se usa pese a lo tremendamente util que es en los comboBox, supongamos que tengo varias categorias y subcategorias y me gustaría que los usuarios puedan elegir sólo la subcategoría(se supone que en la base de datos la subcategoria tiene un parent asi que no requerimos el id de la categoria) pero además que mantenga un orden el combo para que el usuario sepa que categoria va a que subcategoría y obtener algo como lo de la imagen.
combo optgroup

El código es muy sencillo, basta usar la etiqueta optgroup en nuestra categoría y etiquetas select para nuestras subcategorias

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<select name="categorias">
    <optgroup label="fruta">
    <option value="1">naranja</option>
    <option value="2">fresas</option>
    <option value="3">peras</option>
    </optgroup>
    <optgroup label="verduras">
    <option value="1">zapallo</option>
    <option value="2">habas</option>
    </optgroup>
    <optgroup label="carnes">
    <option value="1">pollo</option>
    <option value="2">pescado</option>
    <option value="3">cerdo</option>
    </optgroup>
</select>

Hasta ahi muy bien, pero podemos darle algo de estilo a nuestro combo para que quede así:
combo optgroup
Para eso aplicamos los siguientes estilos:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
select {
    border:1px solid #999;
    background-color:#000;
    color:#FFF;
}
optgroup {
    background-color:#900;
    color:#FFF;
    background-image:url(flecha.png);
    background-repeat:no-repeat;
    background-position:right top;
}
option {
    background-color:#000;
}

Lo mejor de todo es que funciona hasta en IE6 excepto colocar una imagen como fondo del optgroup pero creo que es un detalle pequeño que podemos obviar.

Primeros alcances Internet Explorer 9

Categories: Otros - Tags:

No soy un fan de Internet Explorer admito que lo detesto!!! ya que 50% de mi tiempo es para programar y el otro 50% para hacerlo compatible con IE6, 7, 8 y encima ya viene el 9…
Hagamos un breve recuento antes de analizar el Internet Explorer 9, todos ya sabemos que Internet explorer 6 además de no ser seguro no respeta ningún standard conocido es totalmente obsoleto y debería eliminarse pero ya, sin embargo lo mantenemos porque hay sistemas que sólo funcionan en IE6. Respecto a IE7 personalmente creo que fue un gran avance ya casi todo lo que funcionaba en Firefox funcionaba en IE7 con algún pequeño cambio sin embargo en cuanto a velocidad de javascript y CSS3 aun estaba en nada. IE 8 me parece una gran decepción esperaba que finalmente se pusiera al día en cuanto a estándares refiere pero sus avances estaban muy pero muy por detrás de la competencia.

CSS3 en IE 9

Los resultados son interesantes al menos en cuanto a selectores refiere parece que funciona al 100%, en cuanto al Acid Test 3 marca un 55/100 si recordamos que una buena parte de los modernos navegadores ya dan un 100/100 o muy cercano parece que este resultado no es la gran cosa sin embargo comparado con versiones anteriores ya es un avance además parece que finalmente Microsfot empieza a preocuparse por estándares. Ojalá la versión final diga 100/100

Javascript

Si damos una ojeada al Webkit sunSpider
Sun Spider Internet Explorer 9

Si vemos el gráfico vemos que hay una gran evolución respecto a Internet Explorer 8 y ya entra en competencia con los modernos navegadores.

Rendimiento

Sería muy apresurado hablar del rendimiento ya que aún es sólo un cascarón sin más función que navegar sin embargo pueden descargarlo desde AQUI y sacar sus propias conclusiones.

En conclusión de lo que he visto se ve prometedor espero que finalmente sea totalmente standard aunque más me preocupa que sean capaces de deshacerse de todas las versiones anteriores y podamos programar en HTML 5 y CSS3.

Seguridad, ataques y spam en la web

Categories: PHP - Tags: , ,

Desde que empecé a postear en mi blog he sufrido múltiples ataques afortundamente he podido repelerlos todos gracias a una serie de plugins para WordPress sin embargo estas mismas funciones es posible incluirlas en nuestros scripts, veamos algunas formas:

No permitir HTML

Nada más molesto que ser bombardeado por cientos de mensajes llenos de código basura, con links para comprar viagra (creo que no lo necesito), ofertas de mil cosas he incluso mensajes en árabe que llenan de links y código malicioso en los peores casos añaden javascript que invocan banners de propaganda o intentan descargarla algún troyano a nuestros visitantes lo mejor para prevenirlos es no permitir el uso de código HTML para eso podemos usar una muy útil función de PHP que es strip_tags y se usa de la siguiente forma:

1
2
3
4
5
//// Para eliminar todo rastro de html seria
$text = '<p>mi codigo html</p><a href="#fragment">Other text</a>';
echo strip_tags($text);
//// Para permitir el uso solo de <p> y <b>
echo strip_tags($text, '<p><b>');

Existen formas más elaborados usando PHP purifier por ejemplo pero por lo general no requerimos un script tan pesado y con strip_tags basta.

Usar un código de seguridad

Más conocido como captcha podemos colocar nuestra letras como si fueran un gráfico un poco distorcionado y así prevenir que robots posteen, hay algunos detalles que debemos tomar en cuenta primero que el código se debe verificar al momento de enviar el formulario y al recibir los datos ya que los robots suelen no usar el formulario y saltarse toda validación javascript, hay muchas opciones de captcha basta buscar en google pero siempre tomando en cuenta que el código sea lo suficientemente comprensible para un humano.

Bloquear IP

Esta es una de las formas más radicales de prevenir spam ya que los robots suelen venir de algunos ip que no varían al bloquearlos se disminuye el spam pero cuidado porque podriamos estar bloqueando a todo un grupo de usuarios que estén bajo un mismo IP público.
Para esto en PHP verificamos el IP de nuestro visitante

1
2
3
4
5
6
7
8
<?php $ip = $_SERVER['REMOTE_ADDR'];
//// Hacemos un array de ips baneadas
$ips_baneadas = array('10.0.0.1',’192.0.0.1’);  
$contador = count($ips_baneadas);  
//// Verificamos si el visitante esta baneado
for ($i=0; $i<$contador; $i++) {  
if($ip == $ips_baneadas[$i]) { die("Lo sentimos, estas baneado . $ip"); } } ?>  
?>

Y bueno esas son las formas más usuales de prevenir spam aunque les aseguro que no son 100% seguras digamos que son un 99% seguras combinadas asi que siempre quedará algo que debamos borrar manualmente por lo que no esta demás poner alguna opción que diga “denunciar” para eliminar algún comentario malicioso.

No se ve la configuración de Flash

Categories: Flash - Tags: ,

Hace poco me pasó un extraño error en flash player no podía activar la configuración, le daba click derecho y la opción de configuración aparecía deshablitada, pensé que era algún error con el embed ya que estaba usando YUI, cambié a jquery con swfobject y no funcionaba, así que pensé que tal vez era un error en flash pero no daba señales de arreglarse, al final encontré el error y es que en flash debes usar un tamaño mínimo de película o de lo contrario no hay forma que esta aparezca así que si intenetas con unos 200px de ancho o menos simplemente no aparece y la única solución según veo es agrandar el tamaño de tu película flash.