index.htm für die SR-Slideshow                       Download ZIP-Archiv

Beispiel für die Startseite
 

Die Bilder werden zur  Vorbereitung am besten in einem eigenen Ordner zusammengestellt. Dann verwendet man das MS Slideshow Powertoy zur Erzeugung der benötigten Arrays.

Einstellungen: Keep current picture size, Resize Box nicht angehakt lassen, Advanced und Fullscreen selektieren.

 

Aus dem erzeugten \images Unterordner alle *.gif löschen

und den Ordner in das Verzeichnis ziehen, in dem index.htm liegt.

Mit einem Texteditor die erzeugte Datei  viewer.htm im \html Unterverzeichnis der MS Slideshow öffnen.

Daraus die folgenden Zeilen kopieren

var vImage = new Array(...
var cxImage = new Array(...
var cyImage = new Array(...
var vThumb = new Array(...
 

Diese Zeilen in das Template sr-slideshow.htm im Unterverzeichnis \html einfügen an Stelle der Beispiel-Bilder. Dann noch den <title>SR-Slideshow Example</title>
entsprechend anpassen.

Die Bildtexte, die auch HTML Tags enthalten können, werden im Feld vText definiert,  und sollten maximal zweizeilig sein zB:

var vText = new Array(
"Bild 1",
"Bild 2",
"Bild 3 <i>im Hochformat</i>",
"Bild 4",
"Bild 5<br>Ende der Slideshow")
 

Die anderen Dateien der MS Slideshow werden nicht mehr gebraucht.

Fertig.


5 Fotos von R. Sedlaczek (auf 1280x960 skaliert und/oder ausgeschnitten);
0 Panoramen, erzeugt mit autostitch;
 
Tipp Die Bildübergänge wirken am besten, wenn alle Bilder gleich groß sind. Kleinere Bilder bzw. solche im Hochformat sollten daher mit entsprechenden schwarzen Rändern auf die gleiche Größe gebracht werden.  Dies geht einfach mit dem freien Bildprogramm IrfanView
Tipp Die Vorbereitung  der Fotos (Skalierung, Umbenennen zur Gewährleistung der richtigen Reihenfolge im MS SlideShow Powertoy)  erfolgt sinnvollerweise auch mit Irfanview. Dieses Programm hat gegenüber anderen den Vorteil, dass es das Originaldatum der Bilder unverändert lassen kann und auch die Exif-Informationen nicht zerstört.
Tipp Die Fotos sollten sinnvolle Namen haben und die laufende Nummer mit "-" oder "_" angehängt oder vorangestellt sein, damit Bilder-Suchmaschinen leichter etwas damit anfangen können.

Fullscreen Slideshow

Slideshow (skalierbar)

Slideshow-Bedienung

Hier vielleicht ein Panorama...

13.08.2007 Weitere Slideshows

 

Aufbereitung der Slideshow für Bilder-Suchmaschinen (abgestimmt auf Google Bildersuche):

 

Bilder und Texte in Script-Teilen einer Webseite werden normalerweise nicht indiziert. Mit folgender Vorgangsweise lässt sich das umgehen:

Man verwendet dafür den  <NOSCRIPT> Bereich in der Datei sr-slideshow.htm, der von den Suchmaschinen gelesen, aber von Browsern mit aktiviertem Javascript ignoriert wird:
 

<NOSCRIPT>
<h1>Titel, der bei der Google Bildersuche für die nachstehenden Bilder aufscheint</h1>
<p>If you see this section, your browser has Javascript disabled<br>
This slideshow requires Javascript</p>
All slideshow images and texts following

<P>Bild 1<BR>
<img src="../images/1 Canyon.jpg" ALT="Bild 1"></P>
...

</NOSCRIPT>

 

Die SR-Slideshow enthält eine Funktion, die Bilder und Texte im HTML-Format auszugeben, um diese in den <NOSCRIPT> Bereich einfügen zu können. Mit der Tastenkombination w h wird der HTML-Code unten im Browserfenster ausgegeben. Diesen Textblock kopiert man dann mit einem Text-Editor in die Datei sr-slideshow.htm anstelle der Beispielbilder- und Texte am Ende der Datei.

Die Google Bildersuche verwendet auch den letzten Header-Tag vor einer Sequenz von Bildern, weswegen ein sinnvoller Kurztitel vor zusammengehörigen Bildern empfehlenswert ist.