La instalación es sencilla, se realiza mediante el Web Launcher de Microsoft y con tan solo seleccionar WebMatrix, se instalarán sus dependencias correspondientes: SQL Server Compat, IIS (uno básico si no tiene una edición de Windows con IIS incluido) y otras cosas ahí. La interfaz utiliza el ya famoso Ribbon (la misma de Office 2k7 y la mayoría de programas de Windows 7) donde mediante pestañas veremos una vista general del proyecto, los archivos en el proyecto junto al editor, la vista de Base de Datos para crear tablas y realizar consultas y la de SEO o como yo la llamaría: vista de validación de código.

Editor HTML de WebMatrix

La vista de archivos, trae las típicas funciones de cualquier editor HTML junto a controles para iniciar/reiniciar/detener los servicios web y de base de datos. El editor es muy parecido al de Visual Studio pero no se si fué por falta de configuración o porque no lo soporta, no me completó codigo ni HTML ni Javascript cosa que me pareció muy desfavorable pues casi todos los editores existentes lo hacen por defecto, sin embargo, puedes lanzar Visual Web Developer (supongo solo si lo tienes instalado) para realizar estas operaciones pero ya pierde el sentido el uso de esta aplicación.

Vista de Base de datos de WebMatrix

La vista de Base de Datos es una versión reducida de SQL Server Management Studio, permite crear tablas, relaciones, editar las propiedades de los campos, etc. La desventaja es que usar SQL Server Compat y pues bueno, para páginas pequeñas sirve pero seria mejor usar o que detectara SQL Express, pero para el fin de esta herramienta es suficiente esta versión de Base de Datos.

Validación SEO de WebMatrix

La vista/opción que me llamó la atención fue la de validación de SEO, el cual realiza un análisis del código que has escrito en busca de errores del estándar web y posibles malas prácticas donde se afecte tu SEO. Me impresionó que ahora Microsoft apoye esto luego de varios años intentando crear su propio estándar, supongo que esta estrategia les permite luchar contra la competencia y con el futuro lanzamiento de Internet Explorer 9 (prometiendo gran soporte para los estándares web establecidos actualmente), les permite a sus clientes crear páginas que se vean bien en este navegador (y obviamente en el resto de navegadores)

Realmente, WebMatrix es una herramienta sencilla pero completa, la recomiendo para aquellos que se estan iniciando en el desarrollo web y no quieran inicialmente aprender mucho sobre ello, su interfaz es sencilla, incluye las herramientas mínimas para trabajar, trae unas plantillas iniciales (si tienes Internet) y te da la posibilidad de migrar ese proyecto a Visual Studio.

Sin embargo, si quieres aprender bastante sobre desarollo web y/o no deseas utilizar herramientas propietarias (o no tienes Windows), yo recomiendo instalar un servidor WAMP (LAMP si usas Linux) junto a Aptana ó Netbeans, ya que con un poco mas de esfuerzo podrás crear aplicaciones mas poderosas, ademas, a diferencia de WebMatrix estas son multiplataforma y de código abierto.

• 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.

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

Lo que hizo esta gente es crear un traductor de PHP a C++, donde luego se compila a lenguaje de máquina utilizando G++ (el compilador GNU de C++), permitiendo “migrar” aplicaciones PHP a lenguaje de máquina y ejecutarse con mayor velocidad, obviamente se pierde las voluntades del lenguaje dinámico e interpretado  junto a la eliminacion de algunos comandos que no se pueden adaptar a C++, como el caso de eval() que evalúa código PHP en tiempo de ejecución, el uso de $$ y otras funciones mas.

En el screencast del lanzamiento su creador comentó que este proyecto no busca sustuir el entorno de ejecución de PHP ni hacer que la gente compile todo a C++, sino que en ambientes de alta demanda, utilizar PHP con servidores web tradicionales en el momento de desarrollo y luego cuando se esté listo para producción compilarlo en C++ y obtener mayor rendimiento.

Cabe destacar que HipHop PHP también es un servidor web para servir estas páginas generadas y que se esta trabajando en un interprete para PHP, sin embargo es muy temprano para dar opiniones ya que apenas hoy se hizo el anuncio y liberación del codigo en Github , esperemos a ver que ofrece el futuro del proyecto de código abierto.

Mas informacion: http://developers.facebook.com/news.php?blog=1&story=358

Entre las principales caracterí­sticas que posee son:

• Utiliza el script de jQuery de WordPress por lo que no sobrecarga las páginas.
• Sencillo y fácil de configurar.
• Permite mostrar o no la cantidad de artí­culos por año o mes.
• Permite mostrar o no los artí­culos que hay en cada mes.
• Seleccionar los efectos de jQuery.
• Carga el script y lo ejecuta al final de la carga de la página, evitando el retraso de la carga de otros elementos.
• Permite seleccionar el sí­mbolo de la viñeta.

Sé que es sencillo y no ofrece mucho, pero dependiendo del uso y si pueden colaborar con donaciones podré dedicarle mas tiempo con el fin de agregar mas caracterí­sticas configurables. Por ahora, pues descárguenlo e instálenlo, cualquier sugerencia o corrección pueden hacerlo por mensaje privado y/o un comentario en esta entrada.

La licencia del mismo es GPL2 y pueden descargarlo desde el siguiente enlace:

http://skatox.com/descargas/jquery-archive-list-widget.zip

Si les gustó mucho el widget y desean colaborar con el desarrollo de futuras versiones pueden ayudar con una donación libre usando el siguiente botón

Para ello, existe un excelente plugin para firefox llamado HTML Validator, no se porqué no está en la página oficial de extensiones de firefox, sin embargo pueden entrar a la página del plugin y descargarlo para su arquitectura y sistema operativo. (posee soporte para Windows, Linux, FreeBSD,OpenBSD para 32 y 64 bits)

Al instalarlo, observarán en la esquina derecha inferior, un sí­mbolo verde si la página aprueba el estándar o rojo si ocurre lo contrario. Al hacer clic sobre él, se abrirá una ventana mostrando el código fuente de la página junto a la lista de errores, lo interesante es que al leer sobre cada error, se explica como deberí­a hacerse correctamente a través de ejemplos para poder corregir el error posteriormente y no volverlo a cometer.

Ventana del plugin html validator

Es muy importante si eres desarrollador web, seguir el estándar w3c ya que garantizarás que tus trabajos sean visibles de forma correcta en el 95% de los navegadores (Internet Explorer es el único navegador que no respeta esto y poco a poco le ha tocado adaptarse al estándar) y darás mayor calidad a tus páginas.

En estos momentos parece gracioso comentar como en una época no tan lejana, los buscadores (recuerdo que Yahoo era así­) eran mantenidos por personas, donde eran contratados para navegar todo el dí­a buscando páginas web para agregar al í­ndice del buscador (Recuerdo haber mandado por ahi en el 1999 mi primera página personal, la ascendete de skatox.com, hospedada en el extinto Geocities). Hoy en dí­a,serí­a imposible hacer eso, pero gracias a los robots y sus algoritmos secretos, los buscadores pueden indexar muchisimas páginas por segundo y darnos información de ellas casi instantáneamente.

Bueno, lean el artí­culo http://www.searchenginejournal.com/search-engine-history/13152/ y si les gustó, o desean hablar del tema, comenten aquí­ en el blog.

El método a usar va a ser una moficación del tema, especí­ficamente para la página de registro de usuario (user/register), para ello utilizaremos una serie de cosas que nos provee Drupal. Lo que haremos es editar el archivo template.php que se encuentra dentro de la carpeta de nuestro tema y agregar la siguiente función:
function ELNOMBREDETUTEMA_theme($existing, $type, $theme, $path) {
return array(
// tell Drupal what template to use for the user register form
'user_register' => array(
'arguments' => array('form' => NULL),
'template' => 'user-register', // this is the name of the template
),
);
}

Recuerda cambiar ELNOMBREDETUTEMA por el nombre del tema que estas usando y que corresponde el archivo template.php, esta función lo que hará es que al entrar a la página user/register obliga a usar el template con el nombre de user-register.tpl.php. Bueno ahora lo siguiente que haremos es crear el archivo user-register.tpl.php de acuerdo a nuestras necesidades. En el caso que voy a poner aquí­ es un registro sencillo que imprime: el texto de registro, el nombre usuario, el correo electrónico a usar, un campo personalizado del módulo profile, los campos ocultos y obligatorios del formulario el boton de enviar.

<div id="registration_form">
<?php print drupal_render($form['user_registration_help' ]); ?>
<div class="field">
<?php print drupal_render($form['account']['name']); ?>
</div>
<div class="field">
<?php print drupal_render($form['account']['mail']); ?>
</div>
<div class="field">
<?php print drupal_render($form['category']['profile_field']); ?>
</div>
<div class="field">
<?php
print drupal_render($form['form_id']);
print drupal_render($form['form_build_id']);
?>
</div>
<div class="field">
<?php print drupal_render($form['submit']); ?>
</div>

Ya con eso solo les falta jugar y modificar las cosas a su antojo.

Cada vez, se observa como las páginas mas reconocidas utilizan Javascript para hacer páginas complejas y con mejor apariencia: ejem, Gmail, Facebook, Google Docs, Youtube, WordPress, etc. Y el uso de Flash en ellas es absolutamente nulo, bueno en el caso de Youtube, solo es usado para reproducir ví­deo, sin embargo, con HTML 5 no necesitaremos el plugin de Flash para ver ví­deos en Youtube.

Con el nuevo estandar de HTML, necesitaremos mucho menos a Flash ya que con el soporte etiquetas como audio, video y canvas, teóricamente se podrá hacer todo lo que se podí­a hacer con flash. Cosa que ha  asustado a Adobe y le ha hecho mejorar sus tecnologí­a y dar soporte a mayor cantidad de dispositivos, esperemos que sucederá de esto.

Creo que Flash nunca desaparecerá del todo, pero si se disminuirá muchisimo su uso en la web, al igual que el uso de Silverlight y JavaFX.  Tal vez falte mucho tiempo para que HTML 5 sea usado de forma masiva, pero en el mundo de la informática todo esto sucede rápidamente, ademas, HTML5 y Javascript seran estandar, abierto y soportado en casi todos lados.

• Si quieres probar algunas tecnologí­as de HTML  5, puedes entrar a: http://htmlfive.appspot.com

• Y si quieres saber porque no es bueno usar Flash lee esto: http://www.churbayportillo.com/blog/2007/11/05/flash-cinco-razones-para-no-usarlo/

Recuerda que debes tener un navegador que soporte esta tecnologí­a como Firefox, Safari, Chrome u Opera.

Si les gustó, les recomiendo entrar a la página The SEO Rapper y observen mas ví­deos de este grandioso artista geek.