Imágenes y biblioteca de medios de Éclair
- 1. Descubrir Éclair CMS
- 2. Preparar la instalación
- 3. Instalar Éclair paso a paso
- 4. Manejar la administración de Éclair
- 5. Escribir y publicar tu primer artículo
- 6. Páginas, menús y página de inicio
- 7. Imágenes y biblioteca de medios de Éclair
- 8. Formulario de contacto y mensajes
- 9. Los ajustes esenciales antes del lanzamiento
Índice
- Subir tus imágenes a la biblioteca de medios de Éclair
- ¿Qué formatos y tamaños se aceptan?
- Lo que hace Éclair con cada imagen
- Redactar un buen texto alternativo
- Colocar una imagen en una página
- Imagen destacada, imagen para compartir, logo e icono
- Eliminar una imagen sin romper una página
- Para recordar
- Para saber más
- Preguntas frecuentes
La biblioteca de medios de Éclair guarda todas las imágenes de tu sitio y las optimiza en cuanto las subes: redimensionado, conversión a WebP y eliminación de los datos de ubicación. Esta lección te enseña a subir tus fotos, a describirlas para Google y para la accesibilidad, y a colocarlas en tus páginas, tus artículos y tu cabecera.
Lo que sabrás hacer
Subir tus fotos
Arrastrar y soltar una o varias imágenes, desde Medios o desde el editor.
Mantener un sitio rápido
Entender qué hace Éclair con cada imagen para que siga siendo ligera.
Describir bien tus imágenes
Escribir un texto alternativo útil, a mano o con la IA.
Subir tus imágenes a la biblioteca de medios de Éclair
- Haz clic en Medios en el menú lateral.
- Arrastra tus archivos a la zona Arrastra tus imágenes aquí o haz clic para elegir, o haz clic en ella para seleccionarlos. Puedes subir varios a la vez.
- Cada imagen muestra su progreso en porcentaje y después «Subida completada», seguido de su nombre.
No hace falta salir del editor: la ventana Biblioteca de medios, que se abre cuando eliges una imagen, tiene su propia zona para soltar archivos, y un bloque Imagen vacío acepta que arrastres un archivo dentro. El campo Buscar una imagen… filtra la cuadrícula por nombre de archivo o por texto alternativo.
¿Qué formatos y tamaños se aceptan?
| Regla | Límite | Mensaje si se rechaza |
|---|---|---|
| Formatos | JPG, PNG, WebP, GIF | «Formato no compatible: solo JPG, PNG, WebP o GIF.» |
| SVG | Rechazado, por seguridad | El mismo mensaje |
| Peso | 20 MB por imagen | «Imagen demasiado pesada (20 MB como máximo).» |
| Dimensiones | 40 megapíxeles | «Dimensiones de imagen no válidas o demasiado grandes (máximo 40 megapíxeles).» |
| Límite del proveedor | Se muestra bajo la zona para soltar archivos | «Archivo demasiado pesado para tu hosting» |
Cuidado con la trampa más habitual: tu proveedor de alojamiento también fija un tamaño máximo por subida, a veces inferior a 20 MB. Éclair lo indica bajo la zona para soltar archivos: en la captura de arriba, «máx. 2M» significa 2 MB por subida, y una foto de 5 MB se rechazaría. En un alojamiento pequeño, una foto muy grande también puede superar la memoria disponible: Éclair te pide entonces que la reduzcas a menos de 4000 píxeles de ancho.
Lo que hace Éclair con cada imagen
Con la extensión GD de PHP (el asistente de instalación comprueba que esté), cada imagen subida pasa por cuatro etapas:
- Recodificación: la imagen se reescribe por completo, lo que elimina las cargas ocultas y los datos EXIF, coordenadas GPS incluidas. Una imagen que contenga código se rechaza.
- Redimensionado: 2000 px de ancho como máximo.
- Versiones WebP: 480, 800, 1200 y 1600 px, solo las más pequeñas que tu imagen, además de una versión WebP a tamaño completo.
- Visualización optimizada: dimensiones explícitas (la página no salta al cargar), carga diferida y prioridad para la imagen principal.
Ejemplo: Camille sube una foto de 3000 × 2000 píxeles hecha con el móvil. Éclair la reduce a 2000 × 1333, borra sus coordenadas GPS y crea versiones WebP de 480, 800, 1200, 1600 y 2000 px. Cada visitante descarga la versión adaptada a su pantalla, nunca el original de varios megabytes.
Los GIF animados se conservan, limpiados bloque a bloque. Sin la extensión GD, las imágenes se quedan tal cual: un aviso te lo indica en Medios, y conviene comprimirlas antes de subirlas.
Redactar un buen texto alternativo
El texto alternativo describe la imagen para las personas con discapacidad visual, a quienes un lector de pantalla se lo lee, y para Google Imágenes. En Medios, haz clic en una imagen: la ventana de detalle muestra sus dimensiones, su peso y su número de versiones WebP. Rellena Texto alternativo y haz clic en Guardar.
| Evitar | Mejor |
|---|---|
IMG_2045 | Cuenco de gres esmaltado azul sobre un torno de alfarero |
| «foto» | Manos de una alumna centrando un trozo de arcilla durante una clase |
| «cerámica cerámica Lyon» | Escaparate de Atelier Nova lleno de jarrones, visto desde la calle |
- Las imágenes sin texto alternativo llevan una etiqueta ALT naranja en la cuadrícula: detectas los olvidos de un vistazo.
- Si el asistente IA está activado, el botón ✨ Describir con IA redacta el texto mirando la imagen (Activar el asistente IA integrado).
- Escrito una vez en la biblioteca de medios de Éclair, este texto sirve en todos los lugares donde aparece la imagen. En un bloque Imagen, puedes sustituirlo para un contexto concreto; si lo dejas vacío, se muestra el de la biblioteca de medios.
Colocar una imagen en una página
- En el editor, escribe / y elige Imagen.
- Haz clic en Añadir una imagen para elegirla en la biblioteca de medios, o arrastra un archivo al bloque.
- Completa Leyenda (opcional), Texto alternativo y, si hace falta, Enlace (opcional).
- Elige el Tamaño: Normal (el ancho del texto), Ancha (más ancha que la columna de lectura) o Pequeña (reducida y centrada).
- Más adelante, Cambiar la imagen sustituye la foto sin volver a crear el bloque.
En modo Visual, basta con hacer clic en una imagen para elegir otra en la biblioteca de medios.
Imagen destacada, imagen para compartir, logo e icono
| Imagen | Dónde se configura | Bueno saberlo |
|---|---|---|
| Imagen destacada | Editor de un artículo › Documento › Imagen destacada | Se muestra al principio del artículo y en las redes sociales |
| Imagen para compartir | Automática | Se genera una sola vez una versión de 1200×630, a partir de la imagen destacada o de la primera imagen del contenido (600 px de ancho como mínimo) |
| Imagen por defecto para compartir | Ajustes › SEO | Se usa cuando un contenido no tiene ninguna imagen |
| Logo | Ajustes › Apariencia › Logo | PNG o WebP con fondo transparente, de unos 400 px de ancho |
| Icono del sitio (favicon) | Ajustes › Apariencia | Imagen cuadrada de al menos 512 px; sin icono, se genera un rayo con tu color |
Eliminar una imagen sin romper una página
En la biblioteca de medios de Éclair, abre la imagen, haz clic en Eliminar y confirma. Si la imagen todavía se usa, Éclair muestra «Esta imagen se usa aquí:» con la lista de contenidos y ajustes afectados (logo, icono, imagen para compartir, foto de perfil) y luego pregunta «¿Eliminar de todos modos?». El buen hábito: sustituye primero la imagen allí donde se usa.
Para recordar
- La biblioteca de medios de Éclair acepta JPG, PNG, WebP y GIF, de hasta 20 MB y 40 megapíxeles; el SVG se rechaza.
- Con GD, cada imagen se recodifica sin EXIF ni GPS, se limita a 2000 px de ancho y se genera en WebP de 480 a 1600 px.
- Un texto alternativo preciso sirve a la accesibilidad y a Google Imágenes; la etiqueta ALT señala los olvidos.
- La imagen para compartir de 1200×630 es automática; el logo y el icono se configuran en Ajustes › Apariencia.
Para saber más
- Crear una página con IA y retocar sus textos: Describir con IA y la imagen destacada creada por la IA.
- Temas y apariencia: logo, icono, color y fuentes de tu sitio.
- Rendimiento: mantener 100 sobre 100: imágenes, fuentes y peso de las páginas.
- Fuentes externas: las prácticas recomendadas de Google para imágenes y el tutorial del W3C sobre textos alternativos.
Preguntas frecuentes
¿Por qué se rechaza mi imagen SVG?
Por seguridad, Éclair no acepta el SVG, un formato que puede contener código. Exporta tu logo en PNG o en WebP con fondo transparente y súbelo.
Mi imagen de 15 MB se rechaza aunque el límite es de 20 MB, ¿por qué?
Tu proveedor de alojamiento fija su propio límite por subida, indicado bajo la zona para soltar archivos. Reduce la imagen antes de subirla, o pregunta a tu proveedor si puede aumentar ese límite.
¿Tengo que convertir mis fotos a WebP antes de subirlas?
No. Súbelas en JPG o en PNG: Éclair crea por sí mismo las versiones WebP, si la extensión GD de tu alojamiento admite ese formato.
¿Se publican las coordenadas GPS de mis fotos?
No, si la extensión GD está activa: cada imagen se recodifica al subirla, lo que elimina los datos EXIF, GPS incluido. Sin GD, los archivos se quedan tal cual; por eso conviene comprobar este punto.