Thursday, October 20, 2005

Pausen Specials

GMail
Welche Vorteile eine GMail Adresse haben kann, könnt Ihr nunmehr mit Euren eigenen GMail Accounts testen.

BlogMania
Daß man Blogs nicht nur als private Spielerei, sondern auch als einfaches Redaktionssystem für Kunden einsetzen kann, haben wir in unserem BlogMania Special gelernt.

Picasa & Hello
Wie man Bilder effizient managed und mit Hilfe von Picasa bzw. Hello versendet oder in einen Blog stellt, was Inhalt dieses Pausen Specials.
More/Weiterlesen...

Das Programm - Adobe Photoshop CS2

Nach dem Kennenlernen verschiedener Werkzeuge haben wir uns gleich auf unsere DigiPicts gestürzt. Wie man ein einfaches 3D-Objekt produziert, haben wir am Beispiel eines FotoWürfels ausprobiert. Das war doch gar nicht so schwierig, oder?



Danach mußte die vielstrapazierte "Photoshop-Ente" herhalten, sich mit verschiedenen Werkzeugen & Funktionen malträtieren zu lassen. Hoffentlich stolpert niemand von PeTA oder Greenpeace über unsere Übungsseiten >;o))
Zu diesem Zweck haben wir die Enten im Maskierungsmodus und/oder mit Hilfe des "Zauberstabs" (Farbauswahl) freigestellt. Die unterschiedlichen Farben wurden mit farbigen Overlays und der Anwendung von Ebenenfüllungen erzielt.

Gleichzeitig habt Ihr gelernt, wie man Muster erzeugt und anwendet, Pinselspitzen importiert und Ebenen dupliziert und versetzt (Gras unter der Entenfamilie). Den Himmel haben wir mit =>Filter =>Rendering-Filter =>Wolken erzeugt und zu guter Letzt haben wir mit dem Werzeug "Eigene Formen" die Sonne aus einem Stern geformt und mit einer Kombination aus Ebeneneffekten zum Strahlen gebracht...

Die vielfältigen Photoshop Werkzeuge haben wir anhand von verschiedenen Layout-Ideen eingesetzt. Sinn der Übung war dabei nicht etwa eine konzeptionelle Umsetzung, sondern einfach ein "graphisches Brainstorming", wie unterschiedlich Designs ausfallen können, selbst wenn man die gleichen Basiselemente verwendet.

Wir haben dabei bewußt auf die Überlegung verzichtet, wie man ein solches Layout technisch umsetzen würde, dafür aber viele Aspekte guten Designs besprochen, wie z.B. den Einsatz von Schriften, die Raumberechnung für Navigationselemente u.v.m.


Wie man durch Einsatz von Hintergründen, künstlerischen Pinselspitzen und sorgfältig gewählten typographischen Elementen eine völlig andere Stimmung erzeugen kann, zeigt unser drittes Layout.
More/Weiterlesen...

Das Programm - Konzeption & Präsentation

haben wir ebenso wie Web Usability quer durch die bisherigen Module behandelt. Nachlesen könnt Ihr verschiedene Inhalte im Bereich wwwissen auf netz.werk.stadt, darunter 99.gebote - erfolgreich produzieren im web.
More/Weiterlesen...

Wednesday, October 19, 2005

Das Programm - HTML & CSS

Begonnen hat alles mit drei knochenharten Tagen an "Fingerübungen" in HTML+CSS. Um Euch mit den verschiedenen "Tags" vertraut zu machen, haben wir eine einfache Testseite in Tabellenlayout erstellt.

Solche Kinkerlitzchen haben wir aber ganz schnell hinter uns gelassen und gleich ein farbenprächtiges Miniweb in Angriff genommen. Dabei habt Ihr gelernt, wie man CSS einsetzt, um schlanke, saubere HTML Seiten zu produzieren.
More/Weiterlesen...

Die TeilnehmerInnen

Plaziere Deinen Cursor über einem Bild, um die Vornamen der TeilnehmerInnen anzuzeigen. Womit erreichen wir das? Bingo!
Mit dem <alt>-Parameter im <img>-Tag.
Dieser Parameter ist im übrigen gleich dreifach nützlich:

  • Usability (Benutzerfreundlichkeit)
    Der alt-Text kann die Orientierung verbessern, indem ich entsprechende Hinweise/Erklärungen bereitstelle.

  • Accessibility (Barrierefreie Zugänglichkeit)
    UserInnen, die Bilder nicht sehen wollen oder können, erhalten eine Text-Alternative (daher der Name) bzw. spezielle Audio-Systeme für Menschen mit Sehbehinderungen lesen den alt-Text vor.

  • Search Engine Optimization
    Suchmaschinen halten Ausschau nach Suchbegriffen in alt-Texten und finden diese ganz besonders lecker.

Beispiel:
<img src="http://www.xy.com/images/bild.jpg" alt="Das ist ein tolles Bild" />

walter susanne mirza

veronika jochen nikolina

karin damir ines

More/Weiterlesen...