Make sure your website is available and usable for everyone during COVID-19

This page provides guidance to help ensure that your website is available, accessible, secure, and usable for everyone at all times.

La guía en esta página proviene de una colección multifuncional de equipos dentro de Google que están cambiando su enfoque a corto plazo para respaldar sitios web que ayudan a las persons a mantenerse seguras durante la situación de COVID-19. Estos empleados de Google han visto que los sitios se enfrentan a un aumento sin precedentes en la demanda de personas que buscan información crítica, muchas de las cuales rara vez o nunca han utilizado la web antes. Puede ser un desafío garantizar que los sitios estén disponibles durante este tiempo y accesibles para todos.

guide

Availability, reliability, resilience and stability

Si su sitio está experimentando picos de traffic y está fallando, o si desea evitar que falle, la guía a continuación puede ayudarlo a solucionar problemas rápidamente o detectarlos antes de que se conviertan en problemas importantes.

• Lea Reparar un server sobrecargado para aprender a detectar, mitigar y prevenir problemas de picos de tráfico.
• Elimine imágenes, videos, scripts y fuentes innecesarios. Asegúrese de que cada página se centre en ofrecer la funcionalidad que las personas que utilizan su sitio realmente necesitan.
• Optimizing your images can significantly reduce your server's bandwidth usage because images are the number one source of bloat on the web.
• Descargue la mayor cantidad posible de contents estático en CDN. Más detalles de proveedores comunes:
  AWS,
  Azure,
  Cloudflare,
  Google cloud,
  Firebase.
• Compruebe si su CDN tiene alguna optimización que be fácil de activar, como compresión dinámica de imágenes, compresión de texto o minificación automática de recursos JS y CSS.
• La optimización del almacenamiento en cache HTTP puede reducir significativamente las demandas de sus servidores con un cambio mínimo de código. Consulte La caché HTTP: su primera línea de defensa para obtener una descripción general y HTTP caching
  and Caching best practices for specific recommendations. Serving static assets with efficient cache policy auditing in Lighthouse can help you quickly detect resources that are not being cached. Keep in mind that different types of resources will have different update requirements and therefore require different caching strategies.
• Service workers are another way to significantly reduce the demands on your servers, but they can require a significant technical investment. They also allow your website to work
  disconnected, allowing you to present opening hours, phone numbers, and other information to returning users without a connection. Workbox is the recommended approach to adding service workers to websites because it automates a lot of replay, makes it easy to track best practices, and avoids subtle mistakes that are common when using the low level. ServiceWorker
  API directamente.
• If your site is experiencing increased usage, check to see if you have adequate protection against DDoS attacks porque su sitio ahora puede ser un target más atractivo. Más detalles de proveedores comunes:
  AWS,
  Azure,
  Cloudflare,
  Google cloud.

See Network reliability for further guidance.

Accessibility

Focusing on accessibility is more important than ever because more people with a variety of needs are likely to access your site. Follow the guidelines below to ensure that the core functionality of your website is accessible to everyone.

Identity, security and privacy

Puede ser tentador tomar atajos para obtener soluciones críticas, pero siempre tenga cuidado de no abrir agujeros de seguridad al hacerlo. Las personas necesitan acceder a contenido sobre temas que son extremadamente privados. Los sitios web deben proteger a toda costa estos datos confidenciales del Username y convencer a las personas de que
personally identifiable information (PII) is safe.

See Safe and Secure for further guidance.

Usability, UI and UX

People are increasingly relying on the web to meet their basic needs. Many of these people do not use the web frequently. It's worth auditing the usability of your site's core functionality and making sure it's as simple and user-friendly as possible.

• Considere agregar un banner prominente (que se puede quitar con un X button) at the top of your website that clearly communicates service updates. Use a call to action on the banner to direct people to more specific resources. Consider using different colors and fonts that stand out from the rest of the content on your page. Keep your writing empathetic, focused on people's needs, and transparent about what kind of service to expect.
• Look for opportunities to minimize physical interactions in your critical user journeys (CUJ) and suggest those changes to your product team. For example, if your delivery service generally requires a signature, see if there is a way to fix it.
• Make sure your CUJs are as simple and intuitive as possible and suggest changes to your product team if you see any opportunities for improvement.
• Check the principles of good mobile design
  and test your CUJs on various mobile devices to make sure there are no obvious problems. People who don't use the web frequently and are suddenly forced to rely more on the web are likely to access your site from mobile devices.
• Refactor your site to use responsive design patterns
  as much as possible.
• Make sure your forms are
  efficient
  and
  well designed.

SEO

Las personas buscan información crítica relacionada con la salud y el trabajo. Es importante asegurarse de que sus sitios sean detectables por todos los search engines. Las auditorías de Lighthouse SEO pueden ayudarlo a detectar problemas básicos. Siga los blogs oficiales de los motores de búsqueda para obtener la orientación y las actualizaciones más recientes:
Google,
Bing,
Baidu,
Duck Duck to Win,
Yandex. Recent posts related to COVID-19:

See Discoverable for further guidance.

Performance

Some ISPs (in India for example) are watching a sharp increase in home internet use
y no tienen la infraestructura para satisfacer la creciente demanda. En situaciones como esta, la velocidad de su sitio web puede disminuir sin que usted tenga la culpa. Optimize el rendimiento de su carga podría ser una forma de compensar el viento en contra del ancho de banda reducido. En otras palabras, al reducir la cantidad de bytes que deben enviarse a través de la red para cargar sus páginas, puede compensar el impacto en el rendimiento de la reducción del ancho de banda.

• The images are the leading cause of swelling on the web. You may be able to significantly reduce your website bandwidth usage by optimizing your images.
  Squoosh es una sencilla herramienta de compresión de imágenes de Open Source que puede ayudarlo a comprimir rápidamente sus imágenes.
• to run WebPageTest or
  Lighthouse
  to discover your top performance improvement opportunities.
• Enable text compression to reduce the network size of text resources. This is often an easy performance gain that requires minimal technical investment.
• Read How to Cross-Fix Website Speed to learn how to collaborate and gain buy-in from other departments.
• Use native lazy loading for images to minimize requests for images that people may never see. Browser compatibility
  no es 100%, pero la función puede tratarse como una progressive improvement. En otras palabras, si un determinado browser no admite la carga diferida nativa, la imagen debería cargarse como lo hace normalmente.
• Check if your site has any A / B testing or customization scripts that can be loaded more asynchronously or if there are any non-critical functionality in the scripts that can be disabled. Customization and A / B testing scripts generally cannot be loaded completely asynchronously because they must be executed before the page content is loaded, but there may be some opportunity to load parts of the scripts more asynchronously. Watch Critical render path to understand the fundamental trade-off between synchronous scripts (aka render lock scripts) in general and page load time, and then decide if you need to prioritize render lock scripts over page load time , or vice versa.
• Third-party code constitutes about half of all requests for most websites. To consider
  optimizing
  or remove or temporarily disable third-party code that is not critical to the operation of your site.
• If feature releases aren't taking precedence, this might be the perfect time to clean up. Remove tags from your tag managers, clean up bloated CSS and JS, and remove outdated code or features. the
  Coverage tab
  in Chrome DevTools and
  Coverage The class in Puppeteer can help you detect unused code.

See Quick Charge Times for more guidance.

Hero image for
POT in
Unsplash