Supportnet / Forum / Webseiten/HTML
Vorschaltseite für Homepage erzeugen - aber wie?
Frage
Hi,
Wie kann ich meiner Homepage, beim Aufruf der Startseite (index.html) eine Seite vorschalten, die die Vorladezeit von Bildern überbrückt?
Jetzt sieht man immer 10-15 sec. eine leeren Internet-Browser. Wie könnte ich z.B. den Ladevorgang anzeigen lassen oder auch nur einen farbigen Bildschirm?
Das Javascript zum Laden der Bilder wird bei meiner Homepage über die index.html aufgerufen.
Ein Lösungsweg oder ein Script würde mir sehr helfen, da ich nur wenig Ahnung vom Programmieren habe.
Danke!
Antwort 1 von rfb
besser:
Bilddateigröße reduzieren
und
schon mal ein netter Willkommenstext
und
keine Layouttabelle, damit die Seite angezeigt werden kann, bevor alles geladen ist
und (GANZ WICHTIG)
ein deutlicher Link zur ersten wirklich interessanten Seite (das ist nämlich das einzige was mich an "Vorschaltseiten" interessiert)
Bilddateigröße reduzieren
und
schon mal ein netter Willkommenstext
und
keine Layouttabelle, damit die Seite angezeigt werden kann, bevor alles geladen ist
und (GANZ WICHTIG)
ein deutlicher Link zur ersten wirklich interessanten Seite (das ist nämlich das einzige was mich an "Vorschaltseiten" interessiert)
Antwort 2 von nicknameemail
da fehlt noch ein button mit "SKIP vorschaltseite".
falls mir so eine seite begegnet, sofort auf stopbutton vom browser klick.
:)
falls mir so eine seite begegnet, sofort auf stopbutton vom browser klick.
:)
Antwort 3 von Pida.
Ergänzung: Die Maße der Grafiken im Quelltext angeben, so dass die Seite schon mal weiter aufgebaut werden kann, ohne dass erst alle Grafiken geladen werden müssen.
"Das Javascript zum Laden der Bilder wird bei meiner Homepage über die index.html aufgerufen. "
D.h., dass alle Grafiken des gesamten Projekts schon beim Aufruf der index.html geladen werden?
Gruß, Pida
"Das Javascript zum Laden der Bilder wird bei meiner Homepage über die index.html aufgerufen. "
D.h., dass alle Grafiken des gesamten Projekts schon beim Aufruf der index.html geladen werden?
Gruß, Pida
Antwort 4 von nicknameemail
oh, man hat mich gerötet :).
nun mal im ernst:
wann begreift es auch der allerletzte dau, dass man kein java/javascript benutzt?
es geht auch ohne!.
sicherheitsbewusste surfer, d.h. die, die ahnung besitzen, haben in allen browsern java/+script ausgeschaltet.
statt ihm jetzt ratschläge zum richtigen laden zugeben (zu geben- neue deutsche dingsreform), sollte man jens22 mal so richtig aufklären.
javascript ist bull****!
benutz reines html!
nun mal im ernst:
wann begreift es auch der allerletzte dau, dass man kein java/javascript benutzt?
es geht auch ohne!.
sicherheitsbewusste surfer, d.h. die, die ahnung besitzen, haben in allen browsern java/+script ausgeschaltet.
statt ihm jetzt ratschläge zum richtigen laden zugeben (zu geben- neue deutsche dingsreform), sollte man jens22 mal so richtig aufklären.
javascript ist bull****!
benutz reines html!
Antwort 5 von rfb
@nicknameemail:
so dogmatisch würde ich das nicht sehen, aber richtig ist: Java/JavaScript/Flash/usw. sind barrierebehaftete Techniken und Seiten müssen (für Seiten des Bundes und der Länder) bzw. sollten (bei Seiten von netten und rücksichtsvollen Leuten) so gestaltet sein, dass sie auch ohne den Kram gut funktionieren.
Als kleine Spielerei am Rande spricht aber nix gegen die Verwendung dieser Techniken.
so dogmatisch würde ich das nicht sehen, aber richtig ist: Java/JavaScript/Flash/usw. sind barrierebehaftete Techniken und Seiten müssen (für Seiten des Bundes und der Länder) bzw. sollten (bei Seiten von netten und rücksichtsvollen Leuten) so gestaltet sein, dass sie auch ohne den Kram gut funktionieren.
Als kleine Spielerei am Rande spricht aber nix gegen die Verwendung dieser Techniken.
Antwort 6 von Mils
Zitat:
... zugeben (zu geben- neue deutsche dingsreform) ...
was meinst Du denn damit? Kapier ich nicht.... zugeben (zu geben- neue deutsche dingsreform) ...
Antwort 7 von Jens22
Hi,
es ist alles schön und gut was ihr hier von euch gebt, aber das hilft mir alles nicht weiter.
Ich sage nur wer kein Java verwendet ist selber schuld. Die meisten Surfer verwenden die neueren Browser und die meisten Web-Seiten verwenden auch noch Javascript und für die Sicherheit gibt es Virenprogramme.
Ich lasse nur die Bilder für die Startseite vorladen, denn mir persönlich gefällt es besser, wenn die Startseite gleich kommplett erscheint. Für euch ist es vielleicht Ansichtssache, aber für mich ist es Prinzip.
Was ich brauche ist ein Lösung.
Jens
es ist alles schön und gut was ihr hier von euch gebt, aber das hilft mir alles nicht weiter.
Ich sage nur wer kein Java verwendet ist selber schuld. Die meisten Surfer verwenden die neueren Browser und die meisten Web-Seiten verwenden auch noch Javascript und für die Sicherheit gibt es Virenprogramme.
Ich lasse nur die Bilder für die Startseite vorladen, denn mir persönlich gefällt es besser, wenn die Startseite gleich kommplett erscheint. Für euch ist es vielleicht Ansichtssache, aber für mich ist es Prinzip.
Was ich brauche ist ein Lösung.
Jens
Antwort 8 von Pida.
Soll wohl ein Verweis auf die Rechtschreibreform sein. Allerdings ist (und war schon immer) "zu geben" was völlig anderes als "zugeben".
Antwort 9 von rfb
irgendwie erinnert mich das an http://www.karzauninkat.com/Goldhtml/goldhtml.htm#46
Spaß beiseite: solange du hier nicht ein paar Zeilen deiner Seite mit der Schneckenladegeschwindigkeit einfügst, können wir dir sowieso nicht weiter helfen.
Spaß beiseite: solange du hier nicht ein paar Zeilen deiner Seite mit der Schneckenladegeschwindigkeit einfügst, können wir dir sowieso nicht weiter helfen.
Antwort 10 von Dokan
Zitat:
für die Sicherheit gibt es Virenprogramme.
für die Sicherheit gibt es Virenprogramme.
Javascript ist gefährlich, weil es aufgrund seiner Komplexität anfällig für Sicherheitslücken ist. Das hat die Vergangenheit immer wieder bestätigt. Und wenn Dein Browser wegen eines Exploits plötzlich anfängt Dateien zu löschen, dann hilft Dir dagegen kein Virenprogramm!
Antwort 11 von Jens22
Hi, alle!
Vielleicht habe ich mich nicht verständlich genug ausgedrückt. Die Seite soll nur die Ladezeit der Bilder (Wartezeit) überbrücken z. B. mit der Anzeige " Seite wird geladen ... ". Jetzt könnte man denken der Rechner ist eingefroren, wenn man nicht auf die Aktivitäten in der Stauszeile achtet.
Jens
Vielleicht habe ich mich nicht verständlich genug ausgedrückt. Die Seite soll nur die Ladezeit der Bilder (Wartezeit) überbrücken z. B. mit der Anzeige " Seite wird geladen ... ". Jetzt könnte man denken der Rechner ist eingefroren, wenn man nicht auf die Aktivitäten in der Stauszeile achtet.
Jens
Antwort 12 von rfb
Zitat:
Jetzt könnte man denken der Rechner ist eingefroren, wenn man nicht auf die Aktivitäten in der Stauszeile achtet.
und das ist ein Zeichen dafür, dass da ziemlicher Murks im Code ist und den gilt es zu beseitigen.Jetzt könnte man denken der Rechner ist eingefroren, wenn man nicht auf die Aktivitäten in der Stauszeile achtet.
Das was du dagegen andenkst geht allenfalls über ein JavaScript-PopUp, das von den von dir so geschätzten neuen Browsern in der Regel blockiert wird.
Antwort 13 von Gummikuh
Moin moin,
kannst Du nicht zu Beginn der Seite einen kleinen Popup einbauen "Bitte einen Monent Geduld, Seite wird geladen"
Obwohl ich den z.B. nicht zu sehen bekommen würde ;-)
RFB hat die geraten die Bildgröße zu reduzieren.
Wieviel MB an Bilddaten müssen denn geschaufelt werden?
Gruss
Micha
kannst Du nicht zu Beginn der Seite einen kleinen Popup einbauen "Bitte einen Monent Geduld, Seite wird geladen"
Obwohl ich den z.B. nicht zu sehen bekommen würde ;-)
RFB hat die geraten die Bildgröße zu reduzieren.
Wieviel MB an Bilddaten müssen denn geschaufelt werden?
Gruss
Micha
Antwort 14 von Jens22
Hi, alle!
Die Größe der Bilder beträgt ca. 0,5MB, die nur für die Startseite geladen werden sollen.
Meine Vorstellung ist es, über die index.html das Ladescript aufzurufen, welches auch alle weiteren Abläufe für die Vorschaltseite steuert. Sollte jemand Java deaktiviert haben, dann soll mit dieser parallelen Startfolge, der normale Ladevorgang ungehindert weiter laufen können.
Ablauffolge:
1. Bilder laden und gleichzeitig eine weitere HTML-Seite öffnen (kein Popup), die über den Vorgang informiert und die mit "Focus" im Vordergrund gehalten wird, da im Hindergrund auch die index.html langsam geladen wird.
2. Sind die Bilder vollständig geladen (über Abfrage kontrollieren), dann wird die Vorladeseite über "Close" (evtl. mit Verzögerung bis Index.html aufgebaut ist) geschlossen und die index.html kommt vollgeöffnet zum Vorschein, da sie sich parallel schon auf bauen konnte.
3. Mein Ladescript müsste jetzt in das neue Script eingebunden werden.
Für diesen Schritt, fehlt mir leider das notwendige Wissen.
/* Bilder vorladen */
if (document.images) {
var bilder=new Array(12);
bilder[0]=new Image();
bilder[0].src="./images/stop.gif";
bilder[1]=new Image();
bilder[1].src="./images/banner1.gif";
bilder[2]=new Image();
bilder[2].src="./images/logo.jpg";
bilder[3]=new Image();
bilder[3].src="./images/home.jpg";
bilder[4]=new Image();
bilder[4].src="./images/navileiste.jpg";
bilder[5]=new Image();
bilder[5].src="./images/bgrnd.jpg";
bilder[6]=new Image();
bilder[6].src="./images/stadt.png";
bilder[7]=new Image();
bilder[7].src="./images/wappen.gif";
bilder[8]=new Image();
bilder[8].src="./images/bgsoft.gif";
bilder[9]=new Image();
bilder[9].src="./images/blick.jpg";
bilder[10]=new Image();
bilder[10].src="./images/pfeil.gif";
bilder[11]=new Image();
bilder[11].src="./images/pfeil_bl.gif";
}
Danke, für eure bisherigen Tipps!
Jens
Die Größe der Bilder beträgt ca. 0,5MB, die nur für die Startseite geladen werden sollen.
Meine Vorstellung ist es, über die index.html das Ladescript aufzurufen, welches auch alle weiteren Abläufe für die Vorschaltseite steuert. Sollte jemand Java deaktiviert haben, dann soll mit dieser parallelen Startfolge, der normale Ladevorgang ungehindert weiter laufen können.
Ablauffolge:
1. Bilder laden und gleichzeitig eine weitere HTML-Seite öffnen (kein Popup), die über den Vorgang informiert und die mit "Focus" im Vordergrund gehalten wird, da im Hindergrund auch die index.html langsam geladen wird.
2. Sind die Bilder vollständig geladen (über Abfrage kontrollieren), dann wird die Vorladeseite über "Close" (evtl. mit Verzögerung bis Index.html aufgebaut ist) geschlossen und die index.html kommt vollgeöffnet zum Vorschein, da sie sich parallel schon auf bauen konnte.
3. Mein Ladescript müsste jetzt in das neue Script eingebunden werden.
Für diesen Schritt, fehlt mir leider das notwendige Wissen.
/* Bilder vorladen */
if (document.images) {
var bilder=new Array(12);
bilder[0]=new Image();
bilder[0].src="./images/stop.gif";
bilder[1]=new Image();
bilder[1].src="./images/banner1.gif";
bilder[2]=new Image();
bilder[2].src="./images/logo.jpg";
bilder[3]=new Image();
bilder[3].src="./images/home.jpg";
bilder[4]=new Image();
bilder[4].src="./images/navileiste.jpg";
bilder[5]=new Image();
bilder[5].src="./images/bgrnd.jpg";
bilder[6]=new Image();
bilder[6].src="./images/stadt.png";
bilder[7]=new Image();
bilder[7].src="./images/wappen.gif";
bilder[8]=new Image();
bilder[8].src="./images/bgsoft.gif";
bilder[9]=new Image();
bilder[9].src="./images/blick.jpg";
bilder[10]=new Image();
bilder[10].src="./images/pfeil.gif";
bilder[11]=new Image();
bilder[11].src="./images/pfeil_bl.gif";
}
Danke, für eure bisherigen Tipps!
Jens
Antwort 15 von rfb
- Layouttabelle
- Größenangaben (width u. height) im img-tag fehlen
Antwort 16 von rfb
aber versuchs doch mal in dieser Art ohne Vorschaltseite
hier erscheint am Kopf der Seite einfach ein Hinweistext (kann aber beliebig lang sein), der nach Ende des Ladevorganges wieder verschwindet - viel einfacher als deine Vorschaltseitenidee. Bei deakt. JavaScript bleibt der Text von Anfang an unsichtbar.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="de">
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>Test</title>
<script type="text/javascript">
<!--
document.getElementById("warten").style.display="block";
function fertig() {
document.getElementById("warten").style.display="none";
}
//-->
</script>
</head>
<body onload="fertig()">
<h1>Herzlich willkommen auf meiner HP</h1>
<div id="warten" style="display:none">Bitte haben Sie etwas Geduld bis die Seite sich aufgebaut hat!</div>
<img src="grossesbild.jpg" width="500" height="393" alt="Bildbeschreibung">
</body>
</html>
hier erscheint am Kopf der Seite einfach ein Hinweistext (kann aber beliebig lang sein), der nach Ende des Ladevorganges wieder verschwindet - viel einfacher als deine Vorschaltseitenidee. Bei deakt. JavaScript bleibt der Text von Anfang an unsichtbar.
Antwort 17 von Jens22
Hi,
@rfb
Danke, dass du dir die Mühe gemacht hast, für mich ein Script zu schreiben. Deinen Vorschlag finde ich gut. Nur leider funktioniert er nicht. Ich habe nach deinen Angaben eine HTML-Seite erstellt. Das Bild wird geladen und angezeigt, aber die Schrift verschwindet nicht nach dem Ladevorgang. Liegt es vielleicht an der Bezeichnung "block"? Für was ist diese zuständig?
Ich muß noch nachtragen, dass meine index.html aus Frames besteht. Kommt dein Script auch damit zu recht?
Jens
@rfb
Danke, dass du dir die Mühe gemacht hast, für mich ein Script zu schreiben. Deinen Vorschlag finde ich gut. Nur leider funktioniert er nicht. Ich habe nach deinen Angaben eine HTML-Seite erstellt. Das Bild wird geladen und angezeigt, aber die Schrift verschwindet nicht nach dem Ladevorgang. Liegt es vielleicht an der Bezeichnung "block"? Für was ist diese zuständig?
Ich muß noch nachtragen, dass meine index.html aus Frames besteht. Kommt dein Script auch damit zu recht?
Jens
Antwort 18 von Jens22
@rfb
Sorry! - Ich war zu voreilig. Das Script funktioniert doch. Ich habe nur auf die Überschrift geachtet, die muss ja stehen bleiben. Aber wie binde ich das Script in meine Frame-Seite ein?
Wenn ich die Größe der Bilder (width, height) mit 0 der 1 angebe, kann ich sie auch unsichtbar laden (vorladen) - oder?
Jens
Sorry! - Ich war zu voreilig. Das Script funktioniert doch. Ich habe nur auf die Überschrift geachtet, die muss ja stehen bleiben. Aber wie binde ich das Script in meine Frame-Seite ein?
Wenn ich die Größe der Bilder (width, height) mit 0 der 1 angebe, kann ich sie auch unsichtbar laden (vorladen) - oder?
Jens
Antwort 19 von rfb
zu den Bildern: ich habe immer noch keine Ahnung, wozu du da was vorlädst. Da in einer frame-definitions-Seite nix angezeigt wird, geht da das Vorladen über img natürlich nicht, es bleibt bloß JavaScript. Ansonsten klappt das Vorladen mit <img ... width="1" height="1" ...> an einer unauffälligen Stelle problemlos (wobei sich aber Surfer, die Grafiken nicht aktiviert haben und daher nur Platzhalter angezeigt bekommen, über die "Bilderflut" in irgendeiner Ecke der Seite wundern dürften).
Wenn du die Bilder unbedingt in der index laden willst, müsstest du das Script auch dort einbauen.
Da dort aber nix angezeigt wird, müsstest du das div mit dem Ladehinweis in die angezeigte Hauptseite einbauen und dann die Anweisung im Script anpassen:
aus
document.getElementById ...
wird
frames["namedeshauptanzeigeframes"].document.getElementById...
außerdem müsste der Funktionsaufruf aus dem body-tag ins frameset-tag also
<frameset ... onload="fertig()">
(Gefallen tut mir das nicht)
Ansonsten verlege dein Ladescript bzw. die img-Variante sowie mein Script in die erste angezeigte Seite im Hauptframe, das dürfte weniger Probleme bereiten als eine störanfällige frames-JavaScript-Kombination.
Wenn du die Bilder unbedingt in der index laden willst, müsstest du das Script auch dort einbauen.
Da dort aber nix angezeigt wird, müsstest du das div mit dem Ladehinweis in die angezeigte Hauptseite einbauen und dann die Anweisung im Script anpassen:
aus
document.getElementById ...
wird
frames["namedeshauptanzeigeframes"].document.getElementById...
außerdem müsste der Funktionsaufruf aus dem body-tag ins frameset-tag also
<frameset ... onload="fertig()">
(Gefallen tut mir das nicht)
Ansonsten verlege dein Ladescript bzw. die img-Variante sowie mein Script in die erste angezeigte Seite im Hauptframe, das dürfte weniger Probleme bereiten als eine störanfällige frames-JavaScript-Kombination.
Antwort 20 von Jens22
@rfb
Danke für deine Mittarbeit. Ich werde deine Vorschläge noch ausprobieren. Es gefällt mir zwar alles nicht so richtig, wahrsscheinlich werde ich es so lassen wie es ist.
Jens
Danke für deine Mittarbeit. Ich werde deine Vorschläge noch ausprobieren. Es gefällt mir zwar alles nicht so richtig, wahrsscheinlich werde ich es so lassen wie es ist.
Jens

