Damit lässt sich jedes Wort im Titel anders formatieren oder via CSS positionieren. Dasselbe würde natürlich auch mit der Seitenbeschreibung funktionieren, get_bloginfo('description');

Ergebnis

[...]<span class="titlepart titlepart-eine">Eine </span><span class="titlepart titlepart-wordpress">WordPress </span><span class="titlepart titlepart-testumgebung">Testumgebung</span>[...]

<?php
    $title = preg_replace_callback( '/(.)([^\s]*\s?)/', function($match) {
        $part = '<span class="titlepart titlepart-'.sanitize_key($match[0]).'">'.esc_html($match[0]).'</span>';
        return $part;
    }, get_bloginfo('name')
);
?>
<?php if ( is_front_page() ) : ?>
        <h1 class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php echo wp_kses($title, ['span' => ['class' =>[]]]); ?></a></h1>
    <?php else : ?>
        <p class="site-title"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php echo wp_kses($title, ['span' => ['class' =>[]]]); ?></a></p>
    <?php endif; ?>

Mit wp_kses($title, ['span' => ['class' =>[]]]) wird die Anwendung erlaubter Tags auf span mit CSS-Klasse(n) beschränkt. Diese Sicherheitsmaßnahme schützt den Output vor Code Injections.