<section>
<h1>事業内容 <span>- Services -</span></h1>
<p>いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。</p>
</section>

冒頭でよく使われると言っておりますが、どのような場面で使うのでしょうか。
質問一覧にもあるように、上記のように書いてしまえば早いですし楽な気がします。

HTMLをシンプルにするためと言うことでも、結局以下のように打ち込んでおります。

<section>
<h1 data-subtitle="- Services -">事業内容</h1>
<p>いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。いろいろです。</p>
</section>

擬似要素を使用するメリットがいまいちわかりません。教えてください。