
Hola a todos los adictos a la creacion de paginas web, este es un post donde se informaran de como hacer las cosas bien para la creacion de una pagina web, muchas veces no nesesitas ser un profesional, pero si te interesa este tema de crear una Pagina Web puedes aprender mas en este post.
Estructura de páginas web
Cómo hacer para que lo importante aparezca primero
Cuando nos encontramos optimizando una página web para los buscadores, una de las cosas que debemos tener en cuenta es que aquellos contenidos de mayor importancia deben ser los primeros en aparecer, no solo visualmente, sino además en el código HTML. Esto está relacionado con el funcionamiento de los robots de búsqueda.
Los buscadores necesitan clasificar las páginas web de acuerdo a su contenido, lo que implica necesariamente un análisis de los mismos. Pero estos robots que hurgan en las páginas web no analizan la totalidad del código de cada página, sino que tienen un límite y solo analizan los primeros contenidos.
Es por ello que resulta muy importante que las páginas web cuenten dentro de sus primeras líneas aquellos contenidos que resulten más relevantes. Sin embargo, esto que parece sencillo, muchas veces choca con la intensión de los diseñadores de maquetar la página siguiendo cierto orden.
Por ejemplo, si un diseñador desea que la página tenga una cabecera, dos columnas a la izquierda y el cuerpo principal con el contenido a la derecha, podría parecer que es imposible hacer que el contenido principal aparezca entre las primeras líneas del código HTML. Sin embargo, empleando algunas características de CSS, esto es posible.
Cómo maquetar una página para que el contenido importante aparezca primero
A continuación mostraremos como es posible hacer que los contenidos más relevantes de la página aparezcan en los primeros lugares del código HTML, empleando para ello el float de CSS. Sin entrar en demasiados detalles, ya que no es la finalidad de este artículo explicar como funciona la propiedad float, podemos resumir que esta propiedad hace que el elemento salga del flujo del HTML para posicionarse a la izquierda o derecha de otros elementos adyacentes, alterando el orden en que se encuentran escritos en el código HTML.
Para poder explicarlo de mejor forma, escribiremos un código de ejemplo y su resultado visual, que podrán probarlo utilizando el mismo código escrito en bloc de notas, guardando el archivo como .html o .htm y abrirlo en su navegador para visualizar los resultados.
Código básico
Lo primero que haremos será ordenar los contenidos dentro del HTML en el orden que deseamos. Luego, empleando CSS le daremos el orden visual. El código de ejemplo es el siguiente:
Como se puede apreciar, además del código HTML, deberemos escribir, en otro archivo aparte, una hoja de estilo independiente, a la que llamaremos estilo.css y que contendrá el código CSS. En este código HTML podemos ver que el contenido principal de la página, se encuentra inmediatamente después de la cabecera, es decir, en los primeros lugares del código.
En el archivo CSS, daremos los primeros atributos a los diferentes div’s, de forma que la página adquiera una forma visible y donde los contenidos aparezcan separados. El siguiente código es el que aparecerá en el archivo estilo.css:
Con esto, ya es posible visualizar la página, la que encontraremos que se encuentra diagramada en una única columna y los diferentes contenidos aparecen alineados en forma vertical. Esto se debe a que el proceso de maquetación aún no ha comenzado, y la página se verá de la siguiente manera:
Empleando el ejemplo anterior, si deseáramos maquetar la página con una columna a la izquierda y el contenido principal a la derecha, deberíamos dejar el tercer contenedor debajo de los anteriores y ocupando todo el ancho de, para lo que podríamos escribir, debajo del CSS básico que ya hemos escrito, las siguientes líneas de código (debe observarse que en cada uno de los ejemplos que daremos, el código HTML no será modificado).
La siguiente imagen es el resultado del código descrito. En la caja de color rosa aparece el contenido principal, aunque visualmente no ocupe esa posición, ya que la columna de la izquierda aparece antes.
A continuación veremos un ejemplo donde la columna aparece a la derecha y el contenido principal de la página estará a la izquierda:
Teniendo en cuenta que los contenidos se encuentran jerarquizados en tres escalas diferentes, es posible organizarlos en tres columnas, como en los dos casos que exponemos a continuación, donde las dos columnas se colocan sobre uno de los lados (en un ejemplo a la derecha y en el otro a la izquierda) y el contenido principal en el opuesto:
La forma en que se decida maquetar la página, no impide en modo alguno que podamos colocar los contenidos en el orden que creamos más conveniente. Empleando adecuadamente las propiedades CSS, es posible establecer el diseño deseado sin necesidad de realizar grandes modificaciones en el código HTML.
Redes Sociales ¿Que es el SMO y el SMM?
SMO o Social Media Optimization (en español: Optimización de redes sociales) es un terminado creado por Rohit Bhargava en Agosto del 2006, el mismo hace referencia a los cambios en un sitio a fin de optimizarlo para que sea mas facil difundirlo a través de medios sociales y comunidades online por parte de los usuarios.
SMM o Social Media Marketing (en español: Marketing en redes sociales) fue un término que apareció un tiempo después, haciendo referencia al uso de las redes sociales para difundir mensajes y contenidos utilizando diferentes formas de marketing viral.
¿Cuáles son las principales diferencias entre SMO y SMM?
La optimización de redes sociales se refiere mas a lo que puede hacerse dentro del sitio, modificándolo para conseguir los fines mencionados anteriormente, y el marketing en redes sociales se refiere a lo que puede realizarse fuera del sitio sin modificar nada dentro del sitio.
Realizando una analogía con el SEO, podríamos decir que:
Tal como el SEO es on-site y off-site, el SMO sería la parte on-site y el SMM la parte off-site.
Tal como el SEO es parte del SEM (Search Engine Marketing), el SMO forma parte del SMM.
Rohit Bhargava al momento de utilizar el término SMO por primera vez agregó 5 reglas para poder realizar una campaña de SMO correctamente, las cuales luego se ampliaron hasta 16 mediante la colaboración de otras personas (bien 2.0). Las 16 reglas hasta el día de hoy son:
1.- Se mas “linkeable”
2.- Haz más fácil el social bookmarking
3.- Recompensa los enlaces entrantes
4.- Ayuda a que tu contenido (no textual) viaje
5.- Promueve el uso de Mashups
6.- Agrega recursos para tus usuarios
7.- Recompensa a los usuarios fieles
8.- Participa en las redes sociales
9.- Entiende a tu audiencia
10.- Crea contenido
11.- Di siempre la verdad
12.- Se humilde
13.- No tengas miedo de probar cosas nuevas
14.- Desarrolla una estrategia
15.- Elige tus tácticas sabiamente
16.- Haz al SMO parte de tus prácticas comunes
Si bien se habla mucho sobre el SMO como el reemplazante del SEO, creo yo que ambos seguirán existiendo por un largo tiempo y que ambos combinados son la mejor forma de promoción online de la que una empresa puede disponer.
La segunda parte esta en construccion, recuerda que si quieres tener la mejor pagina del mundo no dudes en seguir siempre los pasos, asi empezo Taringa!, Facebook, Twitter y muchas paginas mas,