Vorlage für responsive HTML5-konforme Webseite mit CSS
woto
- css
- flexbox
- html
Liebe Community,
vor einigen Jahren habe ich die selfhtml-Seite intensiv genutzt um mir eine private Homepage zu basteln. Nach ein paar Experimenten mit cms wurde mir die Seite mittlerweile von Schadsoftware zerstört. Ich arbeite nicht regelmäßig mit html, css, php, js, habe aber prinzipiell ein Grundverständnis für diese Sprachen/Strukturen. Aber seit ich meine letzte Seite erstellt habe ist auch viel passiert, bspw. war es damals kein Thema, die Darstellung für Handys oder Tablets anzupassen.
Ich würde mir nun gerne schnell eine funktionsfähige Webseite erstellen, die ich dann so nach und nach anpassen und was die Neuerungen für mich betrifft (Flexbox, Responsivität, etc.) verstehen kann. Ich habe gesehen, dass es ein html5-Grundgerüst auf selfhtml.org gibt, gibt es auch ein Grundgerüst mit Flexbox und main.css-Datei, das ich erst einmal kopieren kann? Selbstverständlich würde ich alle Copyright-Vermerke dauerhaft belassen.
Viele Grüße Woto
Servus!
Ich würde mir nun gerne schnell eine funktionsfähige Webseite erstellen, die ich dann so nach und nach anpassen und was die Neuerungen für mich betrifft (Flexbox, Responsivität, etc.) verstehen kann. Ich habe gesehen, dass es ein html5-Grundgerüst auf selfhtml.org gibt, gibt es auch ein Grundgerüst mit Flexbox und main.css-Datei, das ich erst einmal kopieren kann?
Ja!
CSS/fertige_Layouts: viele Templates, die alle responsiv sind und flexbox oder grid verwenden.
CSS/Tutorials/Flexbox: Hier siehst du , wie man mit Flexbox eine responsive Seite im Mehrspaltenlayout erstellt.
Selbstverständlich würde ich alle Copyright-Vermerke dauerhaft belassen.
Brauchst Du nicht ist alles free und opensource:
Urheberrecht: Die Templates unterliegen abweichend von den Lizenzbedingungen ausdrücklich nicht der Lizenz CC-BY-SA 3.0 (de), sondern sie sind im Sinne der Lizenz CC0 1.0 (de) als public domain veröffentlicht. Sie dürfen diese Templates kopieren, verändern, veröffentlichen, sogar zu kommerziellen Zwecken, ohne um weitere Erlaubnis bitten zu müssen. SELFHTML verzichtet weltweit auf alle urheberrechtlichen und verwandten Schutzrechte, soweit dies gesetzlich möglich ist.
Herzliche Grüße
Matthias Scharwies
Hallo woto,
Ich habe gesehen, dass es ein html5-Grundgerüst auf selfhtml.org gibt, gibt es auch ein Grundgerüst mit Flexbox und main.css-Datei, das ich erst einmal kopieren kann? Selbstverständlich würde ich alle Copyright-Vermerke dauerhaft belassen.
https://wiki.selfhtml.org/wiki/CSS/fertige_Layouts/Design01
Bis demnächst
Matthias
Hallo Matthias, hallo Matthias,
vielen Dank für Euren schnellen Antworten, das sieht echt schon ziemlich gut aus... auf den ersten Blick gefällt mir das Design05 am besten, dass könnte aber auch daran liegen, dass ich auch eine SVG-Affinität habe 😉
Ich denke, dass ich schon aus pädagogischen Gründen einen Verweis auf selfhtml und den Template-Ersteller setzen werde, wie kommt es, dass die Vorlagen kommplett Public-Domain sind?
Was ist Grid?
Viele Grüße Woto
Servus!
auf den ersten Blick gefällt mir das Design05 am besten, dass könnte aber auch daran liegen, dass ich auch eine SVG-Affinität habe 😉
Da sind die Farben aus unserer Selfhtml-Farbpalette auch gut aufeinander abgestimmt.
Ich denke, dass ich schon aus pädagogischen Gründen einen Verweis auf selfhtml und den Template-Ersteller setzen werde,
Vielen Dank! Werbung können wir immer gebrauchen!
wie kommt es, dass die Vorlagen kommplett Public-Domain sind?
Eigentlich fehlt bei solchen Webseiten, genauer den Farbkombinationen, der HTML-Struktur, etc, die nötige Schöpfungshöhe. Außerdem soll es die Hürde senken, eine zeitgemäße responsive Struktur zu übernehmen.
Was ist Grid?
Was ganz geniales: Hier ist ein Kurs in 6 Kapiteln: Einstieg in Grid
Herzliche Grüße
Matthias Scharwies
hallo
Ich würde mir nun gerne schnell eine funktionsfähige Webseite erstellen, die ich dann so nach und nach anpassen und was die Neuerungen für mich betrifft (Flexbox, Responsivität, etc.) verstehen kann. Ich habe gesehen, dass es ein html5-Grundgerüst auf selfhtml.org gibt, gibt es auch ein Grundgerüst mit Flexbox und main.css-Datei, das ich erst einmal kopieren kann? Selbstverständlich würde ich alle Copyright-Vermerke dauerhaft belassen.
Ich habe 2 Themes geschrieben, die aber auf Javascript basieren (ergo keine Serverseitige Logik). Dieses Verfahren ist etwas umstritten (Navigation etc setzt JS voraus), ist aber für Leute gedacht, die einfache statische Seiten pflegen wollen und trotzdem ihre Seiten ganz schnell in ihr Angebot einbinden wollen.
Hallo beatovich,
ich werde glaube ich versuchen, ohne JS auszukommen!
Trotzdem vielen Dank und Grüße Woto
@@woto
gibt es auch ein Grundgerüst mit Flexbox und main.css-Datei, das ich erst einmal kopieren kann?
Hängt natürlich von Layout ab, aber oft ist CSS Grid das bessere Werkzeug zum Layouten als Flexbox. Und dazu auch noch das einfachere.
LLAP 🖖
Hallo Gunnar,
ich habe gerade mal aus Unwissenheit "Grid vs Flexbox" gegoogelt, ich denke, dass ich mich Deiner Einschätzung anschließen würde. Kannst Du mir spontan sagen, ob meine favorisierte Vorlage (Design05) eher eine Grid oder eine Flexbox-Vorlage ist?
VG Woto
@@woto
Kannst Du mir spontan sagen, ob meine favorisierte Vorlage (Design05) eher eine Grid oder eine Flexbox-Vorlage ist?
Wenn du mir spontan zeigen kannst, wo ich deine favorisierte Vorlage (Design05) finde …
LLAP 🖖
Hallo Gunnar,
Wenn du mir spontan zeigen kannst, wo ich deine favorisierte Vorlage (Design05) finde …
ich denke er redet von dieser:
https://wiki.selfhtml.org/wiki/CSS/fertige_Layouts/Design05
Bis bald!
Bernd
@@Barksalot
Sieht mir sehr nach Grid aus.
LLAP 🖖
Hallo Gunnar,
Sieht mir sehr nach Grid aus.
kann ich bestätigen:
https://src.selfhtml.org/designs/design05/css/style.css
Bis bald!
Bernd