CARINA RATH

Als erste Aufgabe im Kurs Produktion und Gestaltung interaktiver Medien sollten Änderungen am persönlichen Lernblog vorgenommen werden, die ich nun genauer beschreiben:

Das Menü auf der rechten Seite habe ich links positioniert. Dazu habe ich im Skin „Stylesheet“ das CSS geändert. Im #menu habe ich die Eigenschaft left auf 0 gesetzt und im #content left:230px; eingestellt. Anschließend musste auch die vertikale Linie des Menüs umpositionert werden, indem border-left einfach durch border-right ersetzt wurde. Auch die Textausrichtung text-align wurde von right auf left umgestellt. Das Suchfeld wurde diesbezüglich im Skin „Search“ im input-field margin-left verändert. Im Allgemeinen wurden diverse Ränder und Abstände mittels padding und maring optisch auf die neue Anordnung angepasst.

Als nächstes wurde eine Google Web Font eingebunden. Google stellt kostenlos die Verwendung freier Fonts zur Verfügung, die man ei der Gestaltung von Websites verwenden kann. Die Einbindung erfolgt in vier einfachen Schritten. Man wählt zu Beginn den Stil der ausgewählten Schriftart aus, dann ein Character Set, woraus anschließend ein Code mit den gewählten Einstellungen generiert wird. Diesen Code fügt man als erste Stelle in den Header der Mainpage ein. Letzendlich muss man noch die Font im CSS in der gewünschten Klasse angeben, wie in meinem Fall h1 { font-family: ‘Metrophobic’, Arial, serif; font-weight: 400; }

Um ein Mashup von meinem Lernblog zu machen habe ich schlussendlich noch ein Twitter Widget eingebaut. Auf www.twitter.com kann man eine öffentliche Timeline mit Tweets eines Twitter-Benutzers auf seine eigene Website veröffentlichen. Dazu kann man in einem Editor auf Twitter diverse Einstellungen für das Widget vornehmen, woraus ein Code zum Einbetten in den Blog generiert wird. In meinem Lernblog habe ich den Account @jkulinz gewählt, da es sich um einen universitären Lernblog handelt und die Tweets von @jkulinz die Leser möglicherweise interessieren könnte. Das Widget ermöglicht weiters direkt an @jkulinz zu twittern oder dem Account zu folgen. Da das Widget eine vorgegebene Breite hat, musste ich dann wieder die Breite des linken Menüs anpassen und demzufolge auch die Breite und Ausrichtung des Contents adaptieren.