Alojar grandes cantidades de ficheros, sobre todo vídeos, y que queden restringidos a tu sitio puede ser complejo, pero hoy te enseñamos una forma fácil de conseguirlo.
Patrocinador
Hosting WordPress en SiteGround
Enlaces comentados
Joan ha presentado todos los cursos de estas últimas semanas:
Javier ha comentado cómo le va con sus proyectos:
- Preparando una presentación para el WordPress Day de la Mobile Week Alcalá (Madrid 16 oct).
- Pensando si ir a la próxima WordCamp US, que es del 23 al 25 de agosto en Washington DC.
- Script Subidas al Media (sin duplicar contenidos).
- Sistemas ¿precios caros?
Actualidad
- Consolidación de las herramientas de diseño en los bloques
- Herramientas, como las tipografías, espaciados o colores
- Mejorado el sistema de bloqueo de bloques (tampoco aplicar determinados filtros, redimensión o alineación)
- Mejoras en el bloque de navegación
- Partes de Plantilla en Temas Clásicos
- TTx?
Walk-Through
- Matías Ventura
- Foco en el editor (mitad de la presentación)
- TT3
- Tipografía fluida
- Rendimiento
- Martes 20 de octubre a las 1600 UTC (1800 ES)
Recordatorio
- WordPress 6.0 -> SOLO PHP 7.4
Developer Blog
- It’s a place to talk to developers as people, first, and then as members of a community.
- Ponerse en el lugar del desarrollador
- developer.wordpress.org/news/
Translating for the user … isn’t it?
- Fernando Tellado
- Debate abierto (muy interesante)
- Nuevas cadenas
- Cadenas Premium
- Traductores profesionales
- Motivación de los voluntarios
Imajinn
- Imajinn – Magical AI Image Generation like DALL·E
- https://es.wordpress.org/plugins/imajinn-ai/
Tema de la semana
Hoy vamos a hablar de alojar muchos contenidos y muy grandes, dependiendo de muchas cosas, claro está… si no, para qué estoy yo aquí, si no es para volveros locos con muchas posibilidades.
El asunto de hoy seguramente se pueda dividir en muchas partes, así que, te dejo a ti que estás al otro lado, que si crees que puedo ampliarlo con más cosas, nos escribáis, y vemos cómo podemos darle una vuelta más.
Comenzamos con lo más básico. WordPress por defecto permite subir contenidos multimedia: imágenes, vídeos, audios… y tanto si es una imagen, como un audio como un vídeo, incluye la forma de reproducirlos. Una imagen, pues se ve, un audio, pues se incluye el reproductor de audio del HTML5, y con los vídeos, lo mismo, se incluye el reproductor HTML 5 de los vídeos.
Hasta aquí, es el sistema clásico, en el que subes un contenido y la ruta es «dominio.es/wp-content/uploads/2022/09/imagen.jpg».
Un primer paso de cara a la escalabilidad de los contenidos es cambiar la ruta de los contenidos que subimos. La idea es tener algo del estilo a «contenidos.dominio.es», por poner un ejemplo. De esta forma esa ruta anterior se nos convierte en «contenidos.dominio.es/2022/09/imagen.jpg».
Este cambio es nativo de WordPress y se puede hacer cambiado una de las opciones que viene con el core, que es el «upload_url_path». Allí se le pone la nueva URL, y listos.
Vale, sí, ya sé que esto no tiene nada que ver con la escalabilidad o tener muchos contenidos, pero es la base por l que funcionan todos los sistemas que hay por encima y que usan los plugins de CDN. En el fondo, lo que os acabo de explicar es la base para crear una CDN personalizada.
Pero, volvamos al tema de tener muchos contenidos. Aquí tenemos varias opciones a partir de ahora. La primera gran pregunta es ¿dónde es mejor alojar los contenidos? Aquí hay varias opciones y dependen mucho de las empresas de hosting. Si has de alojar muchos contenidos, y cuando hablamos de muchos contenidos hablamos de 100 GB para arriba, tenemos como primera opción el propio servidor donde esté nuestro sitio. En este caso hay que hacer un cálculo de a qué precio nos sale tanto el Giga alojado, como la transferencia, que en algunos proveedores puede estar limitado.
Es decir, hay 3 factores:
- Precio por Giga
- Ancho de banda (100 Mbps, 500 Mbps, 1 Gbps)
- Transferencia en TB / mes
Estas 3 cifras nos han de dar una idea de lo que nos va a costar realmente alojar y mantener nuestros, sobre todo, vídeos. pero vamos, que sirve para cualquier cosa.
Así que, lo dicho, la primera opción es alojarlo nosotros mismos en nuestro propio servidor, y a partir de aquí se abren muchas otras opciones. Hay proveedores que te permiten añadir un disco duro extra a tu servidor. Si esta opción no te cuadra, el siguiente paso es analizar el uso de algún alojamiento de ficheros, del estilo a Amazon S3, o de Wasabi. Hay varios de estos servicios, pongo esos dos como ejemplo. Estos servicios están pensados para alojar grandes cantidades de ficheros a un bajo precio. Por ejemplo, Wasabi permite 1 TB de espacio por 6 dólares. Eso sí, en este caso hay que revisar muy bien los otros dos factores, porque por ejemplo, aunque el ancho de banda suele ser pequeño, en algunos casos como el de Amazon te matan con el precio de la transferencia.
Para esto hay varios plugins que trabajan con esta sincronización entre WordPress y estos servicios de alojamiento. Uno de los más conocidos, aunque es un plugin de pago si quieres subir tu contenido previo, es WP Offload Media. De todas formas, lo primero es mirar en cada plataforma porque muchas de ellas ya tienen sus plugins oficiales. Si están desactualizados o les falta mantenimiento, metedles presión para que lo mantengan y actualicen a las últimas versiones de WordPress, que a veces se columpian un poco.
En este caso, estos plugins suelen cambiar la ruta de tu sitio por la ruta de sus sitios.
Yo, por ejemplo, una de las situaciones en las que utilizo estos sistemas, además de alojar en algún sitio los contenidos, lo uso también para alojar las copias de seguridad. En general es tan barato que puedes guardar copias diarias durante más de medio año, por lo que pueda pasar.
Ya sé que todo esto que acabo de explicar parece fácil, pero a veces no lo es tanto… sobre todo, antes de empezar a hacer experimentos, pruebas o tomar decisiones, revisad y mirad bien las necesidades que tiene cada uno d vuestros sitios, porque no todos los sistemas sirven para cualquier cosa.
Además, hay que tener en cuenta otra cosa, el hecho de alojar los contenidos en un sitio de terceros no implica que no tengáis que tener vuestras propias copias de seguridad. Hay que diferenciar muchísimo entre un servicio simple de alojamiento, como los que comentaba de Amazon S3 o Wasabi, de otras plataformas de pódcast o vídeos en los que hay que leer muy bien los términos y condiciones por el uso que se les van a dar a tus contenidos alojados. Nosotros lo que queremos son «discos duros virtuales» para alojar, no un servicio al que subes un audio de tu pódcast y les cedes los derechos de cualquier cosa.
De verdad, esto es muy muy importante, porque no es lo mismo subir una foto tuya a tu sitio web, donde aunque eso esté publicado en Internet, tú tienes 100% tus derechos de imagen, que subirla a un Instagram, donde hay una parte que cedes de derechos a la plataforma, y eso hace que el control de la fotografía empiece a quedar muy lejos de tus manos. Pues vamos, que con cualquier contenido hemos de hacer lo mismo.
Así que, me repito, en la medida de lo posible, sieeempre hemos de alojar todo nosotros. Además, hoy en día el espacio en disco es relativamente barato en muchos proveedores, y como siempre os digo, si tu proveedor de hosting no se adapta a ti, cámbiate a uno que sí lo haga.
Y ahora vamos a lo importante. Las imágenes y los audios pueden ocupar relativamente poco. Una imagen podemos estar hablando de un par de megas, si me apuras y has de subir las imágenes en RAW podemos hablar de 1 MB por Megapixel, así que si tu cámara es de 50 Mpx pues ponle 50MB, ya sé que no es así, pero que sirva de ejemplo. Con los audios pasa lo mismo… depende un poco de la calidad del audio, pues también hablamos de 1 MB por minuto (eso ya es muy buena calidad, que conste) pero como es lo que yo hago en el WordPress podcast, pues por eso lo explico… porque en mi caso, audios de 5 a 10 minutos pueden ocupar unos 8 o 10 MB, que, para un audio es mucho. También he de decir que la calidad es alta.
Y llegamos a lo que seguro que muchos están esperando escuchar: los vídeos. ¿Qué hacemos con los vídeos?
Para los vídeos tenemos un abanico de posibilidades muy amplio e interesante, porque depende, como siempre, de para que uses los vídeos.
En este caso hablamos de usar los vídeos de manera muy masiva, ya sea un videoblog o sea una plataforma de formación.
Probablemente, si es un videoblog lo que tienes, lo mejor sea tener una copia de los vídeos alojados en tu servidor, otra copia en un disco duro en tu casa, y una copia en Youtube porque lo que quieres es darle la mayor difusión al vídeo. Incluso, en estos casos es probable que te interese usar el propio reproductor de Youtube para ver los vídeos en tu sitio. De todas formas, y lo digo por experiencia, hay que ir con cuidado con el tema Youtube pro lo que decía antes de los derechos de imagen y reproducción y sobre todo porque en cualquier momento te cierran la cuenta y nos encontramos con un pequeño gran problema.
La cuestión empieza a complicarse cuando, por ejemplo, tienes una plataforma de cursos en los que, claro está, no quieres que esos vídeos se descarguen fácilmente. Si los alojas en tu propio servidor lo tienes difícil en principio porque simplemente miras la URL del reproductor y verás la URL del vídeo. Y si tienes la URL, pues te la descargas.
Para estos casos el secreto está en el HLS, es decir, el HTTP Live Streaming. Esto es un invento de Apple que se ha convertido en un estándar (para los más geeks, es el RFC 8216). Este sistema comenzó para los MP3 con el formato M3U, actualmente el M3U8 y que básicamente permite una lista de reproducción de contenidos media. Últimamente, el sistema se usa básicamente para vídeos en MP4, aunque también se puede usar para audio en MP3.
Y hago un kitkat para entender bien cómo funciona este sistema y por qué es importante para el tema del alojamiento de vídeos.
Seguro que alguna vez habéis puesto una plataforma de vídeos tipo Netflix o Prime, y al principio del vídeo la imagen se empieza a ver como borrosa, luego de golpe se ve bien, a mitad del vídeo se ve durante unos segundos mal, pero luego vuelve a estar bien de calidad… pues, esto es la base de este sistema del HLS.
Y, es que este protocolo tiene una cosa muy interesante, ya que es adaptativo, se adapta a lo que el usuario necesita o puede obtener en cada momento. A ver, no nos engañemos, esto lo pensó Apple, así que ha de estar pensado para sus dispositivos y todas las condiciones en las que un Apple TV o un iPhone pueda encontrarse.
Básicamente, este sistema que es lo que hace. Tú subes un vídeo en la mayor calidad posible y una caja negra, que es la del HLS, lo que hace es convertir ese vídeo tuyo a muchos formatos, ya sean estándar o no, y de muchos tipos de pantalla, dispositivos y todo lo que plantees. Al final se suelen crear unos 6 formatos. Es parecido a lo que hace WordPress cuando subes una imagen, que te crea la imagen de tamaño grande, la mediana y el thumbnail… pues lo mismo con un vídeo. En este caso se suelen crear dos o tres tamaños, por ejemplo el de escritorio y el de móvil, y se crean esos tamaños en varias calidades, desde un HD, un Full HD o un 4K si se diera el caso.
Ahora lo que se hace es cortar el vídeo en trocitos, por ejemplo trocitos de 5 segundos, o de 1 segundo. Y dentro del fichero M3U8 le das una serie de reglas con todas estas combinaciones. El reproductor y el servidor son capaces de entenderse y saber en cada momento qué trocito ha de enviar al usuario. Si el vídeo que vas a ver dura 1 minuto, no te descargas un fichero de un vídeo de un minuto, sino que te descargas 60 vídeos de 1 segundo, en el que cada uno podría venir incluso en un tamaño de pantalla o resolución diferente, depende de lo que pase en tu dispositivo o en la conexión a Internet.
Y, aquí es donde está el secreto de Vimeo, al menos uno de ellos. Sé que Vimeo es una de esas plataformas que todo el mundo usa para almacenar y servidor los vídeos, pero no tengo tan claro que sea la mejor opción en cuanto a limitar las peticiones, ya que para cosas muy pequeñas puede funcionar, pero si te pones serio, no es tan óptimo como parece. Sé de gente que cuando el servicio ese de 70 dólares ya no le cuadra, el siguiente nivel es de miles de dólares… así que, quizá haya que hacer un pensamiento.
Para estos casos he descubierto estos meses atrás una combinatoria que puede ser interesante y relativamente barata para muchos. Es una combinación entre BunnyCDN y un plugin de reproducción de vídeo llamado FV Player.
El funcionamiento puede variar según las necesidades de cada uno y según el cariño que le quieras dedicar a las cosas. En mi caso, prefiero hacer algunas cosas más manuales en pro de la calidad del servicio, y más teniendo en cuenta que, el ejemplo que estamos poniendo, es el de la formación.
Por un lado, tenemos la parte de alojar los vídeos. Aquí hay varias opciones, ya que se pueden alojar los vídeos en un sistema del estilo a Wasabi, aunque la propia Bunny tiene su sistema de almacenamiento privado de contenidos estáticos, por lo que básicamente te dan una cuenta de FTP donde puedes subir tus vídeos. Otra opción es subirlo directamente a su panel. En cualquier caso, ellos te dan las herramientas para alojar ese vídeo en su servicio de almacenamiento, y que se serviría a través de su CDN. Entre las funcionalidades de la CDN está limitar desde qué dominios se pueden hacer llamadas a los ficheros de la CDN, el «referrer» de toda la vida, que es la funcionalidad principal que la gente usa con Vimeo.
Lo siguiente es decirle que vamos a usar su servicio de streaming, y en ese servicio básicamente te van a dar las herramientas para crear un reproductor de vídeo y poder incrustarlo en tu WordPress. Más o menos lo mismo que hace Youtube y otros… en este caso, el reproductor es suyo y tiene ciertas limitaciones en cuanto a controlar lo que hace o deja de hacer.
Y ahí es donde entra el FV Player. Este es un plugin gratuito que podéis encontrar en el repositorio de WordPress, aunque tiene una versión PRO que incluye funcionalidades interesantes, y es relativamente barato.
Lo interesante de este reproductor es que tiene soporte para HLS, lo que significa queee… ¡Pues sí! Puedes incluir esa ruta que te ha generado Bunny en tu reproductor de forma que conseguimos nuestros 3 objetivos:
- Que el vídeo quede alojado en un servidor externo
- Que el vídeo sólo se pueda reproducir desde nuestro sitio.
- Y, que el vídeo se sirva en un formato HLS, de forma que el usuario verá la mejor opción del vídeo en todo momento, independientemente de que lo haga en un móvil o en un ordenador, y que su conexión sea muy ala o muy buena.
Y, para ir acabando, que conste que esto que he explicado son varios ejemplos de algunas cosas que yo he probado o utilizo, pero que no son las únicas. Tampoco quiero que los expertos se me enfaden cuando he explicado cómo funcionan las distintas tecnologías, que sé que he reducido muchísimo la explicación y que en algunos casos es algo más compleja, pero espero que e general se haya entendido, que en este pódcast no estamos para saber cómo funciona la tecnología, sino cómo aplicarla a nuestros WordPress.
Despedida
Nos podéis dejar ideas, posibles temas de los que queréis que hablemos en el pódcast.
Podéis encontrar a Joan Boluda, donde tenéis sus cursos de WordPress, y a Javier Casares, con todos sus proyectos.
Estáis más que invitados a participar a través de la sección de contacto de la web, a través de la que podéis enviar preguntas, dudas, y sugerencias para nuevos episodios.
Puedes suscribirte y escucharnos cada semana en Pocket Casts, Apple Podcasts, Spotify, Google Podcasts e iVoox.
¡Nos vemos el programa que viene con más WordPress!