{"id":6440,"date":"2025-12-11T11:27:55","date_gmt":"2025-12-11T09:27:55","guid":{"rendered":"https:\/\/webs.uab.cat\/webedit\/?page_id=6440"},"modified":"2025-12-11T11:31:20","modified_gmt":"2025-12-11T09:31:20","slug":"accessibilitat-amb-ckeditor","status":"publish","type":"page","link":"https:\/\/webs.uab.cat\/webedit\/accessibilitat-amb-ckeditor\/","title":{"rendered":"Accessibilitat amb CKeditor"},"content":{"rendered":"\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:25%\">\n<div class=\"wp-block-group has-gris-pubilla-background-color has-background is-vertical is-layout-flex wp-container-core-group-is-layout-8cf370e7 wp-block-group-is-layout-flex\">\n<p><a href=\"https:\/\/webs.uab.cat\/webedit\/accessibilitat-amb-ckeditor\/\" data-type=\"page\" data-id=\"6440\">Accessibilitat amb CKeditor<\/a><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Disseny<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/disseny\/\" data-type=\"page\" data-id=\"6457\">Identitat UAB<\/a><\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Sem\u00e0ntica<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/titol-de-la-pagina\/\" data-type=\"page\" data-id=\"5636\">T\u00edtol de la p\u00e0gina<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/text-alternatiu\/\" data-type=\"page\" data-id=\"5699\">Text alternatiu<\/a>\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/imatges-decoratives\/\" data-type=\"page\" data-id=\"5885\">Imatges decoratives<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/imatges-funcionals\/\" data-type=\"page\" data-id=\"5893\">Imatges funcionals<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/imatges-de-text\/\" data-type=\"page\" data-id=\"5902\">Imatges de text<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/imatges-informatives\/\" data-type=\"page\" data-id=\"5911\">Imatges informatives<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/imatges-complexes\/\" data-type=\"page\" data-id=\"5920\">Imatges complexes<\/a><\/li>\n<\/ul>\n<\/li>\n\n\n\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/estructura-de-la-pagina\/\" data-type=\"page\" data-id=\"5938\">Estructura de la p\u00e0gina<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/taules\/\" data-type=\"page\" data-id=\"5952\">Taules<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/llistes-2\/\" data-type=\"page\" data-id=\"6123\">Llistes<\/a><\/li>\n\n\n\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/enllacos-2\/\" data-type=\"page\" data-id=\"6120\">Enlla\u00e7os<\/a><\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Contingut<\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><a href=\"https:\/\/webs.uab.cat\/webedit\/transcripcio-subtitulacio-i-audiodescripcio\/\" data-type=\"page\" data-id=\"6473\">Subtitulaci\u00f3<\/a><\/li>\n\n\n\n<li>Llenguatge clar<\/li>\n<\/ul>\n<\/div>\n\n\n\n<p><\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:75%\">\n<p class=\"wp-block-uab-entradeta entradeta\">Les tecnologies d&#8217;assist\u00e8ncia als usuaris amb dificultats visuals llegeixen les p\u00e0gines web a partir del codi font, de l&#8217;HTML. Un codi que no estigui ben estructurat i dotat de la sem\u00e0ntica adequada pot fer que el contingut de la p\u00e0gina sigui incomprensible per a aquests usuaris.<\/p>\n\n\n\n<p>La sem\u00e0ntica fa refer\u00e8ncia al significat de cada element que conforma la p\u00e0gina web. <\/p>\n\n\n\n<p>Per exemple, en el cas de les llistes, als editors de text com Microsoft Word o Pages, en comen\u00e7ar un text amb un guionet, quan fem retorn, crea un llistat i la seg\u00fcent l\u00ednia ja cont\u00e9 un guionet al comen\u00e7ament. A la codificaci\u00f3 que hi ha darrera d&#8217;aquest text, s&#8217;ha creat un element llista: <strong>sem\u00e0nticament<\/strong>, aquell conjunt de l\u00ednies \u00e9s una llista.<\/p>\n\n\n\n<p>A l&#8217;editor de continguts web CKeditor, si no indiquem que estem creant una llista, a la codificaci\u00f3 HTML que hi ha darrera d&#8217;aquest text no es crea un element llista. El conjunt de l\u00ednies <strong>no \u00e9s sem\u00e0nticament una llista<\/strong>.  Aix\u00f2 perjudica als usuaris que utilitzen lectors de pantalla. Els usuaris que naveguen per una p\u00e0gina amb la vista, veuran els guionets, que ens indiquen que estem davant d&#8217;una llista, per\u00f2 els usuaris amb lector de pantalla, que interpreten el codi HTML darrera de la p\u00e0gina, no.<\/p>\n\n\n\n<p>Per tal que tothom pugui interpretar un llistat com a tal (o qualsevol altre element), cal utilitzar les opcions corresponents de l&#8217;editor CKeditor.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"198\" src=\"https:\/\/webs.uab.cat\/webedit\/wp-content\/uploads\/sites\/667\/2025\/12\/ckeditor-24-1024x198.png\" alt=\"\" class=\"wp-image-6441\" srcset=\"https:\/\/webs.uab.cat\/webedit\/wp-content\/uploads\/sites\/667\/2025\/12\/ckeditor-24-1024x198.png 1024w, https:\/\/webs.uab.cat\/webedit\/wp-content\/uploads\/sites\/667\/2025\/12\/ckeditor-24-300x58.png 300w, https:\/\/webs.uab.cat\/webedit\/wp-content\/uploads\/sites\/667\/2025\/12\/ckeditor-24-768x148.png 768w, https:\/\/webs.uab.cat\/webedit\/wp-content\/uploads\/sites\/667\/2025\/12\/ckeditor-24-1200x232.png 1200w, https:\/\/webs.uab.cat\/webedit\/wp-content\/uploads\/sites\/667\/2025\/12\/ckeditor-24.png 1361w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption class=\"wp-element-caption\">Opcions de marcatge sem\u00e0ntic de l&#8217;editor CKeditor al Portal Web de la UAB: negreta, it\u00e0lica, sub\u00edndex, super\u00edndex, llista ordenada, llista sense ordre, cita, imatge, taula i s\u00edmbol.<\/figcaption><\/figure>\n<\/div>\n<\/div>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>La sem\u00e0ntica fa refer\u00e8ncia al significat de cada element que conforma la p\u00e0gina web. Per exemple, en el cas de les llistes, als editors de text com Microsoft Word o Pages, en comen\u00e7ar un text amb un guionet, quan fem retorn, crea un llistat i la seg\u00fcent l\u00ednia ja cont\u00e9 un guionet al comen\u00e7ament. A [&hellip;]<\/p>\n","protected":false},"author":20,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-6440","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/pages\/6440","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/users\/20"}],"replies":[{"embeddable":true,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/comments?post=6440"}],"version-history":[{"count":4,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/pages\/6440\/revisions"}],"predecessor-version":[{"id":6447,"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/pages\/6440\/revisions\/6447"}],"wp:attachment":[{"href":"https:\/\/webs.uab.cat\/webedit\/wp-json\/wp\/v2\/media?parent=6440"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}