| | | |

Cómo destacar en el menú de navegación el acceso en que nos encontramos

Imaginemos que tenemos un menú de navegación y queremos diferenciar la opción de Home, el About, el Contacto… ya que en esos momentos estamos en uno de ellos.

¿Cómo hacerlo? En Babblative nos enlazan algunos métodos para hacerlo:

Method 1 – WordPress: WordPress actually has this feature built-in. WP-List-Pages

Method 2 – PHP: Jem’s Trendy Active CSS Tabs or Matt’s Intelligent Menu’s. I’ve personally had middling success with PHP on a manually maintained site and little success with it on Textpattern.

Method 3 – Textpattern: You can either muck around with multiple templates, which is bloated and unnecessary, or you can use this method. If you choose to use the multiple templates then you’ll need to read how do I use a different page layout for each section?

Method 4 – Manually Maintained Sites: Use Hicksdesigns method to highlighting current page with CSS

Keep Reading: Keeping a ‘current state’ on navigation, Keeping Navigation Current With PHP, EasyNav, Setting the Current Menu State with CSS

Vía / Babblative

Switchy McLayout: layout adaptable

La gente de A List Apart nunca dejan de sorprenderme, en esta ocasión leo un artículo de ellos en los que nos esplican una técnica para layouts, que se cambie su funcionalidad según el tamaño de la ventana.
El segundo ejemplo, que es el que más me ha gustado, cambia un diseño con varias columnas a un sistema de pestañas horizontales a otro verticales.
layout.png
Switchy McLayout: An Adaptive Layout Technique

24 ways: buenos trucos para tu web

24ways.png24 ways es un sitio a tener en cuenta a la hora de encontrar trucos y efectos para tu web desarrollados por gurus del desarrollo web.

En especial me han gustado cinco de ellos:

Vía / QuirksBlog

Proteger tu aplicación web

Interesantísimo artículo que nos guía a proteger nuestra aplicación web para evitar posibles ataques. Haciendo un corto resumen, separamos las distintas acciones que debemos seguir en:

  • Validar todas nuestras entradas (variables de sesión y formularios). Los datos deben ser lo que se esperan, y si se esperan desde POST, que no vengan desde GET.
  • Evitar el cross-site scripting (XSS) que es la introducción maliciosa de código mediante formularios que se ejecutará en nuestra aplicación.
  • Modificar el fichero de configuración php.ini para que no use super globals, para mostrar todos los errores y que estos se muestren por fichero.
  • Asegurar la conexión a la base de datos. Este método no lo conocía y la verdad es que me ha gustado bastante.
  • Bloquear IPs de hackers, ya sea mediante PHP o htaccess
  • Si el otro día hablábamos del LDAP, ahora nos hablan del LDAP injection, otra cosa que no sabía (no, si ya he dicho que es un buen artículo).
  • Evitar que Google proporcione datos que no queremos (Google Hacking), para ello lo mejor es usar el robots.txt.
  • Restringir el acceso mediante .htaccess

Protecting your Site

Vía / dzone

|

TinyDigg: API simple de Digg para PHP

Aunque el mismo autor reconoce que el código no está muy optimizado, el hecho es que esta librería de PHP para acceder a funciones de Digg, puede ser de suficiente utilidad por si queremos incluir las noticias de Digg actualizadas en nuestra web.
Muestra el número de diggs que tiene una historia, la categoría de la historia, cabecera, enlace a entrada original y el resumen.
TinyDigg
Ejemplo
Vía / Good PHP Tutorials

Kuler: un esquema diario de colores por Adobe

adobe-labs.pngSi ya hace tiempo hacíamos referencia a Daily Color Scheme, un lugar donde nos daban esquemas de colores para poder usar en nuestros diseños (que por cierto, no se actualiza demasiado), ahora nos toca hablar de Kuler una aplicación similar creada por Adobe, la cual nos permite ver esquemas de colores, crearlos, bajárnoslos y modificarlos.
kuler.png
Me ha gustado mucho la forma en que mediante una rueda de colores podemos crear nuestro propio esquema, permitiéndonos elegir si queremos colores análogos, monocromáticos…
Kuler
Vía / Criterion

| |

Escritura el campos blob en MySQL y PHP

Muy buen artículo que explica cómo almacenar imágenes en campos blob usando MySQL y PHP, el post explica realmente cómo crear galerías de imágenes almacenándolas en campos blob. Yo personalmente no soy muy partidario de esta opción, cuando realmente se debería guardar la ruta de la imagen en el servidor y que el servidor web se encargue de enviar la imágen, ya que si no, lo que hacemos es hacer trabajar bastante a la BD.
De todas formas, el artículo puede sernos útil para saber como almacenar en este tipo de campos, porque aunque el ejemplo no sea del todo correcto, en alguna ocasión si que vamos a necesitar guardar datos en campos blob.
Muy bien explicado, añade conceptos básicos de protección por contraseña, actualización y borrado de imágenes, a parte de un par de consejos sobre los problemas que nos podemos encontrar con la capacidad máxima que se permite subir al servidor usando PHP.
PHP MySQL example: image gallery (blob-storage)
Vía / Good PHP Tutorials

|

Addons para desarrolladores e IE

IESi ya hace tiempo hablábamos de la posibilidad de bajarse Addons para IE7, ahora vamos a mencionar unos pocos que ayudarán a los desarrolladores web que usen IE.

  • Internet Explorer Developer Toolbar: desarrollado por Microsoft, nos permite navegar por el DOM, desactivar opciones de IE como el javascript o los pop-ups, remarcar tablas, capas y otros elementos para localizarlos de forma sencilla en la página, validación de CSS y XHTML, redimensionar el navegador y limpiar la caché.
  • Fiddler: permite capturar las peticiones HTTP de entrada y salida y depurarlas antes de que se reciban o envíen.
  • HttpWatch: igual que el anterior, pero con una interfaz más amigable e integrado directamente con IE.
  • IE Powertoys for WebDevs: desarrollado por Microsoft, válido para IE6 e IE7 aunque diga que lo es para IE5, permite ver el código fuente parcialmente mediante el menú contextual.
  • Inline Search: imita la fucnionalidad de búsqueda de Firefox en el IE.

Invaluable IE Addon Tools

Vía / dzone

|

Lógica de aplicación y plantillas mediante PHP

Cuando desarrollamos una aplicación web, algo muy importante es separar la lógica de la aplicación de la presentación. En el siguiente artículo, nos comentan como hacerlo mediante PHP y el sistema de plantillas Smarty.

Primero nos explica la direfencia entre la lógica de aplicación, la cual se encarga de las operaciones como acceso a base de datos, validación de formularios, de la lógica de plantillas, que es la que se preocupa únicamente de mostrar la información.

Dentro de la lógica de aplicación nos tenemos que ocupar de la inicialización y configuración de la lógica de plantillas:

<?php
$smarty = new Smarty();
$smarty->display('index.tpl');
?>

Y en la plantilla mostraremos la información:

<p>
Title: {$title|strtoupper}
Summary: {$summary|truncate}
</p>

Hay que tener cuidado de no cometer el error de en la plantilla modificar el formato del texto, por ejemplo quitarle espacios u otras cosas que corresponden a la lógica de aplicación.

Os recomiendo el artículo, porque viene muy claramente explicado, con ejemplos y nos puede ser de mucha ayuda.

Application logic versus template logic

10 reglas esenciales para depurar

Más consejos que siempre viene bien, algunos los conoceremos, otros simplemente los usaremos de forma automática y otros serán nuevos para nosotros. En este caso se trata de consejos para depurar nuestras aplicaciones.

  • Comprueba los datos: comprueba que los datos son los que se esperan. Una buena opción sería darle la funcionalidad al sistema de exportar los datos a un fichero de texto plano para poder comprobarlo mejor.
  • Comprende el sistema: leer el manual, seguir las instrucciones, compara tu código con los ejemplos que ofrecen, puede ayudarte a usar el sistema correctamente y no mandar datos que no son los correctos.
  • Hazlo fallar: para encontrar posibles fallos no hay nada mejor que hacerlo fallar a proposito. Si algo falla rara vez, puede ser algo bastante importante, no asumas cosas cuando intentes encontrar el problema, te puede hacer perder mucho tiempo.
  • Tómate tu tiempo: sacar conclusiones usando poca información nos puede hacer no encontrar el problema real, sino parchear un problema menor.
  • Divide y conquistarás: estrecha tu búsqueda, limita los sitios donde pueda darse el error, sigue el código hasta la zona más exacta donde pueda fallar.
  • Cambia cosas una a una: cuando encuentres varios errores, corrígelos uno a uno, para evitar encontrarte con otros errores, o que cuando algo falle por los cambios, no sepas por qué se ha producido.
  • Realiza una auditoría: da igual que parezca que todo funciona bien, sigue mirando los logs por posibles errores, por si aparecen casos que no habías visto antes.
  • Comprueba primero lo obvio: no asumas que tus ideas son correctas, cuestionate todo.
  • Pide ayuda: los test de caja negra dicen que quien debe testear la aplicación no debe ser quien la ha desarrollado, ya que muchas veces caemos en el error de pensar que algo en particular no va a fallar porque sabemos cómo funciona.
  • Si no lo corregiste, no está solucionado: las cosas no se arreglan solas, si no se reproduce de nuevo el error no quiere decir nada, el error sigue estando allí.

10 essential debugging rules

Vía / dzone