Untersuchen und Neumischen Ihrer ersten Webseite

Vergewissern Sie sich, dass die Röntgenbrille (X-Ray-Goggles) installiert ist

Jedes Mal, wenn Sie eine Webseite sehen, die Sie untersuchen möchten, können Sie nach einem Klick auf die Röntgenbrille (X-Ray Goggles) in der Lesezeichen-Symbolleiste mit den einzelnen Elementen dieser Webseite beliebig spielen.

Untersuchen Sie die Elemente

Wenn die Röntgenbrille aktiviert ist, werden beim Überfahren mit der Maus verschiedene Teile der Webseite durch leuchtende Farbflächen hervorgehoben.

Diese Flächen stellen die einzelnen Elemente der Webseite dar. Mit einem Klick auf eine dieser Flächen gelangen Sie zum Code-Editor und können dort das Element nach Ihrer eigenen Vorstellung bearbeiten und verändern.

Beginnen Sie mit dem Neumischen

Abhängig von der Art des gewählten Elements haben Sie nun verschiedene Gestaltungsmöglichkeiten:

Text umbauen

Wählen Sie einen Textblock aus und ändern Sie dessen Textinhalt im Code-Editor. Eine Vorschau Ihrer Änderungen sehen Sie dann oben im Hauptabschnitt.

Grafik neu gestalten

Alle Grafiken verwenden in HTML den Verweis <img>. Sie sehen, dass jeder <img>-Verweis zu einer URL-Adresse führt, die dem Verweis den tatsächlichen Standort der Grafik zeigt.

Sie können die Originalgrafik nach Belieben verändern und umgestalten. Dazu öffnen Sie einen neuen Reiter, suchen die gewünschte Grafik, machen einen Rechtsklick darauf und wählen Grafikadresse kopieren.

Fügen Sie nun die URL der zuvor kopierten Grafik in den Code-Editor ein und Sie können die Änderung in der Vorschau sehen.

Sie können einen Hyperlink auf jedes gewünschte Ziel festlegen.

Alle Hyperlinks beginnen mit dem Verweis <a href=" und enthalten dann die URL, auf welche der Hyperlink gerichtet ist. Wenn die URL zwischen den beiden Anführungszeichen geändert wird, ändert sich zugleich auch das Ziel des Links.

Vielleicht möchten Sie auch den „Ankertext” ändern. Das ist ein besonders gekennzeichneter Text, der dem Besucher einen Hinweis auf die Zielseite gibt. Dieser Text wird häufig in blauer Schrift und unterstrichen dargestellt.

Fertigstellen und Veröffentlichen

Sollten Sie einen Fehler gemacht haben, klicken Sie einfach im Code-Editor auf die Schaltfläche Cancel und verwerfen damit Ihre Änderung.

Wenn Sie mit Ihren Änderungen zufrieden sind, klicken Sie auf die grüne Schaltfläche Update, danach können Sie sofort Ihre fertige, neu gemischte Seite bewundern.

Um die Seite zu veröffentlichen, drücken Sie die Taste P auf Ihrer Tastatur oder auf die Schaltfläche Publish (=Veröffentlichen) in der rechten Seitenleiste.

Wenn Sie bei teach.mozilla.org registriert sind, wird Ihre Röntgenbrillen-Bearbeitung zur „Your Projects”-Seite hinzugefügt und erhält eine eigene URL, um sie mit Ihren Freunden teilen zu können.

War der Artikel hilfreich?

Bitte warten…

Diese netten Menschen haben geholfen, diesen Artikel zu schreiben:

Illustration of hands

Mitmachen

Vergrößern und teilen Sie Ihr Fachwissen mit anderen. Beantworten Sie Fragen und verbessern Sie unsere Wissensdatenbank.

Weitere Informationen