Slight changes in Getting Started section

- Mention the importance of using script-tags and no
  other DOM elements as container for templates
- Recommendation to precompile template (rather than
  just saying "you could")

see handlebars-lang/handlebars.js#604

src/pages/index.haml

@@ -45,7 +45,10 @@
           </div>
         </div>
       </script>
-
+    .notes.warning
+      It is important that you put the template inside a <code>&lt;script&gt;</code>-tag. Do
+      not put it into the HTML directly or the HTML-parser might modify it (for example, if
+      it <a href="https://html.spec.whatwg.org/multipage/parsing.html#unexpected-markup-in-tables">contains a table</a>)
   .bullet
     .description
       Compile a template in JavaScript by using
@@ -54,11 +57,10 @@
       var source   = $("#entry-template").html();
       var template = Handlebars.compile(source);
     .notes
-      It is also possible to precompile your templates. This will
-      result in a smaller required runtime library and significant
-      savings from not having to compile the template in the
-      browser. This can be especially important when working with
-      mobile devices.
+      Please note that this approach is not recommended for production applications.
+      A better way is to precompile your templates. This will result in a smaller required
+      runtime library and significant savings from not having to compile the template in the
+      browser. This can be especially important when working with mobile devices.
     = link("Learn More: Precompilation", "precompilation.html", :class => "more-info")
 
   .bullet

src/stylesheets/application.sass

@@ -269,6 +269,12 @@ ul.bullet
       margin-top: 10px
     &+ .description
       margin-top: 20px
+    &.warning
+      padding-left: 40px
+      background-image: url('../images/warning.svg')
+      background-repeat: no-repeat
+      background-position: left center
+      background-size: 30px 30px
 
   pre
     +liquid