Todo lo que publicado hasta el momento sobre Desarrollo y diseño web.

WebMatrix, lo mejor para diseño web desaparece en 2017

Microsoft ha anunciado que el 1 de noviembre de 2017 dejará de apoyar a Webmatrix.

Así que parece que en 2017 vamos a perder la mejor plataforma de diseño web que he conocido.

Webmatrix, plataforma de diseño web

Muy bien, pero ¿Qué es WebMatrix?

Es fácil que no te suene, sobretodo si no te dedicas al diseño web.

Webmatrix es la solución gratuita y open source de Microsoft para el desarrollo y diseño web.

El paquete integra:

  • Servidor virtual local
  • Plantillas para la instalación y optimización de CMS (como WordPress o Joomla!)
  • Editor de código multilenguaje (HTML5, CSS, Javascript, ASP.NET, PHP, SQL, etc…)
  • Gestor de proyecto y publicación por varios sistemas (entre ellos FTP)
  • Analizador SEO
  • …y muchas otras cosas

No está nada mal y todo esto ¡Gratis!

Aunque durante su historia ha tenido muchos altibajos, la verdad es que nunca ha gozado de la popularidad de otras plataformas de Microsoft para el desarrollo de aplicaciones, como por ejemplo Visual Studio.

Y es una verdadera lástima ya que supera en facilidad de uso y posibilidades a otras herramientas mucho más conocidas como Adobe Dreamweaver.

Una poquito de historia muy rápido

Microsoft creó esta herramienta para respuesta a una tendencia que estaba muy en boga a principios de los 2000: Acercar el diseño web y la programación web a todo el mundo.

En aquellos años había mucha demanda de desarrolladores web y miles jóvenes se plantearon el diseño web como una profesión con futuro.

Y la mayoría de desarrolladores que se acercaron a Webmatrix fue por su facilidad de uso y con la intención de aprender a programar en un entorno mucho más amigable que Visual Studio u otras opciones profesionales.

¿Te apetece saber como fue la evolución de la herramienta?

  • Microsoft Webmatrix nace en el año 2001 como un IDE para ASP.NET.
  • Se lanzan varias versiones de la herramienta como “Tecnology Preview” en 2002 y 2003
  • En 2005 se integra a la suite Visual Web Developer Express
  • En 2011 se independiza de Visual Studio y se publica WebMatrix 1
  • WebMatrix 2 aparece de forma gratuita en 2012
  • En 2013, Microsoft lanza la ultima versión hasta la fecha: WebMatrix 3
  • Microsoft anuncia el cese de su apoyo a la herramienta en 2016
Pantalla de inicio de WebMatrix

Pantalla de inicio de WebMatrix

¿Por qué Microsoft deja de apoyar a WebMatrix?

La verdad es que no hay una respuesta clara por parte de Microsoft (por lo menos que yo conozca).

Parece ser que la herramienta ha estado muy vinculada históricamente a ASP.NET y a RAZOR (lenguaje de programación de Microsoft para simplificar el desarrollo web) por lo que parece que esto ha limitado ganar adeptos y usuarios… y la herramienta no ha tenido el éxito esperado.

Tanto es así, que las páginas de la web de Microsoft dedicadas a la plataforma ya están anunciando que los usuarios continúen con Visual Studio Code como alternativa.

Pues igual no es una gran pérdida

En principio sí lo es. Me explico.

Todos los que nos dedicamos a la web, al diseño web sobretodo, usamos o deberíamos usar, un entorno seguro para hacer las pruebas de desarrollo.

Ese entorno se suele solucionar con un servidor de desarrollo local usando plataformas como WampServer o Xampp, como las más conocidas. Ambas dan problemas con Windows 10. 

En cambio WebMatrix se integra perfectamente con la última versión de Windows, sobretodo en su formato para x64.

Eso, unido a todas las herramientas que integra y su facilidad de uso, hacen de Webmatrix la mejor plataforma para desarrollo web que haya conocido.

Página de selección de plantillas de instalación de CMS

Página de selección de plantillas de instalación de CMS

¿Nos pasamos a Visual Studio Code?

Aún no he podido probar la nueva plataforma Visual Studio Code que sustituirá a WebMatrix, pero por la información que tengo, creo que no será lo mismo, ya que no estará tan orientado a los usuarios más noveles.

Puedes ver todas la información en este enlace:

https://www.microsoft.com/web/webmatrix/

Aunque te aviso que esta sección de la web de Microsoft da errores al acceder a algunas páginas.

Preview de Visual Studio Code

Preview de Visual Studio Code

Conclusiones

Aunque WebMatrix dejará de tener soporte de Microsoft, también se ha anunciado que la comunidad de WebMatrix continuará dando el soporte a la plataforma, lo cuál es una buena noticia.

Es una lástima que esta gran herramienta no haya tenido el éxito esperado entre los desarrolladores web.

Quiero destacar que es la única plataforma que he conocido con la que editar un CMS se convertía en un proceso sencillo y rápido.

Sí, ya sé que Dreamweaver también podía abrir un CMS y trabajar con él, pero el método de trabajo no era tan fluido y eficaz con el de WebMatrix.

¿Crees que se equivoca Microsoft dejando de dar soporte a WebMatrix? ¿Es el fin de una época?

Estoy deseando leer tu opinión.

Elementor, el fin de la dictadura del diseño en WordPress

Hoy quiero presentarte un plugin que cambiará la forma de diseñar webs desde ya: Elementor Page Buider, el plugin totalmente gratuito de edición visual para WordPress.

Estoy convencido que este plugin puede cambiar la manera de diseñar y editar webs en WordPress sin pasar por la “dictadura” de plugins de pago como Visual Composer.

Y es que Elementor no es el típico plugin de edición visual gratuito. Es el mejor editor visual para WordPress.

Diseño web con Elementor

¿Por qué Elementor es el mejor editor visual para WordPress?

Elementor Page Builder para WordPress

Estoy seguro que estás acostumbrado a que los editores visuales estén integrados en el editor de WordPress y tengas que ir abriendo una pestaña nueva para ir viendo como queda en el frontend (no pongas cara rara, así es como se llama la parte de la web que ve el usuario).

Bien, eso se acaba con Elementor, ya que podrás trabajar directamente sobre el frontend e irás viendo como queda, a medida que “construyes” tu página.

Además, Elementor Page builder se compromete a que siempre será gratis, ya que es un proyecto de código abierto, así que se irá actualizando con nuevos módulos, tipos de letra, etc..

¡No me dirás que sólo por eso no vale la pena!

Pero si eso no es bastante, también te puedo decir que hoy por hoy, Elementor es el editor visual para WordPress más rápido del mercado.

Con este plugin se acabó tener que esperar a que se carguen los módulos, refrescar cachés, etc…  ¡Añadir y ver el resultado!

Trabajando con Elementor Page Builder ¿Qué cosas incluye este genial plugin?

Pues el paquete completo y, repito, gratuito de Elementor Page Builder incluye:

  • Una librería de 20 plantillas listas para ser usadas.
  • Una herramienta exclusiva para el diseño en móviles.
  • 28 widgets o módulos con todo tipo de herramientas que podrás utilizar para diseñar tu web.
  • Diseños totalmente profesionales y complejos con la precisión de 1 pixel.
  • Multidioma, aunque el castellano aún está en “proceso

También es compatible con cualquier theme y respeta la configuración de éste.

Herramientas de Elementor¿Cómo se trabaja con Elementor Page Builder?

editor visual reescalable

Pues funciona igual que el resto de plugins de composición visual, es decir, Drag & Drop (arrastrar y colocar).

Sólo tendrás que diseñar la plantilla, por columnas y secciones, arrastrar el módulo que te interese y ver el resultado.

Rápido, limpio, fácil y eficaz.

El siguiente vídeo es un tutorial (Aunque el vídeo dice durar unos 20 minutos, en realidad sólo son 10… El vídeo no es muy bueno, pero es el único que he encontrado en español) en el que Sergio Kolomiychuk, diseñador web especializado en WordPress, te demuestra el uso del plugin paso a paso.

Sencillo ¿Verdad?

Si es tan bueno ¿Por qué es gratuito?

A Ben Pines, el creador de Elementor, le preguntaron si este no iba a ser otro editor visual gratuito más.

Su respuesta fue:

No parece lógico que el CMS libre más utilizado en el mundo no permita crear páginas web de forma rápida e intuitiva. Es por eso que hemos decidido crear un constructor de páginas visual, que permite a los usuarios crear su sitio web de la mejor manera que hay..

Y añadió:

…vamos a añadir aún más widgets al plugin, así como lanzar una versión Pro en algún momento en el futuro.

Quizás sea el momento de aprovechar ahora, antes que sea de pago, no? jejejeje

Elementor trabajando

¿Como consigo Elementor Page Builder?

Pues te la puedes descargar del directorio de WordPress como cualquier otro plugin en:

https://wordpress.org/plugins/elementor/

o también te lo puedes bajar de la web oficial:

https://elementor.com/

Y, como ya he dicho antes, es totalmente gratis.

Además puedes combinarlo con un buen theme gratuito y por nada tendrás tener una superweb profesional para tu blog, negocio o lo que quieras.

Tener una web no tienen por qué se caro.

¿No sabes donde conseguir buenos themes gratuitos? ¡Ay! No sé que harías sin mi.

Mira este artículo titulado: Las 5 mejores plantillas de diseño web responsive gratis para WordPress. 

Ahí tienes unas cuantas para empezar y recomendadas por mí… ¡de nadaaa!

Conclusión

¿Por qué estoy recomendando un plugin que ni me va ni me viene?

Bien, pues porque cada vez me encuentro más problemas entre mis clientes que utilizan themes que incorporan Visual Composer, siempre en una versión anterior e incompatible con las nuevas versiones de WordPress.

Como los desarrolladores de dichos Themes no siempre actualizan el plugin, resulta que los clientes de dichos themes tienen que acabar escogiendo entre actualizar su WordPress o mantener la estética de su web.

Aunque en estos casos la web mantiene su estética. El plugin, que dejó de funcionar a nivel editor, no permite hacer modificaciones a lo ya diseñado.

Si a eso le sumamos que, especialmente Visual Composer, trabaja muy mal con volúmenes de información medianos y mucho peor en hostings con pocos recursos, me ha llevado a buscar una alternativa real y eficaz que pueda sustituir a Visual Composer o a cualquier otro editor visual que dé problemas.

Estoy seguro que mis clientes que quieran dar el paso y sustituir su antiguo editor por Elementor Page Builder podrán vivir más tranquilos y yo podré dedicarle menos tiempo a solucionar problemas que crean terceros y más a conseguir que los negocios online de mis clientes tengan mejores resultados.

¿Crees que el plugin Elementor desbancará a la hegemonía de los de pago?. Es más ¿Crees que Mullenweg, el creador de WordPress, debería integrarlo dentro de Worpress en próximas versiones?

Yo espero que sí.

Tu WordPress en 1and1 el doble de rápido

Lo que te voy a explicar hoy puede acelerar hasta el doble la velocidad de descarga de tu WordPress alojado en 1and1, según las pruebas que yo mismo hice.

Voy a dejar claro que yo no tengo nada con 1and1, más que la desgracia de haber tenido que tratar con ellos.

Hoy por hoy, la empresa de hosting alemana debe ser la que peor fama tiene entre los profesionales de la web.

Sólo has de hacer una búsqueda en Google para confirmarlo

 

¿Por qué 1and1 tiene tan mala fama?

1and1 lento

Pues porque dan un servicio malísimo a todos los niveles.

Si, ya sé que tienen dos años seguidos el premio al hosting con la mejor atención al cliente de la consultora Sotto Tempo Advertising.

A lo mejor a dicha consultora no se le ha ocurrido mirar las opiniones de los usuarios antes de darles la mención.

Resultados de busqueda en Google sobre 1and1

No voy a enumerar todas las quejas que acumulan, pero a grandes rasgos suelen ser:

  • Su atención al cliente es amable pero incompetente.
  • Sus productos son pobres y mediocres.
  • Muchos clientes se quejan del servicio de facturación, teniendo costes de servicios no contratados.
  • CPanel con herramientas pésimas.
  • Hosting lento y con una ip de Alemania. Dos factores esenciales que no cumplen para el SEO.

Aunque podría comentar todos estos puntos uno a uno, prefiero recomendarte la lectura de un interesante artículo que analiza con profundidad este tema.

Se trata de un post de Rubén Alonso de “Mi posicionamiento web” que se titula “1and1, por qué no contratarlo”.

Un título revelador, verdad jajajajaja

Nadie habla bien de 1and1

Por qué 1and1 es tan lento

Tiempo largo de carga en 1and1

El principal problema e la lentitud de 1and1 es precisamente su servicio de hosting, sobre todo en los planes más asequibles.

Dichos planes se basan en ordenadores compartidos con hostings virtuales a los que se les ha asignado unos recursos bastante limitados.

Por cierto, no busques la compresión Gzip en este hosting porque no existe, eso sí, tienes una compresión más modesta llamada Zlib.

¿Para qué sirven estas compresiones?

Estas compresiones sirven básicamente, y sin entrar en tecnicismos, para que tu web se descargue más rápidamente.

Si quieres saber más sobre la compresión GZip, lee este post de Desarrolloweb.com, titulado: “Introducción a la compresión Gzip de un sitio web

¿Cuál es la diferencia entre Gzip y zlib?

¡Buena pregunta!

Mientras que Gzip, además de ser el estándar hoy día, puede comprimir todo tipo de archivos (HTML, CSS, Js… incluso imágenes), Zlib solo comprime archivos PHP y tiene consigue menos compresión que Gzip.

Eso quiere decir básicamente que 1and1, por abaratar en recursos, te ha colado un sistema de compresión bastante más cutre que el habitual en los hostings profesionales.

¿Es por eso que mi web va lenta?

No, tu web puede ir lenta por muchas razones y la más habitual es que no esté bien optimizada.

Aunque en el caso de qué tu web esté muy bien optimizada, también irá más lenta en un hosting de 1and1 precisamente por los pocos recursos que asignan a cada hosting virtual.

1and1 sucks

Truco para activar Zlib en 1and1 y hacer más rápido mi WordPress.

Si haces unas búsquedas por la web verás que se recomiendan tres posibilidades para activar dicha compresión.

Te comento las tres y te digo cuál uso yo.

¿Cómo saber si tengo activado Zlib en mi hosting?

Según el servicio técnico de 1and1, Zlib está activado por defecto, pero mis años de experiencia me han enseñado a no fiarme nunca de nada, y menos de 1and1.

Puedes crear un pequeño archivo que pondrás en la raíz de tu web y que te dirá si está o no activado.

  1. Crea un archivo de texto llamado phpinfo.php (por ejemplo)
  2. Dentro de dicho archivo, incluye el siguiente código: <!–?php phpinfo(); ?–>
  1. Guárdalo y súbelo con un cliente de FTP a la raíz de tu hosting

Accede al archivo con la dirección: www.mihosting.com/phpinfo.php (sustituye “www.mihosting.com” por tu dominio)

Una vez ahí, debes ver si tu hosting tiene el módulo activado.

Zlib activado

Si es así, fantástico, puedes seguir.

Si no es así, deberías de ponerte en contacto con el servicio técnico de 1and1 y pedir que te lo activen, aunque ya te he comentado que 1and1 asegura que está activo en todos los planes y otras veces ni saben de qué les estás hablando. Así de guay es su servicio técnico jajajaja.

¿Cómo usar los trucos para activar Zlib en 1and1?

Antes de nada, te recomiendo que testees la velocidad actual de tu web, para poder compararla con la nueva y ver si realmente funciona.

Para ello, te recomiendo los siguientes servicios gratuitos:

WebPagetest

WebPagetest

Pingdom Tools

Pingdom Tools

Google PageSpeed Insights

Pagespeed Insights

Recuerda no utilizar todos los trucos al mismo tiempo, sólo uno: el que te funcione.

¡Ah! Y sobretodo!! Haz una copia de seguridad de todos los archivos que manipules.

Así si tienes algún problema solo tendrás que volver a sustituir el archivo modificado por el sin modificar y tu WordPress volverá al estado anterior.

Primer truco para activar Zlib. Modificando header.php

Para este primer truco, debes tocar el código en el archivo header.php de WordPress.

Lo encontrarás en la carpeta del tema, normalmente en 1and1 está en:

/ clickandbuilds / WordPress/ MyCMS2 / wp-content / Themes / elnombredetutema

Debes incluir el siguiente código justo antes de la declaración !DOCTYPE html:

<!–?php ini_set(‘zlib.output_compression’, ‘On’); ini_set(‘zlib.output_compression_level’, ‘1’); ?–>

Guardas y lo subes, sustituyendo (recuerda que antes debes haber hecho una copia de seguridad) el archivo original.

Haz un test de velocidad y compáralo con el que has hecho antes.

¿Va más rápido? ¡Genial! Ya lo tienes.

No va más rápido. Pues prueba con el siguiente truco.

Segundo truco para activar Zlib. Modificando .htacces

El siguiente truco será manipulando el archivo .htacces que encontrarás en la raíz de tu WordPress.

Normalmente en esta ruta:

/ clickandbuilds / WordPress/ MyCMS2 /.htacces

El proceso será el mismo que antes:

  • Copia de seguridad del archivo
  • Incluir en el archivo el siguiente código:

&lt; IfModule mod_deflate.c&gt;Insertar filtros #AddOutputFilterByType texto DESINFLE / plain

AddOutputFilterByType texto DESINFLE / html

AddOutputFilterByType DESINFLE text / xml

AddOutputFilterByType DESINFLE text / css

AddOutputFilterByType DESINFLE application / xml

AddOutputFilterByType aplicación DESINFLE / xhtml + xml

AddOutputFilterByType aplicación DESINFLE / rss + xml

AddOutputFilterByType DESINFLE application / javascript

AddOutputFilterByType aplicación DESINFLE / x-javascript

AddOutputFilterByType aplicación DESINFLE / x-httpd-php

AddOutputFilterByType aplicación DESINFLE / x-httpd-fastphp

AddOutputFilterByType DESINFLE imagen / svg + xml

# Caída de los navegadores problemáticos

BrowserMatch ^ Mozilla / 4 gzip de sólo-text / html

BrowserMatch ^ Mozilla / 4 \ 0.0 [678] no-gzip

BrowserMatch \ BMSI [E]! No-gzip! Gzip de sólo-text / html

# Asegúrese de que los servidores proxy no entregan el contenido incorrecto

Cabecera de anexión Vary usuario env -Agente =! Dont-variar

<!– IfModule –>

  • Sustituye el archivo
  • Haz la prueba de velocidad y compara

Este sistema a mí no me gusta mucho, pero si te ha servido ya está bien.

Si ves problemas en tu web, vuelve otra vez a sustituir el archivo modificado por el original y todo volverá a la normalidad.

Tercer truco para activar Zlib. Modificando Functions.php

Y finalmente el último truco.

Este es el que yo suelo usar más por sus buenos resultados.

En este truco modificaremos el archivo functions.php, que te encontrarás, al igual que el header.php, en la carpeta del tema de tu WordPress.

Si miras en el primer truco verás la ruta para acceder en 1and1.

Al archivo functions.php le has de añadir el siguiente código:

if(extension_loaded(“zlib”) && (ini_get(“output_handler”) != “ob_gzhandler”))
add_action(‘wp’, create_function(”, ‘@ob_end_clean();@ini_set(“zlib.output_compression”, 1);’));

Sigues el mismo proceso de sustitución que te comentado en los anteriores trucos.

Ahora, al hacer las pruebas de velocidad deberías ver que va casi el doble de rápido, es decir que descarga en la mitad de tiempo.

Bola extra

Antes te he comentado que otro de los problemas con el que te puedes encontrar al hacer SEO onpage en tu WordPress es que 1and1 usa IP Alemanas.

El hecho de que la IP no sea nacional (del país que seas) es un problema para tu SEO, ya que Google le da prioridad a las IPs locales.

Para resolver esto, escribí hace algún tiempo un artículo que te ayudará a resolver ese problema.

El articulo se titula: “Usa Hreflang para mejorar tu SEO“.

hreflag para tu SEO

Conclusión

El mejor truco para conseguir que tu web vaya más rápida de verdad va a pasar por que cambies de hosting.

Yo siempre recomiendo Webempresa a mis clientes, pero hay muchos otros que funcionan muy bien.

Evidentemente no son tan baratos como 1and1, pero ya sabes el dicho: “Lo barato sale caro”.

¿Cómo te ha ido? ¿Te ha funcionado bien? ¿Has conseguido más velocidad?

Cómo reducir el tamaño de las fotos de tu web

Hoy quiero hablarte de cómo reducir el tamaño de las fotos de tu web, un tema que me parece crucial.

Este será el último post hasta septiembre… y quiero asegurarme que, a la vuelta, no voy a escuchar más excusas del tipo ” Yo es que no sé cómo reducir el tamaño de las fotos para la web… ¡Menudos diseñadores web éstos!

Me parece increíble que uno de los errores más habituales que encuentro en las auditorias web sea que haya que reducir el tamaño de las fotos porque pesan una barbaridad.

Reducir el tamaño de las fotos de una web es una práctica que debes dominar si quieres resultados de tu web, así que no quería dejar pasar la oportunidad de hablarte de cómo comprimir fotos para hacer más óptima tu web.

Cómo reducir el tamaño de las fotos

¿Por qué hay que reducir el tamaño de las fotos de tu web?

Las imágenes sin optimizar, sin comprimir correctamente, tienen un efecto muy negativo en la efectividad de una web.

¿Por qué? Pues porque la hace terriblemente lenta y eso repercute negativamente en:

  • El SEO: Ningún buscador posicionará bien una web que tarda en cargar
  • La Usabilidad: No es cómoda de usar una web en la que tienes que estar esperando que cargue la siguiente página
  • La Eficiencia de la web: ¿Tu esperarías segundos a que cargue una web o harás una nueva búsqueda para encontrar una alternativa?

Saber reducir el tamaño de de las fotos, optimizar imágenes para la web, saber comprimir correctamente las imágenes es imprescindible para cualquier diseñador web

¿Cuál es mejor tipo de imagen para mi web?

Cómo sabes, no puedes usar cualquier tipo de imagen para tu web. Un tiff, por ejemplo, sería una muy mala elección.

Los formatos estándar de imagen para la web son:

Todos ellos basados en mapas de bits o, también llamados ráster.

También existe un formato vectorial que puedes usar en tu web (y no es flash, no):

¿Cuando se debe utilizar uno u otro formato?

GIF es un formato decano de imagen comprimida que se ha recuperado ultimamente en las redes sociales, aunque llevaba ya unos años en el olvido.

Este formato tiene la desventaja de usar sólo 256 colores y el acierto de posibilitar pequeñas animaciones gracias a que funciona por capas.

Incluso tiene una capa transparente.

Este formato se comprime bajando la cantidad de colores utilizados por la imagen, por lo que en una época fue muy útil para imágenes planas, dibujos y/o logotipos.

Plátano animado en gif

Imagen original de hatandriyapramusesa

JPG es el formato comprimido más conocido y utilizado en la web.

Aunque puede usar millones de colores, cuanto más comprimida está la imagen menos resolución tiene, aunque da muy buen resultado si se equilibra correctamente la fidelidad original con la compresión moderada.

Imagen en JPG

Imagen original de www.neuronagroup.cl

PNG es un formato que se queda un poco a medio camino entre el GIF y JPG.

También puede trabajar con millones de colores (PNG 24) y, además, incluye la posibilidad de crear fondos transparentes con una capa Alpha.

Aunque se inventó para ser un formato sin pérdida, no deja de ser una evolución de GIF.

Sería el formato perfecto si no fuese el más pesado de todos.

SVG es un formato que, a diferencia de los anteriores, está basado en vectores y no en mapas de bits.

Aunque no es todo lo conocido que debería, lleva muchos años en la web y parece que cada vez tiene más adeptos.

Tiene muchas ventajas y todos los números para sustituir finalmente al GIF:

  • Pesa muy poco
  • Se redimensiona sin pérdida
  • Está aceptado y recomendado por el Consorcio WWW

La desventaja es que está limitado su uso a imágenes planas, logotipos y/o dibujos

Diferencia entre imagen raster (mapa de bits) y vector

imagen original de wikimedia.org

Optimizar imágenes para la web

Compresión de imagen

Imagen original de http://s.culturacion.com

El primer consejo que te voy a dar para reducir el tamaño de las fotos es que debes aprender a usar los formatos de imagen según el caso.

Saber escoger correctamente cuando usar jpg, png o svg será definitivo para que tu web sea más usable.

Pero también tienes que saber cuando no usarlas.

Es una postura inteligente usar fuentes web (como las Google Fonts), efectos visuales CSS (como degradados) frente al uso de las imágenes. La carga será mucho más rápida y eficaz si evitamos usar imágenes de forma gratuita.

En cuanto a la optimización de imágenes para reducir el tamaño de las fotos, hay una regla que debes seguir y que yo les repito a mis alumnos hasta la saciedad:

Para comprimir fotos o imágenes de forma correcta debes seguir siempre unas pequeñas reglas:

  • El tamaño de tu imagen debe estar al 100% cuando se muestre en la web
  • Tus imágenes deben tener la resolución de pantalla. Actualmente hay una pequeña guerra entre dos formatos de resolución:
    • Resolución de pantalla estándar: 72 ppi
    • Retina

Retina es un sistema que aplica Apple a sus dispositivos, sobretodo móviles, que mejora ampliamente la calidad de visionado de las imágenes.

¿Qué resolución escoger?

Pues dependerá de cuál sea el público objetivo de tu web.

Si éste es clase alta, diseñadores, profesionales liberales, etc… Es decir, personas que por su poder adquisitivo o profesión consumen dispositivos Apple, necesitarás aplicar Retina, para el resto de webs, la resolución estándar es más que suficiente.

Que no debes hacer nunca con las imágenes para la web

  • No redimensiones nunca a la baja tus imágenes: Aunque la veas más pequeña, la imagen sigue siendo grande y sigue pesando lo mismo: demasiado.
  • No redimensiones nunca al alta tus imágenes: Si tu imagen es más pequeña y la redimensionas a un tamaño mayor sólo conseguirás que se vea pixelada
  • No vuelvas a subir una imagen que ya está subida: No lo necesitas, vuelve a enlazar la misma imagen… Sí, se puede hacer. Ten el detalle de poner la fuente de procedencia y asegúrate que no tiene derechos de publicación antes de usar una imagen de terceros.
  • No comprimas demasiado: Deformarás la imagen y tu web dará la sensación de una web amateur.

Si sigues estas prácticas harás todo lo contrario a reducir el tamaño de las fotos. 

Los mejores programas para optimizar imágenes para web

optimizar imagenes para web

imagen original de http://i.emezeta.com

Adobe Photoshop

Reconozco que no soy especialmente amigo de Photoshop para la optimización de imágenes web, pero como estoy seguro que o la usas o has oído hablar de ella, voy a comentarla un poco por encima.

No la recomiendo especialmente ya que, aunque con Photoshop se puede manipular la compresión y el tamaño de una imagen, el resultado aún sigue siendo más grande de lo que debería ya que deja mucha información innecesaria dentro de la imagen.

De todas formas, te incluyo un acceso donde los amigos de 40 de fiebre explican paso por paso, cómo usar Photoshop para comprimir imágenes:

Compressor.io

Este es un servicio online que recomiendo para quién no se quiere complicar demasiado la vida.

Comprime todos los formatos de imagen que te he comentado en este artículo e incluso tiene la opción Lossless que comprime sin pérdida de calidad.

En este vídeo te explica cómo utilizarlo para tus imágenes

Kraken.io

También muy recomendado.

Incluye los mismo servicios que Compressor.io y más opciones.

A mi me gusta especialmente la posibilidad de comprimir una imagen con sólo la URL de la misma.

TinyPNG

Esta es otra aplicación online con la que podrás subir 20 imágenes al mismo tiempo y de hasta 5 MB cada una.

Además, si usas WordPress, dispones de un plugin con el que podrás comprimir las imágenes desde tu propia web.

En este vídeo verás como usar TinyPNG.

FILEminimizer Pictures

FILEMinimizer Pictures es una pequeña maravilla gratuita que puedes instalar en tu ordenador para reducir tamaño de fotos e imágenes.

Este programa es capaz de reducir cualquier imagen hasta en un 98% y sin pérdida de calidad.

Trabaja con los formatos JPG, BMP, GIF, TIFF, PNG y EMF y con un tamaño máximo de 5 megas.

No es que recomiende FILEminizer Pictures, debería ser obligatorio para cualquier desarrollador o webmaster.

Te dejo un vídeo para que aprendas a usarlo, aunque verás que es extremadamente sencillo:

Conclusión

Creo que ya no tienes ninguna excusa para reducir el tamaño de tus fotos o imágenes en tu web.

Espero que este artículo te ayude a optimizar las imágenes de tu web y, por tanto, optimizar la carga de tu web y así mejorar los resultados de ésta.

¿Conoces otras técnicas para optimizar las imágenes de tu web? ¿Sabes de algún programa que no haya comentado y te buenos resultados?

WordPress 4.5.2, la actualización crítica que debes instalar ahora

Se ha publicado WordPress 4.5.2, una actualización crítica que debes instalarte de forma inmediata.

El pasado día 18 de Abril te hablaba de la nueva versión de WordPress 4.5, que incluía algunas mejoras significativas para tu web o blog.

Posteriormente se han publicado dos actualizaciones más: 4.5.1 y 4.5.2.

En este post voy a comentarte de qué van estas dos nuevas actualizaciones y por qué debes instalártelas urgentemente, sobretodo la 4.5.2

La nuevas actualizaciones de WordPress 4.5

Tras la actualización de WordPress 4.5 se detectaron algunos problemas de compatibilidad con algunos plugins y temas.

Es muy habitual que los mismos usuarios reporten estas cuestiones a la compañía para solucionarlas.

Así que se liberó la versión 4.5.1 para solucionar estos problemas

WordPress 4.5.1

Pocos días después del lanzamiento de WordPress 4.5, se liberaba 4.5.1.

Esta nueva actualización soluciona hasta 12 errores que se habían localizado.

Quizás el más importante sean  las correcciones para el tema Twenty Eleven, el cual daba problemas con algunas versiones de Chrome y el editor visual de WordPress.

Otro problema destacado que se soluciona con esta versión se refiere a Imagick (una extensión PHP para crear y modificar imágenes. Puedes ver más información en la siguiente URL: http://www.desarrolloweb.com/articulos/intro-imagick-php.html).

El problema era que hacía imposible la carga de archivos multimedia como imágenes o vídeos.

Otros errores que se solucionan en esta versión los encontrarás en este link:

https://core.trac.wordpress.org/log/branches/4.5?rev=37295&stop_rev=37182

Así que al actualizarte a WordPress 4.5.1 se te solucionan muchos problemas de compatibilidad que se habían detectado en esta versión

Por qué debes actualizarte a WordPress 4.5.2 ahora mismo

Hace escasamente 3 días que se ha liberado la versión 4.5.2, a la que llamo crítica por lo necesario de su actualización.

Según ha publicado WordPress.org en su artículo “WordPress 4.5.2, actualización de seguridad”, parece ser que se han detectado graves problemas de seguridad en esta versión del CMS que se solucionan con esta actualización.

Parece ser que todas las versiones anteriores de WordPress sufren un agujero de seguridad en una librería externa de subida de archivos llamada Plupload.

Y también parece que este problema se remonta a la versión 4.2 y lo hace vulnerable a un ataque de XSS reflejo si se utilizan URLs creadas con la librería MediaElements.js.

En esta versión se han actualizado tanto MediaElements.js como Plupload para corregir esta brecha de seguridad, por lo que podrás estar un poco más tranquilo en lo que respecta a seguridad de tu WordPress.

Conclusión

Como puedes ver, actualizarte a WordPress 4.5.2 ya no es una opción para tu web o blog.

Te recomiendo que leas el artículo “¿Te conviene actualizar a WordPress 4.5? donde te explico los pormenores de esta nueva versión de WordPress, por qué y cómo actualizar tu web de forma segura y sin problemas de compatibilidad.

Si tienes más información sobre esta nueva versión de WordPress, te animo a que la cuentes en los comentarios.

¿Te conviene actualizar a WordPress 4.5?

El pasado viernes actualicé la web a la nueva versión de WordPress, WordPress 4.5

Cualquier actualización de WordPress suele ser una gran noticia, no en vano el 25% de las webs que corren por la red están hechas sobre este CMS.

Pero siempre que te enfrentes a una actualización hay que tener cuidado.

Por eso en este post, no sólo te voy a explicar las novedades que trae la nueva versión de WordPress, también te voy a explicar como actualizarte y qué problemas se han detectado y cómo solucionarlos

Las Novedades en WordPress 4.5

En este enlace tienes todas las novedades que lleva esta nueva versión de WordPress:

https://codex.wordpress.org/Version_4.5

De todas formas, voy a comentarte las que me parecen más interesantes o destacadas:

Previsualización de tema

Una de las novedades que más se ha destacado de esta actualización es la posibilidad de visualizar, mediante unos pequeños iconos que encontrarás en el Personalizador, como quedará tu web tanto en formato navegador estándar, móvil y/o Tablet.

Visualizador Responsive de WordPress 4.5

Esto es muy práctico cuando estás diseñando tu web, ya que así te evitas tener que ir haciendo visualizaciones directamente en los diferentes dispositivos.

Logotipo desde personalizador

Otra novedad muy comentada es que ya puedes añadir tu logo directamente desde el mismo personalizador, cosa que no ocurría hasta ahora con los temas por defecto de WordPress.

Incorporar Logo desde el personalizador de WordPress

Atajos en el editor de texto

Esta novedad me parece especialmente práctica.

Se trata de una serie de “atajos” de texto con los que podrás añadir algunos formatos:

  • Si añades el acceso ´code´ para ingresar código en el texto
  • Si añades un asterisco “*” antes y después de un código consigues el texto en cursiva
  • Con un doble asterisco “**”, antes y después del texto consigues que el texto esté en negrita

Esto mejora la productividad de trabajo.

Nuevo sistema para Enlaces

También se ha incluido una nueva forma de poner enlaces en los textos. Se trata de un sistema en el que se crean los enlaces sin necesidad de abrir la ventana de edición de los links.

Nuevo sistema de enlaces

Al pulsar el botón de enlace del editor, se abrirá un acceso justo al lado del texto para poner el enlace y con la posibilidad de hacer configuraciones más avanzadas.

Email de comentarios en HTML

Hasta ahora los emails que enviaba WordPress para los comentarios se enviaban en formato de texto.

Este nuevo WordPress 4.5 los enviará en formato HTML, con lo cual se verá más claramente si nos quieren colar un enlace en los comentarios, por ejemplo.

Email de comentarios

Soporte para AMP

Amp es una tecnología de mejora de carga en dispositivos móviles.

Desde luego es un acierto haberla incluido en esta actualización

Nuevo sistema de carga de imágenes

Esta es una de las novedades que más me gustan a mí.

Se trata de un nuevo sistema de gestión de carga de imágenes que incluye la compresión sin pérdida. ¡¡Hasta un 50% de mejora!!

Acceso a backoffice con email

Otra novedad interesante es que a partir de esta nueva versión, no solo podrás entrar en le backoffice de WordPress con tu usuario, también podrás usar el email como usuario.

Acceso a Backoffice, antes y después

Otras mejoras

Evidentemente, te he contado las más sonadas, pero también hay mejoras para las webs multi-sitio, de seguridad y de rendimiento.

¿Me actualizo ya a WordPress 4.5?

Yo te recomendaría que sí, que te actualizases.

Aunque sea sólo por las mejoras de seguridad y rendimiento ya vale la pena (yo he notado cierta mejora en el rendimiento de la web)

Pero, siempre hay un pero, antes de actualizar, sigue estos pasos:

  1. Siempre haz una copia de seguridad de tu web
  2. Asegúrate de tener actualizados todos tus plugins para no tener problemas de compatibilidad
  3. Asegúrate de tener la última versión de tu tema para no tener problemas de compatibilidad
  4. Actualiza a WordPress 4.5 y pruébalo

¿Qué hago si mi web deja de funciona bien?

Si ves que algo te da problemas, sigue estos pasos:

  1. Desactiva todos los plugins, si todo va bien entonces
  2. Actívalos uno a uno y antes de activar el siguiente y prueba que no se reproduce el problema.
  3. Haz esto hasta que veas qué plugin te da el problema.
  4. Una vez localizado, busca una alternativa y asegúrate que no te da el mismo problema.

¿Se han detectado problemas de compatibilidad con algún tema?

De hecho sí.

Por ejemplo, mi tema Enfold (de Envato), trajo una actualización del tema el mismo día de la actualización de WordPress que corrigen algunos problemas.

Así que ya sabes, si tienes Enfold y quieres tener Wordpres 4.5: Actualiza tu tema

Pero no es el único.

Se sabe que el tema Avada 3.9.3 está dando un error de JavaScript.

Por suerte, existe un parche, que puedes descargar desde aquí:

https://theme-fusion.com/knowledgebase/avada-3-9-3-fix-wordpress-4-5-compatibility/

En esta misma página tienes toda la información sobre cómo proceder para solucionar el problema.

También se han encontrado con problemas los usuarios de temas con Visual Composer, el plugin de composición visual.

Ya se ha publicado que próximamente habrá una actualización que resolverá el problema.

Lo mismo podría pasar con tu tema, así que antes de actualizar asegurate que no tendrás ningún problema. No he podido comprobarlos todos.

Si ocurre lo mismo con el tema de tu web, sólo tienes dos opciones:

  1. Cambiar de tema, aunque ya sé que para ti no es una opción
  2. Volver a la versión anterior de WordPress (¿ves para que necesitabas una copia de seguridad?) y esperar próximas actualizaciones de tu tema.

Conclusión

Aún tengo que probarlo más a fondo, pero mi opinión es que una buena actualización y que todas las webs deberían actualizarse dentro de la medida que no les cree ningún problema.

Te dejo el vídeo oficial de la actualización.

Antes de acabar me gustaría que me comentases tu experiencia con la nueva versión de WordPress 4.5 y si te has encontrado con algún problema.

¿Cómo mejorar la experiencia de usuario en tu web?

A estas alturas, yo creo que todos estamos de acuerdo en que la experiencia de usuario es un factor definitivo en la convertibilidad. Y es que es que, en la web, la experiencia de usuario lo es todo:

La experiencia del usuario definirá si tus usuarios rebotan de tu web, si convierten y si vuelven a tu web.

¿Qué define la experiencia de usuario?

Si tuviese que darte una definición te diría que la experiencia de usuario es:

“El conjunto de percepciones y sensaciones que desarrolla un usuario durante su relación e interacción con los elementos de tu identidad digital y, en concreto, con tu sitio web” Extraído del curso de Marketing online de IAB

Es decir, en la experiencia de usuario recae la percepción que tendrá el usuario de tu web a partir de su primera visita y condicionará su actividad en ella.

Es como la primera impresión de una persona a la que acabas de conocer.

Hay veces que una persona no nos cae bien a la primera, aunque no sabes muy bien por qué… No pasa nada, es normal… pero claro, no harás nunca negocios con alguien que no te cae bien.

Lo mismo ocurre en la web, cual comercial cualquiera, tu web debe caerle bien a todos tus usuarios, si no ellos no interactúan con ella y difícilmente convertirán.

El Diseño Web como factor influyente en la experiencia de usuario

Diseño Web como factor influyente

 

El factor más importante en la experiencia del usuario es el diseño de tu web y debes planificarlo con detalle y cuidado si quieres que sea efectivo, planteándote los objetivos que ha de conseguir dicho diseño.

Objetivos del diseño web

El diseño de tu web debe cumplir una serie de objetivos si quiere formar parte de una agradable experiencia de usuario:

  • Debe haber una coherencia de todas las acciones online.
  • Una imagen de marca clara y aplicada correctamente.
  • Una aproximación a la experiencia global del usuario en la web.

Recuerda que tu web será la referencia de marca que tendrán tus usuarios en Internet y por tanto también tu escaparate al mundo, por tanto hay que cuidar tanto la imagen de marca como la usabilidad del sitio. Este es el truco.

Otros actores influyentes

 

Evidentemente los actores influyentes en la experiencia de usuario son múltiples y amplios, pero me gustaría destacar los siguientes:

  • Valor añadido y utilidad de la propuesta.
  • Solvencia a las necesidades de tu público objetivo.
  • Valor de marca en Top of Mind.
  • Diseño gráfico de la web.
  • Usabilidad o facilidad de uso de la web.

Valor añadido y utilidad de la propuesta

Si tu propuesta no mejora o amplía la oferta de tu competencia difícilmente le darás a tus usuarios la oportunidad de escogerte.

Procura que tu web aporte valor a tus usuarios, que les sean útiles tus propuestas y que mejoren las de tu competencia.

Si tus usuarios comparan y encuentran un valor añadido en tus contenidos sabrán valorarlo positivamente.

Solvencia a las necesidades de tu público objetivo

Ser solvente a la hora de solucionar las necesidades de tu target será definitivo para mejorar la experiencia de usuario en tu web.

Los usuarios de la web pasan muchísimo tiempo buscando información que solucione sus problemas, si identifican tu web como un espacio de referencia para resolver problemas concretos. Evidentemente la experiencia de usuario en un espacio así será muy satisfactoria.

Valor de marca en Top of Mind

Conseguir que tu marca sea top of mind no es una tarea fácil, lo sé. Pero si consigues que la relación intelectual y emocional del usuario vincule propuesta y marca tendrás clientes fieles y evangelizadores de tu web.

Para ello debes aplicar una estrategia intensa de promoción de tu marca en la web,a provechando cualquier circunstancia para lanzar tu mensaje y, evidentemente, cumplirlo.

Diseño gráfico de la web

Habitualmente se confunde diseño web y diseño gráfico de la web.

El primero se refiere a todos los aspectos a tener en cuenta en la realización de un espacio web, el segundo se refiere exclusivamente al valor visual de dicha web. Por tanto el diseño gráfico de la web es solo uno de los elementos que engloba el diseño web.

Para realizar un diseño gráfico de la web correcto debes tener en cuenta multitud de cuestiones, entre ellas la aplicación de la imagen de marca y la coherencia de los elementos gráficos y su usabilidad en la distribución.

Gran parte del éxito de una estrategia de experiencia de usuario se basa en la “comodidad” que sentirá un usuario al entrar en una web.

Yo, al tener un pasado de dj, a veces comparo del diseño gráfico de la web con la figura de un dj en un local nocturno.

Y es que, aunque todos los elementos dispuestos en el local nocturno (buena oferta, gran decoración, servicio exquisito…), si el cliente entra en el local y la música no le gusta, marchará y además tendrá un percepción equivocada del local.

En el diseño gráfico de la web ocurre lo mismo: Un mal diseño gráfico puede desconcertar al usuario y tener un percepción de que no es lugar donde satisfará sus necesidades.

Usabilidad o facilidad de uso de la web

Con la Usabilidad ocurre algo parecido al punto anterior, no en vano están muy relacionados.

Si el usuario encuentra dificultades para encontrar lo que busca, si al aterrizar en tu web no sabe como actuar para localizar lo que busca perderás a ese usuario para siempre.

Por lo que te aconsejo que tengas presente siempre esta máxima:

Facilita lo máximo posible el uso de tu web a tus visitantes

Experiencia de Usuaio

Conclusión.

Como has podido ver, conseguir tener un buena experiencia de usuario para tu web no es un trabajo laborioso en que tienes que tener en cuenta múltiples cuestiones.

El criterio principal de toda web ha de ser que: Tu web ha de ser un espacio para tus usuarios.

Muchas de las webs que existen actualmente no tienen todo ésto en cuenta y se construyen según el “gusto” del desarrollador, diseñador o pagador de la web y por eso no consiguen despegar y acaban fracasando.

Espero que este artículo te ayude a mejorar la experiencia de usuario de tu web.

Si te ha gustado comparte y si no, coméntame por qué.

 

La 5 mejores plantillas de diseño web responsive gratis para WordPress

¡Que no te engañen! Ya no es necesario comprar temas o plantillas de pago para tener un buen diseño responsive.

Hoy te traigo una lista con las mejores plantillas o themes diseño web responsive gratis para WordPress.

 

¿Qué es el diseño responsive?

El diseño responsive, sensible o adaptable es un tipo de diseño en el la web se adapta a las pantallas que lo reproducen. Esto se consigue redistribuyendo los elementos de la página por columnas dependiendo del tamaño de ésta, así siempre se adaptará al disposivo que lo reproduzca.

¿Por qué es tan importante el diseño Responsible?

No es necesario repetir lo que comenta el vídeo, pero sí quiero aportar algo nuevo sobre la importancia de este tipo de diseño web:

Por usabilidad

A parte del ahorro de trabajo que supone para el programador y/o diseñador de tu web trabajar con este tipo de diseño, también tiene un gran valor en la usabilidad.

Antiguamente, al tener que hacer un tipo de diseño diferente para cada dispositivo era fácil caer en las garras de la creatividad y modificar la línea de diseño haciendo que el usuario, al utilizar un dispositivo que no era el habitual, le resultase incómodo o incluso llegase a pensar que no estaba en el sitio correcto. Evidentemente, esta situación es precisamente la que se intenta corregir con la aplicación de la usabilidad.

Por SEO

Con la entrada de la nueva modificación del algoritmo de Google con la que castiga a las webs que no estén adaptadas a la correcta visualización con dispositivos móviles, la necesidad del uso del uso de temas o plantillas responsive ya no es una opción.

Así que es necesario que todas las webs que no quieran tener una penalización en su posicionamiento en el buscador usen o una plantilla adaptada exclusivamente a móviles o un diseño responsive. Evidentemente la segunda opción es la más utilizada por ser la más lógica y productiva.

La mejores plantillas de diseño web responsive gratis para WordPress

La mejores plantillas de diseño web responsive gratis para WordPress

Imagen original de www.santinavarro.es

Como sabes, estoy especializado en WordPress, así que te voy a enseñar las que yo creo que son las mejores plantillas de WordPress de diseño web responsive gratis, de manera que tu web pueda seguir funcionado con la seguridad de no ser penalizada por Google, sin problemas de usabilidad y sin gastarte un solo duro.

Puedes descargarte los temas de forma totalmente gratis, clickando sobre la imagen de cada theme.

Spacious

 Spacious

imagen de http://dejujo.com/

Este es uno de mis temas favoritos, ya no solo por ser gratis, además es que tiene una gran calidad. Incluye widgets, slider y viene, entre otros idiomas, en español. Toda una joyita.

Attitude

Attitude

imagen original de http://dejujo.com/

Otra maravilla. Un tema con diseño web responsive gratis versátil y con muchas funciones. Incluye 5 plantillas de página, 5 áreas para widgets, widgets personalizados, iconos para redes sociales y con muchas posibilidades de personalización. Este tema lo recomiendo, especialmente, para webs corporativas.

Asteria Lite

Tema Asteria

Imagen original de www.sourcewp.com

Es la versión gratuita de un tema de pago que, evidentemente, lleva menos opciones que su versión Premium. Aún así es un gran tema y del tipo Multi-Purpose, es decir, que se puede usar para diferentes temáticas.

Incluye iconos sociales, 3 tipos de páginas, botón de ancho completo, barra lateral izquierda y una plantilla para blogs. También incorpora el modo “en mantenimiento“, galerías de imágenes y es totalmente compatible con Woocommerce.

Fullby

Fullby

Imagen original de http://i0.wp.com/

Otra versión limitada o “lite” de un tema de pago. Este tema está muy orientado a blogs.

Este tema incluye infinidad de opciones pero la web (http://www.marchettidesign.net/fullby/) no deja muy claro que opciones son de pago y cuales gratuitas. Aún así te invito a que la pruebas y descubras tu mismo las posibilidades del tema.

Gridby

Gridby

imagen original de http://www.marchettidesign.net

Otro tema del mismo diseñador que Fullby. Este también es la versión lite de un tema premium. Para descargártelo te pedirá que le envíes un Twitter o un mensaje a Facebook desde su web, lo cual me parece barato a cambio de un tema como este.

El tema está orientado a uso de web personal e incluye un sistema Grid para presentar imágenes o posts, una plantilla para la home, otra para blog, soporte para Youtube, tipos de letra web, boostrap, galerías y dos tipos de menús entre muchas otras cosas.

Conclusión

Como puedes ver, tener una web con aspecto profesional no tiene por qué costarte mucho dinero.

Evidentemente, todos estos temas de diseño web responsive gratis tienen algunas carencias, sobretodo en las posibilidades de personalización, aún así son una excelente opción para empezar o para webs personales y sin aspiraciones comerciales.

Cómo aumentar el límite de memoria de WordPress

Estos días lo he pasado francamente mal por culpa del límite de memoria de WordPress.

Como sabes este blog está construido con WordPress y uso el tema Enfold (tema más que recomendable y muy usado por su versatilidad). En los últimos días pretendía darle una lavada de cara a la web y me quedé a medias…

Sin previo aviso, el tema dejó de funcionar bien. El problema era, ni más ni menos, que de memoria baja en WordPress.

Así que, como puedes ver, un bajo límite de memoria de WordPress puede acarrear muchos problemas.

Hoy voy a explicarte como aumentar la memoria asignada a WordPress.

Aumentar el límite de memeoria de WordPress

¿En qué casos se debo aumentar la memoria de WordPress?

En casi todos… Normalmente la instalación de WordPress lleva configurada una limitación muy baja de memoria ya que no tiene en cuenta que WordPress irá creciendo con el uso: le añades plugins, temas, actualizaciones... y esas funcionalidades precisan de memoria para funcionar.

El error más habitual es:

Fatal error: Allowed memory size of 33554432 bytes exhausted

¿Cómo saber la limitación de memoria de mi WordPress?

Hay varias maneras pero la más práctica y que menos te complicará la vida es, como siempre, un plugin llamado TPC Memory Usage y que puedes instalar directamente desde “Plugins” de tu WordPress.

TPC Memory Usage

Ampliando el límite de memoria de WordPress

He visto que por la red dan diversas soluciones. Yo sólo te daré una y una alternativa que complementa ésta primera, ya que la he probado y sé a ciencia cierta que funciona.

Antes de empezar debo decirte que por mucho que aumentes el límite de memoria de WordPress el límite estará en la memoria que está asignando tu hosting.

Aunque le aumentes la memoria en 256, si el límite de hosting está en 64, en 64 se quedará.

Si sigues los pasos tal cuál te los digo verás que es muy fácil y no has de tener ningún problema.

Aclarado esto, arremángate que hoy tocamos código.

1- Descarga wp-config.php.

El primer paso será descargar, vía FTP, el archivo wp-config.php, que encontrarás en la raíz de tu wordpress a tu ordenador. ¡NO BORRES NADA!

EStructura de archivos de WordPress

2- Añadir una línea de código en este archivo.

Es muy importante que para este paso uses un programa que no te formatee el archivo, por eso nunca debes modificar el código con programas tipo Word o Wordpad.

Yo te aconsejo que uses:

  1. Notepad++. Es el que uso. Va genial, es fácil y totalmente gratuito.
  2. Blog de Notas. No es lo mejor pero te hace el apaño. Lo encontrarás instalado en tu Windows como Accesorio de Windows.
  3. Adobe Dreamweaver. Programón que toda persona vinculada a la web, sobretodo si son diseñadores web o desarrolladores, debe conocer. Este no es gratis para nada y vale una pasta.

Abres el archivo wp-config.php que te has descargado y localizas la siguiente linea de código:

define('NONCE_SALT', 'pon aquí tu frase aleatoria'); // Cambia esto por tu frase aleatoria.

Escribe justo debajo de esta línea escribe el siguiente código:

define('WP_MEMORY_LIMIT', '64M');// cambia la memoria.

El “64” puedes cambiarlo por la cifra que tu creas conveniente. Normalmente poniéndolo “64” ya es suficiente.

Antes de guardar el archivo asegúrate que la linea de código que acabas de añadir está antes de la siguiente:

require_once(ABSPATH . 'wp-settings.php');

Normalmente esta línea está al final del archivo wp-config.php, pero asegúrate por que si no, no funcionará.

3- Subir el archivo modificado.

Ahora vas a subir por FTP el archivo wp-config.php modificado.

Antes de sustituirlo, haz una copia del archivo original wp-config.php, ya que si hubiese algún problema siempre podrías restaurarlo y dejarlo como estaba.

Ahora puedes ir a TPC Memory Usage y ver si el límite de memoria es el que tu le has configurado. Si es así ¡Enhorabuena! Ya sabes como aumentar el límite de memoria de WordPress.

Si no, revisa los pasos:

  • El archivo que está activo es el que has modificado.
  • No te has equivocado escribiendo el código.
  • Has añadido el código donde te he dicho y no en cualquier otro sitio.

Si estás seguro que está todo bien, sigue los pasos que te voy a explicar.

No ha funcionado el sistema para aumentar el límite de memoria de WordPress ¿Qué hago?

Pues no va a quedar otra que tocar otro archivo de Wordpres para aumentar el límite de memoria de WordPress.

En este caso vas a ir por FTP a la carpeta “wp-includes” y vas a descargar el archivo: default-constants.php

Lo vas a abrir con alguno de los editores de texto que te he recomendado antes y localizar el siguiente código:

// set memory limits
if ( !defined(‘WP_MEMORY_LIMIT’) ) {
if( is_multisite() ) {
define(‘WP_MEMORY_LIMIT’, ’64M’);
} else {
define(‘WP_MEMORY_LIMIT’, ’40M’);
}
}if ( ! defined( ‘WP_MAX_MEMORY_LIMIT’ ) ) {
define( ‘WP_MAX_MEMORY_LIMIT’, ‘256M’ );
}
/**

En negrita te he marcado la linea que debes modificar. Sustituye el ‘40‘ de esa línea por el mismo valor que has puesto en  wp-config.php.

Guarda el archivo, cierra y (previa copia de seguridad del archivo original) sustitúyelo por el original.

¡Voilà! Ya ha aumentado el límite de memoria de WordPress.

Conclusión.

Te puedes evitar muchos problemas al aumentar el límite de memoria de WordPress. Ya has visto que es muy sencillo y práctico.

Si crees que hay alguien a quién le puede ser útil o interesante el artículo envíaselo y si quieres comentarme algo, ya sabes que tienes los comentarios a tu disposición.