️ Added blank alt attributes to images when no alt text is provided

no issue

- screen readers often resort to reading out the filename when alt text is not provided which is not useful. By adding `alt=""` (or just `alt`) to `<img>` elements the image is skipped by screen readers providing a smoother experience
- updated `@tryghost/kg-default-cards` which contains above change for `image` and `gallery` cards
This commit is contained in:
Kevin Ansfield 2020-06-15 09:24:08 +01:00
parent 84d0a46c6e
commit 937df2c7ec
4 changed files with 7 additions and 7 deletions

View File

@ -48,7 +48,7 @@
"@tryghost/image-transform": "0.2.4", "@tryghost/image-transform": "0.2.4",
"@tryghost/kg-card-factory": "2.1.1", "@tryghost/kg-card-factory": "2.1.1",
"@tryghost/kg-default-atoms": "2.0.1", "@tryghost/kg-default-atoms": "2.0.1",
"@tryghost/kg-default-cards": "2.1.0", "@tryghost/kg-default-cards": "2.2.0",
"@tryghost/kg-markdown-html-renderer": "2.0.1", "@tryghost/kg-markdown-html-renderer": "2.0.1",
"@tryghost/kg-mobiledoc-html-renderer": "3.0.1", "@tryghost/kg-mobiledoc-html-renderer": "3.0.1",
"@tryghost/magic-link": "^0.4.8", "@tryghost/magic-link": "^0.4.8",

View File

@ -1135,7 +1135,7 @@ describe('Post Model', function () {
models.Post.add(post, context).then((createdPost) => { models.Post.add(post, context).then((createdPost) => {
createdPost.get('mobiledoc').should.equal('{"version":"0.3.1","atoms":[],"cards":[["image",{"src":"/content/images/card.jpg"}]],"markups":[["a",["href","/test"]]],"sections":[[1,"p",[[0,[0],1,"Testing"]]],[10,0]]}'); createdPost.get('mobiledoc').should.equal('{"version":"0.3.1","atoms":[],"cards":[["image",{"src":"/content/images/card.jpg"}]],"markups":[["a",["href","/test"]]],"sections":[[1,"p",[[0,[0],1,"Testing"]]],[10,0]]}');
createdPost.get('html').should.equal('<p><a href="/test">Testing</a></p><figure class="kg-card kg-image-card"><img src="/content/images/card.jpg" class="kg-image" srcset="/content/images/size/w600/card.jpg 600w, /content/images/size/w1000/card.jpg 1000w, /content/images/size/w1600/card.jpg 1600w, /content/images/size/w2400/card.jpg 2400w"></figure>'); createdPost.get('html').should.equal('<p><a href="/test">Testing</a></p><figure class="kg-card kg-image-card"><img src="/content/images/card.jpg" class="kg-image" alt srcset="/content/images/size/w600/card.jpg 600w, /content/images/size/w1000/card.jpg 1000w, /content/images/size/w1600/card.jpg 1600w, /content/images/size/w2400/card.jpg 2400w"></figure>');
createdPost.get('custom_excerpt').should.equal('Testing <a href="/internal">links</a> in custom excerpts'); createdPost.get('custom_excerpt').should.equal('Testing <a href="/internal">links</a> in custom excerpts');
createdPost.get('codeinjection_head').should.equal('<script src="/assets/head.js"></script>'); createdPost.get('codeinjection_head').should.equal('<script src="/assets/head.js"></script>');
createdPost.get('codeinjection_foot').should.equal('<script src="/assets/foot.js"></script>'); createdPost.get('codeinjection_foot').should.equal('<script src="/assets/foot.js"></script>');

View File

@ -68,7 +68,7 @@ describe('lib/mobiledoc', function () {
}; };
mobiledocLib.mobiledocHtmlRenderer.render(mobiledoc) mobiledocLib.mobiledocHtmlRenderer.render(mobiledoc)
.should.eql('<p>One<br>Two</p><!--kg-card-begin: markdown--><h1 id="markdowncard">Markdown card</h1>\n<p>Some markdown</p>\n<!--kg-card-end: markdown--><p>Three</p><hr><figure class="kg-card kg-image-card kg-width-wide kg-card-hascaption"><img src="/content/images/2018/04/NatGeo06.jpg" class="kg-image" srcset="/content/images/size/w600/2018/04/NatGeo06.jpg 600w, /content/images/size/w1000/2018/04/NatGeo06.jpg 1000w, /content/images/size/w1600/2018/04/NatGeo06.jpg 1600w, /content/images/size/w2400/2018/04/NatGeo06.jpg 2400w"><figcaption>Birdies</figcaption></figure><p>Four</p><!--kg-card-begin: html--><h2>HTML card</h2>\n<div><p>Some HTML</p></div><!--kg-card-end: html--><figure class="kg-card kg-embed-card"><h2>Embed card</h2></figure><figure class="kg-card kg-gallery-card kg-width-wide"><div class="kg-gallery-container"><div class="kg-gallery-row"><div class="kg-gallery-image"><img src="/content/images/test.png" width="1000" height="500" srcset="/content/images/size/w600/test.png 600w, /content/images/size/w1000/test.png 1000w, /content/images/size/w1600/test.png 1600w, /content/images/size/w2400/test.png 2400w"></div></div></div></figure>'); .should.eql('<p>One<br>Two</p><!--kg-card-begin: markdown--><h1 id="markdowncard">Markdown card</h1>\n<p>Some markdown</p>\n<!--kg-card-end: markdown--><p>Three</p><hr><figure class="kg-card kg-image-card kg-width-wide kg-card-hascaption"><img src="/content/images/2018/04/NatGeo06.jpg" class="kg-image" alt srcset="/content/images/size/w600/2018/04/NatGeo06.jpg 600w, /content/images/size/w1000/2018/04/NatGeo06.jpg 1000w, /content/images/size/w1600/2018/04/NatGeo06.jpg 1600w, /content/images/size/w2400/2018/04/NatGeo06.jpg 2400w"><figcaption>Birdies</figcaption></figure><p>Four</p><!--kg-card-begin: html--><h2>HTML card</h2>\n<div><p>Some HTML</p></div><!--kg-card-end: html--><figure class="kg-card kg-embed-card"><h2>Embed card</h2></figure><figure class="kg-card kg-gallery-card kg-width-wide"><div class="kg-gallery-container"><div class="kg-gallery-row"><div class="kg-gallery-image"><img src="/content/images/test.png" width="1000" height="500" alt srcset="/content/images/size/w600/test.png 600w, /content/images/size/w1000/test.png 1000w, /content/images/size/w1600/test.png 1600w, /content/images/size/w2400/test.png 2400w"></div></div></div></figure>');
}); });
}); });
}); });

View File

@ -443,10 +443,10 @@
resolved "https://registry.yarnpkg.com/@tryghost/kg-default-atoms/-/kg-default-atoms-2.0.1.tgz#3223ef5210d73af02c53795e5a5f1a9c5fc5bd92" resolved "https://registry.yarnpkg.com/@tryghost/kg-default-atoms/-/kg-default-atoms-2.0.1.tgz#3223ef5210d73af02c53795e5a5f1a9c5fc5bd92"
integrity sha512-0/Fx98ZIj/gyPglKg9HQP+cKPSBpbue1pnzh3E8hR4WXzqnSWMFA8VTUyMeI+8oNwxkxhZrWt5KifngHbBfw2A== integrity sha512-0/Fx98ZIj/gyPglKg9HQP+cKPSBpbue1pnzh3E8hR4WXzqnSWMFA8VTUyMeI+8oNwxkxhZrWt5KifngHbBfw2A==
"@tryghost/kg-default-cards@2.1.0": "@tryghost/kg-default-cards@2.2.0":
version "2.1.0" version "2.2.0"
resolved "https://registry.yarnpkg.com/@tryghost/kg-default-cards/-/kg-default-cards-2.1.0.tgz#a218079d2e6662fe5b0117740faecf94cde6fd35" resolved "https://registry.yarnpkg.com/@tryghost/kg-default-cards/-/kg-default-cards-2.2.0.tgz#d85dd5b826af3148ec893ff943933ac5315653ee"
integrity sha512-8OKPFm210ACzjojmQLPCcRVNattc66Ub+Re5QsG6x09q7+xNV4IiTRt7L+pU4UizmHQ7y6jOFTWXH35az0O1Qw== integrity sha512-ENxrtyS959HV1gbX2eMVGgXhjmpbdvYkbNK/ohME74lIL1czCVpZBaziG2g2Lileknh6NbCxU0VDSQs2zZrtBg==
dependencies: dependencies:
"@tryghost/kg-markdown-html-renderer" "^2.0.1" "@tryghost/kg-markdown-html-renderer" "^2.0.1"
"@tryghost/url-utils" "^0.6.14" "@tryghost/url-utils" "^0.6.14"