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.

Grundlagen der Webprogrammierung: Meine erste Website

Schriftgestaltung

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Schriftgröße und Schriftschnitt sind zusätzliche Gestaltungsmöglichkeiten, wie dieses Video anschaulich präsentiert.
05:14

Transkript

Nachdem ich jetzt hier meine richtigen Schriftarten gefunden habe, kann ich mich noch etwas genauer um die Schriftgröße beziehungsweise teilweise den Schriftschnitt kümmern. Was mir vorschwebt, ist, dass zum Beispiel diese "h1" sehr sehr viel größer werden muss, was dann auch zum Beispiel hier gilt, oder auch bei den Gedanken. Das heißt, diese großen Überschriften sollten auch wirklich noch an Bedeutung gewinnen? Dann ist die Frage, ob nicht auch mein Zitat etwas größer werden sollte. Womit ich aber auf jeden Fall anfangen werde, ist die Schriftgröße hier heroben bei mir in meiner Navigation. Gesagt, getan. Ich wechsle hier in meine "main.css" und habe hier Navigation beziehungsweise das "a"-Element meiner Navigation und das ist auch der Ort, wo ich mich jetzt um die Schriftgröße kümmern kann. Und dazu sage ich, ich möchte die "font-size" anpassen. Und ich denke, wenn ich sie mit "1.2em" angebe, das mal speichere und mir dann die Seite neu laden lasse, habe ich damit eine ganz nette Größe für meine Navigation gefunden. Das, was mich jetzt noch stört, ist, dass ich so wenig Raum habe für meine Schrift, aber auch das ist nicht wirklich das Problem. Das heißt, ich werde hier heroben in der Navigation noch ein Padding hinzufügen. Das heißt, ich gehe einfach nur und sage, "padding", und oben und unten, glaube ich, bin ich wahrscheinlich sogar mit 0,2em schon auf der richtigen Seite. Den zweiten Wert setze ich auf null, das heißt, links und rechts brauche ich kein Padding. Und wenn ich das jetzt mir neu ausgeben lasse, bringt mir das genau den gewünschten Effekt. Meine Buchstaben haben gefühlt etwas mehr Raum und habe jetzt eine gut lesbare, sehr schön prominente Navigation, die immer schön fix am Ort bleibt, auch wenn ich mit meiner Seite weiter scrolle. Gut, als Nächstes möchte ich mich um diese "h1" kümmern. Ich habe hier heroben schon insgesamt für alle Überschriften den Schrifttyp angegeben. Wenn ich jetzt speziell für meine "h1" noch etwas haben möchte, dann kann ich sie extra ansprechen. Und auch hier geht es mir vor allem um die "font-size", die prinzipiell bei der "h1" ja schon mit etwas größer vorgegeben ist, ich möchte aber tatsächlich, dass Sie 2em groß wird. Ich speichere und lasse mir die Seite neu ausgeben. Okay, 2em bringt noch nicht wirklich was, vielleicht mit 2,5em, ja, das gefällt mir jetzt besser. Das sieht gut aus, damit hat es die nötige Bedeutung. Ja, das werden wir so lassen. Und dann ist noch zu überlegen, was wir mit dem Zitat machen. Wahrscheinlich hat sich das Zitat auch noch eine kleine Verbesserung verdient. Im Moment haben wir ja für das Zitat selbst noch überhaupt keine Einstellungen getroffen und können deswegen direkt auf das Element "blockquote" sozusagen zugreifen. Das heißt, ich sage hier, "blockquote", und mein "blockquote" soll von der "font-size" her, wenn die Überschrift 2,5em ist, dann sollte vielleicht "blockquote" "1.3em" groß sein. und möchte aber, dass das "font-style: italic" sein soll. das ist dieses leicht schräg gestellte, wie es im Moment nur hier herunten bei dem Autor sehen. Ich speichere, lade meine Seite neu. Ja, und habe jetzt ein Zitat, das größer geschrieben ist und noch deutlicher als Zitat erkennbar ist, weil es eben leicht kursiv geschrieben wurde. Soviel jetzt zu den einzelnen Textgestaltungsmöglichkeiten. Ihren Ideen sind dabei keine Grenzen gesetzt. Sie sollten nur darauf achten, dass auf der einen Seite nicht zu viele unterschiedliche Schriftarten verwenden und dann auch nicht zu sehr sich in Details verlieren, was einzelne Schriftausprägungen anbelangt, aber sonst haben Sie alle Möglichkeiten, dass Sie auch mit Hilfe der Schrift Ihrer Webseite einen durchaus persönlicheren Touch noch geben können.

Grundlagen der Webprogrammierung: Meine erste Website

Gestalten Sie in wenigen Stunden Ihre erste Website und lassen Sie sich dabei von der Idee über die Auswahl der Werkzeuge bis zur Veröffentlichung Ihrer Web-Präsenz begleiten.

2 Std. 53 min (29 Videos)
Derzeit sind keine Feedbacks vorhanden...
 
Software:
Exklusiv für Abo-Kunden
Erscheinungsdatum:09.05.2017

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!