LU00.A01 - Assessment: Blog für einen Kunden erstellen [BZZ

Diese Seite ist nicht editierbar. Sie können den Quelltext sehen, jedoch nicht verändern. Kontaktieren Sie den Administrator, wenn Sie glauben, dass hier ein Fehler vorliegt.
====== LU00.A01 - Assessment: Blog für einen Kunden erstellen ======

===== Voraussetzungen =====

Laden Sie {{ :modul:m287:learningunits:lu00:aufgaben:vorlagen.zip | hier}} die Vorlage für die Aufgabe herunter.


===== Ausgangslage =====

Ein Kunde gibt Ihnen einen statischen, webbasierten Auftritt in Auftrag. Mit dem neuen Webauftritt möchte er Artikel/Tipps zur Kleintierhaltung über dem Internet-Kanal veröffentlichen. Sie schlagen dem Kunden die bewährte Verzeichnisstruktur-01 (zur Zeit nur mit drei Themen-Gruppen) aus Ihrem Lehrbetrieb vor. Der reine Inhalt zu den Artikeln liefert Ihnen der Kunden. Diese Inhalte müssen ein wenig gestyled werden. Die Details dazu folgen in der Aufgabenstellung.

<code>
/
index.html
themen/
    gesundheit/
        article_01.html
        article_02.html
    nahrung/
    kaefige/
bilder/
    logo.jpg
    tierarzt.jpg
    impfung.jpg
basis/
    sitemap.html
</code>

===== Aufgaben =====

  - Erstellen Sie die Verzeichnisstruktur-01. Kopieren Sie die vorgegebenen Dateien (Bilder, HTML-Dateien) in die entsprechenden Verzeichnisse gemäss der Verzeichnisstruktur-01.  (5 Punkte)
  - Ersetzen Sie im index.html überall ?? mit den entsprechenden HTML-Elementen. (5 Punkte)
  - Ersetzen Sie im sitemap.html überall ?? mit den entsprechenden HTML-Elementen. (5 Punkte)
  - Ersetzen Sie überall ?? mit den entsprechenden HTML-Elementen im article_01.html ein. (5 Punkte)
  - Ersetzen Sie überall ?? mit den entsprechenden HTML-Elementen im article_02.html ein. (5 Punkte)
  - Passen Sie in allen Webseiten die Links (Verweise) und die Pfade zu den Bildern an, wo ein ?? als Platzhalter steht. Die Grundlage für die korrekten Verzeichnisse ist Verzeichnisstruktur-01. Verwenden Sie ausschliesslich relative Verweise! (8 Punkte)
  - Sämtliche Bilder weisen einen alternativen, sinnvollen Text. In der Wahl sind Sie frei. (2 Punkte)
  - Auf allen Seiten müssen die Umlaute korrekt angezeigt werden. Fügen Sie das fehlende HTML-Elementen ein. (2 Punkte)
  - Stylen Sie so getreu wie in den abgebildeten Vorgaben. Für alle Seite gelten die nachfolgenden Angaben (10 Punkte)
      * Schrift-Familie Arial im <body>
      * Hintergrund-Farbe LightGrey für <nav> und <footer>
      * Farbe red für Links ausserhalb des Webauftritts
      * die kleine Fontgrösse ist 10px. Teilweise sind Texte in Fett- und Kursiv-Schrift gesetzt.
      * Links im Umbau (Seitemap) erhalten die Hintergrund-Farbe yellow
      * Farben green resp. blue für <h3>-Elemente in den Artikeln.

===== Vorgaben HTML-Elemente =====

Alle Texte sind mit HTML-Element umschlossen. Der HTML-Code muss valid sein. Für den Webauftritt zur ersetzende HTML-Elemente:
<color #7092be>aside, nav, article, header, footer, ul, li, ol, strong, meta, i, figure, figcaption</color> inklusive den entsprechenden Attributen des jeweiligen HTML-Elements.

===== Vorgaben Styling =====

{{:modul:m287:learningunits:lu00:aufgaben:a1_01.png?600|}}

----

{{:modul:m287:learningunits:lu00:aufgaben:a1_02.png?600|}}

----

{{:modul:m287:learningunits:lu00:aufgaben:a1_03.png?600|}}

----

{{:modul:m287:learningunits:lu00:aufgaben:a1_04.png?600|}}

----
[[https://creativecommons.org/licenses/by-nc-sa/4.0/|{{https://i.creativecommons.org/l/by-nc-sa/4.0/88x31.png}}]] Daniel Garavaldi