{"id":6076,"date":"2021-10-03T12:17:20","date_gmt":"2021-10-03T12:17:20","guid":{"rendered":"https:\/\/webnus.site\/dox\/?p=6076"},"modified":"2024-02-13T08:52:42","modified_gmt":"2024-02-13T08:52:42","slug":"improve-mec-accessibility","status":"publish","type":"knowledgebase","link":"https:\/\/webnus.net\/dox\/modern-events-calendar\/improve-mec-accessibility\/","title":{"rendered":"Improve MEC Accessibility"},"content":{"rendered":"\n

In this article, we will learn how to improve MEC Accessibility. According to W3C<\/a>, When websites and web tools are properly designed and coded, people with disabilities can use them. However, many sites and tools are currently developed with accessibility barriers that make them difficult or impossible for some people to use.<\/p>\n\n\n\n

<\/span>Making the web accessible<\/span><\/h2>\n\n\n\n

Making the web accessible benefits individuals, businesses, and society. International web standards define what is needed for accessibility.<\/p>\n\n\n\n

You can also use tools like WAVE Web Accessibility Evaluation Tool<\/a> and WebAccessibility.com<\/a>\u00a0to check your accessibility level.<\/p>\n\n\n\n

<\/span>How to Improve MEC Accessibility <\/span><\/h2>\n\n\n\n

To improve accessibility in the Modern Events Calendar’s shortcodes and Single Event pages, you can add the following CSS<\/a> to MEC Settings > Custom CSS<\/strong>.<\/p>\n\n\n\n

By doing this, you will get more points in the Lighthouse<\/strong> in your browser, and you’ll implement proper accessibility for your website:<\/p>\n\n\n

\n.mec-calendar.mec-calendar-daily .mec-calendar-d-table .mec-daily-view-day,\n.mec-calendar.mec-calendar-weekly .mec-calendar-d-table dl dt.mec-weekly-disabled.mec-table-nullday span {\n        font-weight: 300;\n}\n\n.mec-calendar .mec-event-article .mec-event-detail,\n.mec-calendar .mec-calendar-side .mec-next-month a,\n.mec-calendar .mec-calendar-side .mec-previous-month a,\n.mec-calendar .mec-table-nullday,\n.mec-single-event .mec-current,\n.mec-single-event .mec-event-meta .mec-events-event-categories a,\n.mec-single-event .mec-event-meta dd,\n.mec-single-event .mec-next-event-details abbr,\n.mec-yearly-view-wrap .mec-agenda-date-wrap i,\n.mec-yearly-view-wrap .mec-agenda-date-wrap span.mec-agenda-day,\n.mec-calendar.mec-calendar-daily .mec-calendar-d-table .mec-daily-view-day,\n.mec-calendar.mec-calendar-weekly .mec-calendar-d-table dl dt span,\n.mec-skin-tile-month-navigator-container .mec-next-month,\n.mec-skin-tile-month-navigator-container .mec-previous-month,\n.mec-events-agenda-wrap span.mec-agenda-day,\n.mec-events-agenda-wrap .mec-agenda-time,\n.mec-event-grid-modern .event-grid-modern-head .mec-event-day,\n.mec-event-grid-modern .mec-event-content p,\n.mec-event-grid-clean .mec-event-content p,\n.mec-event-grid-classic .mec-event-content p,\n.mec-event-list-modern .mec-event-date .event-f,\n.mec-event-list-modern .mec-event-date .event-da,\n.mec-wrap .mec-time-details,\n.mec-wrap .mec-event-detail,\n.mec-wrap .mec-event-loc-place {\n    color: #000;\n}\n\n.mec-wrap .mec-av-spot-wrap p,\n.mec-event-tile-view ul.mec-categories li.mec-category a,\n.mec-event-tile-view .mec-event-loc-place,\n.mec-skin-grid-container .mec-event-grid-novel .mec-event-address,\n.mec-skin-grid-container .mec-event-grid-novel .mec-event-detail,\n.mec-skin-grid-container .mec-event-grid-novel .mec-event-month,\n.mec-skin-grid-container .mec-event-grid-novel ul.mec-categories li.mec-category a,\n.mec-skin-grid-container .mec-event-grid-novel ul.mec-categories li.mec-category a:before,\n.mec-skin-grid-container .mec-event-grid-novel .mec-shortcode-organizers a,\n.mec-skin-grid-container .mec-event-grid-novel .mec-shortcode-organizers i:before,\n.mec-event-grid-colorful ul.mec-categories li.mec-category a,\n.mec-event-grid-colorful .mec-event-content .mec-grid-event-location,\n.mec-event-grid-colorful .event-grid-modern-head .mec-event-day,\n.mec-event-grid-colorful ul.mec-categories li.mec-category a,\n.mec-wrap .mec-skin-grid-events-container .mec-time-details,\n.mec-wrap .mec-skin-grid-events-container .mec-event-loc-place,\n.mec-wrap .mec-event-grid-classic .mec-time-details {\n    color: #fff;\n}\n<\/pre><\/div>","protected":false},"excerpt":{"rendered":"
In this article, we will learn how to improve MEC Accessibility. According to W3C, When websites and web tools are properly designed and coded, people with disabilities can use them. However, many sites and tools are currently developed with accessibility barriers that make them difficult or impossible for some people to use. Making the web […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","template":"","knowledgebase_cat":[49],"class_list":["post-6076","knowledgebase","type-knowledgebase","status-publish","hentry","knowledgebase_cat-knowledge-other"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/webnus.net\/dox\/modern-events-calendar\/wp-json\/wp\/v2\/knowledgebase\/6076","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webnus.net\/dox\/modern-events-calendar\/wp-json\/wp\/v2\/knowledgebase"}],"about":[{"href":"https:\/\/webnus.net\/dox\/modern-events-calendar\/wp-json\/wp\/v2\/types\/knowledgebase"}],"author":[{"embeddable":true,"href":"https:\/\/webnus.net\/dox\/modern-events-calendar\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/webnus.net\/dox\/modern-events-calendar\/wp-json\/wp\/v2\/comments?post=6076"}],"version-history":[{"count":5,"href":"https:\/\/webnus.net\/dox\/modern-events-calendar\/wp-json\/wp\/v2\/knowledgebase\/6076\/revisions"}],"predecessor-version":[{"id":11382,"href":"https:\/\/webnus.net\/dox\/modern-events-calendar\/wp-json\/wp\/v2\/knowledgebase\/6076\/revisions\/11382"}],"wp:attachment":[{"href":"https:\/\/webnus.net\/dox\/modern-events-calendar\/wp-json\/wp\/v2\/media?parent=6076"}],"wp:term":[{"taxonomy":"knowledgebase_cat","embeddable":true,"href":"https:\/\/webnus.net\/dox\/modern-events-calendar\/wp-json\/wp\/v2\/knowledgebase_cat?post=6076"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}