Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.

Hacer que tu sitio de Squarespace sea más accesible

Los lectores de pantalla y otras tecnologías de asistencia pueden analizar los sitios web accesibles. Hay muchos aspectos de tu sitio que puedes ajustar para facilitar el acceso a tu contenido a los visitantes con diferentes capacidades visuales y de movimiento.

Use this guide to learn best practices for designing and structuring your content. 

Nota: Esta guía está disponible como un recurso para ayudarte a comenzar, pero no debe interpretarse ni considerarse como asesoramiento jurídico. Squarespace no puede proporcionar consejos sobre cómo hacer que tu sitio cumpla con leyes o regulaciones específicas de accesibilidad.

Títulos de página

The first thing screen readers dictate when users go to a new web page is the page title. Since page titles are so important for orientation, ensure every page has a title that introduces its topic or purpose, and differentiates it from other pages on your site. You can also add a page description that provides more context. These fields also help with your site’s SEO.

Texto

Títulos

Screen readers scan pages for html tags to understand their structure and allow visitors to navigate quickly between sections. Use the heading field in the text editor to structure your text. To learn how to format text with headings, visit Styling and formatting text.

  • Use structured headings and a linear format.
Don't
  • Rely on text within images to convey meaning.
  • Rely on bolding, italics, or other design formatting to create structure.

Espacios

Ensure your text has adequate line spacing. You can control letter spacing and line height in Site Styles. Here are some guidelines:

  • Line spacing should be at least 1.5 times the font size.
  • Spacing following paragraphs should be at least 2 times the font size.

Enlaces

Ensure the purpose of each link can be determined from the link text alone. For example:

“To reach out, visit our contact page.”

Don't  “To reach out, click here.

Compartir en las redes sociales

Además de los íconos de redes sociales, incluye vínculos de texto a tus cuentas de redes sociales. Indica siempre el nombre de la plataforma de redes sociales en el texto para identificar el propósito del vínculo.

Imágenes

When scanning a page, screen readers identify images and read the descriptive text (alt text) to visitors. When adding alt text, take a moment to consider why you’ve used the image in the first place. Is it to convey information, or is it decorative? What do visitors with vision impairments need to know about the image to access all the information available to sighted visitors? A best practice is to briefly describe the image as you would to a friend over the phone.

Purely decorative images, like graphics separating content or abstract background images, don't require descriptions.

To learn more about alt text, visit Adding alt text to images.

  • Consider the purpose of the image and try to convey that meaning concisely using text.
  • Keep your alt text under 125 characters. Many braille displays only present up to 40 or 80 characters at a time, so it's best to be concise as possible.
  • If the image has a clickthrough URL or any other functional use, describe the function. For example: "A laughing couple. Links to Engagement Photos."
  • For images that require detailed descriptions, like charts, graphs, or complex graphics, include a description of the image nearby in the text of your site. As an alternative, you can add a separate page containing a description of the image, then add a clickthrough URL from the image to that page.
Don't
  • Include phrases like “An image of” or “A picture of” in your alt text. Many assistive technologies automatically identify them as images.

Audio

You can help visitors with hearing impairments access your audio content, like podcasts, by adding a transcript.

  • Keep your pages organized by linking to a Not Linked page containing the transcript.

Videos

Add synchronized captions using the integrated closed captioning features for YouTube and Vimeo. This way, viewers can enable or disable captions from within the Video Block. Visit YouTube and Vimeo for more information on adding captions.

  • Provide enough time to read captions.
Don't
  • Add flashing content known to cause seizures or physical reactions. As a general rule, avoid content that flashes three times in any one second period.

Colores

Pair colors that maximize contrast, and avoid grouping colors that are difficult to differentiate with color blindness, like blue and purple. Color Oracle is a useful tool that simulates how people with common color vision impairments see a page. Note that this is a third-party application that falls out of the scope of Squarespace support. You can change your site’s colors in Site Styles.

If you can’t change the color scheme, use text, alt text, and other contextual information to help visitors with color blindness understand content explained through color.

For example, if the chart below was a static image, visitors with color blindness probably wouldn't see which section represents New York. However, since this is a Squarespace Chart Block, we can add section labels on hover so color vision impaired visitors read context about each section of the chart.

Color_wheel.png

  • Group colors with high contrast.
  • Use Color Oracle or similar tools to see a simulation of how people with common color vision impairments experience your content.
Don't
  • Pair colors that are difficult to differentiate with common color blindness, like blue and purple.

Preguntas frecuentes

Is my site accessible?

Los requisitos de accesibilidad difieren en todo el mundo. Eres responsable de asegurarte de que tu sitio cumple con las leyes aplicables, incluidos los requisitos de accesibilidad locales. La mejor manera de entender la accesibilidad de tu sitio e identificar áreas para mejorar es consultar a un especialista en accesibilidad. También puedes revisar esta lista de comprobación preliminar de accesibilidad web. El soporte técnico de Squarespace no puede proporcionar asesoramiento sobre cómo hacer que tu sitio cumpla con leyes o decretos específicos de accesibilidad web.

Is Squarespace working to improve accessibility?

Yes. Squarespace takes accessibility seriously. We are always looking to improve and will never be done. We’re committed to making our services more accessible to users of all abilities. We're currently in the process of reviewing our services to improve user experience further, and seeking to make it easier for our customers to make their sites as accessible as possible. 

 

¿Fue útil este artículo?
Usuarios a los que les pareció útil: 164 de 198
Hacer que tu sitio de Squarespace sea más accesible