Tipps und Tricks

Illustrator

Imagemap erstellen

(dl) In Illustrator kann man ganz einfach Imagemaps erstellen. Man muss lediglich den verschiedenen Objekten in der Attribute-Palette eine URL zuweisen («http://» nicht vergessen) und dann für Web speichern. Nun speichert man zuerst das GIF oder JPEG ab und wiederholt das Speichern, gibt aber beim zweiten Mal die Ausgabeeinstellung nur HTML an. Dies erzeugt eine HTML-Datei mit Referenz auf die vorher gespeicherte Grafikdatei. Versuchen Sie nicht, eine Imagemap über den gewöhnlichen Exportieren-Befehl zu machen. Sonst sind in der HTML-Datei zumindest in Version 10 immer nur Rechtecke definiert, auch wenn man Polygone angibt. Ausserdem umgibt die Imagemap ein blauer hässlicher Rand. Indem die Links den Objekten zugewiesen sind, können diese beliebig verändert werden, der Export ordnet die Koordinaten immer richtig zu.

GoLive

Gross-/Kleinschreibung bei Links

(dl) Anwender früherer Versionen als GoLive 6 haben ein Problem: Wenn sie bei einer Linkadresse im Inspektor die Gross/Kleinschreibung nicht beachtet haben, so kann dies auch im Nachhinein nicht mehr korrigiert werden. GoLive betrachtet es nicht als Änderung, ein a durch ein A zu ersetzen und aktualisiert gar nichts. Abhilfe: die Gross/Kleinschreibung ändern, einen zusätzlichen Buchstaben tippen und Enter drücken. Jetzt begreift das Programm, dass etwas geändert worden ist. Nun den zusätzlichen Buchstaben wieder löschen.

CSS

Tabellenzellen mit Rollbalken

(dl) Innerhalb der Zelle, also des <td>-Tags, wird ein <div>-Tag angelegt mit folgenden CSS-Attributen:

<div style=“width: 100%; height: 100%; overflow : auto;“>
beliebig langer Text
</div>

Wird nun der Text länger als es der Platz in der Zelle erlaubt, werden automatisch Rollbalken hinzugefügt. Natürlich nur auf neueren Browsern.

CSS

Tabellen mit punktierten Rahmen

(dl) Das sieht gut aus und ist einfach zu machen. Dieser Code erzeugt einen gepunkteten Rahmen, Farbe schwarz und Punktgrösse 2 Pixel.

<table style="border : dotted 2px black;" width="200" border="0">
<tr><td>Inhalt</td></tr>
</table>

Tipps von www.hilfdirselbst.ch

GoLive

Mouseover-Effekte für Textlinks

(Dirk Levy) Der Mouseover-Effekt für Textlinks ist daran zu erkennen, dass der Text die Farbe oder den Hintergrund bei Berührung mit der Maus wechselt.

Er wird mit CSS erzeugt und funktioniert mit dem Internet Explorer ab Version 4 und Netscape ab Version 6.

1. Den Style Sheet Editor für die Seite öffnen (oben rechts das treppenartige Symbol). Natürlich kann man auch ein externes Style Sheet anlegen, aber in diesem Beispiel wird das interne Style Sheet benutzt.
2. Den Button Element hinzufügen in der Toolbar anklicken.
3. Das neue Element anwählen und als Namen a:hover in das Namensfeld des CSS-Inspektors schreiben.
4. Die Textfarbe auf dem Farb-Pop-Up-Menü im Schrift-Tab des CSS-Inspektors öffnen. Dies wird die Farbe beim Zustand mouseover (hover = mouseover) sein.
5. Die Hintergrundfarbe aus dem Farb-Pop-Up-Menü im Hintergrund-Tab des CSS-Inspektors anwählen
6. Zuletzt noch den Link anlegen.
7. Die Seite sichern und dann im Internet Explorer angucken.
Angenommen, man möchte verschiedene «MouseOvers» haben, zum Beispiel so:

a:link { color:#0000ff; text-decoration:underline; }

			a:visited { color:#228B22; text-decoration:underline; }

			a:hover { color:#00ff00; text-decoration:underline; }

			a:active { color:#0000ff; font-weight:bold; text-decoration:none; }

			a:focus { color:#0000ff; font-weight:bold; text-decoration:none; }

			a.an { text-decoration:none; }

Dann spielt die Reihenfolge der Definitionen eine Rolle. «Wer zuletzt kommt, mahlt zuerst» – soll heissen, es gilt die Angabe, die am nächsten an dem zu formatierenden Element steht.

Ein Link kann zunächst die natürlichen Zustände «besucht» (visited) oder «nicht besucht» haben. Hover muss zwangsläufig danach stehen, damit diese Formatierung über den Normalzustand «gelegt» werden kann.
Der nächste logische Zustand ist active. Diese Formatierung wird wieder über hover gelegt.
Einzig über die Positionierung von focus am Ende könnte man streiten.

Webdesign

Tabellenhintergrund in Netscape 4.7

(Urs Gamper) Problem: die Tabelle wurde mit einem Hintergrundbild versehen und nun wiederholt sich das Bild in Netscape 4.7 in jeder Zelle aufs Neue.
Verhindert werden kann dies, indem in der ersten Tabelle eine zweite angelegt wird. Dieser weist man ein transparentes Bild als Hintergrund zu. Somit kachelt sich das transparente Bild, welches aber logischerweise unsichtbar ist.

GoLive

Falsche Linkwarnungen entfernen

(Helge Maus) Es ist möglich, dass es innerhalb von Sites Referenzierungen gibt, die in GoLive als Linkwarnung angezeigt werden, welche aber absolut korrekt sind.

Um diese Linkwarnungen zu deaktivieren gibt es folgende Möglichkeit:
1. Voreinstellungen Adobe GoLive
2. Rubrik Allgemein \> URL-Verwaltung: Hier kann die URL hineingeschrieben und in die Liste der URL-Filter aufgenommen werden.

GoLive

Arbeitsbereich anpassen

(Urs Gamper) Mit den vielen Paletten von GoLive kommt man schnell einmal zu Platzproblemen in der Bildschirmansicht. GoLive bietet da eine interessante Möglichkeit, die Bildschirmansicht be­­-nutzerdefiniert anzupassen:
Je nach Arbeit sind ja unterschiedliche Paletten zur Ansicht erforderlich. Sie können nun die aktuelle Größe und Position von Paletten auf dem Bildschirm als benutzerdefinierte Arbeitsbereiche speichern. Die Namen der Arbeitsbereiche werden im Untermenü «Arbeitsbereich» des Menüs «Fenster» angezeigt. Die Liste der Namen bearbeiten Sie, indem Sie einen Arbeitsbereich hinzufügen, umbenennen oder löschen.

GoLive

Noframe-Bereich für Suchmaschinen beschriften

(Urs Gamper) Früher hat man im \-Bereich eines Framesets jeweils lediglich die Mitteilung in der Art von: «Sorry – Ihr Browser unterstützt keine Frames» hinterlegt. Damit die Suchsysteme aber möglichst alle Seiten eines Webs finden, ist es sehr wichtig, dass im \-Bereich auf die referenzierenden Dateien verwiesen wird.
Dies geschieht in GoLive folgendermassen: Man öffnet das Frameset in der Layout-Ansicht. Dort schreibt man, wie bei einer normalen Seite, die darauf basierenden Seiten hinein und verlinkt sie.