Gliederung

  1. Einleitung, Übersicht über das Spiel
    • PvP, Player vs. Player Endgame
      • Schlachtfelder
      • Arenen
    • PvE, Player vs. Environment
      • Dungeon
      • Schlachtzüge
    • User-Interface
    • Beschreibung des Websitekonzeptes

Zuerst habe ich die Navigationsleiste erstellt. Dabei habe ich ein Bild eingefügt und darunter die entsprechenden Links. Danach wurde die Navigationsleiste mit CSS Formatiert.

Im Anschluss habe ich die index.html erstellt. Das Bild wurde eingefügt und der Text links daneben mit einem float platziert. Die Links zu den unterseiten wurden unter dem Bild platziert. Dabei war das Problem, dass die Links zu beginn nicht mit dem hover effekt funktioniert haben. Das wurde jedoch gelöst, indem ich den css befehl a:hover{..} unter alle anderen Befehle geschoben habe.

Danach habe ich die PvP.html seite erstellt. Da habe ich das Bild mit einem float links von dem Text platziert und die Links außerdem rechts vom Bild unter dem Text.

Im Anschluss kam die Schlachtfelder.html Seite. Bei dieser Seite habe ich einen Text neben einem Infotext platziert und in dem Text noch ein Bild. Bei der Seite war das problem, dass ich bei kleineren Bildschirmen nicht mehr scrollen konnte und somit der Text abgeschnitten wurde. Das wurde behoben, indem ich einen Effekt „height: 100%“ bei html und body entfernt habe.

Als nächstes habe ich die arenen.htrml seite gemacht. Bei der Seite habe ich ein Bild eingefügt, dass vom Text umflossen wird.

Dann kam die PvE.html seite. Da habe ich einen Text erstellt und darunter zwei Bilder nebeneinander, welche als Links dienen. Das Problem war hierbei, die Beiden Bilder so groß zu skalieren, dass beide nebeneinander passen.

Dann die Dungeon.html seite. Hier habe ich ein Bild, dass rechts vom Text ist und darunter eine Bildunterschrift. Das Problem war, dass die unterschrift nicht genau unter dem Bild blieb.

Die nächste Seite war die Schlachtzüge.html. Da habe ich einen Infotext neben dem eigentlichen Text. In dem Text war ein Bild, dass vom Text umflossen wird. Unterhalb dem ganzen ist eine Tabelle mit 3 Spalten.

Als nächstes kam die UI.html seite, welche aus einem Bild besteht. Daneben ist ein Text. Unter dem Bild ist eine Bildunterschrift. Und unter dem ganzen ist ein weiterer Text.

Als letztes kam noch die Konzept.html seite, welche aus der Gliederung und dem Erfahrungsberichtes besteht.

Es gab Probleme, dass der Hintergrund von den Seiten nicht bis zum Unteren rand mit Transparenz war. Das wurde behoben, indem ich bei allen Seiten ein div um den ganzen Body bereich gemacht habe und das mit „background-color: hsla(0,0%,80%,0.57);“.

Ein weiteres Problem war, dass ich eine Seite nicht anklicken konnte, da der div bereich des Menüs über die komplette Seite ging und nicht nur über den Menübereich.