Chris Ashton

dai11y 08/09/2021

Your daily frequent11y newsletter, brought to you by @ChrisBAshton:

HTMHell Issue #12 – crossed out content

  • The good person behind HTMHell describes the two ways to represent crossed out text in HTML: <del></del>, and <s></s>. They clarify in the article that “crossed out” has semantic meaning that doesn’t necessarily have to manifest itself as crossed out text.
  • The <s> element should be used for highlighting contents that are no longer accurate or relevant. Think “Original price: £10, Special offer: £8″.
  • The <del> element should be used for highlighting a removal from the document, to retain an edit history. Example:
    • The man's name was <del datetime="2021-09-03T17:42:36">Mrak</del> <ins datetime="2021-09-03T17:42:40">Mark</ins>.
  • Different screen readers announce the deletions/insertions in different ways. The article goes into some detail around how to use CSS pseudo elements to add your own textual prefixes/suffixes.

Did you know that you can subscribe to dai11y, week11y, fortnight11y or month11y updates! Every newsletter gets the same content; it is your choice to have short, regular emails or longer, less frequent ones. Curated with ♥ by developer @ChrisBAshton.