El contenido a simple vista de una web, lo más importante

Cuando se diseña una página web hay que tratar de encajar muchos elementos y esto lleva en muchos casos a que no podamos tenerlos todos a simple vista. El motivo, es que las resoluciones de pantalla no permitan visualizar todo el contenido. Y es que prácticamente tres de cada cuatro usuarios solo se quedan si el contenido que se ve de un vistazo es lo que necesitan, prácticamente solo un 23% de los usuarios hacen scroll para buscar el contenido que pudieran necesitar. En el pasado con las bajas resoluciones de pantalla, esto hacía que fuese especialmente importante tener esto en cuenta, pero hoy en día en cierta medida el problema se ha visto minimizado ya que las resoluciones de pantalla han aumentado considerablemente facilitando esta labor.

Y es que no es fácil tener todos los contenidos de nuestro sitio web de forma que no sea necesario realizar un scroll en algún momento. Por ejemplo si en un listado de resultados  tratamos de reducir el número de resultados por página para seguir este concepto, se nos generará un mayor número de páginas, lo cual también puede ser contraproducente, así que hay que buscar cierto equilibrio en todo momento.

Por tanto, es muy importante tener una cabecera muy concisa, un menu de navegación suficientemente sencillo y que a la vez facilite la navegación por nuestro sitio web, y tener claramente lo que nuestro sitio web ofrece a los visitantes de cara a atraparlos y lograr que sigan explorando nuestro sitio web (y de paso no dejen de hacer el scroll). También hay que tener en cuenta, que con el auge de nuevos dispositivos como las tablets y smartphones hay que tener este aspecto muy en cuenta, ya que en estos la disminución de pantallas si podría seguir siendo un factor muy determinante, así pues, la clave está en tener en la cabecera un gancho suficientemente atractivo para que nuestros visitantes sigan profundizando en nuestro sitio web, sino es más que probable que acaben por abandonarlo.

Elimina espacios en una cadena de texto en JavaScript

Si tienes una cadena de texto dentro de un fragmento de código en JavaScript y necesitas eliminar los espacios en blanco por algún otro caracter o texto, puedes hacerlo con relativa sencillez mediante la función «replace». A continuación vamos a poner un ejemplo de código donde se eliminan los espacios en blanco por el texto %20 por ejemplo para el caso de que estemos usando una cadena de texto que se quiera pasar como URL y para que funcione correctamente debemos realizar dicha sustitución

var url_final = url_actual.replace(/\s/g,»%20″);

Generar contenido original … esa es la cuestión

O al menos así lo entienden los buscadores. Y es que a pesar de muchas técnicas que uno intente utilizar para mejorar el posicionamiento de una página web, el generar contenidos propios y que además tengan calidad es el punto de partida para lograr mejorar nuestra visibilidad. Es cierto, que hay que aprovechar todas las técnicas que los motores de búsqueda nos ofrecen, pero no debemos olvidar que el destinatario final de nuestros sitios web no son esos buscadores, sino los visitantes que a través de estos buscadores llegan a nuestra web. Y si cuando estos llegan, no hacen sino encontrarse contenidos duplicados, posiblemente y a menos que nuestro sitio sea su primer punto de referencia, acabarán por dejar de visitar nuestra web o acabarán por dejar nuestro RSS (que aún no lo tiene tu web, a que esperas para poner uno) en un segundo plano. De esta forma, si creamos un contenido completamente nuevo, este seguramente atraerá y enganchará mucho mejor a nuestros visitantes que cualquier otro contenido (y si, posiblemente luego al final, acabe duplicado en algún lugar de la red).

Pero no siempre podemos tener contenidos originales. Cierto es que es difícil que, si uno visita páginas de temáticas similares, no acaben por darse algunas coincidencias. Los temas candentes suelen comentarse en diferentes páginas y al final uno acaba por encontrar el mismo tema varias veces repetidas. Pero no debemos limitarnos a replicar una noticia o artículo visto en otro lado, eso no aporta ningún valor. Lo ideal, sería documentarse sobre el tema (posiblemente leyendo la noticia en varias fuentes para contrastar), si podemos experimentar sobre la cuestión y finalmente ofrecer nuestra opinión lo más personal que sea posible. De esta forma, el visitante, cuando llegue a nuestra página si se detiene a leer el artículo y acaba comprobando que hay ciertos detalles en nuestro artículo que acaban por diferenciarlo, se sentirá más atraído para una siguiente visita. Así pues, aunque hablemos de un tema recurrente, no caigamos en la tentación de «duplicar» contenidos, sino que tratemos de dar nuestro toque a lo que publiquemos.

Las ideas son dos, intentar crear nuestros propios contenidos y por otro lado cuando hablamos de algún tema «recurrente» dar nuestro toque personal.

JQuery dejará de soportar Internet Explorer 8

El equipo de desarrollo del framework JavaScript, JQuery, ha publicado en su blog una nota en la cual indican cual será el camino para las próximas actualizaciones del Framework.  De esta forma jQuery 1.9  y posteriormente  jQuery 2.0 llegarían durante los primeros meses de 2013. Pero aparte de la temporización de las futuras actualizaciones del framework, lo más destacable sería que jQuery 2.0 dejaría de dar soporte a las versiones antiguas de Internet Explorer, esto es IE6, IE7 e IE8. Un movimiento que sorprende a muchos puesto que windows XP no soportaría versiones superiores a la 8 y podría dejar a muchos usuarios fuera. No obstante para minimizar el posible impacto el equipo de jQuery planea hacer que las versiones 1.9 y 2.0 tengan APIs intercambiables de forma que quienes necesiten soporte para dichas versiones antiguas utilicen la versión 1.9 del Framework.

Wordfence, mejorando la seguridad de WordPress

Ya en otras ocasiones hemos hablado de algunas extensiones que contribuyen a mejorar la seguridad de nuestras instalaciones de WordPress. Pues bien, hoy queríamos hablar de una nueva extensión, que sirve para aumentar la seguridad y que nos permitirá estar tranquilos a nosotros y a nuestros visitantes. Wordfence es una extensión con múltiples funciones que nos permiten garantizar la seguridad de nuestro blog.

Por un lado permite comprobar la integridad de los ficheros comparandolos con los de los repositorios. Permite revisar los comentarios de todos los posts, incluso gestionando varios blogs (aunque aún esté en version beta el soporte de varios sitios). Permite comprobar hasta 44.000 variantes de malware conocidas así como distintos agujeros de seguridad conocidos. Revisa en búsca de malware y enlaces de Phising en lso comentarios. Monitoriza las DNS para evitar cambios no autorizados, trata de evitar ataques de denegación de servicio basados en consumir el espacio de disco disponible… y muchas más funciones.

Sin duda una interesante herramienta a tener en cuenta para mantener la seguridad de nuestro blog a un gran nivel.

Antivirus para tu WordPress

Los blogs basados en WordPress no hacen sino seguir proliferando a un ritmo incesante. Y los administradores de estos blogs deben estar siempre alerta de cara a evitar posibles problemas que por una parte afecten a la reputación del sitio y por otro perjudiquen a los visitantes. Es por eso que existe la extensión Antivirus la cual contribuye a mejorar la seguridad de tu instalación de WordPress. Este sencilla extensión permite revisar posibles agujeros de seguridad, infecciones de malware así como problemas de spam. Permite analizar las plantillas instaladas. Muestra alertas de virus en la barra de administración. Está disponible en varios idiomas. Realiza un scaneo diario con notificaciones por correo electrónico. Para funcionar esta extensión requiere que nuestro servidor utilice PHP 5.1 o superior y nuestro blog debería tener instalada la versión 2.8 o superior de WordPress. Así pues si te preocupa la seguridad, tanto de tu blog como de los posibles visitantes, no dejes de instalar la extensión Antivirus.

Extensión Antivirus para WordPress

Thimble, el editor de la fundación Mozilla

Mozilla desde hace unos días nos ofrece una nueva herramienta enfocada esta vez a los desarrolladores web. Su nombre es Thimble y se trata de un editor HTML que nos permite realizar proyectos basados en HTML y CSS directamente desde nuestro navegador. Si queréis iniciar la prueba, podéis hacerlo desde la web del proyecto Thimble sin necesidad siquiera de crear una nueva cuenta. Con esta herramienta podremos crear páginas web con suma facilidad desde el navegador recibiendo además ayudas desde el editor.

El Apple Touch Icon ¿que es? y como añadir uno a nuestra web

Desde hace algún tiempo Apple permite que en iOs podamos crear accesos directos a algunas páginas web como si se tratase de iconos de apps. Para ello, desde el navegador Safari podemos elegir la opción «Añadir a pantalla de inicio» (que está disponible desde el mismo boton con el que podemos guardar una página en favoritos, el llamado «Boton de acción»). Al hacerlo, por defecto se crea una imagen con una pequeña captura de la página en cuestión. No obstante si queremos definir un icono propio en lugar de hacer uso de esa captura, podemos definir el llamado Apple Touch Icon.

¿Y como lo hacemos? Lo primero de todo es crear el icono, el cual debe cumplir las siguientes condiciones impuestas por Apple: debe estar en formato PNG y debe tener una resolución adecuada al dispositivo (144×144 pixeles o 72×72 pixeles para los iPad y 57×57 pixeles en el caso del iPhone). Si el icono lo tenemos almacenado en la raiz de nuestro sitio web con el siguiente nombre: apple-touch-icon.png todo debería funcionar de forma automática. Pero lo más fácil es que por tener todo mejor organizado en nuestro servidor este icono no se pueda encontrar en la raiz, con lo cual tendremos que añadir algo de código a la cabecera <head></head> de nuestra página. El código sería como sigue:

<head>
<link rel=»apple-touch-icon» href=»ruta_donde_esta_el_icono/apple-touch-icon.png»>
</head>

Y si además, queremos usar un icono distinto en iPhone y iPad, escribiremos el siguiente código:

<head>
<link rel=»apple-touch-icon» sizes=»57×57″ href=»ruta_donde_esta_el_icono/touch-icon-iphone.png» />
<link rel=»apple-touch-icon» sizes=»114×114″ href=»ruta_donde_esta_el_icono/touch-icon-ipad.png» />
</head>

Responsinator, prueba tu web para distintos dispositivos móviles

En la web de Responsinator encontrarás una útil herramienta que te permitirá comprobar como se visualizará tu proyecto web en distintos dispositivos móviles. Así pues, a través de esta web tras introducir la url de nuestro sitio web veremos como se mostraría en un iPhone, en un SmartPhone con Android, en un iPad o en un Kindle todo en un mismo sitio. Sin lugar a dudas una buena forma de comprobar que nuestro diseño se adapta adecuadamente a cada uno de estos dispositivos, cosa especialmente necesario con el creciente auge de estos.