martes, 8 de abril de 2008

Videotutoriales: curso completo de Ajax online y gratis

Ya se encuentran disponibles en revver todos los videotutoriales del curso de Ajax creado por el profesor Jesús Conde.

El curso consiste en 20 videos que van desde lo más básico hasta los conceptos más avanzados.


Descripción de los videos

Video 1 - Primer videotutorial del curso de Ajax y también último del Curso de XHTML, CSS y Javascript. En él se hace un repaso a las distintas tecnologías web que se usan en la elaboración de las aplicaciones llamadas Ajax. Se centra especialmente en el tema de las HTTP Request y XML: HTTP Request y Response; Introducción a XML; Fundamentos de XML; Estructura de un documento XML; Document Type Declaration.

Video 2 - Detalle de la anatomía de una aplicación Ajax. ¿Para qué necesitamos Ajax? Diferencias de las interacciones cliente-servidor en una aplicación tradicional y una aplicación Ajax; Aplicaciones web funcionando como aplicaciones de escritorio; Las partes constituyentes de Ajax; El objeto XMLHTTPRequest; Hablar con el servidor; Código del lado servidor; Procesar las respuestas del servidor; Componentes de una aplicación Ajax trabajando juntos.

Video 3 - El Objeto XMLHTTPRequest. Los Objetos en Javascript; Crear una instancia de un objeto; Crear el objeto XMLHTTPRequest; Diferentes reglas para diferentes navegadores; Una solución para todos los navegadores; Uso de try...catch; Métodos y propiedades del Objeto XMLHTTPRequest; El método open(); El método send().

Video 4 - Bloques clave en la elaboración de una aplicación basada en Ajax. Modo en el que se establece una conversación con el servidor. Enviar la petición al servidor; Solucionar el problema de la caché del navegador; Monitorizar el status del servidor; La propiedad readyState y su uso junto con la propiedad onReadyStateChange; Uso del código de status del servidor; Uso de las propiedades status y statusText. La función de respuesta.

Video 5 - Último eslabón en la cadena Ajax; Como usar los datos devueltos por el servidor; Las propiedades responseText y responseXML; Uso de propiedades del DOM Javascript; El método getElementsByTagName(); Analizar la respuesta XML; Informar al usuario de la evolución de la petición al servidor; El método getElementById().

Video 6 - Creación de dos primeras aplicaciones. La Interface HTML; El código Javascript del lado cliente; La instancia del objeto XMLHTTPRequest; La petición al servidor; Nuestro script PHP del lado servidor; La función de respuesta; Emplear gestores de eventos; Informar al usuario; Creación de una segunda aplicación y comparación entre ambas; Resumen de temas a tratar en el resto del curso.

Video 7 - Como crear aplicaciones asincrónicas sin usar XML. Devolver datos como texto; La propiedad responseText; Usar el texto de retorno directamente en elementos de página; Incluir HTML en responseText; Formateo complejo de datos; Uso de métodos String de Javascript; Introducción a Ahah (Asynchronous HTML And HTTP). ¿Para qué usar Ahah en lugar de Ajax?; Crear una librería reutilizable; Aplicar la librería en distintos proyectos.

Video 8 - Trabajar con los datos devueltos como XML. La propiedad responseXML; Más métodos DOM de Javascript; Propiedades y métodos de nodo y métodos de documento; Crear un lector RSS con Ajax; Uso de métodos DOM en la función de respuesta; El código del lado servidor.

Video 9 - Como crear y utilizar una librería Ajax. Ventajas del uso de librerías; Crear instancias del objeto XMLHTTPRequest; Peticiones HTTP GET y POST; La función de respuesta; Uso de la librería.

Video 10 - Uso de la librería prototype.js. ¿Librería, framework, toolkit? La función $(); La función $F(); El objeto Form; La función try.these(); Usar el objeto Ajax de prototype.js; Ajax.Request; Ajax.Updater; AjaxPeriodicalUpdater.

Video 11 - Uso de RICO, framework para la creación de aplicaciones web mejoradas basadas en Ajax. Introducción a RICO; Usar RICO en nuestras aplicaciones; Crear un Widget Acordeón; El AjaxEngine de RICO; Herramientas de interface de RICO; Ejemplo de interface arrastrar y soltar; Efectos cinemáticos de RICO.

Video 12 - JSON (JavaScript Object Notation) en profundidad. ¿Qué es JSON?; Arrays literales; Objetos literales; Mezclar literales; La sintaxis JSON; Codificación/decodificación con JSON; JSON versus XML; Herramientas JSON del lado servidor; JSON.php

Video 13 - Elaboración de aplicaciones completas con la creación de un sistema de autosugerencias para cajas de texto. Funcionalidades de la aplicación: typeAhead; lista de sugerencias; Controles de teclado; Ocultar sugerencias. El código HTML; La tabla de la base de datos; La arquitectura de la aplicación; Las clases; El control AutoSuggest; Implementar la funcionalidad typeAhead; El método typeAhead(); El método AutoSuggest.

Video 14 - Finalizar la aplicación de autosugerencias. El método AutoSuggest(); Manejar eventos de teclado; Mostrar múltiples sugerencias; Posicionar la lista desplegable; Añadir y mostrar sugerencias; Añadir soporte de teclado para la lista desplegable; El método init(); Soporte para escritura rápida; El proveedor de sugerencias; Componente del lado servidor; Componente del lado cliente.

Video 15 - Creación de un sistema de doble validación de formularios Ajax y PHP. Estructura de la aplicación, sistema Firts-in, Firts-out para tratar con la cola de espera; Uso de doble validación; Análisis e implementación de la aplicación.

Video 16 - Creación de una parrilla de datos Ajax, formateada mediante el uso de XSLT y que permite moverse entre las distintas páginas de la parrilla y editar los datos de la tabla por parte del ususario de modo asincrónico sin necesidad de actualizar nunca la página web. Implementación de la parrilla Ajax usando XSLT de lado del cliente; Estructura de la aplicación; Funcionalidad del lado servidor.

Video 17 - Creación de un lector RSS. Sindicación de contenidos y trabajo con RSS; La estructura de un documento RSS; Crear un lector RSS basado en Ajax; Uso de Arrays asociativos; Dar formato con XSLT.

Video 18 - Como usar la extensión para Dreamweaver MX AJAX Toolbox. Construir un sitio web completo; Construir la estructura del sitio; Usar los paneles y ventanas de diálogo de Ajax Toolbox; Añadir enlaces y tooltips Ajax; Personalizar los paneles de la página maestra.

Video 19 - Extensión para Dreamweaver MX AJAX Toolbox. Creación de un completo catálogo musical online. Crear el sitio web, la base de datos y enlazarlos. Planificar la aplicación; Construir el Sito Ajax "dinámico" y su estructura; Añadir nombres de artistas en el panel menú; Crear la página de detalles artistas; Crear la página de detalles álbumes.

Video 20 - Uso de los distintos "Widgets" de MX AJAX Toolbox. Tabset; Accordion; Caja de diálogo; Galería de fotos, Pop-up; Texto colapsable. Termina viendo como crear un WebService con el Asistente para WebService y el uso de DragAndDrop.

jueves, 13 de marzo de 2008

PureEdit: CMS "puramente simple"

PureEdit: CMS 'puramente simple'

PureEdit es el primer CMS (PHP/MYSQL) que simplifica dramáticamente el back-end de desarrollo de tu sitio web dándote pleno control de la interfaz de usuario y diseño de la programación. Básicamente realiza un formulario de acuerdo a tu tabla de la base de datos similar al scaffold de Rails.

El 10 de Febrero 2008 fue publicado por Michael Dick bajo la licencia GPL (General Public License) esto quiere decir que lo podemos utilizar, mejorar y compartir.

Si quieres empezar a darle leña a esta herramienta te recomiendo que visites los siguientes links:

- Videotutoriales de como crear un blog en 9 minutos y más

- Blog del desarrollador Michael Dick

- Foros de la comunidad

- La documentación (actualmente solo disponible en Inglés)

Vía | Bedomax
Enlace | PureEdit

También te puede interesar:
- CodeIgniter, Framework PHP

viernes, 4 de enero de 2008

Andanza, crea una versión móvil de tu sitio web en minutos

Andanza, crea una version móvil de tu sitio web en minutos

Andanza es un servicio web “movilizador” de blogs simple y gratuito que, en cuestión de minutos, hace que un blog sea accesible desde cualquier dispositivo móvil (PDA, teléfono móvil, smartphone, etc).

Andanza.com ofrece, además, la posibilidad de “personalizar” tu blog móvil como mejor te guste: la imagen de cabecera, los colores de las fuentes, el fondo, etc. Así mismo, pone a tu disposición una serie de plugins que ayudarán a mejorar las prestaciones de la versión móvil de tu blog.

Para la movilización de blogs, Andanza utiliza esmeroPlatform, una plataforma de estándares abiertos, que facilita el acceso a los contenidos y aplicaciones web, a partir de una filosofía: "anywhere, anytime, anydevice".

El proceso es rápido y sencillo, y además los resultados son bastante buenos.

Enlace | Andanza

También te puede interesar:
- Google Mobilizer, adapta sitios web a dispositivos móviles
- Jagango, crea tu sitio web móvil en minutos y de forma online
- Mofuse, crea una versión para móviles de tu sitio en minutos y de forma online

Firefox 3, cinco mejoras que te encantarán

Ya se puede descargar la Beta 2 de Firefox 3, y entre las novedades que incluye se pueden destacar algunas que seguro que te enamorarán.

1- Transferencias directas más fáciles: Mientras que el más viejo encargado de las transferencias directas era absolutamente útil, Mozilla ha hecho algunos buenos retoques en la nueva versión. Ahora no sólo enumera el nombre de fichero, sino que además nos muestra la URL de donde fue transferido, e incluye un icono que lleva a la información sobre cuando y donde se transfirió. (la eliminación del link, ahora tiene hacerse con botón derecho para suprimir un listado).

Pero las nuevas y buenas características no acaban ahí, ya que antes cuando estabas descargando un archivo y se bloqueaba o “colgaba” el navegador había que reiniciar todo de nuevo. En cambio con la nueva versión de Firefox, esto no ocurre, ya que tras iniciar de nuevo el navegador, el sólo retomará la transferencia donde la dejó, como si no hubiera sucedido nada. Podéis hacer la prueba cerrando la aplicación firefox.exe durante una transferencia directa.

2- Una barra de direcciones mejorada: Mozilla también ha realizado mejoras en la función “Autocompletar” de la barra de direcciones, y hay que decir que es algo impresionante útil. En la versión Beta 2 de Firefox 3, el resultado de “Autocompletar” no sólo ofrece una lista de direcciones URL que se han visitado, sino que ahora también incluye las dirección de favoritos.

También se muestra la dirección URL con un texto más grande y más fácil de leer, por lo que será más sencillo encontrar aquella web donde estuviste.

3- Un organizador idóneo de marcador: Hablando de marcadores, el historial y marcadores antes iban en barras independientes y los administradores han sido reemplazados,o, en su lugar, aumentados por un único espacio, que utiliza un formato familiar al árbol del navegador de Windows . Ofrece una forma sencilla y rápida para leer y administrar el historial y los marcadores, y va incluida la capacidad para editar un nombre de un marcador, su ubicación y las etiquetas, todo esto en lugar de tener que entrar en el cuadro de propiedades (algo muy pesado en la versión 2 ).

4- Registro de marcadores más fácil: Hay, de hecho, muy pocas características nuevas que implican a los marcadores, eso si, algunas son pequeñas pero muy útiles. Por ejemplo, ahora se puede crear rápidamente un marcador haciendo doble clic en una estrella que aparece en la parte derecha de la barra de direcciones. También se pueden agregar etiquetas a los marcadores, que podría trabajar bien como una herramienta de la organización.

También hay nueva carpeta denominada Smart Bookmarks en la barra de herramientas. Ofrece tres categorías de los marcadores: Páginas visitadas más recientemente y etiquetas recientes que se rellena automáticamente durante el transcurso de las sesiones web. Como la mayoría de las personas, tengo una serie de sitios que visito con regularidad, y ahora puedo ver cómo algo como la lista de páginas más visitadas; podría resultar útil como un recurso para mis sesiones diarias. (Podría, por supuesto, crear mi propia carpeta para estas swebs, pero es mucho más fácil dejar que Firefox lo haga).

5- Una mejor administración de memoria: Si eres seguidor de Firefox, y si ha habido veces que has considerado volver a Internet Explorer debido a los problemas que tenía Firefox con el empleo de memoria. Había momentos en los que resultaba frustrante ver como el Firefox llegaba a utilizar 200Mb de ram. Y más frustrante todavía cuando Mozilla no reconocía un problema de consumo de memoria.

Si la has probado nos puedes comentar las tuyas.

Vía | Incubaweb 2.0
Fuente | Information Week
Enlace | Firefox 3 Beta 2

También te puede interesar:
- Mozilla Weave, nuevo servicio de sincronización
- Firefox 3 más cerca de HTML 5

SEO vs SEO 2.0, comparando diferencias

SEO vs SEO 2.0, comparando diferencias

Con el auge de las redes sociales, que en los medios de comunicación se lo conoce como web 2.0, y con los cambios que Google ha introducido en sus algoritmos en este año para valorar páginas webs, ahora ya no se puede hablar solamente de SEO (Search Engine Optimization) en el sentido clásico. Es decir, concentrarse en palabras claves, metatags, conseguir una gran cantidad de enlaces entrantes, etc.

Justamente SEO 2.0 ha publicado una lista muy interesante donde compara 15 diferencias del SEO y SEO 2.0.

A continuación la traducción del artículo:

SEO

SEO 2.0

Generación de enlaces entrantes de forma manual, usando intercambios, catálogos, pagando por enlaces

Generación de enlaces entrantes mediante acciones como blogging, escribiendo contenidos únicos, generando link-baiting, socializando.

Optimización on-page para bots de los buscadores, por ejemplo repitiendo títulos, palabras claves, etc.

Optimización on-page para los usuarios, por ejemplo colocando títulos provocativos.

Competición: Tu compites con otros para aparecer en el top 10 de los resultados de Google para palabras claves especificas.

Cooperación: Tu cooperas con otros bloggers votando por ellos en redes sociales, blogs, etc., esperando que ellos también te enlacen.

Trueque: Si tú me das un enlace y yo te doy otro.

Dar: Yo te enlazo independientemente de que tu también me des un enlace, pero en la mayoría de los casos tu también me enlazarás.

Ocultamiento: No estamos haciendo SEO, no podemos mostrar nuestra lista de clientes.

Abierto: Bienvenidos los clientes nuevos, estamos orgullos de trabajar con ellos.

Palabras claves

Etiquetas

Optimización para enlaces

Optimización para tráfico

Clicks, impresiones, visitas

Conversiones, retorno de la inversión, marca

DMOZ

del.icio.us

Principales fuentes de tráfico: Google, Yahoo, MSN.

Principales fuentes de tráfico: StumpleUpon, redes sociales de noticias, blogs.

Comunicación en una sola dirección

Dialogo, conversación

De arriba hacia abajo

De abajo hacia arriba

Antidemocrático, quien paga más está en la parte superior.

Democrático, quien responde a la demanda popular está en la parte superior.

50% automatizado

10% automatizado

Tecnocrático

Emocional


Me parece que esta lista muestra a cabalidad cuales son las diferencias entre el posicionamiento clásico y el de la web 2.0. Pero esto NO significa, como se ha estado comentado últimamente en muchos foros y blogs que la profesión del SEO ha muerto. Por el contrario, ahora se han abierto muchas más posibilidades y perspectivas para el posicionamiento de proyectos webs: los clásicos, que todavía seguirán existiendo por bastante tiempo y los de la web 2.0.

Vía | Blog de Dr. Max Glaser
Fuente | SEO 2.0

Project2Manage, administrador de proyectos online

Project2Manage, administrador de proyectos online

Project2Manage es un gestor de proyectos online que nos permite administrar / organizar nuestros proyectos de forma fácil, rápida y bien organizada. Probablemente se transforme en uno de los principales competidores de BaseCamp.

Entre sus principales características Project2Manage nos permite:

  • Asignar distintos niveles de autorización para clientes y usuarios
  • Administrar nuestros proyectos desde cualquier lugar
  • Cantidad de proyectos ilimitados
  • Administrar nuestras tareas por medio de To-Do-List

Con Project2Manage podremos mantener nuestros proyectos bien organizados y hacer exhaustivo siguimiento de ellos. Y un detalle muy importante: es un servicio totalmente gratis.

Vía | Freak Group
Enlace | Project2Manage

SplashUp, editor de imágenes online

Splashup, editor de imágenes online

Splashup es uno de los mejores (si no el mejor) editor de imágenes online que haya visto hasta el momento. Su potencia y su facilidad de uso lo convierten en la real alternativa a programas de escritorio como Photoshop.

Splashup (antes conocido como fauxto) cuenta con una gran cantidad de herramientas que van mucho más allá de las que vemos en otros editores online (cortar, redimensionar, contraste, brillo, etc.) y que nos permiten realizar todo tipo de moficiaciones a nuestras imágenes.

Este editor online nos permite trabajar fácilmente con multiples imágenes y capas, aplicar filtros, elegir entre una gran variedad de pinceles además de integrarse perefectamente con servicios como Picasa, Flickr y Facebook.

Splashup, editor de imágenes online

Realmente es impresionante las cosas que se pueden lograr con este magnífico editor online. Desde que conocí Splashup se ha convertido en mi editor preferido cuando no tengo a mano GIMP.

La única desventaja que le veo es que para poder usar bien esta herramienta hay que tener una buena conexión a internet sobre todo al trabajar con imágenes muy grandes ya que el tiempo que demora para cargar los archivos puede ser desesperante si tienes una conexión demasiado lenta.

Vía | Adictos a la red
Fuente | Pixelco Blog
Enlace | Splashup

También te puede interesar:
- Shareapic, alojamiento de imágenes ilimitado y gratuito que te permite ganar dinero