Extensiones de Firefox recomendadas para el desarrollo web

Soy usuario de Firefox desde sus inicios y cuando empecé a trabajar como desarrollador web en Caniatech, descubrí una gran cantidad de extensiones (la mayoría gracias a su lista de complementos favoritos) que permiten transformar este navegador en una maravillosa herramienta indispensable para cuando se está creando páginas/sistemas web (si fanáticos de Chrome, se que se puede hacer lo mismo con ese navegador). Así que aquí les dejo una lista de las extensiones que recomiendo instalar si trabajan en el desarrollo  (y tal vez un poco de diseño) web.

  • Firebug: para mi es el complemento mas importante e indispensable de esta lista. Esta herramienta permite: excelente análisis y modificación en tiempo real del: código HTML, clases de estilos, permite ver y correr paso a paso (debug) del código Javascript, mostrar la cantidad de errores JS, entre otros.
  • FireQuery: agrega compatibilidad entre jQuery y Firebug, se pueden observar funciones asignadas a ciertos elementos del markup, entre otros.
  • FirePHP: agrega compatibilidad con php  y permite a los desarrolladores imprimir datos en la consola de Firebug, muy útil cuando se esta creando aplicaciones con Ajax.
  • PixelPerfect: otro complemento compatible con Firebug, el mismo, permite sobreponer imágenes en cualquier página, con la idea de comparar el sitio que se está desarrollando respecto al diseño original,útil cuando se estan escribiendo las clases de estilos y se desea lograr una apariencia exacta al diseño dado.

Firebug dentro de Firefox con el plugin de jQuery

  • Html Validator: permite chequear si las páginas web cumplen el estándar XHTML/HTML, necesario para comprobar que tenemos un buen markup Html, evitando futuros problemas de renderizado y permitiendo obtener un mejor SEO.
  • Messure it!: agrega una regla virtual al navegador para medir la distancia exacta (en pixels) de una distancia o área, muy usada en la etapa de diseño y escritura del CSS (sobre todo si se combina con PixelPerfect.
  • Dummy Lipsum: permite generar extractos del texto Lorem ipsum e insertarlo en cualquier campo de un formulario, pues como todo profesional de desarrollo web, sabemos lo feo el uso de texto al azar para probar campos de texto.
  • Lazarus Form: evita la pérdida de los datos dentro de un formulario, útil cuando estamos probando un formulario, rellenamos cada uno de los campos pero algo sale mal y se pierde esa info, pues con este complemento no volverá a suceder lo mismo.
  • Wappalyzer: excelente complemento que informa sobre las tecnologías usadas en un sitio, cuando entras a una página, muestra unos íconos en la barra de estado de los programas o librerías usadas (ejem, jQuery, WordPress, Google Analytics, etc)

Greasemonkey, Html Validator (icono verde) y observer como muestra para este blog las tecnologías que uso: WordPress, Google Analytics y Jquery

  • Web Developer: un gran conjunto de herramientas y opciones a utilizar cuando se desarrolla un sitio web, permite ver errores de javascript, activar o desactivar: estilos, plugins, javascript. Posee una barra acceder a las herramientas rápidamente, permite ocultar/mostrar tablas, imagenes, fondos, etc. Indispensable para cualquier desarrollador web.
  • ColorZilla: permite obtener el color de cualquier pixel de la página, útil para tener el color en hexadecimal de una imagen y escribirlo en el CSS.

Bueno, estos son los complementos mas utilizados por mi cuando creo páginas, si creen que faltan alguno y desean recomendarlo, no duden en comentar. Ademas, si les interesa que complementos uso a diario, pueden ver mi lista.

Google libera el codec de vídeo VP8

Ayer en Google I/O se anunció la liberación del codec VP8 bajo licencia BSD (Código Abierto) y sin regalías (no van a cobrar por su implementación), algo muy maravilloso para aquellos que apoyamos una Internet abierta y estandarizada, pues ahora se cuenta con un codec respaldado por varias empresas y usable para HTML5.

Actualmente, se está desarrollando HTML5 que será la nueva versión de la web, entre sus mayores innovaciones es el uso de la etiqueta <video>, permitiendo al navegador mostrar un vídeo sin usar una tecnología externa (como flash), permitiendo teóricamente mayor velocidad y mas portabilidad. Para reproducir estos videos, se necesita algo llamado codec que descodifica la información de los archivos y los transforma en video, en estos momentos, existen dos codecs: H.264 y Ogg/Theora. El primero es el mas óptimo de los dos, tiene mayor calidad y menor consumo de ancho de banda, pero tiene una gran limitante que es cerrado y exigue una cantidad de dinero anual para implementarlo (creo que piden 5 millones de dólares para ser implementado en un navegador), causando que compañias pequeñas como Mozilla y Opera les cueste mucho pagar una regalía para usar este codec, además, en el caso de Mozilla no lo usan porque va en contra de su filosofía de apoyar por una web abierta.

El segundo, es un codec libre permitiendo ser usado en todos los navegadores y no require pagar por ello, sin embargo no ha tenido mucho apoyo porque es una oportunidad para algunas compañías apoyar el uso de H.264 para así sacar la competencia del camino, por ello, Microsoft y Apple han anunciado apoyar solamente este codec y han decido convertilo en estándar con el fin de que Mozilla y Opera (claro, también estan las razones de superioridad con respecto al otro) no puedan implementarlo, convirtiéndolos en navegadores con menos funcionalidades. Pero, Google en el mes de febrero compró la empresa On2 que fabricaba el codec VP8 (superior en calidad y ancho de banda con respecto a los mencionados anteriormente), mucha gente inclusive la Free Software Foundation se contactó con Google para la liberación del mismo y que se usara en Youtube para darle un mayor impulso, y pues eso fué lo que ocurrió ayer en el Google I/O.

Ahora se cuenta con un tercer codec superior a los demás, de código abierto, sin costos de licenciamiento y usado en Youtube (la página web con mas vídeos del mundo). Ahora falta esperar que ojalá sea aprobado por la W3C como estándar para la web, de ser así, contaremos con una Internet abierta para HTML5.

Hace 1 año en esa fecha: Rap sobre los estándares web

Hace 2 años en esa fecha: A Steve Ballmer le tiran huevos en una charla

Excelentes 30 tips de desarrollo web para principiantes

NetTus+ publicó un artículo muy interesante sobre 30 consejos que se deben seguir para el desarrollo web, todos son excelentes y altamente recomendados para cualquier persona interesada en esta área o que ya lleve muchos años trabajando en ella. Estos consejos estan dirigido principalmente a principiantes para que desde los inicios lleven a cabo buenas prácticas, sin embargo, recomiendo a cualquiera leerlos porque aquellos que tenemos tiempo en el desarrollo web, aún conservamos malas prácticas (después de este artículo pienso eliminar casi todas) y es recomendable conocer cuales son.

El artículo está en inglés en el siguiente enlace: 30 HTML Best Practices for Beginners

Hace 4 años en esa fecha: La MacBook Negra

Pequeños tips para mantener seguro tu blog

Siempre he sido muy cuidadoso con la seguridad de este blog, sin embargo, hace unos días sufrí un ataque a la base de datos del blog por un descuido que tuve y no me di cuenta de ese problema durante los 4 años que tengo usando WordPress como software para manejar el blog de este sitio. Pero todo ya fue solucionado, elevé mucho mas los niveles de seguridad y solo se perdieron los comentarios de 1 semana, por esta razón, me animé a comentarle sobre tips que deberían seguir todos para evitar posibles ataques a sus blogs:

  • Siempre tener presente que puedes ser víctima de un ataque, la mayoría de la gente piensa que no puede ser víctima de los ataques porque su blog no contiene temas interesantes, temas que ofendan a otra gente, temas con posiblidad de venta comercial entre otros. Sin embargo, es el peor error ya que los crackers simplemente se enfocan en la parte tecnológica del blog y no les importa el tema del mismo, si el blog tiene un fallo, buscarán explotarlo y atacarlo, punto.
  • La mejor manera para empezar a tener un blog seguro consiste en usar buenas contraseñas para la administración (también para la base datos y cuentas FTP), mis recomendaciones son usar: letras, numeros, mayúsculas y signos especiales. En vez de usar una palabra, usemos una frase favorita cambiando las vocales por números, la primera letra de cada palabra en mayúscula eliminando los espacios como se observa en el siguiente ejemplo: M3Gust431bl0gd3Sk4t0x (me gusta el blog de skatox). Si son mas paranoicos, simplemente escriban la frase dos veces y aumentarán exponencialmente la posibilidad de robo, además es recomendable: cambiarla cada 6 meses, evitar anotarla en algún lado, darla a conocer a otra persona, usarla en sitios o computadoras públicas y aceptar que el navegador la guarde para evitar escribirla cada vez que deseemos escribir un artículo.
  • Estar atentos a los cambios de seguridad con las nuevas versiones del software del blog, este punto lo descubrí recientemente y es muy importante en sitios que llevan mucho tiempo en línea, generalmente mucho software para gestionar blogs (ejem, WordPress) agrega con el tiempo nuevas opciones de seguridad,las cuales muchas veces no se activan por defecto, es por ello, estar siempre atento a estos cambios para activarlos. Ademas, en los sitios con mucho tiempo en línea, se suele conservar los mismos archivos de configuración desde su instalación inicial, siendo obsoletos después de unos años al faltarles parámetros introducidos en nuevas versiones.
  • Evitar exceso de código de terceros: plugins, código HTML/Javascript copiado de otros sitios, entre otros. Pues pueden introducir nuevas vulnerabilidades y no tener soporte de actualizaciones, es decir, no hay garantía de corrección de fallas en los mismos. Si tenemos instalados plugins o código de terceros, también se debe visitar periódicamente estas páginas en busca de actualizaciones o corrección a problemas existentes.
  • Tratar de evitar acceder a la página administrativa desde sitios públicos (como un punto inalámbrico de un restaurante), desde cibercafes o computadoras de uso publico, tratar de cifrar las conexiones accediento mediante Https o SFTP/FTPS para el caso de transmición  de datos. Con esto evitarás que intercepeten tus datos, sean manipulados o extraidos.
  • Si tienen el blog alojado en un servidor propio, chequear la correcta permisología de los archivos, revisar los archivos .htaccess, evitar que las carpetas de configuración y de administración sean indexadas por los motores de búsqueda (usando el robot.txt), chequear que se esté usando las últimas versiones de los servicios y si es posible, escribir un buen firewall para controlar aún mas el acceso al servidor.

Con estos tips es suficiente para conseguir una excelente seguridad en tu blog, en unas próximas semanas escribiré detalles para hacerlo con WordPress. Recuerden siempre estar atentos a todo detalle para evitar ser atacados.

Hace 4 años en esa fecha: Nuevo Diseño de Hotmail (otra vez)

El Efecto Genbeta

Hace unos días, mi blog tuvo la oportunidad de aparecer en Genbeta. Fue un gran momento para mi porque soy lector de ese blog hace unos años y además es un blog reconocido en el área de la tecnología. Obviamente ese suceso hizo que tuviese muchas visitas y cuando observé mis estadísticas, hubo un pico alto ese dia, casi se duplicaron las visitas diarias con un ligero aumento de las visitas luego de eso.

El efecto Genbeta

Tomando en cuenta que fue por una noticia no muy popular o comercial (era sobre el PS3 pero a una minoría solo le interesa tener linux en él), no me imagino ahora como será recibir un efecto barrapunto o efecto slashdot sobre una noticia popular y recibir los cientos de miles de visitas en tan solo unas horas.

Ojala en unos años se vuelva realidad, para ello, solamente puede ser posible con la ayuda de ustedes los lectores, sigan visitando y recomendando esta página a quien crea que les guste.

Hace 1 año en esa fecha: Duke Nukem Forever R.I.P (1997 - 2009)

Hace 2 años en esa fecha: Documentales de Metal Gear (Parte 1)

Hace 4 años en esa fecha: Gnome 2.14 y Deskbar