Desarrollo Web en Colombia » Articulos Home

Diseño web con WordPress

IngVillamizar — Tue, 24 Feb 2009 01:13:35 +0000

Desde que el primer blog fue publicado en el año de 1999, escribir y tener un blog se ha convertido en un fenómeno que ha creado millonarios, tumbado políticos y ha cambiado la forma en la que se reportan las noticias en la web.

Para tener un dato sobre la cantidad de blogs que existen actualmente, podemos recurrir a technorati, donde este sito rastrea aproximadamente 112 millones de blogs, y en donde aproximadamente 175,000 nuevos blogs son registrados a diario.

WordPress inició en el año 2003, y desde entonces ha crecido hasta convertirse en una de las plataformas de blog más grandes e importantes del planeta. Basta con decir que es usado por organizaciones como “the New York times”, “Wall Street Journal” o CNN.

Al ser un software de descarga libre, se convierte en una plataforma bastante útil para diseñadores web, que no se tienen que preocupar demasiado por la parte técnica, sino que se pueden dedicar exclusivamente a la parte gráfica.

En wordpress prácticamente se puede hacer lo que se pueda lograr con una página web normal. Se puede crear un tema nuevo, o editar el default que viene con la instalación de wordpress.
Las partes de una plantilla en wordpress es bastante simple y muy bien estructurada, se puede decir que se cuenta con las siguientes partes:

Header.php: Típicamente el archivo header.php contendrá la imagen del cabezote principal – será la imagen o aspecto que le da al sitio web su temática o personalidad.
Sidebar.php: En esta parte de una plantilla web, es posible ubicar información adicional o complementaria al sitio web, generalmente widgets, como las categorías, los tags, archivos, calendarios, etc. Añadir widgets al sidebar es bastante sencillo.
Footer.php: Se encuentra en la parte de abajo del blog y contiene información acerca del blog, como copyright por ejemplo.
Styles.ccs: La hoja de estilos que le da forma y la parte visual al blog.
Single.php: Determina el contenido de cada blog individual. Es decir, la posición de los textos, la forma en la que se puede visualizar el texto, etc. Este archivo es como una plantilla que se aplica a cada entrada del blog.

Al modificar estos archivos, se puede conseguir pasar de algo así:

Diseño worpress basico

A algo así: 3 sitios web que han sido modificados y adaptados a wordpress, y que personalmente me parecen muy buenos, espero que les gusten:

Studio Racket

Arvind Andrion

Ndesign Studio

Posicionamiento Web

IngVillamizar — Sat, 13 Dec 2008 16:20:37 +0000

Ya mucho se habla del posicionamiento web o SEO -por sus siglas en Inglés-, el que te encuentren en Google y en los diferentes motores de búsqueda. A través del tiempo, me he dado cuenta que este tema toma más y más relevancia entre el público, pues ya esto no se observa como un lujo sino como una necesidad.

El posicionamiento web o posicionamiento en buscadores, le permite a una empresa potencializar sus ventas, productos, servicios, entre otras cosas, a través de Internet. Ya no se trata simplemente de aparecer en los motores de búsqueda, sino aprovechar los motores de búsqueda para vender mis servicios, mis productos, generar recordación de marca, etc.

Según estudios, se ha llegado a la conclusión que la mayoría de las personas únicamente revisan la primera página de resultados cuando realizan una búsqueda por cualquier motor de búsqueda. Pero aparecer en la primera hoja de resultados aveces no parece ser suficiente. Sabías que el porcentaje de clicks que recibe la posición número uno, puede llegar a ser hasta 10 veces más de la que recibe la posición número 4?

Aca les muestro estp en más detalle:

Claramente se observa, que las primeras 3 posiciones son las que se llevan la mayor parte de los clicks.

El posicionamiento web, sin embargo, no se trata solamente de posiciones altas en los motores de búsqueda, se trata de brindar un sitio web de calidad, con contenido valioso, un sitio web con estándares de accesibilidad y principios de usabilidad.

Quería presentarles un primer enfoque de lo que es el posicionamiento web o SEO. Espero seguir una serie de entradas para profundizar sobre este tema. Y cierro como empecé, esto ya no es un lujo, sino una necesidad.

Si estás interesado en servicios de posicionamiento web, puedes contactarme a través del formulario de contacto

Técnicas para optimizar código HTML

IngVillamizar — Sun, 07 Dec 2008 23:35:25 +0000

A continuación les quiero compartir una serie de tips, consejos o técnicas para conseguir un código HTML más limpio, más fácil de entender, y más amigable a los motores de búsqueda. Aca están las técnicas para optimizar código HTML:

1. Declarar el DOCTYPE correctamente: Declarar esta parte del código HTML correctamente permite que la página sea valdidada, y adicionalemente le indica a los motores de búsqueda cómo deben mostrar la página web. Algo que una simple etiqueta no consigue.

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>

2. Ubicar un ID para la etiqueta Body: Ubicar un ID para la etiqueta Body permite crear propiedades CSS que sean únicas para una página en particular. Por ejemplo, si yo quiero que la etiqueta H2 sea diferente en mi página principal que en las páginas interiores del sitio, yo puedo definir en el archivo CSS lo siguiente: #home h2 {} para lograr esto y no afectar la forma en la que se visualizan las etiquetas H2 en el resto del sitio.

3. Ubicar un DIV principal para todo el contenido. Ubicar todo el contenido en un ID principal da un control todal sobre la forma en la que se quiera manejar el aspecto de una página web.

4. Una sección Head corta: Establecer el título de la página, enlazar los archivos externos al sitio. No empezar a ubicar código innecesario en esta etiqueta.

Desarrollo y Diseño web en Colombia

5. Menú declarado semánticamente:

Si se quiere tener un poco más organizado el código HTML, se puede declarar en un archivo html aparte el menu, e incluirlo en el archivo principal con la función include_once de php:

6. Ubicar el contenido más importante al inicio. Es recomendable que el contenido html más importante esté primero que el resto del contenido. por ejemplo:

7. Uso de CSS y no tablas. El código CSS y el uso de hojas de estilos permite que el código HTML sea más ligero, y más entendible por los motoeres de búsqueda. Adicionalmente, es mucho más sencillo de actualizar y de realizar cambios.

8. No usar estilos directamente en el código. Se debe hacer uso de una hoja de estilos única y externa al archivo html. Es decir, se debe evitar a toda costa el uso e etiquetas con estilos como por ejemplo:

.

10 Consejos para buenos Diseños Web

IngVillamizar — Tue, 02 Dec 2008 02:23:58 +0000

Diseñar un sitio web puede ser algo realmente complicado, actualmente tener un sitio web “más bonito” que el de la competencia puede representar una venta que gane nuestro sitio web.

Por esto, les quiero hacer una lista de 10 consejos básicos para mejorar un diseño web. No solo se debe tener en cuenta el punto de vista gráfico (los sitios desarrollados 100% en flash no siempre es lo más efectivo), hasta factores de usabilidad y accesibilidad deben ser tenidos en cuenta en el momento de diseñar un sitio web.

El objetivo de estos consejos, es tener un sitio web que agrade tanto a los visitantes como a los motores de búsqueda (posicionamiento web!).

1. Crear un cabezote o logo que llame la atención. Finalmente, esto es lo primero que van a encontrar los visitantes a tu sitio web. Hay que atraparlos en el sitio web desde el primer momento.

2. Asegurate de tener un balance óptimo entre gráficos y texto: Los sitios web que abusan de los gráficos y hacen poco uso de texto pueden correr el riesgo de no ser encontrados por los motores de búsqueda. Mientras que un sitio web con solo texto puede generar que los visitantes no entiendan y no lean tus páginas web. Encontrar un punto de equilibrio entre texto e imágenes en clave para el exito de un sitio web.

3. Procurar que en cada página se pueda escribir mínimo 250 palabras como texto.

4. Usar hojas de estilos genera un código más limpio para los motores de búsqueda, de esta forma se minimiza el riesgo de tener código innecesario en una página web.

5. Dividir los párrafos con imagenes y viñetas es una buena opción. Los textos largos generalmente hacen que los visitantes abandonen un sitio web rápidamente, escribir la información de forma concisa y segmentada puede ser la diferencia para que un visitante continúe en el sitio o lo abandone.

6. Hacer obvio lo obvio! Si quiero que mi visitante compre un producto de página web, desde un punto de vista de diseño debo garantizar que el visitante encuentre fácilmente el botón de comprar (o dependiendo el ‘call to action’, puede ser contactenos, suscribase, mas informacion, etc)

7. Usa las etiquetas H1-H6 de forma lógica a lo largo del sitio. H1s para el encabezado o tema principal de cada página, H2 o H3 para subencabezados.

8. Ubicar un par de enlaces dentro del contenido del sitio web. De esta forma se aumenta la posibilidad de que el visitante ingrese a las páginas interiores del sitio web. Por ejemplo, aca puedes leer un poco más sobre la importancia del diseño web.

9. Garantizar que la información de contacto sea visible para el visitante. No se puede permitir que una persona abandone el sitio web porque no encontró información de contacto.

10. NO Realizar sitios 100% en Flash! Si quieres que te encuentren a traves de un motor de búsqueda, quizá debas reconsiderar realizar un diseño completamente en Flash.

Foro liderazgo y medios de comunicación

IngVillamizar — Thu, 27 Nov 2008 17:57:14 +0000

El próximo 29 de Noviembre en el auditorio Jaime Hoyos de la Universidad Javeriana, se llevará a cabo el foro: Liderazgo y medios de comunicación.

En este foro se estarán analizando las herramientas existentes en la actualidad, para el emprendimiento empresarial.

Se analizarán varios casos de exito donde hablaran diferentes invitados entre los que estan Fernando Jimenez de Dunkin Donuts, Carlos Mendoza de La Huerta de Oriente, Kesmira Zahur de la Casa Editorial El Tiempo, Jesus Muñoz de Polimedios y Gina Centenaro Olascoaga de la Fundación Lideres y Emprendedores en la U.

Aca se encuentra toda la agenda del evento:

Portales de Yahoo y AOL en Colombia

IngVillamizar — Wed, 19 Nov 2008 20:49:26 +0000

Esta entrada no tiene mucho que ver con desarrollo como tal. Sino para comentar algo que note recientemente.

Nose cuanto tiempo lleve el portal de AOL Colombia. La verdad, apenas hasta la semana pasada me dí cuenta que había un portal de esta empresa dedicado exclusivamente a Colombia. Me sorprede porque a decir verdad, creo que AOL tiene muy poca presencia de marca en Colombia. Me gustaría saber que tantas personas utilizan este portal y sus servicios. Es más, dudo mucho que el portal de Yahoo, que lleva más tiempo al aire, reciba una cantidad considerable de visitas que los sitios o portales colombianos, como el tiempo, colombia.com, elespectador.com, etc.

Aca les presento unas aproximaciones sobre el uso de estos portales:

Como era de esperarse, no existe punto de comparación entre los 3 sitios, mientras que eltiempo.com recibe casi 100.000 visitas mensuales, los portales de AOL y Yahoo, ni siquiera tienen visitas suficientes para aparecer en la gráfica.

Momo (Mobile Monday) Bogota

IngVillamizar — Sat, 08 Nov 2008 19:37:25 +0000

Mobile Monday es la comunidad más grande de desarrolladores móviles del mundo. Tiene como objetivo lograr el intercambio de ideas y en general la formación sobre el espectacular mundo del desarrollo para móviles.

Esta comunidad hace reuniones periódicamente, en el capítulo local de Bogotá, ya se ha realizado la primera. Y el próximo lunes 10 de noviembre se realizará la segunda reunión. Registrarse no tiene precio, y es muy sencillo. Se realizará en el Salto del Angel (Cra 13 # 93A-45) desde las 7:00 pm hasta las 9:00 pm. Para registrarse, sigan el siguiente enlace http://momobogota.eventbrite.com/.

La agenda parece realmente buena, aca la copio:

Registro
Keynote: Juan Carlos Posada de Microsoft Worldwide (Group Manager, Premium Mobile Experience Microsoft).
Presentación para Developers (Luis Linares de Microsoft Colombia)
Presentación Startup Colombiano: Social Networking Móvil
Presentación Startup Colombiano: AdverGaming Móvil
Presentación Startup Colombiano: Mobile Rich Applications
Presentación Startup Colombiano: Gestión Remota
Networking

Realmente se vew muy interesante! Termino con la descripción del evento, tomado de la página oficial:

Por segunda vez en Bogotá, más de 300 profesionales de la industria (Operadores Móviles, Fabricantes, Proveedores de Contenido, Agregadores, Empresarios, Desarrolladores, Inversionistas, Gobierno, entre otros) estarán reunidos en una tarde de intercambio de ideas y diversión. Esta es la oportunidad perfecta para ponerse al día con las últimas tendencias y lo más importante, conocer los principales jugadores de la industria de servicios móviles en Colombia! Te esperamos.