Bild

Sollte der skalierbare Hintergrund wie  im NOF-Tutorial beschrieben nicht funktionieren, so kann dies mit der Publizierungsstruktur zu tun haben.

Dass sich der Hintergrund nicht der Bildschirmgröße angepasst hatte, sondern im Browser gekachelt angezeigt war, hatte bei einem Anwender folgende Ursache: Das Projekt war mit Site-Struktur publiziert, das Tutorial aber setzte eine Publizierung „nach Assets-Struktur“ voraus.

Weitere Informationen dazu in unserem Forum-Thread:

jquery Backstretch – Hintergrund auf Bildschirmgröße skalieren – Problem und Lösung

 

Weitere Hinweise:

Selbstverständlich kann man jedoch die Skripte im Tutorial mit den richtigen Pfadangaben auch einer anderen Publizierungsstruktur anpassen.

Ein gutes Verständnis über relative und absolute Pfadangaben bekommt man in dieser Anleitung:

Absolute und relative Pfadangaben

Anleitung von Tommy: Jquery Backstretch – Fullscreen Hintergrund

http://www.tommyherrmanndesign.com/nof/Hintergrundbild-Skript/html/backstretch-tut.php

Folgender Screencast zeigt, wie man die Publizierungsstruktur einstellt und was mit den Dateien passiert. Man sollte wissen, dass seit Version NOF12 die Standardeinstellung  für die Publizierung „Site-Struktur“ ist. Bei allen früheren Versionen war die Standard-Einstellung „nach Assets-Typ“ eingestellt.

http://www.nof-schule.de/forum/t-publizierungseinstellungen

 

Und so sieht z.B. der skalierbare Hintergrund aus:

 

Fullscreen Hintergrund

Quelle

 

Bilder und Links sind gute Instrumente der Suchmaschinenoptimierung.

Bilder, Alttexte und Titel

Ein Bild hat einen Dateinamen. In NOF wird der Dateiname als Alttext im Eigenschaftsfenster vorgeschlagen.

Es wäre für die Suchmaschinenoptimierung sinnvoll, bereits im Bildnamen (auf der eigenen Festplatte) einen thematisch relevanten Namen zu vergeben.

Nach der Einfügung in NOF stehen uns weitere zwei Möglichkeiten der Beschriftung zur Verfügung:

  • Die Eingabe eines Alttitels: Der Alttitel (Alternativ-Titel) wird direkt im Bildeigenschaftsfenster eingegeben. Bitte Feld nicht leer lassen! Screenreaders für sehbehinderte Menschen lesen Alttexte vor! Darüber hinaus verursacht das „leer lassen“ dieses Feldes für jedes Bild einen HTML-Fehler im Quelltext.
  • Die Eingabe eines Bildtitels. Dies ist etwas komplizierter: Bild anklicken > Im Eigenschaftsfenster „HTML“ klicken > im HTML-Code „im TAG“ folgendes eingeben:
    title="Meine Bildbeschreibung"

NetObjects Tutorial zum Thema Bildbeschriftung

Es gibt unterschiedliche Möglichkeiten Euer Video oder auch eines von YouTube auf einer Seite darzustellen.

Eine sehr einfache Lösung ist die Verwendung der Video Lightbox von „Visual Ligtbox“. Der Einbau funktioniert ebenso leicht wie bei der Visual Lightbox, entweder direkt in die Seite oder auch als Link in einem Iframe. Die Software ist auch auf Deutsch einzustellen. Dieses Plugin ist für mobile Endgeräte geeignet.

 

 

Eine Anleitung für den Einbau in NOF könnt Ihr auf meiner Hilfe- und Tutorialseite zu NetObjects Fusion finden.

Website der Video Ligtbox

 

In NOFs „Verwaltenansicht“ finden wir im dritten Reiter Reiter die Möglichkeit, Datenobjekte zu verwalten. Datenobjekte enthalten Bestandteile der Website, die in Form von Containern bestimmte Inhalte einschließen – wie z.B. Bilder von Bildgalerien.

Typischerweise werden hier die  z.B. die NOF-Bildgalerien verwaltet. Wenn eine alte Bildgalerie, die als Test gemacht war oder gelöscht wurde, hier im Karteireiter „Objekte“ nicht gelöscht wurde, bleiben alle Bestandteile dieser Galerien im Projekt bestehen. Das Projekt wird dadurch überladen und lässt sich bei einer großen Anzahl Bilder nur noch langsam hochladen und speichern.

NOF.Objekte-pruefen

Hier enthaltene Objekte, die nicht mehr in Verwendung sind, sollten hier aktiv regelmäßig gelöscht werden.

Mit folgendem Icon auf der NOF-Seitenansicht kann ein Bild eingefügt werden:

 

nof-werkzeug-bild-einfuegen

 

Das Bild wird in die Seite mit der Maus platziert. Wenn mehrere Bilder nebeneinander vorgesehen sind, ist es sinnvoll, die Bilder in Tabellen oder innerhalb von Layoutbereichen einzubinden. Bei  Bedarf können damit die Bilder in einem Vorgang auf der Arbeitsfläche verschoben oder auf anderen Seiten kopiert werden.

Seit Version NOF12 wird der Anwender gewarnt, wenn Bilder zu groß für das Layout sind. Die Bilder können in solchen Fällen vor dem Einfügen in NOF herunterskaliert werden. Sinnvoll ist es aber, vor dem Einfügen in NOF das Bild mit einem Bildbearbeitungsprogramm zu bearbeiten und für das Web zu optimieren. Eine Auflösung von 72 dpi ist für die Darstellung im Internet ausreichend. Einzelne Bilder sollten nicht viel mehr als 100 KB Volumen haben.

Die Foto-Galerien

NetObjects Fusion bietet zwei Komponenten für Bilder-Galerien Eurer Fotos.

Die Foto Galerie von NOF:

http://www.tommyherrmanndesign.com/nof/html/foto-galerie.html

Die Flash Foto Galerie von NOF:

http://www.tommyherrmanndesign.com/nof/html/flash-galerie-katze.html

Zu beiden Beispielen habe ich Tutorials geschrieben.

 

Beide Galerien werden von den meisten Benutzern jedoch nur wenig bis gar nicht verwendet und dies hat einen guten Grund.

Man soll ja über Geschmack nicht streiten 😉 aber besonders gut sehen beide NOF-Galerien nicht aus.

Ein großer Nachteil ist auch, dass NOF sämtliche Bilder in dem Projekt speichert und das bläht, bei einer großen Anzahl von Bildern, Euer Projekt unerhört auf. Daher sollte man mit diesen Galerien eher sparsam umgehen und nicht viel mehr als vielleicht 30 Bilder pro Galerie verwenden. Dabei sollte man auch darauf achten, dass die Bilder keine zu große Dateigröße haben.

Diese Galerien von NOF sind also für eine große Anzahl von Bildern vollkommen ungeeignet.

 

Es ist daher zu empfehlen externe Galerien zu verwenden, die man leicht in NOF einbauen kann oder auch mittels Inlineframe anzeigen lassen kann.

Es gibt im Web unzählige solcher Galerien, wie z.B. den WOW Slider oder auch die Visual Lightbox.

Das Erstellen einer Galerie mit der Visual Lightbox oder auch dem WOW Slider geht fast von alleine.

 

Guckt Euch auch mal die Lytebox und die Komponenten von SwissKnife for NOF zu diesem Thema an.

Etliche solcher externen Galerien beschreibe ich auf meiner NetObjects Fusion Hilfe Seite inklusive der Tutorials zum Einbau in NOF.

http://www.tommyherrmanndesign.com/nof/html/go-multimedia.php

Externe Bildgalerien Beispiele und Tutorials im Forum