diff --git a/public/index.html b/public/index.html
index a9d4c0c0320add0f1105018f1ae50f6f843e36cd..422a85e5359b71f1fb53e2276c423c8a797e9044 100644
--- a/public/index.html
+++ b/public/index.html
@@ -95,6 +95,7 @@
                 
                 <!-- BITTE QUELLCODE UND BILDER JEWEILS IN EINEM EIGENEN PROJEKTORDNER ABLEGEN -->
                 <img class="thumbimg" src="beispielprojekt/imgs/thumbnails/hft_beispielbild.jpg" alt="">
+                <!-- Beschreibungstext bitte möglichst kurz halten, bspw. 100 Zeichen -->
                 <div class="card-body">
                   <p class="card-text">Beschreibungstext hier einfügen...</p>                
                 </div>
@@ -129,6 +130,7 @@
                 <!-- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: Thumbnail"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> -->
                 <!-- BITTE QUELLCODE UND BILDER JEWEILS IN EINEM EIGENEN PROJEKTORDNER ABLEGEN -->
                 <img class="thumbimg" src="beispielprojekt/imgs/thumbnails/hft_beispielbild.jpg" alt="">
+                <!-- Beschreibungstext bitte möglichst kurz halten, bspw. 100 Zeichen -->
                 <div class="card-body">
                   <p class="card-text">Beschreibungstext hier einfügen...</p>                
                 </div>
@@ -160,6 +162,7 @@
                 <!-- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: Thumbnail"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> -->
                 <!-- BITTE QUELLCODE UND BILDER JEWEILS IN EINEM EIGENEN PROJEKTORDNER ABLEGEN -->
                 <img class="thumbimg" src="beispielprojekt/imgs/thumbnails/hft_beispielbild.jpg" alt="">
+                <!-- Beschreibungstext bitte möglichst kurz halten, bspw. 100 Zeichen -->
                 <div class="card-body">
                   <p class="card-text">Beschreibungstext hier einfügen...</p>                
                 </div>
@@ -196,6 +199,7 @@
                 <!-- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: Thumbnail"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> -->
                 <!-- BITTE QUELLCODE UND BILDER JEWEILS IN EINEM EIGENEN PROJEKTORDNER ABLEGEN -->
                 <img class="thumbimg" src="beispielprojekt/imgs/thumbnails/hft_beispielbild.jpg" alt="">
+                <!-- Beschreibungstext bitte möglichst kurz halten, bspw. 100 Zeichen -->
                 <div class="card-body">
                   <p class="card-text">Beschreibungstext hier einfügen...</p>                
                 </div>
@@ -227,6 +231,7 @@
                 <!-- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: Thumbnail"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> -->
                 <!-- BITTE QUELLCODE UND BILDER JEWEILS IN EINEM EIGENEN PROJEKTORDNER ABLEGEN -->
                 <img class="thumbimg" src="beispielprojekt/imgs/thumbnails/hft_beispielbild.jpg" alt="">
+                <!-- Beschreibungstext bitte möglichst kurz halten, bspw. 100 Zeichen -->
                 <div class="card-body">
                   <p class="card-text">Beschreibungstext hier einfügen...</p>                
                 </div>
@@ -258,6 +263,7 @@
                 <!-- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: Thumbnail"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> -->
                 <!-- BITTE QUELLCODE UND BILDER JEWEILS IN EINEM EIGENEN PROJEKTORDNER ABLEGEN -->
                 <img class="thumbimg" src="beispielprojekt/imgs/thumbnails/hft_beispielbild.jpg" alt="">
+                <!-- Beschreibungstext bitte möglichst kurz halten, bspw. 100 Zeichen -->
                 <div class="card-body">
                   <p class="card-text">Beschreibungstext hier einfügen...</p>                
                 </div>
@@ -293,6 +299,7 @@
                 <!-- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: Thumbnail"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> -->
                 <!-- BITTE QUELLCODE UND BILDER JEWEILS IN EINEM EIGENEN PROJEKTORDNER ABLEGEN -->
                 <img class="thumbimg" src="beispielprojekt/imgs/thumbnails/hft_beispielbild.jpg" alt="">
+                <!-- Beschreibungstext bitte möglichst kurz halten, bspw. 100 Zeichen -->
                 <div class="card-body">
                   <p class="card-text">Beschreibungstext hier einfügen...</p>                
                 </div>
@@ -324,6 +331,7 @@
                 <!-- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: Thumbnail"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> -->
                 <!-- BITTE QUELLCODE UND BILDER JEWEILS IN EINEM EIGENEN PROJEKTORDNER ABLEGEN -->
                 <img class="thumbimg" src="beispielprojekt/imgs/thumbnails/hft_beispielbild.jpg" alt="">
+                <!-- Beschreibungstext bitte möglichst kurz halten, bspw. 100 Zeichen -->
                 <div class="card-body">
                   <p class="card-text">Beschreibungstext hier einfügen...</p>                
                 </div>
@@ -355,6 +363,7 @@
                 <!-- <svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid slice" focusable="false" role="img" aria-label="Placeholder: Thumbnail"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"/><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> -->
                 <!-- BITTE QUELLCODE UND BILDER JEWEILS IN EINEM EIGENEN PROJEKTORDNER ABLEGEN -->
                 <img class="thumbimg" src="beispielprojekt/imgs/thumbnails/hft_beispielbild.jpg" alt="">
+                <!-- Beschreibungstext bitte möglichst kurz halten, bspw. 100 Zeichen -->
                 <div class="card-body">
                   <p class="card-text">Beschreibungstext hier einfügen...</p>                
                 </div>