Publishers of technology books, eBooks, and videos for creative people

Home > Articles > Web Design & Development > HTML/XHTML

  • Print
  • + Share This
  • 💬 Discuss
This chapter is from the book

Noting Edits and Inaccurate Text

Sometimes you may want to indicate content edits that have occurred since the previous version of your page. There are two elements for noting edits: the ins element represents content that has been added, and the del element marks content that has been removed (red-a.jpg through red-d.jpg). You may use them together or individually.

red-a.jpg One item (the bicycle) has been added to this gift list since it was previously published, and purchased items have been removed, as noted by the del elements. You are not required to use del each time you use ins, or vice versa. Browsers differentiate the contents of each element visually by default gray-b.jpg.

108figb.jpg

Click to view larger image

red-b.jpg Browsers typically display a line through deleted text, and they typically underline inserted text. You can change these treatments with CSS.

red-c.jpg Both del and ins are rare in that they can surround both phrasing content (“inline” content, in pre-HTML5 parlance) and blocks of content like entire paragraphs or lists, as shown here.

109figd.jpg

Click to view larger image

red-d.jpg Just as before, browsers indicate which content has been deleted or inserted.

Meanwhile, the s element notes content that is no longer accurate or relevant (it’s not for edits) (red-e.jpg and red-f.jpg).

red-e.jpg This example shows an ordered list (the ol element) of show times. The time slots for which ticket availability is no longer relevant have been marked with the s element. You can use s around any phrases, not just around text within list items (li elements), but you cannot use it around a whole paragraph or other “block-level” element like you can with del and ins.

110figf.jpg

red-f.jpg The s element renders as a strikethrough by default in browsers.

To mark newly inserted text

  1. Type <ins>.
  2. Type the new content.
  3. Type </ins>.

To mark deleted text

  1. Place the cursor before the text or element you wish to mark as deleted.
  2. Type <del>.
  3. Place the cursor after the text or element you wish to mark as deleted.
  4. Type </del>.

To mark text that is no longer accurate or relevant

  1. Place the cursor before the text you wish to mark as no longer accurate or relevant.
  2. Type <s>.
  3. Place the cursor after the text you wish to mark.
  4. Type </s>.
  • + Share This
  • 🔖 Save To Your Account

Discussions

comments powered by Disqus