diff -u b/core/themes/bartik/color/preview.html.twig b/core/themes/bartik/color/preview.html.twig
--- b/core/themes/bartik/color/preview.html.twig
+++ b/core/themes/bartik/color/preview.html.twig
@@ -2,8 +2,8 @@
 
   <div class="color-preview-header">
     <div class="color-preview-logo">
-      <img src="../../../core/themes/bartik/logo.svg" alt="{% trans %}Site Logo
-      {% endtrans %}"/>
+      {% set path_to_logo = '../../../core/themes/bartik/logo.svg' %}
+      <img src="{{ path_to_logo }}" alt="{{ 'Site Logo'|t }}"/>
     </div>
     <div class="color-preview-site-name">Bartik</div>
     <div class="color-preview-main-menu">
@@ -33,14 +33,14 @@
       <div class="color-preview-node">
         <div class="preview-content">
           <p>
-            {% trans %} This is a block of example content. This content is here to
-            demonstrate what actual content would look like in the color scheme you
-            configure.<a href="#">This is an example link</a>, to demonstrate how
-            background colors you configure may affect the readability of links.
-            Another sentence to demonstrate what actual content would look like in
-            the color scheme you configure.<a href="#">This is another example
-             link.</a>This is the end of this block of example content.
-            {% endtrans %}
+            {% trans %}This is a block of example content. This content
+            is here to demonstrate what actual content would look like in the
+            color scheme you configure.<a href="#">This is an example link</a>,
+            to demonstrate how background colors you configure may affect the
+            readability of links. Another sentence to demonstrate what actual
+            content would look like in the color scheme you configure.
+            <a href="#">This is another example link.</a>This is the
+            end of this block of example content.{% endtrans %}
           </p>
         </div>
       </div>