Bildbearbeitung
Eine Homepage lebt nicht nur vom Text, sondern auch von Bildern und Fotos.
Digitale Kameras speichern die gemachten Fotos meist mit Großbuchstaben ab. Damit es bei der Bereitstellung von Bildern auf Servern und der Darstellung in den unterschiedlichen Browsern nicht zu Problemen kommt, sollten Sie einige (manche mögen das für antiquiert halten) Regeln beachten:
Alle Buchstaben werden klein geschrieben, auch und gerade die der Extensions.
Es werden kurze Dateinamen verwendet (und bitte keine "Romane").
Wenn es viele Dateien mit gleichem Namen sind, benennen Sie diese entweder um, oder kopieren sie zusammengehörende in einen eigenen Ordner.
Image Map 2
Ich hätte gerne eine Deutschlandkarte, auf der man mit der Maus über einzelne Bereich fährt und dann dort bestimmte Informationen angezeigt bekommt; z.B.: Wie das Bundesland heißt.
Noch einen Schritt weiter: Mit einem Klick auf sein Bundesland wird man sofort auf die dazugehörige Seite geleitet.
Das realisiert man mit dem Freeware-Programm Programm Fast Image Map 2 (aktuelle Version: 2.2.1 [funktioniert auch noch unter Windows 11]).
Vorgehensweise beim Programm Fast Image Map 2.
| Vorgehensweise | |
|---|---|
| 1) | Datei → Neu; neues Fenster öffnet sich. |
| 2) | Name der Image-Map eingeben. |
| 3) | Bilddatei für die Image Map aussuchen. |
| 4) | Beschreibungstext eingeben. |
| 5) | OK anklicken. |
| 6) | Auf die entsprechende Verweisfläche klicken: Kreis, Rechteck, Polygon (vieleckig). |
| 7) | Bei polygoner Verweisfläche mit vielen Klicks diese 1x umrunden. Es reicht ein Klick an der Stelle, an der die Richtung sich ändern soll. |
| 8) | Beschreibungstext in das Fenster unten links in die Zeile "alt, title" eingeben. |
| 9) | Reiter Image Map "in neue HTML-Datei einfügen" auswählen und dann im neuen Fenster zuerst "Speichern unter ..." auswählen und entsprechenden Namen vergeben. |
| 10) | Fenster schließen (sonst geht es nicht weiter). |
| 11) | Bei (6) geht es weiter bis zu (8). |
| 12) | Statt (9) nun nur noch "Speichern" drücken und das Fenster schließen. Nun passiert etwas Interessantes: alle bisherigen Koordinaten sind weiterhin vorhanden, solange die Image-Bearbeitung nicht unterbrochen (d.h. das Programm nicht beendet wird). So geht es weiter, bis alle Verweisflächen aufgenommen wurden. |
| 13) | Die blauen Daten (im Fenster) bitte markieren und kopieren. |
| 14) | Die Seite in CMSimple_XH aufrufen und dort im Editormodus das HTML-Fenster öffnen. |
| 15) | Mit <Strg> + <V> diese Daten an der Stelle einfügen, an der das Bild hin soll. |
| 16) | Nun muss zuerst gespeichert werden. Anschließend bekommen Sie eine Fehlermeldung, dass das Bild nicht vorhanden sei. Das ist richtig. Rufen Sie nochmals den HTML-Modus auf und suchen Sie "scr". Ändern Sie nun den richtigen Pfad zum Bild ( CMSimple_XH = ./images/dateiname.jpg ). Nach dem Speichern wird nun auch das Bild korrekt angezeigt. |
| 17) | Loggen Sie sich nun aus, damit die Contentdatei gespeichert und auch ein BAK-Up angelegt wird. |
im Juli 2013 für die Anfrage von roze aus dem CMSimple_XH Forum.
Als Kopiervorlage freigegeben: © 2013, Michael Zajusch
Free Imagemapper V2.0
Ich hätte gerne eine Deutschlandkarte, auf der man mit der Maus über einzelne Bereich fährt und dann dort bestimmte Informationen angezeigt bekommt; z.B.: Wie das Bundesland heißt.
Noch einen Schritt weiter: Mit einem Klick auf sein Bundesland wird man sofort auf die dazugehörige Seite geleitet.
Das realisiert man mit dem Freeware-Programm Programm Free ImageMapper 2 (aktuelle Version: 2.0 [funktioniert auch unter Windows 11 und liegt sowohl für 32- als auch 64-bit vor]).
Vorgehensweise beim Programm Free ImageMapper 2.
| Vorgehensweise | |||
|---|---|---|---|
| 1) | File→ Create new Map; neues Fenster öffnet sich. ![]() |
||
| 2) | Name der Image-Map eingeben. ![]() |
||
| 3) | Bilddatei für die Image Map aussuchen. ![]() |
||
| 4) | OK anklicken. | ||
| 5) |
|
||
| 6) |
|
||
| 7) | Bei polygoner Verweisfläche diese mit vielen Klicks diese 1x umrunden. Es reicht ein Klick an der Stelle, an der die Richtung sich ändern soll. | ||
| 8) | Beschreibungstext in das Fenster unten links in die Zeile "alt, title" eingeben. | ||
| 9) | Reiter Image Map "in neue HTML-Datei einfügen" auswählen und dann im neuen Fenster zuerst "Speichern unter ..." auswählen und entsprechenden Namen vergeben. |
||
| 10) | Fenster schließen (sonst geht es nicht weiter). | ||
| 11) | Bei (6) geht es weiter bis zu (8). | ||
| 12) |
vorhanden, solange die Image-Bearbeitung nicht unterbrochen (d.h. das Programm nicht beendet wird). So geht es weiter, |
||
| 13) | Die Daten (im unteren Fenster) markieren und kopieren. | ||
| 14) | Die Seite in CMSimple_XH aufrufen und dort im Quellcode-Modus das HTML-Fenster öffnen. | ||
| 15) | Mit <Strg> + <V> diese Daten an der Stelle einfügen, an der das Bild hin soll. | ||
| 16) | Nun muss zuerst gespeichert werden. Anschließend bekommen Sie eine Fehlermeldung, dass das Bild nicht vorhanden sei. Das ist richtig. Rufen Sie nochmals den HTML-Modus auf und suchen Sie "scr". Ändern Sie nun den richtigen Pfad zum Bild ( CMSimple_XH = ./images/dateiname.jpg ). Nach dem Speichern wird nun auch das Bild korrekt angezeigt. |
||
| 17) | Loggen Sie sich nun aus, damit die Contentdatei gespeichert und auch ein Bak-Up angelegt wird. |
Als Kopiervorlage freigegeben: © 2025, Michael Zajusch
Als Kopiervorlage freigegeben: © 2013, Michael Zajusch





