por Omar Benyakhlef | accesibilidad, Diseño de páginas web, Google, SEO, Usabilidad
Google y la velocidad de carga de una web
Hemos hablado en numerosas ocasiones de la importancia de la velocidad de carga en un diseño web. Una página web pesada perjudica la usabilidad, requiere un mayor coste (ancho de banda) y se traduce en la mayor de las ocasiones, en un abandono del usuario.
Hace unos días Matt Cutts (SEO de Google) reproducía en su blog un post el que comunicaba la incorporación de una nueva variable al algoritmo de Google, la velocidad de carga.
Este nuevo valor no variará mucho las posiciones en los resultados de búsqueda, ya que se estima que sólo afectará a un 1% de las consultas, pero aún así, es un factor que desde hace ya mucho tiempo, tanto diseñadores como programadores web, venimos teniendo muy en cuenta.
El tiempo de carga de nuestras web, depende fundamentalmente de las imágenes, CSS, javascript y flash. Deberemos pues optimizar al máximo cada uno de estos componentes.
Para optimizar el CSS, existen varios «trucos», desde reducir al mínimo la cantidad de espacios en blanco que aparecen en el archivo, a colocar una CSS distinta para cada tipo de páginas similares que forman nuestra web. También podemos hacer lo mismo con los archivos js, ya que en numerosas ocasiones además cargamos js que no van a ser utilizados en nuestra página.
Últimamente se ven imágenes enormes en sitios web, además de estar de moda, vienen fomentadas por las mayores velocidades de conexión que tenemos hoy en día, pero esto no es motivo para dejar de optimizarlas al máximo a la hora de guardarlas para web.
En todo caso, si queremos analizar nuestra web, Google y Firefox ponen a nuestra disposición un complemento para hacer un exhaustivo control de carga de cada uno de los elementos que componen nuestra web, imágenes, CSS, scripts, …
- Page Speed – un complemento para Firefox recomendado por Google.
Si queréis otro complemento más vistoso e igual de fiable, también podéis usar el navegador Google Chrome, y abrir la consola javascript, en la que podréis ver también todos los tiempo de carga componente a componente (pestaña Elements).
Además de estos dos complementos, tenemos también la posibilidad de ver online la velocidad de carga de nuestras páginas, aunque de un modo más genérico.
por Omar Benyakhlef | Diseño de páginas web, SEO, Trucos CSS
Usar CSS para optimizar el SEO
A la hora de afrontar el «diseño de una página web«, un diseñador debe tener en cuenta muchos factores, se trata fundamentalmente de elaborar un proyecto que sea atractivo y útil para el cliente y sobre todo para sus usuarios, pero para llegar hasta «meta», tenemos que plantearnos muchas otras «etapas».
Mi experiencia me dice que un buen diseñador web, no puede quedarse sólo en el aspecto general y superficial de la web. Tenemos que conocer a la perfección cómo maquetar una web, si no expertos, saber bastante de SEO y tener alguna noción de al menos, cómo influye el código de programación en la estructura de la página.
Los conocimientos de maquetación son importantes a la hora de diseñar, ya que nos dirán si es más o menos conveniente hacer un diseño de una forma u otra. El SEO, nos dirá dónde es más conveniente colocar los títulos por ejemplo, y conocer algo de programación, nos ayudará a plantear por ejemplo colocar aquí o allá un menú css, o una galería ajax. Todo en su conjunto, contribuye a realizar un buen trabajo, una buena página web.
Desgraciadamente esta práctica no es muy habitual, y desgraciadamente en España, el trabajo del Director de ARte o diseñador, esta muy infravalorado, no hay más que ver los sueldos aquí y en el resto de los países y las «chapuzas» que invaden la red.
Hoy vamos a comentar la importancia que tiene el flujo del Html a la hora de posicionar bien una web e incluso de que cargue con mayor rapidez.
(más…)
por Omar Benyakhlef | Diseño de páginas web, Google, SEO
Diseño Web. Página en Construcción.
Un año más de mi blog de diseño web !!, Feliz Año a todos.
El otro día un amigo me comentaba que si veía bien o mal el colocar una página de «en construcción» en su web, hasta poder subir al menos unos contenidos decentes.
En este post, vamos a ver si es conveniente que google indexe una página del tipo «en construcción«.
(más…)
por Omar Benyakhlef | Diseño de páginas web, SEO
Keywords con Google AdWords
En este blog de diseño web ya vimos una lista de sitios útiles para poder buscar las palabras más adecuadas para nuestro SEO. Seguramente la mayoría ya conozca Google AdWords para buscar palabras clave o keywords, pero pienso que puede ser útil para quien está empezando.
(más…)
por Omar Benyakhlef | Ajax, Diseño de páginas web, Google, SEO, Usabilidad
HTML 5
Desde hace tiempo el diseño web ha tenido que ir sufriendo las diferentes lecturas de los navegadores respecto al lenguaje de etiquetas de hipertexto que se utiliza para crear y poder visualizar los contenidos de las páginas web.
El Explorer empezó llevándose mal con el Netscape y ahora lo hace con todos los demás, particularmente hace mucho tiempo que tomé la determinación de prescindir de él, sin embargo sigo comprobando que cada uno de mis diseños se vea igual en él, porque sigue siendo una gran mayoría la que lo usa (aunque no creo que los motivos sean por haberlo elegido frente a otros).
Así que maqueto para firefox, porque así me aseguro que también funcionará para los demás navegadores importantes (safari, chrome, ópera…), y luego hackeo para explorer cuando es necesario.
Con el desarrollo del nuevo HTML 5, se está tratando al parecer, de conseguir minimizar todas estas incompatibilidades. Todavía se trata de una versión beta, aunque portales de la relevancia de youtube, ya han desarrollado su versión en este lenguaje.
No intentéis acceder a este enlace con explorer, como siempre será el último en subirse al carro…
La nueva versión HTML 5, trata de añadir semántica y usabilidad implícitas en sus etiquetas, para así de este modo eliminar ambigüedad e incluso facilitar más si cabe la labor a los buscadores.
A la hora de maquetar una web, lo que hacemos hoy en día es dividir las zonas de contenido con divs, estas etiquetas son siempre la misma y las diferenciamos a través de la CSS.
HTML 5 crea nuevas etiquetas para diferenciar los «divs» más usados en el desarrollo de una página web, veamos algunas de las más importantes: (más…)
por Omar Benyakhlef | Google, SEO
¿Cómo ven los buscadores nuestras webs?
En este blog de diseño web, podréis encontrar numerosas utilidades para posicionar mejor vuestra web. Hoy traemos una herramienta muy útil, se trata de una web que nos analiza cómo ven los buscadores nuestras páginas.
Como ya sabemos, cada buscador tiene su propio robot, el cual, cada x tiempo lee nuestra página para incorporar o modificar datos a su base de datos.
La primera visión que nos muestra esta herramienta, es el texto que lee el buscador al entrar en nuestra página. Tenemos además un «modo avanzado» que nos permite además seleccionar distintos robots, las dos últimas versiones del Googlebot (Google), Msnbot (Msn), Yahoo Slurp (Yahoo), Ask Jeeves/Teoma (Ask),… incluso el robot de Windows Mobile.
SEO-browser nos indica además entre otras cosas la densidad de palabra, el tiempo de carga, los tipos de enlaces (externos, internos o no-fallow).
Se trata pues de una herramienta muy útil para conocer las carencias de nuestro código o reforzar en mayor medida aquellos aspectos que queremos destacar.
Un ejemplo son los keywords. Podemos ver cómo el robot detecta las 15 primeras palabras y coloca en rojo las restantes.
Analizar tu web con SEO-Browser.
