Here are some alternative ways to format <del> and <ins>, with explanations. I'd love to hear your own improvements. Solution so far.

The most straightforward solution is just using a space character between the elements:
Speling Spelling is hard.

However, this is not semantically correct, since the space inside is not part of the text.

You could insert a space character using CSS (del + ins:before {content: ' ';}):
Speling Spelling is hard.

Now the markup is semantically correct, but the content shown to the user is worse: Both display and semantics are wrong.

Inserting a margin between the elements should do the trick (del + ins {margin-left: 0.3em;}):
SpelingSpelling is hard.

This should be semantically correct, but the width of the space character can depend on the browser implementation and the font, so make sure you check the results.