Mejorar la accesibilidad del MEC
En este artículo, aprenderemos cómo mejorar la accesibilidad MEC. Según el W3C , cuando los sitios web y las herramientas web están bien diseñados y programados, las personas con discapacidad pueden utilizarlos. Sin embargo, muchos sitios y herramientas se desarrollan actualmente con barreras de accesibilidad que dificultan o imposibilitan su uso para algunas personas.
Hacer que la web sea accesible
Hacer que la web sea accesible beneficia a las personas, las empresas y la sociedad. Los estándares web internacionales definen lo que se necesita para la accesibilidad.
También puedes utilizar herramientas como WAVE Web Accessibility Evaluation Tool y WebAccessibility.com para comprobar tu nivel de accesibilidad.
Cómo mejorar la accesibilidad del MEC
Para mejorar la accesibilidad en el Modern Events CalendarEn los códigos cortos y las páginas de evento único, puede agregar lo siguiente CSS a Configuración de MEC > CSS personalizado.
Al hacer esto, obtendrás más puntos en el Faro de tu navegador y lograrás una accesibilidad adecuada para tu sitio web:
.mec-calendar.mec-calendar-daily .mec-calendar-d-table .mec-daily-view-day,
.mec-calendar.mec-calendar-weekly .mec-calendar-d-table dl dt.mec-weekly-disabled.mec-table-nullday span {
font-weight: 300;
}
.mec-calendar .mec-event-article .mec-event-detail,
.mec-calendar .mec-calendar-side .mec-next-month a,
.mec-calendar .mec-calendar-side .mec-previous-month a,
.mec-calendar .mec-table-nullday,
.mec-single-event .mec-current,
.mec-single-event .mec-event-meta .mec-events-event-categories a,
.mec-single-event .mec-event-meta dd,
.mec-single-event .mec-next-event-details abbr,
.mec-yearly-view-wrap .mec-agenda-date-wrap i,
.mec-yearly-view-wrap .mec-agenda-date-wrap span.mec-agenda-day,
.mec-calendar.mec-calendar-daily .mec-calendar-d-table .mec-daily-view-day,
.mec-calendar.mec-calendar-weekly .mec-calendar-d-table dl dt span,
.mec-skin-tile-month-navigator-container .mec-next-month,
.mec-skin-tile-month-navigator-container .mec-previous-month,
.mec-events-agenda-wrap span.mec-agenda-day,
.mec-events-agenda-wrap .mec-agenda-time,
.mec-event-grid-modern .event-grid-modern-head .mec-event-day,
.mec-event-grid-modern .mec-event-content p,
.mec-event-grid-clean .mec-event-content p,
.mec-event-grid-classic .mec-event-content p,
.mec-event-list-modern .mec-event-date .event-f,
.mec-event-list-modern .mec-event-date .event-da,
.mec-wrap .mec-time-details,
.mec-wrap .mec-event-detail,
.mec-wrap .mec-event-loc-place {
color: #000;
}
.mec-wrap .mec-av-spot-wrap p,
.mec-event-tile-view ul.mec-categories li.mec-category a,
.mec-event-tile-view .mec-event-loc-place,
.mec-skin-grid-container .mec-event-grid-novel .mec-event-address,
.mec-skin-grid-container .mec-event-grid-novel .mec-event-detail,
.mec-skin-grid-container .mec-event-grid-novel .mec-event-month,
.mec-skin-grid-container .mec-event-grid-novel ul.mec-categories li.mec-category a,
.mec-skin-grid-container .mec-event-grid-novel ul.mec-categories li.mec-category a:before,
.mec-skin-grid-container .mec-event-grid-novel .mec-shortcode-organizers a,
.mec-skin-grid-container .mec-event-grid-novel .mec-shortcode-organizers i:before,
.mec-event-grid-colorful ul.mec-categories li.mec-category a,
.mec-event-grid-colorful .mec-event-content .mec-grid-event-location,
.mec-event-grid-colorful .event-grid-modern-head .mec-event-day,
.mec-event-grid-colorful ul.mec-categories li.mec-category a,
.mec-wrap .mec-skin-grid-events-container .mec-time-details,
.mec-wrap .mec-skin-grid-events-container .mec-event-loc-place,
.mec-wrap .mec-event-grid-classic .mec-time-details {
color: #fff;
}