Hasta hoy en mis Bios aparecía el siguiente texto:
Bloguero, diseñador y formador, no necesariamente en ese orden. Trabajo como autónomo desde comienzos de siglo aunque me gusta más aquello de freelance por lo del free (no confundir con gratis). Si necesitas servicios de diseño, formación o publicidad contáctame, estaré encantado de colaborar.
Hoy lo he cambiado:
Profesor en la Escuela de Arte y Diseño de Sevilla. Ex-freelance. Ex-diseñador web. Ex-perto en Lorem Ipsum.
Sin tenerlo planeado y después de muchos años cambio de perfil profesional y sobre todo de vida. Siempre defendí el freelancismo aunque de vez en cuando me quejara como cualquier otro de la falta de corporativismo, de la dejadez de los gobiernos para mejorar nuestras condiciones, de los clientes tóxicos… Pese a todo lo malo la libertad de la que he disfrutado todos estos años es impagable.
He podido disfrutar y mucho de toda la infancia de mis hijas. Ser dueño de tu tiempo será algo que eche mucho de menos. Esto obviamente es el recuerdo general, el puntual me estresa todavía:
cuando el cliente exigía entregas para ayer,
cuando no dabas con el punto y coma que te fastidiaba el script hasta las 5 de la mañana o cuando te lo llevabas contigo a la cama,
cuando llegaban las vacas gordas y con ellas las sobrecargas, etc.
En todos esos momentos no eres dueño de tu tiempo ni de tu vida, eres un esclavo del trabajo. Afortunadamente a lo largo de los años aprendí a (y pude) decir no. Ese free(lance) intenté que consistiera en buscar la mejor calidad de vida para mí y para mi familia más que la posibilidad de no tener techo de ingresos.
Aún hoy me cuesta entender cómo algunos compañeros se sienten orgullosos de trabajar a destajo etiquetándose como #workaholic (trabajólico, ergómano, trabajoadicto o similar). Obsesión por el emprendedurismo cuando no se es más (ni menos) que un freelance. Publicaciones a veces adornadas con frases motivacionales que provocan vergüenza ajena. BTW, si de verdad tienes tanto curro dedícate a ello en vez de hacerte la fotito, buscar frases motivacionales y ponerte a responder los comentarios de tu séquito de ignorantes aduladores.
Claro que estos perfiles sociales están llenos de ego y después del post del workaholic llega el del selfie con gin-tonic. Creo humildemente que estas posturas ayudan poco al sector del autónomo. La imagen que se da es la que muchos clientes proyectan luego en sus demandas por ejemplo con llamadas a deshora porque se supone que trabajamos 24/7.
Mi horario y vacaciones han sido sagradas (y personales) aunque para ello haya tenido que bloquear algún cliente. No siempre es fácil obtener el respeto en una jungla donde el papel del freelance es el último de la cadena.
Todos estos pensamientos me acompañaron todos estos años pero nunca, nunca, pensé en abandonar. Las bondades del freelancismo superaban sus penurias. He tenido mucha suerte, nunca tuve que buscar los trabajos, gracias al boca a boca y a esta web me contactaron todos los clientes. He cobrado el 99,9% de las facturas que he emitido, el 75% en su fecha. He disfrutado de mi trabajo, he sido libre y feliz. Dejo el freelancismo con cierta pena, seguiré alentando a mis alumnos a que valoren esta opción laboral, al menos durante algún tiempo de su vida.
¿Entonces por qué leches lo dejo? Realmente todo ha sido un cúmulo de causalidades, como dice mi amigo José Carnero en esta charla TEDx.
«La historia de un cambio, de una transformación. De cómo convertir los por qués en para qués. Un reflexión sobre lo verdaderamente importante»
Alguien me dijo que iban a salir oposiciones, se podía hacer online, el temario y los ejercicios prácticos versaron sobre el trabajo que llevo haciendo años, los compañeros opositores pidieron otra provincia, aprobamos menos de los que plazas había por lo que a pesar de no tener puntos como interino cogí plaza… Todavía estoy digiriendo este proceso.
Hace mucho que leí que en los 40 era la edad en la que se conseguía la estabilidad laboral, en la que uno dejaba de dar tumbos. Yo tengo 45 y nuestra sociedad está estructurada para que trabajemos cada vez más años, con horario, nómina, jefes, si queremos disfrutar algo de nuestra vejez.
Como freelance siempre me he sentido fuera del sistema (no anti-sistema), me he sentido libre, no dando tumbos, las cuentas me han salido todos los años pero una espinita siempre he tenido ¿el año que viene tendré los mismos ingresos? ¿y dentro de 5? ¿y con 60 años estaré (se seguirán) haciendo webs? ¿podré jubilarme y disfrutar de mi jubilación?
A pesar de no haberme planteado nunca «formar parte del sistema» en estos Tiempos Modernos tengo una responsabilidad con mis hijas y de todas las opciones ser profesor de diseño no es un para mi un cambio, es una evolución. Ser profesor en la escuela pública supone una enorme tranquilidad, la espinita económica me la he sacado y además es algo que me encanta, que llevo mucho tiempo haciéndolo y que además puedo ejercer con cierta libertad.
Cuando me preguntan a qué me dedico antes decía más o menos «Bloguero, diseñador y profesor, no necesariamente en ese orden.» Ahora me cuesta decir «soy funcionario», igual que no me gustaba autónomo y decía freelance ahora me quedo con «profe de diseño» que lo soy desde hace mucho aunque a partir de ahora vaya el primero de la lista.
Familia, amigos y algunos buenos clientes ya lo sabíais, incluso lo hemos celebrado porque…
Las noticias importantes son las que quieres dar en persona y no por las redes sociales.
Los recursos de tu servidor son finitos, el espacio en disco que tienes contratado puede acabarse si no gestionas bien la librería multimedia de tu WordPress. Seguramente cuando haces copias de seguridad es cuando eres consciente del enorme tamaño de tu sitio.
Un altísimo porcentaje de ese tamaño es por la carpeta «uploads» donde se guardan por defecto las imágenes y los archivos que subes a tu WordPress.
Claro que esto es lógico si consideramos que el 53% del peso de una web tipo son imágenes. Aunque no tan lógico cuando descubramos que muchas de las imágenes que guarda nuestro WordPress no sirven para nada.
En este artículo vamos a tratar de reducir en lo posible el tamaño de nuestra carpeta «uploads». Como más que un artículo me ha salido un libro os dejo un pequeño índice y si tienes prisa ve directamente a las conclusiones:
El primer problema es que el tamaño de esas imágenes puede no ser el adecuado, debes optimizarlas, así que lo primero que debes hacer es tener optimizadas esas imágenes, previa subida o mediante plugins como EWWW Image Optimizer o con ShortPixel cuyos brutales resultados explico en Cómo optimizar las imágenes de tu WordPress
El segundo problema, que es el que vamos a tratar en este artículo, es que puedes tener muchas imágenes en tu servidor que nunca se utilizan en tu sitio web, así que veremos cómo identificarlas y cómo deshacerte de imágenes que no sirven para absolutamente nada y están ocupado un preciado espacio.
Lo primero que tenemos que hacer es una copia de seguridad, no sólo de la carpeta uploads sino también de la BBDD.
1. Cómo guarda WordPress la información de las imágenes en la BBDD
La tabla wp_posts además de guardar la info de entradas, páginas, revisiones y CPT guarda la info de cada imagen donde:
post_type será attachment,
post_parent será el ID de la publicación a la que se adjunta
guid se guarda la ruta absoluta al archivo.
Y en la tabla wp_postmeta es donde se almacenan otros metadatos:
_wp_attachment_image_alt guarda el contenido del atributo ALT
_wp_attached_file guarda la ruta relativa dentro de «uploads»
_wp_attachment_metadata guarda la información sobre distintos tamaños de imagen, algo de lo que hablaremos más adelante.
2. Identificar y eliminar las imágenes inútiles de nuestro WordPress
Depende del tipo y edad de tu proyecto:
este sitio, un simple blog de 11 años que tiene 8.649 elementos multimedia que ocupan 2,2 GB
mientras que elfinalde.com con sólo 2 años tiene ya 70.476 elementos que ocupan 26,5 GB
En este artículo veremos cómo reducir el tamaño de esa carpeta:
Identificar esas imágenes inútiles y
Cómo eliminarlas.
2. 1. Cómo identificar imágenes que no usamos
Hay dos tipos de imágenes que debemos identificar:
las imágenes que por algún motivo subimos a nuestro WordPress pero que no utilizamos, serían las imágenes sin adjuntar
una misma imagen suele tener distintas versiones, debemos identificar cuáles usamos y cuáles no
2.1.1.- Identificar elementos multimedia sin adjuntar
Imágenes, vídeos o audios o archivos PDF que subiste pero que no añadiste a ninguna publicación. Estos elementos puedes verlos desde Medios > Biblioteca y en el primer desplegable donde pone «Todos los medios» elegir «Sin adjuntar».
Debes revisarlo de vez en cuando, aquí quedan esas imágenes que subimos desde la biblioteca para un posible artículo pero que nunca llegamos a publicar o imágenes de publicaciones que han pasado a mejor vida porque aunque las hayas eliminado de la papelera los archivos adjuntos no se eliminan.
Pero mucho cuidado, que aunque aparezcan como medios «Sin adjuntar» no siempre significa que no lo utilices. Una imagen sólo se adjunta a una publicación (Entrada, página o Custom Post Type) Va a ser una imagen «Sin adjuntar» aunque útil cuando:
una imagen subida a la biblioteca la usas sólo como Imagen destacada
una imagen subida a la biblioteca la uses en algún widget
subas una imagen desde la edición un widget, aunque la uses en el mismo
Y por último también puede ocurrir que haya archivos adjuntos que no uses. Si escribiendo una entrada subes 10 imágenes pero luego no las insertas serán imágenes «adjuntas» pero inútiles.
Una solución parcial es instalar el plugin Find Posts Using Attachment que nos mostrará un listado de las publicaciones y la forma en que un medio está siendo usado (contenido o imagen destacada) o no usado. La info la tendremos en una nueva columna de la Biblioteca pero también en la página individual de cada imagen. Es una forma mucho más segura de saber si es una imagen útil que simplemente ver si está sin adjuntar aunque no detecta si la imagen se usa en un widget o shortcode.
Otro plugin interesante para la gestión de medios aunque todavía en beta es Media Usage. Este plugin nos muestra en una nueva columna las distintas versiones de una imagen, iconos con la inicial del ID del tamaño. Al hacer clic en ellos accedemos a las estadísticas de uso de esa imagen, por IP y desde qué página. Ojo, como te habrás imaginado una imagen sin visitas no tiene porqué ser inútil.
En cualquier caso antes de eliminar cualquier imagen y como medida extra de seguridad os aconsejo activar la papelera en la Biblioteca de Medios añadiendo esto a wp-config.php
2.1.2. Identificar los tamaños de imagen que me sobran
Todo WordPress crea por defecto distintas versiones de una misma imagen. El número de archivos y sus tamaños vienen definidos por:
Imagen original
La configuración de medios
Imágenes responsive añadidas por el propio Core
El tema que utilices
Algún plugin
2.1.2.1. Imagen original
El archivo original lógicamente ocupa se guarda y ocupa espacio, no deberíamos subir archivos mayores del tamaño máximo que vayamos a necesitar. Es decir, si el tamaño mayor de imagen que vamos a utilizar es de 1024px de ancho lo ideal es subir todas las imágenes a ese ancho, no más.
Debemos tener en cuenta que si subimos una imagen de menor resolución a otras versiones que necesitamos no se crearán dichas versiones, es decir, WordPress puede escalar una imagen reduciendo su tamaño pero nunca ampliando. Siguiendo el ejemplo anterior si subimos una imagen de 1023 píxeles de ancho la imagen de 1024px no se creará.
2.1.2.2. Imágenes creadas por los ajustes de WordPress
En Ajuste > Medios se especifican 3 tamaños: miniatura, medio y grande que luego puedes utilizar desde el editor, que se creen los 3 dependerá del tamaño del original como explicado en el apartado anterior.
Tendrás que pensar si utilizas estos 3 tamaños cuando:
publicas desde el editor
desde el tema (ver en 1.2.4 cómo averiguarlo)
2.1.2.3. Imágenes responsive añadidas por el propio Core
Desde la versión 4.4 WordPress añade a la etiqueta HTML <img> los atributos scrset y sizes sirviendo un tamaño acorde con la resolución del dispositivo de todos los tamaños disponibles de una imagen. Ahorramos ancho de banda y ganamos en velocidad.
Además se añadió una función para crear un tamaño extra, llamado medium_large para resoluciones de 768px de ancho.
2.1.2.4. Imágenes que crea el propio tema
El tema que utilices puede añadir nuevos tamaños a través de add_image_size haz una búsqueda de esta función en los archivos de tu tema para saber qué tamaños añade.
Por ejemplo el tema Twenty Seventeen añade dos nuevos tamaños en su archivo functions.php
Para saber dónde se utilizan estas imágenes podemos volver a hacer una búsqueda pero esta vez por el nombre del tamaño de imagen. Generalmente los distintos tamaños de imagen se pintan usando
the_post_thumbnail( 'nombre del tamaño de imagen: thumbnail | medium | medium-large | full | twentyseventeen-featured-image | ... ' );
Aunque también se pueden usar otras resoluciones no registradas:
Siguiendo con el tema Twenty Seventeen si buscamos «twentyseventeen-featured-image" lo encontramos en 8 archivos, en header.php, en los de front page y en todos los archivos de loop de single incluidos los formatos de entrada. En resumen, el tema utiliza este imagen de 2000×1200 como imagen de cabecera.
Ahora busquemos la otra imagen, la llamada twentyseventeen-thumbnail-avatar y ¡sorpresa! no hay ningún archivo que pinte esta imagen de 100×100, hemos encontrado una imagen completamente inútil.
2.1.2.5. Imágenes creadas por plugins
Los plugins también pueden utilizar add_image_size Por ejemplo:
el plugin Featured Image Admin Thumbañade una imagen de 60×60 desde add_image_size( $this->fiat_image_size, 60, 60, array( 'center', 'center' ) );
El plugin Jetpack añade una de 50×50 para el módulo de portafolios con add_image_size( 'jetpack-portfolio-admin-thumb', 50, 50, true );
El widget del plugin SiteOrigin Post Carousel añade uno de 272×182 con add_image_size('sow-carousel-default', 272, 182, true);
Puedes escanear tu carpeta de plugins en busca de «add_image_size» para ver qué plugins añaden versiones de imágenes. Ten en cuenta que si desactivas y borras el plugin las imágenes que haya creado no se eliminarán.
Nota: Las imágenes que crean los plugins puede que no se guarden con la misma estructura de año/mes y lo hagan en una carpeta independiente cuyo nombre probablemente haga alusión al del plugin.
Nota 2: El bloque de Imagen del proyecto Gutenberg (versión 1.9.1 del plugin) lista todos los tamaños de una imagen, no sólo el original y los 3 por defecto. Podemos elegir también cualquier otro tamaño que haya sido creado desde el tema o desde un plugin.
2.2. Cómo eliminar y dejar de crear las imágenes inútiles
Una vez que detectamos aquellas imágenes inútiles que no hacen más que consumir recursos debemos eliminar las que tengamos ya creadas y decirle a WordPress que deje de crearlas.
2.2.1. Eliminar imágenes inútiles
Si tu WP es nuevo puedes saltarte este paso pero si llevas un tiempo con él lo más probable es que tengas un montón de imágenes inútiles en tu servidor.
Veremos cómo deshacernos de todas esas imágenes que se han estado creando y que sólo sirven para ocupar espacio.
Digamos que has cambiado los ajustes de medios o has cambiado de tema. Surgirán dos problemas:
El nuevo tema utiliza tamaños de imagen nuevos, por ejemplo uno de 275×275
El tema viejo utilizaba tamaños de imagen que ya no necesitas, por ejemplo uno de 450×250
El plugin Regenerate Thumbnails Reminder te advertirá si surge algún problema del tipo 1, si detecta algún tamaño nuevo te recomendará que regeneres ese nuevo tamaño para las imágenes que ya tenías subidas. El plugin que ya hemos comentado Media Usage muestra con iconos las versiones de cada imagen de forma que puedes comprobar si hay variaciones entre los tamaños nuevos y los antiguos.
Vamos a ver cómo regenerar estos nuevos tamaños.
2.2.1.2 Cómo volver a crear los nuevos tamaños útiles en imágenes antiguas
Para que todas tus imágenes antiguas tengan las versiones nuevas de tamaño útiles, en nuestro caso el nuevo tamaño 275×275 tenemos muchos plugins, el más famoso y clásico ya Regenerate Thumbnails. Hace exactamente lo que pedimos regenerar en lote o individualmente los nuevos tamaños sin borrar ningún tamaño antiguo. Veamos otras opciones:
Plugins que regeneran y también eliminan imágenes inútiles
Image Regenerate & Select Crop: Divide la acción de regenerar por tamaño, tipo de publicación a la que se ha adjuntado, calidad para regenerarla, además si es un tamaño recortado puedes elegir el punto de anclaje. Puedes desactivar el tamaño que quieras y también eliminar todas las imágenes pertenecientes a ese tamaño para luego regenerarlas. Muy, muy completo.
reGenerate Thumbnails Advanced: elimina todos los tamaños que no estén activos además de regenerar los nuevos tamaños, puedes elegir el período de tiempo de las imágenes a regenerar. Tendremos información del proceso así como un log de errores, por ejemplo si hay algún medio que no es una imagen.
Force Regenerate Thumbnails: elimina todos los tamaños que no estén activos además de regenerar los nuevos tamaños, te muestra un resumen de esos tamaños eliminados y regenerados.
ONet Regenerate Thumbnails: Puedes regenerar las imágenes en lote como muchos otros pero además puedes elegir el ratio de compresión, añadir un botón al lado del uploader del editor de publicaciones y crear nuevos tamaños de imagen. No elimina ninguna imagen.
Simple Image Sizes: Este plugin mejora la página Ajustes > Medios mostrando todos los tamaños disponibles y pudiendo crear los nuestros. De cada tamaño puedes editar su tamaño, recorte e incluso dando la opción de que un tamaño añadido por un tema, un plugin o creado por nosotros esté disponible en el editor. Por último permite regenerar aquellos tamaños que seleccionemos. No elimina ningún archivo.
Thumbnails (Miniaturas): en vez de regenerar todas las imágenes, las crea y cachea cuando se necesitan evitando procesar una gran cantidad de imágenes. Además puede añadir la Imagen Destacada a entradas que no tengan ninguna asignada. Es muy útil cuando un tema o plugin crea un tamaño sin ID, por ejemplo los plugins de sliders suelen usar tamaños específicos.
2.2.2.2 Cómo eliminar los tamaños inútiles de imágenes antiguas
Otra opción es hacerlo de forma manual, aunque no es aconsejable puedes usar por ejemplo Filezilla. Haces una búsqueda recursiva (icono prismáticos) en la carpeta uploads de archivos que contengan «-300x» y te devolverá todos los archivos cuyo ancho es 300px. Ej: imagen-inutil-300x127.jpg
Si tienes acceso por SSH a tu servidor puedes hacer lo mismo yendo al directorio wp-content/uploads y luego ejecutando
find . -name "*-300x*" -type f -delete
Bonus: Actualizar el HTML después de regenerar y eliminar
Regenerar y eliminar las imágenes no modifica el contenido de tus publicaciones, si pusiste una imagen de tamaño grande en una página y luego cambiaste su tamaño esa página seguirá buscando la imagen antigua. Afortunadamente tenemos una solución:
Regenerate Thumbnails HTML: Muy útil sobre todo cuando los cambios son en los ajustes de Medios. Digamos que en mis entradas he añadido imágenes de tamaño medio durante meses cuyo tamaño máximo son 300px y ahora decido cambiarlo a 250px, si vamos a la pestaña HTML de una de esas entradas vemos que WP ha estado generando este código
Donde la ruta del archivo será aquella versión de ancho 300, lo sabemos por el sufijo del nombre del archivo «nombre-archivo-anchoxalto.jpg» y que el atributo width toma como valor también los 300px. WordPress no actualiza este HTML aunque hayamos cambiado el tamaño medio, sigue llamando a la imagen anterior incluso si la eliminamos lo que puede resultar en enlaces rotos.
Este plugin te permite hacer una búsqueda de etiquetas img según el atributo ancho y el ID del tamaño. Si da resultados puedes actualizar el HTML de tus publicaciones.
2.2.1.3. Eliminar imágenes sin adjuntar
Las podemos eliminar desde la misma Biblioteca de medios como hemos visto antes o pero mejor utilizando el plugin gratuito Media Cleaner, DNUI o incluso mejor el plugin Theia Upload Cleaner for WordPress que trae funciones extras. Estos plugins escanearán más a fondo la BBDD que un simple filtro de imágenes sin adjuntar que como vimos en el apartado sobre identificar imágenes sin adjuntar no siempre te asegura que sea inútil.
Entre las ventajas de estos plugins están:
que cuando eliminas las imágenes además de enviarla a la papelera las mueve a otro directorio (uploads/wpmc-trash en el caso de Media Cleaner) y Theia Upload Cleaner además te crea una copia de seguridad. Si envías una imagen a la papelera desde la Biblioteca de Medios los archivos se quedarán en el mismo sitio
también escaneará posibles imágenes utilizadas en widgets, galerías o shortcodes
detectará como inútil aquellas imágenes adjuntadas pero que realmente no se utilizan
Theia Upload Cleaner permite eliminar tamaños inútiles de imagen
Image Cleanup ofrece una interfaz más pobre que los otros, de hecho no tenemos una miniatura de la imagen aunque es muy potente indexando todas las imágenes posibles.
Como dijimos al principio del artículo recuerda que antes de eliminar cualquier imagen debemos hacer una copia de seguridad de la carpeta uploads y de la BBDD.
2.2.2. Dejar de crear tamaños de imagen inútiles
Añadiendo esta función evitarás que se creen tamaños de imagen especificados tanto en los ajustes, en el Core, en un plugin o en un tema.
function no_crear_useless_image_sizes ($sizes) {
unset( $sizes['medium']); /* tamaño por defecto (ver otro método 2.2.1) */
unset( $sizes['medium_large']); /* tamaño responsive (ver 2.2.2) */
unset( $sizes['jetpack-portfolio-admin-thumb']); /* tamaño del plugin Jetpack (ver 2.2.3) */
unset( $sizes['twentyseventeen-thumbnail-avatar']); /* tamaño del tema Twenty Seventeen (ver 2.2.3) */
return $sizes;
}
La función se la pasamos al hook intermediate_image_sizes_advanced que filtra todos los tamaños que genera WP automáticamente cada vez que subamos una imagen.
En principio puedes añadirlo a tu archivo functions.php o mejor al functions.php de un tema hijo o como plugin.
Si no quieres meterte en código puedes utilizar el plugin que hemos comentado antes Image Regenerate & Select Crop para desactivar tamaños de imagen.
Otra opción es usar el plugin gratuito Optimize Images Resizing lo que hace es generar los tamaños sólo cuando se necesitan, no cuando se sube una imagen, es decir, este plugin evitaría que se generara el tamaño twentyseventeen-thumbnail-avatar del tema Twenty Seventeen porque jamás se va a necesitar. También puedes eliminar con él las imágenes inútiles antiguas.
Me parece muy interesante para algunos tipos de proyectos que por ejemplo utilicen muchos tamaños y tengan una enorme librería de medios. Para un sitio al uso es un poco arriesgado dejar que WP genere el tamaño X cuando un usuario visite tu esa página.
2.2.2.1. Dejar de crear tamaños por defecto
Para que WordPress no genere alguna o todas las versiones que por defecto crea (thumbnail, medium y large) de cada imagen podemos ir a Ajustes > Medios y definir en cero los anchos y altos de las imágenes que nos sobren.
Con esta configuración no se crearían imágenes de tamaño medio (‘medium’)
2.2.2.2. Dejar de crear el tamaño responsive medium-large
Igual quieres que WP no cree una versión de 768px de ancho de todas tus imágenes, quizás no porque no te preocupa esto de las imágenes responsive sino porque tu tema ya crea una imagen de este tamaño o casi y ves absurdo tener dos.
2.2.2.3. Dejar de crear tamaños de plugins y temas
Podemos evitar que se creen imágenes inútiles desde plugins o temas, simplemente conociendo el nombre de esa imagen. Si la función que hemos visto antes la añades al archivo functions.php debe estar después de que se haya definido el tamaño con add_image_size de ahí que os recomiendo hacerlo mejor desde un tema hijo.
3. Conclusiones
Tener optimizado tu WordPress es un trabajo de detalles, hay muchos factores en los que pensar, uno de ellos son los archivos. Como empezamos el artículo, tu servidor tiene un espacio finito.
Resumen de pasos facilito y con plugins:
Hagas una copia de seguridad
Instales Image Regenerate & Select Crop y veas todos los tamaños que se están generando por cada imagen ¿De verdad los necesitas todos? Imagino que si estás leyendo esto es porque piensas que no
Elimina las imágenes de los tamaños que no necesitas
Desactiva los tamaños que no necesites para que no se vuelvan a crear
Opcional: Si ves que alguno de los tamaños al margen de Miniatura, Medio y Grande te pueden ser útiles para incluirlos en alguna publicación en vez de tener que recortar o escalar la imagen instala el plugin Simple Image Sizes para añadirlo a los tamaños de inserción de imágenes del editor.
Además si has cambiado de tema o los ajustes de medios
Regenera los tamaños que han sido afectados
Instala el plugin Regenerate Thumbnails HTML para actualizar los cambios en el HTML de inserciones de imágenes de tamaños que han cambiado.
Tener un sitio web cuando estamos estableciendo un negocio por primera vez es importante. Sin embargo, adentrarse al mundo en línea y crear un sitio web de acuerdo con tus necesidades no es tarea fácil. Muchos necesitan ayuda para empezar. Usted piensa que es el momento de darse a conocer, pero siente que no tiene los recursos y las habilidades necesarias para poner en marcha su negocio digitalmente. Aunque piense que establecer un sitio web tiene que saber de programación y de diseño, existen procesos que le ayudan a facilitar su camino y puede que termine gustándole y ayudando a otros. En Internet existen millones de recursos que le pueden guiar a comenzar con su presencia en línea. Nosotros le hemos resumido la forma más sencilla de alcanzar sus objetivos.
Establecer objetivos
Cuando se trata de diseñar un sitio web, lo primero que debemos tener en mente es que queremos crear un sitio web. A la hora establecer tu objetivo general, es importante trabajar muy bien en los objetivos específicos. Por ejemplo, si piensas crear una empresa de neurología y quieres usar el sitio web para publicar nuevos hallazgos y nuevas ideas neurológicas, debes adaptar el diseño a un sitio web de blogs. Pero si quieres una página web para vender automóviles, deberás crear un sitio web adecuado para ello. Conocer el propósito de su sitio web es útil cuando se trata de definir los objetivos. Mientras más sepa de su tema, más fácil podrá alcanzar sus metas.
Comience a crear
Después de establecer sus objetivos, ya piensa que con la visión de su negocio en línea debe hacer todo lo posible para hacerlo realidad. De hecho, es mejor comenzar a hacer borradores de sus ideas antes de usar su ordenador para crear su sitio web. Si usted no es experto con el diseño web, usar herramientas avanzadas puede ser un obstáculo.
Lo importante no es si sabe cómo hacer los borradores o no, sino comenzar a crear la forma que desea que tome la página web. Use plantillas básicas para establecer dónde deben ir las funciones de navegación y revise cualquier cosa que pueda ser un obstáculo en el futuro. Muestre el diseño y reciba comentarios para mejorar sus ideas. Mientras más planificación haya, más fácil será usar un creador de sitios web para su sitio y cubrir todas sus necesidades.
Diseño móvil
Hace unos años atrás, el diseño de los sitios web solo se centraba en los ordenadores de escritorio y portátiles. Ahora, los sitios web son visitados desde teléfonos, relojes y cualquier tipo de dispositivo que cabe en la palma de su mano. Esto quiere decir que siempre deberá considerar la presentación de su sitio web en este.
Tómese un tiempo para pensar en el diseño de su sitio web. Esto le permitirá crearlo de forma más fácil para que cubra sus necesidades. Intente planificar el diseño y establecer los objetivos generales y específicos para que su sitio sea el indicado para su negocio.
Google ha diseñado una aplicación, denominada “Lookout”, la cual se encuentra desarrollada para personas invidentes o con una ceguera avanzada.
La idea de esta app es que, con la cámara de su móvil, las personas con discapacidad visual puedan saber sobre los principales objetos, textos o lugares más importantes que tengan delante de ellos.
De esta forma que no sea necesario que pregunten a los demás o usen bastón para identificar lugares.
¿Cómo funcionará Lookout?
Según señala, su creador Google, el funcionamiento de esta app será sencillo. Una vez que la aplicación se encuentre activada, la cámara del móvil debe señalar hacia adelante, de esta forma, serán los ojos del individuo invidente.
Es por ello que lo más recomendable es que la persona lleve colgado del cuello o en el bolsillo delantero de la camisa el móvil, para que así se puedan captar más imágenes.
Luego de esto, es cuando comienza la magia de la aplicación, ya que detecta la información importante a su alrededor y se la transmite a la persona con problemas visuales. Ejemplo le indica: donde está el baño, una silla para sentarse y hasta le describe una receta de cocina.
Con esta aplicación el invidente puede elegir qué es lo que necesita escuchar de acuerdo con cada situación, ya que en la app hay cuatro necesidades básicas: casa, trabajo & acción, escaneo y experimental.
Si la persona con discapacidad visual se encuentra en la casa y usa esta app puede por ejemplo obtener información de donde está una mesa o el sofá. Lookout irá aprendiendo diariamente con el usuario hasta el punto en el que llegará a nombrar objetos con los que esté familiarizado.
Stan Lee, el héroe de la infancia de muchos, estrena una película que, desde que agarró un lápiz y un papel, ha soñado con realizar: Vengadores Infinity War.
El Universo Cinematográfico de Marvel lanza su décimonovena cinta: Vengadores Infinity War.. La mezcla de personajes emblemáticos se dice que es el más ambicioso de toda la historia, pues finalmente, los universos encontrados de Marvel se encontrarán en el planeta Tierra en un mismo tiempo y espacio.
Desde sus inicios, Stanley Martin Lieber, después conocido como Stan Lee, ha creado héroes inspirados en los más altos valores humanos, como lo son la inteligencia o la fuerza. En esta historia, los Vengadores tendrán que proteger las Gemas del Infinito para evitar la aniquilación de la tierra, la raza humana y el orden del universo.
La carrera de Lee comenzó desde 1940, realizando pequeños trabajos de guionismo y escritura. Más adelante, e inspirado por su esposa, se atrevió a hacer un trabajo en solitario, respondiendo a la dura competencia de DC Comics, crea a 4 personajes que le valdrían el primer escalón para ser conocido como el padre del cómic en Estados Unidos: “The Fantastic Four”.
A partir de este momento, comienzan unos años frenéticos para crear personajes inspiradores, con tramas complicadas y villanos que quitaban el miedo. Junto con el dibujante Jack Kirby y el historietista Steve Ditko, se crearon más de 10 historias diferentes en pocos años. El auge de los cómics en públicos infantiles catapultó el éxito de Stan Lee, y dio paso a que las grandes cadenas televisivas se comenzaran a interesar por sus historias, lo que resultó en la producción de la primera película inspirada en una historieta de Marvel: The Amazing Spider-Man (Spider-Man: El hombre araña, 1978), protagonizada por Nicholas Hammond y David White.
La marca creció gradualmente, poco a poco se fueron creando series y películas con guiones inspirados en los originales de Lee. Una nueva era de películas llegó a principios del 2000, 20th Century Fox compró los derechos para producir la saga de X-Men, que de mano del director Bryan Singer, comenzaron a reescribir la identidad de los personajes de Los Hombres X, contratando actores de primera categoría y amplificando el público al que estaban dirigidos.
Otro gran cambio al imperio de Stan Lee llegó en el 2010, cuando The Walt Disney Company compra Marvel Entertainment, y llega a darle una nueva identidad, junto con un ambicioso proyecto para los héroes y sus historias. Desde este punto, y con una proyección al 2020, la franquicia de Marvel ha renacido y se está convirtiendo en uno de las creaciones cinematográficas más queridas de todos los tiempos.
Stan Lee ha estado presente en todas las etapas de la construcción de este imperio, y aunque su salud ahora esté comprometida, su autonomía y decisión ha sido muy importante para poder proceder en un proyecto tan importante como lo es Infinity War.
Desde sus simpáticos cameos, hasta su astucia para ligar universos diferentes, Stanley Martin Lieber, ha sabido inspirar historias y crear fantásticos sueños en todas las generaciones.
Linio nos deja la historia de este grande del cómic en forma de infografía.
En el artículo Cómo eliminar las imágenes inútiles de WordPress vimos cómo configurar bien nuestro WordPress para que no genere versiones inútiles de una imagen. La idea era ahorrar espacio en el servidor, recursos, optimizar.
En este artículo vamos a ver cómo optimizar esas imágenes restantes, las que sí son útiles y mostramos a nuestros usuarios, ahora no sólo estaremos ahorrando recursos del servidor sino que mejoraremos la velocidad de nuestro sitio, su rendimiento y por tanto el posicionamiento y la experiencia de nuestros usuarios.
Tenía una versión «inútil», era muy parecida a la que crea WP para «responsive», la medium_large para resoluciones de 768px de ancho. Decidí quedarme sólo con 3 versiones de cada imagen además de la original. Es cierto que cuantos más tamaños disponga mejor resultado tendrás, pero en este proyecto el nº de imágenes es muy grande, así que opté por reducir las opciones, la mayoría se muestran pequeñas en una galería (100×100) y se amplían en una lightbox, además como tienen carga perezosa no me preocupa.
Así que para que WP no me creara el código de imágenes responsive con <picture> lo desactivé:
Existen varias soluciones, desde la manual hasta la automatización con un cron y la línea de comandos (ver WP CLI). En medio hay varios plugins que nos facilitan el proceso de optimización.
Yo he utilizado ShortPixel, un plugin freemium gratuito hasta 100 imágenes al mes. Antes había utilizado EWWW Image Optimizer porque el volumen de imágenes en elfinalde.com supera con creces la centena, en cambio en muchos sitios será más que suficiente con la versión gratuita de ShortPixel. La cuestión es que me contactaron para probarlo en elfinalde.com y el resultado ha sido brutal.
¡Alerta SPOILER! con ShortPixel pasé de 22,2GB a 9,9GB (ahorrado más de 12GB)
Principalmente el ratio de compresión es mucho mayor además de características como copias de seguridad. Puedes hacer un test online del % de optimización que puedes lograr con ShortPixel. En elfinalde ha sido del 79%. Siempre tendrás acceso a las estadísticas
La optimización se hace cada vez que subes una imagen aunque si ya tienes imágenes anteriores como era mi caso debes ejecutar la optimización en masa, por lotes. Tuve que procesar más de 70.000 imágenes, daros cuenta que cada tamaño es una imagen es 1 crédito, es decir, si tu sitio crea 4 versiones distintas de una imagen, el proceso se hará en 5 imágenes y también estarás consumiendo 5 créditos con ShortPixel. Por tanto asegúrate de no estar creando imágenes inútiles.
Entre las opciones os recomiendo que activéis la eliminación de datos EXIF y que limites el tamaño máximo sobre todo si esas subidas no son manuales, si la hace un cliente o es a través de una API, en mi caso lo he fijado a 1200px.
En los ajustes avanzados puede que te resulte llamativo crear una versión gratuita en formato WebP de Google. Con la configuración adecuada se incluirá esa versión en el elemento <picture> generado por WP. Yo lo hice, generé un imagen .webp por cada imagen pero me di cuenta que no sólo no ocupaban menos que su homónimo JPEG sino que muchas veces ocupaban más. Además de que si mi intención era ahorrar espacio en disco con esto lo estaba duplicando.
Otra opción que me dio problema es la de convertir los PNG en JPEG, aunque el proceso lo hace bien, la imagen destacada que usaba el PNG no se actualiza con el JPEG.
La optimización en lote te va informando del proceso, se hace en segundo plano y puedes seguir trabajando aunque siempre es recomendable no hacerlo por no saturar. Yo decidí para ahorrar créditos y recursos no optimizar las miniaturas, sólo las imágenes originales y tardó 4 días :O
Por último debes tener en cuenta que ShortPixel crea una copia de seguridad que te permite revertir ese proceso. Y claro, esa copia ocupa espacio en tu servidor, puedes eliminarla desde la misma interfaz de ShortPixel.
Conclusiones
Dependerá del tipo de web que tienes, si usas o no muchas imágenes. En un blog donde publiques un par de artículos a la semana tienes de sobra con ShortPixel gratuito pero en un proyecto con miles de imágenes tener bien optimizada tu librería de medios es muy importante. Date cuenta que no sólo ahorras el espacio en tu librería sino también cada vez que haces un simple backup.
Hace 1 minuto me he dado cuenta que este dominio lo compré un 25 de octubre de 2006, hace ya 11 años. Esta mañana lluviosa de beernes me apetece recordar esos comienzos a ver si vislumbro si a ceslava.com le queda sólo pasado o es posible un futuro.
Si ser viejuno tiene alguna ventaja es la de tener muchos recuerdos, confesables y no confesables ;)
La culpa fue del…
Todo comenzó dando un curso, quería compartir recursos con mis alumnos, compartir esos enlaces «favoritos» que añadía a del.icio.us ¿recordáis el ya extinto del.icio.us? Y también quería un sitio para comunicarme de forma asíncrona con los alumnos. Si me hacían una consulta por email la respuesta sólo podía consultarla el destinatario.
Así que me instalé un Joomla! y un Moodle. Tenía blog, foro y una plataforma de e-learning con cursos gratuitos de… FreeHand ;)
Cometí todos los errores que podía cometer como bloguero, con la excusa de que lo que publicaba era sólo para mis alumnos copié y pegué contenido, utilicé imágenes sin preocuparme de su autor y de darle crédito, hasta hice Hotlinking, un desastre vamos.
A los pocos meses te das cuenta que las estadísticas suman más que tus alumnos + ex-alumnos. Que te visitan de otros puntos del planeta. Entonces empiezo a cortarme, esto ya no es privado. Lo primero que hice fue migrar de Joomla! a WordPress, por una vez acerté ;) Digamos que ahí empezó el blog, empecé a compartir utilidades, recursos y tutoriales de diseño, dando el crédito correspondiente e intentando crear contenido original. Me divertía y aprendía con cada artículo.
El paso a Pofe$ioná
Pasado el tiempo dejó de ser una afición, empecé a rentabilizarlo. Tampoco es que haya sido mi principal fuente de ingresos pero sí me ha dado bastantes caprichos.
En estos 11 años parí otros proyectos web, algunos pensados para que el protagonista fuera el usuario y otros con sección blog donde volvía a disfrutar, algunos pensados sólo con el CPC en mente y otros sólo por la necesidad de contar cosas.
El gran bache
Hace ahora 3 años me ocurrió algo que hizo perder el sentido a «compartir», me quitó las ganas de escribir, ya no quería ser «visible». El ritmo de publicación descendió muchísimo y casi que abandoné La Leyenda de Caillou. Al tiempo me embarqué en un sitio de cine, elFinalde, y en vez de escribir me he dedicado a publicar películas y series. Me desenganché.
El trabajo, la familia, las redes sociales, que los Blogs han muerto son todo excusas. ¿Cuántos blogs conoces que siguen publicando con la misma pasión? Lo que a veces se nos apaga es la pasión. He visto despedirse muchos blogueros y resucitar a otros muchos para luego volverse a despedir.
Entonces ¿Despedida o resurrección?
Sinceramente no sé si esto es mi despedida o mi resurrección. A veces, cuando tengo un rato y estoy sentado en el equipo me apetece publicar un artículo, pero en vez de eso acabo pensando que antes de regresar tengo que dar un giro, no sólo a ceslava.com, a todos los sitios.
Además de un rediseño a fondo tendría que pensar qué puedo aportar a la blogosfera. Sé que a algunos os interesan los tutoriales sobre diseño web y sé que estos mismos tutoriales os suenan a chino a los seguidores de La Leyenda de Caillou.
Al ser un blog personal están todos los temas que me interesan, no hay definida una línea editorial, un nicho. Además los blogs personales suelen ser de influencers que dan su opinión sobre su campo de trabajo, en esta definición no encaja el mío como «blog personal». Siempre he tenido esa lucha interna sobre si separar los contenidos en distintos blogs temáticos o seguir como ahora compartiendo churras y merinas en el mismo sitio.
¿Escribo o lanzo otro sitio?
Quizás lo mío no es escribir, no es ser bloguero. Quizás lo mío sea crear sitios web, que por otra parte es mi trabajo. De hecho:
creé un sitio de debates donde no he dado una sola opinión,
uno de chistes siendo todo un saborío,
uno sobre cáncer sin tener cáncer,
uno de reseñas de cine y series sin ser capaz de recordar la peli que vi anoche.
Pero es cierto que esto de rellenar los píxeles en blanco y darle al botoncito azul de publicar tiene un no sé qué que engancha.
En cualquier caso si vuelvo en condiciones debe ser después de reflexionar bien a dónde debe ir este sitio, de hacerle un gran rediseño y si no vuelvo «en serio» pues habrán sido 11 años con unas 500 publicaciones anuales al margen de los chistes, debates y películas…
Si todavía no has cambiado tu WordPress al protocolo HTTPS (HyperText Transfer Protocol Secure – Protocolo seguro de transferencia de hipertexto) ya estás tardando, a continuación te mostraré cómo hacerlo muy fácil y además de forma gratuita.
¿Por qué cambiar a HTTPS?
¿Pero esto de los certificados SSL no era sólo para tiendas? ¿No era algo para asegurar las plataformas de pago? ¿Y si yo tengo un blog de cine donde no vendo nada ni tengo ningún contenido sensible de seguridad también debo migrar?
La respuesta es SÍ. Cualquier sitio web debe hoy día utilizar esta capa extra de seguridad. De hecho tus usuarios serán advertidos por los navegadores «Este sitio no es seguro» y lo contrario cuando visitas con Google Chrome un sitio con HTTPS en la barra de direcciones pone «Es seguro». Y Google agradece que la web sea más seguro añadiendo como factor de posicionamiento SEO este extra de seguridad. A todo esto hay que añadir las ventajas de la actualización del protocolo HTTP a HTTP/2 para la que necesitas un certificado SSL.
Resumen: con HTTPS tu sitio será más seguro, ayudará a mejorar tu SEO y podrás beneficiarte de HTTP/2.
Migrar tu WordPress a HTTPS en 5 pasos
El artículo veremos los 5 pasos que he seguido para migrar mi sitio de cine y series https://elfinalde.com
PASO 1: Cómo conseguir un certificado SSL gratuito
PASO 2: Instalar tu certificado SSL en tu servidor
PASO 3: Activar HTTPS en tu WordPress
PASO 4: Configurar Google Search Console (Google Webmaster Tools)
PASO 5: Configurar Google Analytics
PASO 1: Cómo conseguir un certificado SSL gratuito
Lo primero es conseguir un certificado SSL (Secured Socket Layer / Capa de conexión segura) Algunos hostings ofrecen este servicio extra a un coste o incluyen el servicio gratuito de Let´s Encrypt. Compruébalo en tu plan de alojamiento, si no te ofrecen un SSL gratuito sigue estos pasos.
Completa los campos de su configuración, muy fácil, el nombre, tu país y su código. En los campos adicionales marca «Auto-generate Certificate» para que cuando caduque vuelva a generarse cada 90 días.
Luego haz clic en «Register account» y luego en «Generate Certificate». Se te indicará la ruta de tu Certificado SSL totalmente gratuito en una nueva carpeta creada «letsencrypt», descarga esta carpeta a tu equipo por FTP.
PASO 2: Instalar tu certificado SSL en tu servidor
El siguiente paso es instalarlo el certificado creado en tu servidor. Vamos a verlo en Plesk
Haz clic en la opción «Certificados SSL»
En la siguiente pantalla haz click en Añadir certificado SSL
Ahora tienes que ponerle un nombre y subir 3 archivos .pem que creaste en el PASO 1 en tu WordPress.
Como Clave privada (*.key) subes el archivo key.pem
Como Certificado (*.crt) subes el archivo cert.pem
Como Certificado CA (*-ca.crt) subes el archivo chain.pem
Listo, ya tenemos el certificado, por último debes asociarlo a tu dominio. En Configuración de Hosting > Seguridad seleccionamos nuestro certificado
En cPanel el proceso es similar, existen también plugins para cPanel de Let´s Encrypt. Si te surge alguna duda en este paso puedes consultar a tu proveedor de hosting.
PASO 3: Activar HTTPS en tu WordPress
Ya puedes visitar tu sitio con https://tudominio.com aunque si navegas por él o alguien te visita desde un buscador volverán a encontrarse con el antiguo «http». Hay que redireccionar todas las URLs que hasta ahora apuntaban a HTTP a HTTPS, puedes hacerlo manualmente en los ajustes, en .htaccess y con Buscar y Reemplazar en la base de datos o servirte de un plugin gratuito que no miente en su nombre Really Simple SSL
Instalas, activas y ejecutas.
Contenido mixto
Si visitas tu sitio ahora desde HTTPS y aún no aparece el candado verde es porque el navegador ha encontrado algún contenido mixto, es decir, tu sitio es HTTPS pero hace peticiones a URLs HTTP. Por ejemplo desde CSS, JS tuyo o de algún plugin. El plugin Really Simple SSL corrige algunos pero a veces tendrás que comprobar con la consola qué URL está provocando esto y solucionarlo manualmente o probar otros plugins también gratuito como SSL Insecure Content Fixer o la versión Premium (de pago) del mismo Really Simple SSL
PASO 4: Configurar Google Search Console (Google Webmaster Tools)
El último paso es decirle a Google que hemos cambiado a HTTPS. Debemos crear dos nuevas propiedades, una por cada nueva versión de nuestro sitio (con y sin www) https://www.midominio.com y https://midominio.com
Si lo prefieres puedes crear un conjunto con las 4 propiedades del mismo dominio.
Añade el sitemap y en Configuración del sitio elige como dominio preferido (con o sin www) el mismo que tengas como Dirección del sitio en los ajustes generales de tu WordPress.
PASO 5: Configurar Google Analytics
Ya tienes tu sitio funcionando con HTTPS ahora debes cambiarlo en GA. Vas a Administrar y eliges la cuenta, propiedad y vista correspondiente.
En Configuración de la vista cambias a https:// la «URL del sitio web» y en Configuración de la propiedad la URL predeterminada.
Y si lo deseas más abajo en la Configuración de la propiedad asocias tu propiedad de Search Console a la de GA.
