www.osbelder.de

unsere bilder im web

FUSION-5
os belder = rheinisch für "unsere Bilder"
Zur Stichwort-Suche
Erklaerungen zur Web-Site
Impressum

Zum Seitenanfang


Inhaltsverzeichnis
 

Aktuelles
Spezielles

 

Suche
Stichworte

 


Abkürzungen
 

Mit Klick auf die äußeren Spalten zurück zum Seitenanfang
 

Netobjects-Fusion (NOF)

Erfahrungen Seite 5

 

Zurück zur Übersichts-Seite

 

28

Bildschirmauflösung und Schriftgröße

Mir fiel eines Tages auf, dass durch das hoch- und runterzoomen ab FireFox 3.0 nicht alle Layout-Probleme gelöst werden können.

Ich fand eine Website, die offensichtlich in hoher Auflösung und zusätzlich kleiner Schrift erstellt wurde. Durch das Verkleinern der Web-Site brauchte ich in einer 1024-er Auflösung nicht mehr horizontal zu scrollen, aber die Schrift wurde fast unleserlich.

 

Das Problem verschärft sich noch weiter auf den heute oft genutzten kleinen, mobilen Bildschirmen. Deshalb habe ich probeweise im FireFox meine Seiten gezoomt.

Nach zwei Zoom-Vorgängen (hoch ebenso wie runter) waren die Seiten noch lesbar.

 

Orientierung:

Ich schreibe in der 10 pt Schriftgröße, annähernd identisch mit der 12 px-Größe, aber doch noch besser zu lesen, weil die Laufweite der 10pt Schrift größer ist.

 

Größen ab 10 px und kleiner sind nicht mehr zu lesen. Beispiel: Ich fand eine Website,....

29

Bilder oder Rahmen übereinander oder überlappend anordnen 

Ausnahmsweise keine eigene Erfahrung, sondern ein Tipp aus einem NOF-Forum, hier notiert, damit ich meine Aufzeichnungen nicht noch einmal suchen muss (Urheber nicht mehr bekannt).

 

HTML-Seiten lassen keine Überlappungen von Objekten zu, deshalb muss folgender Umweg gewählt werden:

Im großen Layoutbereich einen zweiten Layout-Rahmen aufziehen (siehe Button-Felder oben, rechts neben den roten Hotspots und im Klappmenü ganz unten). 

 

Der große Layoutbereich muss auf “Dynamisches Seitenlayout” stehen,
der kleine Layout-Rahmen wird auf “Festes Seitenlayout” eingestellt.

Nur so können Bilder, Rahmen und Texte, innerhalb des zusätzlichen Layoutfeldes, übereinander angeordnet werden. (siehe Kopfbereich von osbelder.de)

 

Beispiel, auf der Seite “Home”, rechts oben, der Erinnerungs-Text für den hiesigen
Foto-Stammtisch. Ziel: Haupt- und Neben-Information sollten, obtisch getrennt, im gleichen Rahmen stehen.

30

Extrem große Fotos im Web präsentieren (Einzelbilder und Panoramen),

einschließlich Grundmaße und Arbeitsablaufs

 

Ohne HTML-Kenntnisse ist es, meines Wissens, in FUSION nicht möglich, Fotos, z.B. Panoramen, in einer starken Vergrößerung einzustellen.

 

Außerdem habe ich im Web bisher nur Beispiele gefunden, die größere Panoramen innerhalb von kleinen Fenstern (IFrames) anzeigten. Diese nutzen nicht die gesamte Bildschirmfläche und konnten, in den gefundenen Beispielen, auch nicht durch die neuen Zoomfunktionen der Browser vergrößert werden.

 

Völlig beweglich ist man aber mit einer extern angelegten Galerie mit Hilfe des GalleryMaker, der auf der vorherige Seite, “FUSION-4”, beschrieben wird. In eine solche Galerie können alle gewünschten übergroßen “XXL-Bilder” eingestellt werden.

Dazu gehe ich wie folgt vor:

 

Erster Schritt: Ich nehme meine Panaroma-Einzel-Fotos mit ca. 50 - 150er Zoom auf. Die  Einzelfotos stelle ich ggf. gerade und bearbeite nur die Kontraste vor. Eine aufwendigere Vorbearbeitung ist nur bei sehr kontrastarmem Bildmaterial nötig.

 

Wenn ein entsprechendes Bildbearbeitungsprogramm zur Verfügung steht, geht auch eine Vorbearbeitung aller Einzelfotos mit den immer gleichen Automatik-Funktionen. Welche, das muss man an einem Foto ausprobieren. In Photoshop Elements sind maximal vier solcher automatischen Bildkorrekturen möglich. Wobei ich die automatische Farbkorrektur nicht auf die Einzel-Fotos anwende.

 

Zweiter Schritt: Danach lasse ich die Fotoreihe im Programm “PanoramaStudio” (aktuelle Version) zusammenfügen, bis zum großzügigen Beschnitt, den ich später nachretuschiere.
Das fertige Panorama speichere ich im verlustfreien PSD-Format ab. 

 

Photoshop Elements verfügt ebenfalls über eine Panoramafunktion - über Datei >Neu. Diese verwende ich, wenn der erste Versuch über PanoramaStudio mal nicht gelingt.

 

Im dritten Schritt arbeitete ich die PSD-Panorama-Datei in PhotoShop-Elements nach, z.B. in Retuschen, Licht/Schatten-Optimierung, Farben, Kontraste und Schärfung über den Hochpass-Filter (siehe Punkt 40). Das alles wird teils aufs gesamte Bild angewendet, teils nur auf Bildausschnitte beschränkt . Hier Speichern nicht vergessen!

 

Am Ende muss das fertige und gespeicherte PSD-Panorama auf die Web-Maße verkleinert werden. Die dazu benötigten Maße mussten in den vergangenen Jahren immer wieder an die höheren Auflösungen der gängigsten Bildschirme angepasst werden. Zur Zeit (Jan. 2011) optimiere ich auf die Auflösung: 1680 x 1050 Pixel.  

 

Vierter Schritt: Umrechnung eines PSD-Panoramas aufs Web - Stand Anfang 2011

Zuerst rechne ich, vor jeder weiteren Umrechnung, grundsätzlich die Bildauflösung in 300 dpi um. Die heutigen Kameras liefern Aufnahmen von 72 dpi bis 300 dpi, häufig wird in 180 dpi in der Kamera gespeichert. Durch die Umrechnung auf 300 dpi wird das abgespeicherte Foto nur verdichtet, in seiner Qualität aber nicht verändert. 

Vorgang in PhotoShop-Elements:

Menü: “Bild”

Skalieren  >Bildgröße

Auflösung: 300 Pixel/Zoll - die vorgegebene Zahl auf 300 ändern

Achtung, das Häkchen ganz unten vor “Bild neu berechnen” unbedingt entfernen.

Das Fotos soll eben nicht neu berechnet, sondern nur umgerechnet werden.

Erneut Speichern !! Sie haben nun ein handlicheres Maß, siehe cm-Maße.

 

Wieder “Bild” >Skalieren >Bildgröße aufrufen

Zuerst vor “Bild neu berechnen” - ja ! -  also wieder das Häkchen setzen.

Danach im zweiten Feld von oben, als Höhe: 750 (maximal 840) Pixel eintragen

Für Panoramen ist die Bild Höhe wichtig, nicht die Breite.

Dann mit OK die Verkleinerung bestätigen aber Vorsicht, hier nicht speichern!!!

 

Sie befinden sich, trotz verkleinerter Darstellung,  immer noch in der PSD-Ursprungsdatei. Wenn Sie zwischendurch speichern geht die dringend benötigte Originalgröße verloren!

 

Anschließend in PS-Elements, Menü “Datei” >Für Web speichern aufrufen.

Die Web-Umrechnung erfolgt als JPG-Datei, möglichst ab Qualität 50% (und höher) und durch Umrechnung in mehreren Durchgängen. Dann im JPG-Fenster unter neuem Namen abspeichern. Dem Namen sollte eine Kennung angefügt werden, z.B. GM, um sie später als Großbild, bestimmt für den GalleryMaker, erkennen zu können. 

 

Das Web-Umrechnungsfenster wird automatisch geschlossen, auf dem Bildschirm sehen Sie wieder die verkleinerte PSD-Bilddatei. Erneut Vorsicht, hier nicht abspeichern!!!
Stattdessen Bild schließen, ohne zu speichern.

 

Das vorherige Verkleinern von Fotos ins tatsächlich benötigte Format ist dringend erforderlich. Jedes nachträgliche Herunterrechnen verursacht viel zu lange Ladezeiten. 

 

Fünfter Schritt: Das verkleinerte Panorama oder Großbild wird anschließend in den GaleryMaker in eine Galerie einlesen, untertitelt und verlinkt.

Ich verwende dazu folgenden Html-Bild-Untertext (Mustertext etwas gekürzt):

<a href=”http://www.osbelder.de/html/beilstein.html#Panorama-v-BurgBeilstein”>Zurück zur Ausgangs-Web-Seite Beilstein</a><br />

<br />

<br /><b>Rundblick von der Rückseite der Burg Beilstein</b><br />

 

Ergebnis, siehe hier. Die gelb unterlegten Texte mit den eigenen Einträgen ersetzen.

 

Oder den Betrachter darauf hinweisen, dass er mit dem X-Button rechts oben das Panoramafenster schließen kann. Das geht aber nur, wenn mittels “bestehend - blanc” (vom Webmaster der Ausgangsseite veranlasst) das Panorama die Ursprungs-Seite nur überlagert, nicht überschreibt. (Richtig, wenn im Panoramafenster links oben der  Rücksprung-Pfeil deaktiviert ist (grau hinterlegt - Beispiel hier). 

 

 

Am Schluss im GalleryMaker “Galerie erstellen” und die fertige Galerie auf den Web-Server mit FileZilla hochladen (siehe Beschreibung auf der vorigen Seite “FUSION-4”).

 

Eine exakte Anpassung an die vielen verschiedenen Bildschirmauflösungen der Besucher ist längst nicht mehr möglich. Das Panorama muss in aktuellen Browsern mit Strg & +, bzw. Strg & – (minus) an die jeweilige Bildschirmeinstellung angepasst werden.

 

Eine Vergrößerung durch den Besucher führt schnell zu Qualitätseinbußen. Zu große Bilddateien erfordern lange Ladezeiten. Es bleibt für den Webmaster immer noch eine Entscheidungs-Bandbreite, zwischen Bedienungskomfort und Bildqualität.

 

 

Vergrößerungen im GalleryMaker

Umrechnungen innerhalb von Web-Programmen sind grundsätzlich nicht zu empfehlen. Die Umrechnung erfolgt mit Hilfe des Browsers und verlängert die Ladezeiten erheblich. Wenn aber mangels anderer Möglichkeit doch einmal im GalleryMaker umgerechnet werden muss, dann sollte, auf Empfehlung von Herrn Mussler, Entwickler des GalleryMaker, die Grafikqualität nicht höher als 89% eingestellt werden. Anderenfalls werden die Bilddateien zu groß.

 

Übergroße Fotos,

Sollen übergroße Fotos, zur besseren Darstellung von Details, ins Web gestellt werden, sind die Maße der Bildschirmauflösung, auf die optimiert werden soll, die maximale Grenze. Mein größtes Einzelbild hat eine Höhe von 1061 Pixel und überschreitet knapp das Höhenmaß einer 1680 x 1050 Auflösung. Umgerechnet werden diese Übergrößen genauso wie die Panoramen.  

 

PS: Zum GalleryMaker gibt es ein zusätzliches, auch sehr preiswertes Vorlagen-Paket. Aus diesem stammt die Vorlage für meine Panoramen-Präsentationen.

31

GPX-Dateien oder andere Fremdformate ins Web stellen

GPX-Dateien können nicht in FUSION eingebunden werden. Deshalb müssen sie in das im Web allgemein zugelassene Dateiformat eines “Packers” (z.B. WinZip oder WinRAR) umgewandelt werden.

Dazu die fertige .gpx-Datei im Explorer anwählen (markieren, nicht öffnen),

Das Menü Datei öffnen und...

Zu “name.rar” hinzufügen (für name steht der Originalname des jeweiligen Dokuments)

 

Dadurch wird die Datei umgewandelt in ein Dokument mit der Endung .zip oder .rar

 

Jetzt Zugang zum eigenen Provider öffnen und einen eigenen Ordner anlegen, z.B. “zgpx”

(Name des Ordners: siehe FUSION-4 und dort 4. FileZilla öffnen - Hinweis zur Ordnerstruktur)

 

Die gepackte Datei in den speziellen Ordner hochladen, danach....

Text oder Bild auf eigener Web-Site als “Externer Link” mit der hochgeladenen Datei verlinken

Fertig

 

Jetzt kann der Besucher der Web-Site über den gesetzten Link die gepackte Datei aufrufen.

 

Nachdem er “Entpacken” ausgewählt hat, wird ihm der eigene Explorer zur Auswahl der Ablage angezeigt, eigenen Ordner aussuchen und dorthin speichern (ok)

Die Datei kann jetzt vom Besucher im gpx-Format im Routenplaner aufgerufen und weiter bearbeitet werden.

32

Wie ich Video-Clips in osbelder.de einbinde, das wird auf den Seiten “Foto Video” beschrieben.

33

Die Arbeitsabläufe, wie eine Wanderung, komplett mit GPS, Foto und Video, auf der eigenen
Web-Site dokumentiert wird, das steht auf der Seite Arbeitsablauf.

34

Absatzvorlagen in FUSION - anpassen oder neue definieren

 

1. Automatisch - (geändert: Schrift und zu große Zeilen-Abstände)

In der Seitenansicht:

Text (Menüpunkt)

Formatvorlagen verwalten

Normal (P) - anwählen

Bearbeiten: Schriftart (hier Arial) - Design (Standard) - Größe (10 pt )

Absatz (Reiter oben öffnen) - alles belassen, außer:

Ränder und Einzüge - Abstand oben und unten auf 0 (Null) px setzen

OK (fertig)

 

2. Überschriften (vordefinierte anpassen)

In der Design-Ansicht:

Design (in Menüzeile oben)

Formatvorlagen verwalten

Überschrift H1 anwählen

Duplizieren - Vorsicht!! nicht bearbeiten - siehe unten !!!!

im Zwischenfenster markieren (z.B.):

Benutzerdefinierte Formatvorlage erstellen

Site übergreifend

OK und danach eigene Werte für Schriftart und Design eintragen ...

und unter dem Reiter “Absatz” z.B. nur mittig, sonst alles frei lassen, Zeilenabstand entspicht dann der Schriftgröße. 

 

3. Einrückungen (die eigene Vorlage hier in osbelder )

Aus der Seiten-Ansicht

Text (aus der Menüzeile)

Formatvorlagen verwalten

Neu ..

Schriftart und Design wählen (nicht Automatisch!!)

Reiter “Absatz” öffnen

Abstand oben und unten 0 (Null) px

Linker Rand: 40 px. (Beispiel, diese Einrückung)

OK

 

4. Tabellen-Kopf

Tabelle erstellen - Text eingeben - erste Zeile oben markieren

Im Fenster “Tabellenzeile-Eigenschaften”

unten links: “Zeile ist eine Kopfzeile” markieren

 

Neue Vorlagen können unter “Formatvorlagen verwalten” über den Button “Neu..” erstellt werden.

 

 

Vorsicht, keine Original-Vorlagen bearbeiten, außer die Normal (P)

und auch die vorsichtig, nach den oben genannten Vorgaben.

 

Ich habe versucht, zur Beschreibung der Vorlagen-Erstellung eine Original-Überschriften-Vorlage zu “Bearbeiten”. NOV Version 9 ließ das zu, stürzte aber nach OK ab. Es entstand eine fehlerhafte Datei, die beim nächsten Start -hoffentlich- vollständig beseitigt wurde. 

 

Deshalb, vor Änderungen in den Absatz-Vorlagen eine Projekt-Sicherung vornehmen über die Site-Ansicht >Datei >Als Vorlage exportieren >Ganze Site

 

Auch meine Einrücken-Vorlagen für die eigenen Zwecke völlig neu definiert. Danach habe ich den Rechner neu gestartet und erst dann den bereits vorhandenen Texten zugewiesen.

 

So ganz unbegründet ist mein “Respekt” vor den Absatz-Vorlagen der NOF-Version 9 offensichtlich nicht.

 

35

Gibt es eine Alternative zum GalleryMaker?

Das stark international ausgerichtete “JAlbum” wird erst in neuerer Zeit in Deutsch angeboten. Sie sollten auch prüfen, ob es inzwischen deutsche Foren zur Hilfestellung gibt.

 

Für mich entscheidend war aber, dass JAlbum in der kostenlosen Grundversion bis Anfang 2010 keine eigenen, längeren Bildtexte zuließ. Für Reisebeschreibungen ist das ein absolutes Ausschluss-Kriterium.

 

Man muss also vorher entscheiden, ob man eine Themen-Seite oder eine reine Foto-Seite will. Und wenn pure Foto-Seite, dann ist, aufgrund großer Konkurrenz im Web, eine hohe Bildqualität der eigenen veröffentlichten Fotos erforderlich, um Besucher anzuziehen.

 

Siehe dazu die Fußnote “Zu 5.” auf der Seite Arbeitsablauf, die auch Verlinkungen zu Musterbeispielen enthält.

 

Für meine magazin-ähnliche Reisepräsentation ist der Gallery-Maker weiterhin die erste Wahl. Er ist einfach und schnell zu bedienen und vielseitig. Sogar bildschirm-füllende Panoramen sind möglich (Beispiel aus 2010 - dort mit F11-Taste auf Vollbild umstellen).

 

 

 

Zur vorherigen Seite

Zum Inhaltsverzeichnis

Zur nächsten Seite

Zum Seitenanfang

©
Alle Rechte vorbehalten
 

IMG_4763-DennenloheDennenlohe-1Zur Seite "Aktuelles"Zur Seite "Home"Zu "Wohnort"Zu "Unterwegs"Zu "Infos-Inhalt"Schloss DennenloheSchloss DennenloheNaturfotosReisen
Zum Seitenanfang