Sie sind nicht angemeldet.

1

Donnerstag, 12. Januar 2017, 14:31

krpano in webseite einbinden

Hi,

ich habe mehrere Panoramen mit dem Droplet "MAKE PANO (NORMAL)" von krpano erstellt. Nun habe ich für jedes Panorama einen separaten Ordner mit den entsprechenden Dateien, die das Droplet erzeugt. Soweit gut so.

Nun möchte ich die Panoramen ein einer Webseite einbinden. Dazu habe ich für jedes Panorama ein Vorschaubild erzeugt. Diese Vorschaubilder habe ich alle in Kachelform auf der Webseite eingebunden. Wenn ich nun auf ein Vorsachaubild klicke, soll das dazugehörige Panorama gestartet werden.

Nun meine Frage:

Wie löst ihr die Einbindung von mehreren Panoramen in einer Webseite? Ich würde dies gerne ohne IFrame lösen, gibt es da Möglichkeiten? Muss ich für jedes Panorama auch immer die vom Droplet erzeugten Dateien einbinden oder reicht es diese einmal einzubinden für alle Panoramen?

Ich würde mich über ein paar Tipps sehr freuen.

MfG neoman

2

Donnerstag, 12. Januar 2017, 16:42

Das einfachste und auch nutzerfreundlichste:

Verlinke einfach die von krpano erzeugte HTML-Datei auf dem Vorschaubild.
Der User klickt das Vorschaubild, das Panorama öffnet sich bildschirmfüllend. Das ist das nutzerfreundlichste Verhalten und auch das, was der Nutzer beim Klick auf das Bild intuitiv erwartet.

Wie ich es verstehe, möchtest du, dass sich das Panorama auf der Seite Deckungsgleich mit dem Vorschaubild öffnet.
Damit nicht alle Panoramen beim Betreten der Seite schon laden (Horror!) musst du also entweder lauter iFrames (total veraltet, will niemand!) einbinden oder die Panoramen dynamisch Nachladen (einfach mit jQuery).
Das ist ebenfalls totaler User-Horror. Für jedes Panorama, das der Nutzer betrachten will, haust du ihm den RAM noch voller. Am Ende hat er vier Panoramen gesehen und der Browser lagged wie Sau.

Du siehst, die zweite Methode macht viel mehr Arbeit und ist dennoch am benutzerunfreundlichsten. Niemand will mehrere Panoramen auf der selben Seite gleichzeitig öffnen und niemand hat Lust auf Panoramen in größe eines Vorschaubildes, die einen weiteren Klick für die formatfüllende Darstellung erfordern.

Fazit: Ein einfacher Link ist für alle die beste Lösung ;-)

Beispiel: http://llj.li/p/_Autos

Gruß

3

Donnerstag, 12. Januar 2017, 18:32

Was die Dateien angeht:
Ohne Code-Bearbeitung kommt man nicht aus.

Mit PHP kann man eine dynamische xml-Datei erzeugen, die alle Panoramen gleichermassen bedient. Name sowas wie krpano.xml.php.
Riesenvorteil: Updates oder anderen Änderungen im Code brauchst Du nur einmal zu machen, gelten dann für alle Panoramen. Nachteil: Alle Panoramen müssen die selben Multitile-Größen haben. Die Prozedur und Programmierung geht aber für hier zu weit.

Ansonsten kannst Du Deinen Code so schreiben, dass die Playerfiles und Plugins für alle Panoramen auf der unteren Ordner-Ebene liegen und die xml-Datei und die Bilddateien für jedes Panorama in einem Unterordner zusammen. Dann geht das Update der krpano-Files wenigstens schnell.

4

Donnerstag, 12. Januar 2017, 18:35

Alle Panoramen müssen die selben Multitile-Größen haben.
Mal abgesehen davon, dass du wohl etwas an der Frage vorbei geschrieben hast: Das Auslesen der tile-Größen sind 3 Zeilen Code ;-)

5

Donnerstag, 12. Januar 2017, 20:42

Ok, danke für die Tipps. iFrames ist wirklich Mist, fällt also aus. Ich wollte den User eigentlich auf meiner Seite lassen wenn er auf ein Vorschaubild klickt. Wenn ich das Pano einfach durch einen Link aufs Vorschaubild öffne, geht ja ein neues Browserfenster oder je nachdem ein neuer Tab im Browser auf, somit kann er zwar das Pano betrachten, aber er ist erstmal weg von meiner Seite. Um ein anderes Pano anzuschauen, muss er wieder zurück zu Seite, also m.M.n. auch nicht ganz optimal.

Ich dachte eher an z.B. ein Modalfenster (Bootstrap) in dem sich das Pano öffnet. Das hab ich aber bis jetzt nur mit Hilfe eines iFrames hinbekommen, da ich ja die pano.html in das Modalfenster laden muss. Von iFrames wollte ich aber weg. Ihr seht, alles nicht so einfach. Die Webseite befindet sich momentan auf meinem Rechner zur Entwicklung. Deswegen ist es schwer da was zu zeigen. Ich mache mir aber lieber vorher Gedanken, sonst macht mal alles mehrmals, was viel Arbeit ist.

6

Donnerstag, 12. Januar 2017, 22:08

Ok, danke für die Tipps. iFrames ist wirklich Mist, fällt also aus. Ich wollte den User eigentlich auf meiner Seite lassen wenn er auf ein Vorschaubild klickt. Wenn ich das Pano einfach durch einen Link aufs Vorschaubild öffne, geht ja ein neues Browserfenster oder je nachdem ein neuer Tab im Browser auf, somit kann er zwar das Pano betrachten, aber er ist erstmal weg von meiner Seite. Um ein anderes Pano anzuschauen, muss er wieder zurück zu Seite, also m.M.n. auch nicht ganz optimal.

Ich dachte eher an z.B. ein Modalfenster (Bootstrap) in dem sich das Pano öffnet. Das hab ich aber bis jetzt nur mit Hilfe eines iFrames hinbekommen, da ich ja die pano.html in das Modalfenster laden muss. Von iFrames wollte ich aber weg. Ihr seht, alles nicht so einfach. Die Webseite befindet sich momentan auf meinem Rechner zur Entwicklung. Deswegen ist es schwer da was zu zeigen. Ich mache mir aber lieber vorher Gedanken, sonst macht mal alles mehrmals, was viel Arbeit ist.
95% der User wollen das Ding eh Vollbild ansehen, da in einem kleinen Modal oder Frame wenig zu erkennen ist. Es macht wenig Unterschied, ob er dort den Fullscreen Button klickt, oder direkt ein neues Fenster/Tab geöffnet bekommt. Beide erfordern eine "Zurück" Aktion um wieder die Seite zu betrachten. Weg von deiner Seite ist deshalb niemand´.

Ein Modal ist natürlich auch einfach. Auch muss du nicht die pano.html dort laden sonder nur die entsprechende Zeile HTML um dort das Panorama anzuzeigen. Am Ende hast du dann aber trotzdem wieder ein zu kleines Panorama, das niemand haben möchte ;-)

7

Freitag, 13. Januar 2017, 14:12

Ok, danke für die Tipps. iFrames ist wirklich Mist, fällt also aus. Ich wollte den User eigentlich auf meiner Seite lassen wenn er auf ein Vorschaubild klickt. Wenn ich das Pano einfach durch einen Link aufs Vorschaubild öffne, geht ja ein neues Browserfenster oder je nachdem ein neuer Tab im Browser auf, somit kann er zwar das Pano betrachten, aber er ist erstmal weg von meiner Seite. Um ein anderes Pano anzuschauen, muss er wieder zurück zu Seite, also m.M.n. auch nicht ganz optimal.

Ich dachte eher an z.B. ein Modalfenster (Bootstrap) in dem sich das Pano öffnet. Das hab ich aber bis jetzt nur mit Hilfe eines iFrames hinbekommen, da ich ja die pano.html in das Modalfenster laden muss. Von iFrames wollte ich aber weg. Ihr seht, alles nicht so einfach. Die Webseite befindet sich momentan auf meinem Rechner zur Entwicklung. Deswegen ist es schwer da was zu zeigen. Ich mache mir aber lieber vorher Gedanken, sonst macht mal alles mehrmals, was viel Arbeit ist.
95% der User wollen das Ding eh Vollbild ansehen, da in einem kleinen Modal oder Frame wenig zu erkennen ist. Es macht wenig Unterschied, ob er dort den Fullscreen Button klickt, oder direkt ein neues Fenster/Tab geöffnet bekommt. Beide erfordern eine "Zurück" Aktion um wieder die Seite zu betrachten. Weg von deiner Seite ist deshalb niemand´.

Ein Modal ist natürlich auch einfach. Auch muss du nicht die pano.html dort laden sonder nur die entsprechende Zeile HTML um dort das Panorama anzuzeigen. Am Ende hast du dann aber trotzdem wieder ein zu kleines Panorama, das niemand haben möchte ;-)

Ok, ich hab mich mal auf einigen Webseiten von Usern hier aus dem Forum umgesehen. Tatsächlich machen es die meisten so, das wenn man aufs Vorschaubild klickt sich ein neues Fenster öffnet wo das Pano dann vollflächig dargestellt wird.

Mir persönlich gefällt das nicht so ganz, da man wie gesagt sich nicht mehr auf der Webseite befindet. Schnell hat man dann mehrere zusätzliche Fenster auf und verliert die Orientierung.

Gibt es noch andere Möglichkeiten?

8

Freitag, 13. Januar 2017, 15:53

Du solltest auch daran denken, dass einige Leute auch mit dem Smartphone deine Seite besuchen werden.
Hier ist es auch besser wenn sich das Panorama in voller Größe öffnet. Iframe oder Modalbox sind in diesem Fall wirklich nicht optimal.

Gruß
Uli

9

Freitag, 13. Januar 2017, 16:14

Wie oft wirst im Internet zu einer anderen Seite weitergeleitet? Stört es dich jedes mal wenn du auf einen Link klickst und eine neue Seite öffnet sich?

Gruß Tobias

10

Freitag, 13. Januar 2017, 16:44

Ok, danke für die Tipps. iFrames ist wirklich Mist, fällt also aus. Ich wollte den User eigentlich auf meiner Seite lassen wenn er auf ein Vorschaubild klickt. Wenn ich das Pano einfach durch einen Link aufs Vorschaubild öffne, geht ja ein neues Browserfenster oder je nachdem ein neuer Tab im Browser auf, somit kann er zwar das Pano betrachten, aber er ist erstmal weg von meiner Seite. Um ein anderes Pano anzuschauen, muss er wieder zurück zu Seite, also m.M.n. auch nicht ganz optimal.

Ich dachte eher an z.B. ein Modalfenster (Bootstrap) in dem sich das Pano öffnet. Das hab ich aber bis jetzt nur mit Hilfe eines iFrames hinbekommen, da ich ja die pano.html in das Modalfenster laden muss. Von iFrames wollte ich aber weg. Ihr seht, alles nicht so einfach. Die Webseite befindet sich momentan auf meinem Rechner zur Entwicklung. Deswegen ist es schwer da was zu zeigen. Ich mache mir aber lieber vorher Gedanken, sonst macht mal alles mehrmals, was viel Arbeit ist.
95% der User wollen das Ding eh Vollbild ansehen, da in einem kleinen Modal oder Frame wenig zu erkennen ist. Es macht wenig Unterschied, ob er dort den Fullscreen Button klickt, oder direkt ein neues Fenster/Tab geöffnet bekommt. Beide erfordern eine "Zurück" Aktion um wieder die Seite zu betrachten. Weg von deiner Seite ist deshalb niemand´.

Ein Modal ist natürlich auch einfach. Auch muss du nicht die pano.html dort laden sonder nur die entsprechende Zeile HTML um dort das Panorama anzuzeigen. Am Ende hast du dann aber trotzdem wieder ein zu kleines Panorama, das niemand haben möchte ;-)

Ok, ich hab mich mal auf einigen Webseiten von Usern hier aus dem Forum umgesehen. Tatsächlich machen es die meisten so, das wenn man aufs Vorschaubild klickt sich ein neues Fenster öffnet wo das Pano dann vollflächig dargestellt wird.

Mir persönlich gefällt das nicht so ganz, da man wie gesagt sich nicht mehr auf der Webseite befindet. Schnell hat man dann mehrere zusätzliche Fenster auf und verliert die Orientierung.

Gibt es noch andere Möglichkeiten?
Der Ansatz "Das will ich anders machen als alle anderen" kommt bei Leuten, die nicht viel Erfahrung im Webseiten erstellen haben häufig vor, ist aber völliger Schwachsinn.
Jeder Nutzer auf deiner Seite erwartet intuitives Verhalten der selbigen. Wenn deine Seite plötzlich ander funktioniert, als alle anderen, ist er angepisst und verlässt deine Seite. So verlierst du nutzer, nicht weil sie orientierungslos weden, weil ein neues Fenster aufgeht. Das war vielleicht 1995.

Es gibt viele Möglichkeiten und alles was du beschrieben hast ist sehr leicht machbar. Nur will das eben keiner, außer dir ;-)
Merksatz: So ziemlich alles, was du anders machen willst als andere (vor allem große Seiten) ist einfach "schlecht und falsch".

Gib den Nutzern das, was sie erwarten. Dann sind sie gerne auf deiner Seite und schlau genug ein neues Fenster/Tab zu verstehen und zu schließen, ohne deine Seite zu verlassen, sind sie auch.

Gruß

Der Flo

Mega-User

Beiträge: 446

Wohnort: Hamburg

Beruf: Fotograf

  • Nachricht senden

11

Samstag, 14. Januar 2017, 02:03

Warum nimmst Du nicht einfach irgenden Lightbox-Plugin, das HTML Laden kann, und packst die Panoramen da rein.
Hab ich bei mir so gemacht (hier auf Wordpress-Basis) http://florian-busch.de/360-panorama-interaktiv/

12

Samstag, 14. Januar 2017, 08:07

@ Florian

Das Template und die Einbindung der Panoramen gefallen mir, die Schriftdarstellung nicht.

Egal, wie ich mein iPad Air2 halte, entweder wird das "Panoramafotografie" nach "f" oder sogar nach "e" getrennt.

Ein einzelnes "e" auf der neuen Zeile sieht nun nicht so toll aus. ;)

Der Flo

Mega-User

Beiträge: 446

Wohnort: Hamburg

Beruf: Fotograf

  • Nachricht senden

13

Samstag, 14. Januar 2017, 08:21

Danke für das Feedback das schau ich mir mal an sowie ich Zeit finde.
Bei Wordpress musste ich (zumindestens beim meinen letzten Seiten) übrigens gar kein Plugin mehr installieren, sodnern da scheint mitlerweile was dabeizusein.

14

Samstag, 14. Januar 2017, 11:08

… Egal, wie ich mein iPad Air2 halte, entweder wird das "Panoramafotografie" nach "f" oder sogar nach "e" getrennt.

Ist doch prima; zudem kannst Du Dir das Trennzeichen sparen. Wie sieht es aus, wenn Du ein Pano aus dem Ort Llanfairpwllgwyngyllgogerychwyrndrobwllllantysiliogogogoch beschreibst? Kannst Du den Orstnamen nach der/n Trennung/en noch vernüftig lesen? ^^

Na ja, das Internet ist eben nicht von Deutschen erfunden worden. Und so ist deren Vorliebe für Wortungetüme (Rindfleischetikettierungsüberwachungsaufgabenübertragungsgesetz) nicht berücksichtigt. Ich empfinde den Zwang zur Verwendung von kurzen Wörtern positiv.

15

Samstag, 14. Januar 2017, 19:30

Danke für das Feedback das schau ich mir mal an sowie ich Zeit finde.


­ bzw. &173; können dir dabei eventuell weiter helfen, z.B.: Panorama­fotografie

Gérard