Am 14. September 2017 haben wir eine überarbeitete Fassung unserer Datenschutzrichtlinie veröffentlicht. Wenn Sie video2brain.com weiterhin nutzen, erklären Sie sich mit diesem überarbeiteten Dokument einverstanden. Bitte lesen Sie es deshalb sorgfältig durch.

HTML und CSS für Designer

HTML-Elemente für Inhalte <section><article>

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Werden einzelne Artikel in einem Design umgesetzt, bietet HTML auch dafür eine entsprechende Struktur.

Transkript

Der "next step" ist nun, den Bereich der "Section" zu übernehmen. Ich schalte das mal ein und gehe hier mit "Command + 0" auf 100 Prozent, zoome ein bisschen hinein. Da haben wir genau das, was jetzt hier in dem roten Textrahmen steckt. Wenn man dem einen Namen geben könnte, der bekäme jetzt den Begriff "section". Auch den haben wir bereits in unserem HTML-Dokument eingebaut. Das befindet sich hier an dieser Stelle. Das bedeutet, wir müssen nun innerhalb der "section" diesen Inhalt übernehmen. Es gibt allerdings noch eine kleine Vorarbeit, und zwar, wie wir hier erkennen können, haben wir jeweils verschiedene Artikelbestandteile. Wir haben den Artikel "Zurück zu den Wurzeln", "Unendliche Küste" mit diesem Bild noch ein paar Aufzählungspunkte darunter und "Unendliche Vielfalt" ebenfalls nochmal mit einer Bildreihe. Das bedeutet, wir haben hier in diesem Dokument drei unterschiedliche Artikel: von hier bis da, von hier bis hier unten hin und von hier bis da. Diese Artikel, die gibt es auch in HTML, und zwar brauchen wir genauso viel, wie wir auch in dem InDesign-Dokument haben, also einfach "article". Das ist jetzt das Schöne an den Atom-Editor: Sie sehen, er rückt das alles wieder richtig ein, und das mache ich mir jetzt ein bisschen einfacher. Ich markiere mir die beiden Zeilen, "Command + C" oder "Steuerung + C", in die Zwischenablage und kopiere diese nun in das Dokument. Vielleicht fragen Sie sich, ob das relevant ist, wie viele Leerzeilen oder wie viele Absätze Sie eintragen. Ich kann Sie beruhigen, das hat überhaupt keine Bedeutung. Sie können so viele Leerzeilen, so viele Einrückungen vornehmen, wie Sie möchten. Im HTML-Dokument selbst wird man davon gar nichts mitbekommen. Theoretisch könnten Sie alles in eine einzige Zeile schreiben. Diese Einrückungen dienen lediglich dazu, dass es für uns besser lesbar bleibt. Und wenn man sich mal verschreibt, statt "article" in englischer Schreibweise "Artikel" schreibt, schon hat man den Fehler, und das HTML-Dokument wird nicht genau das machen, was es soll, wenn man Glück hat. Hat man Pech, zeigt der Browser das durchaus richtig an, und man merkt es gar nicht. Aber das ist auch nicht die Welt, entweder man sieht es oder man sieht es nicht direkt. Es gibt aber auch hinterher Prüfmechanismen, die Entwickler, bevor sie eine Seite veröffentlichen, durchlaufen lassen. Und damit hätten wir im Grunde die Artikelblöcke bereits in unser HTML-Dokument eingefügt und können damit beginnen, das Ganze nun inhaltlich zu übernehmen.

HTML und CSS für Designer

Steigen Sie als Designer ein in HTML und CSS. Sie gestalten ein responsives Reisemagazin und erleben dabei, dass der Workflow beim Gestalten nicht anders ist als gewohnt.

3 Std. 9 min (39 Videos)
Derzeit sind keine Feedbacks vorhanden...
 

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!