@@Carmen > ich möchte gerne so ein Design für meine Webseite haben: [http://murren.ru/templates/bobby/bobby-demo/index.html](http://murren.ru/templates/bobby/bobby-demo/index.html) Ist _parallax scrolling_{: lang="en"} nicht schon seit ein paar Jahren _out_{: lang="en"}? > allerdings ist dieses mit Bootstrap umgesetzt und ich habe mir sagen lassen, dass Bootstrap für ein „richtiges“ Design nicht geeignet ist, maximal für einen Prototype. Wenn ein Framework _genau_ das bietet, was du wünschst, dann scheint es geeignet zu sein. Nur sieht man es einer Seite dann oft an, dass sie mit diesem Framework umgesetzt wurde, weil sie eben so aussieht wie tausende anderer Seiten, die mit diesem Framework umgesetzt wurden. Willst du Individuelles, musst du Anpassungen vornehmen. Da bist du schnell an dem Punkt, wo du nicht _mit_, sondern _gegen_ das Framework arbeiten musst. Das ist der Punkt, wo man das Framework gar nicht erst einsetzen sollte. _Gegen_ ein Framework zu arbeiten ist die Hölle. (Egal, ob CSS-Framework oder JavaScript-Framework. Ich hab hier bewusst von „Framework“ gesprochen, nicht speziell von Bootcrap.) Wenn man mit einem CSS-Framework arbeitet, heißt das in der Regel, das Markup mit _präsentationsbezogenen_ Klassen vollzumüllen. Also die Darstellung im HTML anzugeben. Nichts mit _spearation of concerns_{: lang="en"}. Deshalb halte ich von CSS-Frameworks: Abstand. > **Meine zweite Frage:** > Ein Bild welches über die volle Breite gehen soll, wie groß sollte dieses sein? Ich möchte alle Bildschirme abdecken? Ich dachte so um die 3000px Breite? Scheint mir zu groß. Allerdings: bei [_retina-revolution_{: lang="en"}](https://www.netvlies.nl/tips-updates/design-interactie/retina-revolution){: hreflang="en"} … Bei der Übertragung kommt es nicht auf die Pixelgröße, sondern auf die Dateigröße an. Ein Bild sollte nicht größer sein als nötig. Das heißt: für verschiedene Viewportgrößen verschiedene Bilder (Bilddateien) ausliefern. Bei Hintergrundbildern per _media queries_ `min-width`/`max-width` und `min-resolution`/`max-resolution`{: lang="en"}. Bei Vordergrundbildern dienen die Attribute `srcset` und `sizes` und das `picture`-Element dazu, _[responsive](https://forum.selfhtml.org/self/2016/feb/17/responsive-bilder/1661157#m1661157)  [images](https://forum.selfhtml.org/self/2015/oct/15/unterschiedliches-bild-auf-mobiler-und-desktop-version/1652302#m1652302)_{: lang="en"} umzusetzen. Dabei kann der Bildinhalt bei verschiedenen Größen durchaus unterschiedlich sein: die kleine Variante bspw. nicht eine Verkleinerung der großen, sondern ein Bildausschnitt – [_„art direction“_{: lang="en"}](http://maddesigns.de/responsive-images/#17). LLAP 🖖 -- _“You might believe there are benefits for the developer, but first of all, you should put those behind the interest of the user.”_{: lang="en"} —Stefan Tilkov _[Selfcode](http://community.de.selfhtml.org/fanprojekte/selfcode.htm): `sh:) fo:} ch:? rl:) br:> n4:& va:| de:> zu:} fl:{ ss:| ls:# js:|`_{: style="display: block; font-size: 0.875em; font-style: inherit; margin-top:1.5em"}