por The Black | May 29, 2023 | Google, SEO |
A parte de un invento de Mr.Google para que todos los gurus del SEO hagan lo que le conviene a él para ganar más dinero con los anuncios con la excusa de que quiere que tengamos una UX (User eXperience) del copón, vamos a ver si nos explicamos un poco para que lo entengamos los simples mortales.
Las 3 métricas de Core Web Vitals son indicadores clave que evalúan la experiencia de usuario en términos de carga, interactividad y estabilidad visual de una página web.
1. Largest Contentful Paint (LCP): Mide el tiempo que tarda en cargar el elemento más grande y visible de la página. Para mejorar este indicador, debemos optimizar el tamaño de los ficheros, especialmente las imágenes y minificar código, especialmente los achivos .js y .css
2. First Input Delay (FID): Mide la capacidad de respuesta interactiva de una página, midiendo el tiempo de retraso entre la interacción del usuario (clic, toque, etc.) y la respuesta del sitio. Para mejorar el FID, es necesario reducir el tiempo de ejecución de tareas JavaScript, evitar bloquear el hilo principal y utilizar técnicas de carga diferida o asíncrona para scripts.
3. Cumulative Layout Shift (CLS): Evalúa la estabilidad visual de la página midiendo la cantidad de cambios de diseño inesperados durante la carga. Para mejorar el CLS, es importante establecer dimensiones explícitas para imágenes y elementos multimedia, evitar la inserción de contenido dinámico que desplace el diseño y cargar anuncios y elementos externos de manera que no afecten negativamente al diseño.
Cómo mejorar LCP (Largest Contentful Paint)
- Optimiza el rendimiento del servidor: Asegúrate de que tu servidor responde rápidamente a las solicitudes del navegador. Utiliza técnicas de almacenamiento en caché y compresión de archivos (GZIP) para reducir los tiempos de carga.
- Optimiza y comprime imágenes: Las imágenes suelen ser la causa principal de un LCP lento. Reduce el tamaño de las imágenes utilizando formatos más ligeros como JPEG en lugar de PNG. Utiliza compresión sin pérdida para mantener la calidad mientras se reduce el tamaño del archivo.
- Formato WebP es un formato de imagen desarrollado por Google que utiliza compresión con pérdida y sin pérdida para ofrecer imágenes de alta calidad con tamaños de archivo más pequeños en comparación con otros formatos populares, como JPEG y PNG.
- Prioriza el contenido visible: Carga primero el contenido importante y visible para el usuario. Utiliza técnicas como la carga progresiva o lazy loading para mostrar inicialmente el contenido visible y cargar el contenido adicional a medida que el usuario se desplaza hacia abajo en la página.
- Minimiza el tiempo de respuesta del navegador: Reduce la cantidad de recursos bloqueantes, como scripts o archivos CSS, que pueden retrasar la renderización del contenido principal. Asegúrate de cargar y ejecutar scripts de manera eficiente y optimiza tus estilos CSS para que se carguen rápidamente.
- Utiliza una red de entrega de contenido (CDN): Un CDN distribuirá tu contenido a través de servidores ubicados estratégicamente en todo el mundo, lo que reducirá la distancia física entre tu sitio y los usuarios, mejorando así los tiempos de carga.
Cómo mejorar FID (First Input Delay)
- Minimiza el tiempo de ejecución del JavaScript: Optimiza tus scripts para que se ejecuten de manera eficiente y evita bloquear el hilo principal del navegador. Utiliza técnicas como la carga asíncrona o diferida de JavaScript para mejorar el rendimiento.
- Reduce el tamaño de los scripts: Minimiza el tamaño de los archivos JavaScript eliminando el código innecesario, utilizando herramientas de compresión y eliminando bibliotecas o funciones que no se utilizan. Considera utilizar técnicas de modularización para dividir tu código en módulos más pequeños y así reducir la complejidad.
- Interacciones fluidas y receptivas: Asegúrate de que las acciones del usuario tengan una respuesta inmediata. Utiliza técnicas como el preprocesamiento de acciones, la gestión de eventos en segundo plano y la carga progresiva de contenido para que el usuario perciba una experiencia fluida y sin retrasos.
- Evita bloqueadores de JavaScript: Algunos elementos de la página, como ventanas emergentes o elementos de terceros, pueden bloquear el hilo principal del navegador y causar retrasos en la capacidad de respuesta. Identifica y elimina o modifica elementos que puedan afectar negativamente el FID.
- Utiliza herramientas de monitorización y análisis: Realiza un seguimiento del rendimiento de tu sitio web con herramientas como Google Analytics o Lighthouse para identificar áreas problemáticas y obtener información sobre cómo mejorar el FID.
Cómo mejorar CLS (Cumulative Layout Shift)
- Asegúrate de que los tamaños de los elementos sean determinísticos: Establece dimensiones explícitas (ancho y alto) para imágenes, videos y elementos
- Evita cambios de diseño no deseados: Asegúrate de que los elementos de la página no cambien de tamaño, posición o forma de manera inesperada. Esto puede ocurrir cuando se cargan anuncios, imágenes u otros contenidos de manera asincrónica. Reserva espacio para los elementos que se cargarán más adelante o utiliza técnicas como el atributo `width` y `height` para mantener el espacio ocupado mientras se carga el contenido.
- Carga y reserva espacio para contenido incrustado: Si tu página incluye elementos incrustados, como videos de YouTube o widgets de redes sociales, asegúrate de reservar espacio para ellos. De esta manera, cuando se carguen, no causarán cambios inesperados en el diseño y evitarán desplazamientos indeseados.
- Utiliza transiciones y animaciones suaves: Si tienes elementos que se mueven o cambian de tamaño, asegúrate de aplicar transiciones o animaciones suaves para que los cambios sean gradualmente perceptibles para el usuario. Evita cambios bruscos y repentinos que puedan causar un desplazamiento involuntario.
- Realiza pruebas y optimizaciones: Utiliza herramientas como Google PageSpeed Insights o Lighthouse para analizar y medir el CLS de tu sitio web. Identifica los elementos problemáticos que causan cambios de diseño y trabaja en su optimización. Realiza pruebas de rendimiento y optimización para asegurarte de que el CLS se mantenga bajo control.
Recuerda que mejorar estas métricas no solo proporcionará una mejor experiencia para los usuarios, sino que también puede tener un impacto positivo en el posicionamiento de tu sitio web en los resultados de búsqueda para que Google pueda incrementar también sus beneficios.
por The Black | Abr 7, 2023 | SQL Server |
En bases de datos con muchas tablas, podemos necesitar saber cuales son las tablas que más registros tienen y más espacio ocupan, con el fin de mejorar el rendimiento de la base de datos.
Para SQL Server, los datos de las bases de datos de usuarios se encuentran en tablas del sistema. Podemos usar el siguiente QRY para ver el espacio que ocupan todas las tabals de una base de datos en concreto.
USE Mi_base_de_datos;
GO
SELECT
t.NAME AS TableName,
s.Name AS SchemaName,
p.rows AS RowCounts,
SUM(a.total_pages) * 8 AS TotalSpaceKB,
SUM(a.used_pages) * 8 AS UsedSpaceKB,
(SUM(a.total_pages) - SUM(a.used_pages)) * 8 AS UnusedSpaceKB
FROM
sys.tables t
INNER JOIN
sys.indexes i ON t.OBJECT_ID = i.object_id
INNER JOIN
sys.partitions p ON i.object_id = p.OBJECT_ID AND i.index_id = p.index_id
INNER JOIN
sys.allocation_units a ON p.partition_id = a.container_id
LEFT OUTER JOIN
sys.schemas s ON t.schema_id = s.schema_id
GROUP BY
t.Name, s.Name, p.Rows
ORDER BY
TotalSpaceKB DESC
por The Black | Ene 20, 2023 | SEO |
Uno de los aspectos más importantes de cualquier sitio web es su diseño y presentación visual. Los recursos gráficos, como las imágenes y los iconos, son elementos esenciales para crear una experiencia atractiva y profesional para los visitantes. Sin embargo, encontrar recursos gráficos de calidad puede ser costoso y consumir mucho tiempo . Afortunadamente, hay varias opciones para encontrar recursos gráficos gratuitos que se pueden utilizar en tu sitio web.
En este artículo, vamos a ver alguna de las opciones para encontrar recursos gráficos gratuitos que utilizo. Desde bancos de imágenes gratuitos hasta conjuntos de iconos, hay una gran cantidad de recursos disponibles para ayudar a mejorar la apariencia y la funcionalidad de tu sitio web.
Además, también veremos el tipo de licencia de los recursos ofrecidos por cada sitio y cómo asegurarte de que estás utilizando los recursos de manera legal y ética. Con esta información, podrás encontrar los recursos gráficos adecuados para tu sitio web sin arruinarte ni que te pongan una demanda (si lo haces bien, claro).
Pixabay
Pixabay es una plataforma web que ofrece imágenes y vídeos gratuitos para uso comercial y no comercial. Pueden buscar, descargar e incluso contribuir con imágenes y vídeos a la plataforma. Todos los contenidos de Pixabay están bajo la licencia Creative Commons CC0, lo que significa que se pueden usar libremente sin necesidad de pedir permiso o dar crédito al autor.
Unsplash
Al igual que la anteriro, Unsplash ofrece imágenes gratuitas de alta resolución para uso personal y comercial. Puedes buscar, descargar y contribuir con imágenes a la plataforma. Todas las imágenes de Unsplash están bajo la licencia Creative Commons Zero (CC0), lo que significa que las puedes usar libremente sin necesidad de pedir permiso o dar crédito al autor. Aunque cuando las descargas te ofrece un script con la atribución para poner junto a la imagen.
Puedes buscar las imágenes por categorías, color, resolución y más opciones. También cuenta con una aplicación para dispositivos móviles, con la cual podrás descargar imágenes desde cualquier lugar. En resumen, Unsplash es una excelente opción si estás buscando imágenes de alta calidad y gratuitas para usar en tus proyectos.
Pexels
Más de lo mismo y con esta acabamos con el trio de webs de stocks de fotos
Pexels ofrece imágenes gratuitas de alta resolución para uso personal y comercial. Puedes buscar, descargar y contribuir con tus propias iagenes a la plataforma. Al igual que en las dos anteriores, todas las imágenes de Pexels están bajo la licencia Creative Commons Zero (CC0), por lo que las puedes usar libremente sin necesidad de pedir permiso o dar crédito al autor. ambién cuenta con una aplicación para dispositivos móviles.
También es una excelente opción para encontrar las fotografías que puedes necesitar para tu sitio web.
Flaticon
FlatIcon es una plataforma web que ofrece una gran colección de iconos vectoriales gratuitos para uso personal y comercial. Todos los iconos de FlatIcon están bajo la licencia Creative Commons Zero (CC0), lo que significa que se pueden usar libremente sin necesidad de pedir permiso o dar crédito al autor.
Con FlatIcon, puedes descargar iconos de alta calidad para usar en tu sitio web, diseño gráfico, presentaciones, aplicaciones móviles, redes sociales, entre otros. Además, puedes buscar iconos por categorías, estilo, color y más. También cuenta con una herramienta de edición en línea, con la cual podrás personalizar los iconos a tu gusto.
Puedes descargar los iconos desde su página o regsitrate y enlazar con su CDN con un script enel <head> o con la instrucción @import en ti css. Podrás mostar cada icono con un simple <div>
Para ir a la versión en español usa www.flaticon.es
Storyset
Storyset ofrece una gran colección de ilustraciones vectoriales gratuitos para uso personal y comercial. Las ilustraciones son gratuitas, pero debes mostrar en la web la atribución
Puedes seleccionar colecciones de ilustraciones de distinto tipo que puedes personalizar cambiando el color básico de cada ilustración, de esta forma se pueden adaptar fácilmente a la paleta de colores que uses en tu web.
Más Madera…
Sitios web que puedes descargara ilustraciones o iconos gratis para tu web que vamos descubriendo:
- Undraw.com Ilustarciones en formato SVG o PNG
- Boxicons.com Iconos para descargar en distintos tamaños o para usar como una clase en CSS.
por The Black | Ene 11, 2023 | Dominios |
En ocasiones podemos necesitar saber quien es el propietario de un dominio,cuando caduca o que servidores de dominio está usando y no tenemos los datos de acceso a su administración. Algunas webs pueden darnos esta información si no está protegida. los datos del titular estarán, generalmente, ocultos. Pero dependiendo de la extensión del dominio, deberemos usar páginas diferentes
.COM . ORG. .NET Mayoría de dominios
- ICANN Lookup Nos da la fecha de registro, de caducidad y los servidors DNS enq ue esté alojado el dominio
- Who.is Da más información de DNS, pero no siempre está disponible. últimamente da bastantes Time Outs
.ES
- Dominios.es Web oficial de red.es donde comprobar si lso registros de los dominios .es
No mostrará los datos del titular pero si podrás enviar, a través de red.es, una nota al titular.
Si el dominio está libre, te permite seleccionar un registrador autorizado para registrarlo
.CAT
- Whois Puntcat Los mismo datos que los anteriores, pero para dominios .cat
Imagen de Freepik
por The Black | Oct 1, 2022 | Seguridad |
Cunado enviamos un email de cualquier tipo desde un formulario web, no se está enviando desde el servidor de correo. Esto quiere decir que puedes ser tu, o puede ser un spamer que te ha pillado la contraseña esa de ‘123456’ que tan fácil es de recordar.
Lo de usar contraseñas largas, con mayúsculas, minúsculas, números, caracteres especiales…. eso ya no hace falta repetirlo. Peor como el servidor de correo entrante no sabe si esa precaución la tienes, cuando recibe un correo, le pregunta al servidor. ¿Has sido tú?. ¿Y como lo pregunta?. Pues comprobando un registro DNS llamado SPF.
SPF es un método de autenticación de correo electrónico standard. Es decir, no hay un servidor de correo que diga ‘Nolontiendo’.
SPF protege tu dominio contra el spoofing (técnica hacking que intentan suplantar la identidad de tu servidor de correo en este caso)
¿Como configuro mi servidor de correo?
Para configurarlo tienes que tener acceso a cambiar los registros DNS de tu dominio. Y para saber que tienes que incluir, hay e¡una herramienta de MXToolbox muy útil: MXToolBox SPF Record Generator.
Entramos nuestro dominio hacemos clic sobre Check SPF Record y nos mostrará la sugerencia de registro y el registro actual.
Rellenamos los datos que nos pide y con Finalize Record, veremos el registro que nos sugiere para cambiar en nuestros DNS.
