nicht angemeldet
Der Martin
Der Martin
marctrix
Tabellenkalk
Tabellenkalk
Tabellenkalk
marctrix
Gunnar Bittersmann
Gunnar Bittersmann
Gunnar Bittersmann
JürgenB
Gunnar Bittersmann
Hallo zusammen,
meine Website besteht aus mehreren Seiten mit dunklem Hintergrund. Beim Wechsel zwischen den Seiten blitzt dann immer der helle Bildschirm auf. Kann man das verhindern?
Danke vorab!
Moin,
meine Website besteht aus mehreren Seiten mit dunklem Hintergrund. Beim Wechsel zwischen den Seiten blitzt dann immer der helle Bildschirm auf. Kann man das verhindern?
ja, stell einfach eine dunkle Hintergrundfarbe als Browser-Default ein. ;-)
Nein, im Ernst: Das ist browserabhängig und liegt daran, wie die Browser beim Bildaufbau vorgehen. Manche beginnen schon mit dem Bildaufbau, bevor das Dokument vollständig geladen und interpretiert ist. Das kann dann zu dem Effekt führen, den du beschreibst.
Du kannst versuchen, das zu bekämpfen, indem du beispielsweise die Hintergrundfarbe nicht in einem externen Stylesheet festlegst, sondern direkt in einem style-Block im Kopf des Dokuments. So ist diese Information sehr früh verfügbar und wird möglicherweise sofort angewendet.
Aber eine Garantie, dass das nützt, kann dir keiner geben.
So long,
Martin
Hallo
An der von dir verlinkten Website (um die geht es ja wohl) kann ich das Problem nicht nachvollziehen.
Wenn es entweder Browserabhängig ist oder von der Trafficgeschwindigkeit abhängt wirst du auch nur wenig ändern können.
Für genauere Aussagen müssten wir aber genauer wissen unter welchen Voraussetzungen das Problem auftritt. Also Betriebssystem, Browser, Gerät, Geschwindigkeit, Netzwerk u.s.w.
Gruss
MrMurphy
Danke für die schnellen Antworten!
Ich dachte ja, dass ein externes Stylesheet eher ein Geschwindigkeitsvorteil wäre. Ich probier das aber aus mit dem Hintergrund-Style auf jeder Seite.
Angaben: OS X El Capitan, Safari, Mac Mini late 2009, DSL 16 000 MBit/s
Grüße!
Hallo,
Ich dachte ja, dass ein externes Stylesheet eher ein Geschwindigkeitsvorteil wäre.
nein, wie sollte es? - Es ist eine weitere Ressource, die zusätzlich angefordert werden muss. Und deren URL kennt der Browser frühestens, während er das Dokument selbst interpretiert - erst dann kann er also den Folge-Request absetzen.
Ein externes Stylesheet hat allerdings andere Vorteile: Modularisierung (Trennung von Inhalt und Gestaltung), Wiederverwendbarkeit desselben Stylesheets auf mehreren Seiten (einheitliches Design), Wartungsfreundlichkeit (nur eine Stelle bei Änderungen).
Angaben: OS X El Capitan, Safari, Mac Mini late 2009, DSL 16 000 MBit/s
Hmm. Safari. Wie der sich verhält, kann ich nun mangels Erfahrung gar nicht sagen.
Übrigens erlebe ich auf deiner Beispielseite dasselbe wie Kalk: Nichts. Eine winzige Zitrone vor einem schwarzen Hintergrund. Kein Text, kein Link, kein Inhalt.
Ob ich Javascript deaktiviert habe? - Ja, selbstverständlich. Auf fremden, unbekannten Seiten immer. Und selbst auf vertrauten Seiten bleibt das meistens so. Mit nur sehr wenigen Ausnahmen. Meinen Nerven zuliebe.
So long,
Martin
Hej Der Martin,
Ich dachte ja, dass ein externes Stylesheet eher ein Geschwindigkeitsvorteil wäre.
nein, wie sollte es? - Es ist eine weitere Ressource, die zusätzlich angefordert werden muss.
Eigentlich nicht - das Problem tritt ja beim Wechsel von einer Seite auf die nächste auf - da ist die CSS-Datei ja längst im Browser-Cache...
Angaben: OS X El Capitan, Safari, Mac Mini late 2009, DSL 16 000 MBit/s
Hmm. Safari. Wie der sich verhält, kann ich nun mangels Erfahrung gar nicht sagen.
Bei mir im Safari kann ich das Problem auch nicht nachvollziehen...
Marc
Hallo,
An der von dir verlinkten Website (um die geht es ja wohl) kann ich das Problem nicht nachvollziehen.
Ich auch nicht. Ich sehe eine Zitrone(?) auf schwarzem Hintergrund. Von mehreren Seiten, zwischen denen beim Wechsel etwas passieren könnte, ist weit und breit nix zu sehen. Kein Text, kein Link, nix.
Gruß
Kalk
Hallo Kalk, hast du Javascript deaktiviert? Wenn du auf die Zitrone(!) gehst kommt Schrift, wenn du darauf klickst die Startseite usw.
Hallo,
hast du Javascript deaktiviert?
ja, warum?
Wenn du auf die Zitrone(!) gehst kommt Schrift,
nein.
wenn du darauf klickst die Startseite usw.
auch nein.
Gruß
Kalk
Hallo,
hast du Javascript deaktiviert?
ja, warum?
Wenn du auf die Zitrone(!) gehst kommt Schrift,
nein.
wenn du darauf klickst die Startseite usw.
auch nein.
Gruß
Kalk
Ich weiß was du mir hier mitteilen willst. Ich wüßte nicht wie ich das was ich will ohne JS realisieren könnte. Ich kann deinen Purismus durchaus nachvollziehen, würde aber mal behaupten, dass 99% der "normalen" User ihn nicht teilen.
Hallo,
Ich weiß was du mir hier mitteilen willst. Ich wüßte nicht wie ich das was ich will ohne JS realisieren könnte.
du willst, dass deine Seitenbesucher erst deine Zitrone sehen (extra Begrüßungsseiten sind eigentlich schon im letzten Jahrtausend out gewesen) und dann darauf klicken um zum eigentlichen Inhalt zu kommen. Dafür ist in HTML schon seit längerem, vermutlich schon seit immer, ein Extra-Element vorgesehen, das völlig ohne JS funktioniert.
Gruß
Kalk
@@Tabellenkalk
du willst, dass deine Seitenbesucher erst deine Zitrone sehen (extra Begrüßungsseiten sind eigentlich schon im letzten Jahrtausend out gewesen) und dann darauf klicken um zum eigentlichen Inhalt zu kommen.
Was über Mobilfunk mehrere Sekunden dauert. Die Zitrone dürfte den Nutzern sauer aufstoßen.
Dafür ist in HTML schon seit längerem, vermutlich schon seit immer, ein Extra-Element vorgesehen, das völlig ohne JS funktioniert.
Der Inhalt der Startseite sollte gleich beim ersten Request geladen werden, d.h. mit der Zitrone auf derselben Seite sein. Die Umschaltung zwischen Zitrone und Inhalt funktioniert auch völlig ohne JS.
Wenn es denn unbedingt eine Zitrone sein muss:
<main id="content">
<!-- hier der Inhalt -->
</main>
<aside id="lemon">
<!-- hier die Zitrone -->
<a href="#content">weiter</a>
</aside>
Ausblendung per Stylesheet:
main:not(:target) { display: none }
main:target + #lemon { display: none }
LLAP 🖖
Die erste Version meiner Website ist von 2003. Seither habe ich immer nur marginal etwas verändert. Damals fand ich das halt cool :-)(Der Ablauf – wenn man die Maus benützt – ist ja der, dass zuerst die Zitrone da ist, wenn man auf diese geht das Wort "Aporie" erscheint und ein Klick darauf dann zur Startseite führt wo, wenn man sucht, das Wort "Aporie" dann erklärt wird. Ich werde diesen Ablauf überdenken. Es ist halt die Seite eines Künstlers, der mit den Mitteln des Mediums eine Message rüberbringen will. Das ist so ziemlich das Gegenteil einer Seite wie z. B. Selfhtml.org bei der Funktionalität und Information an allererster Stelle stehen. Ob ich mit unterstehendem Tipp die bisherige Gestaltung beibehalten kann wage ich zu bezweifeln, aber ich probiere es aus. Danke für den Hinweis!
[Vollzitat entfernt]
Hej Drifter,
Hallo,
hast du Javascript deaktiviert?
ja, warum?
Ich weiß was du mir hier mitteilen willst. Ich wüßte nicht wie ich das was ich will ohne JS realisieren könnte.
Mit CSS
Marc
@@Drifter
hast du Javascript deaktiviert?
Nein.
Wenn du auf die Zitrone(!) gehst kommt Schrift, wenn du darauf klickst die Startseite usw.
Zur Startseite komme ich per Tastatur, aber „usw.“ gibt es dort nicht.
Sackgasse – wegen onFocus="if (this.blur) this.blur()". Man kann Links nicht anwählen, weil der Fokus sofort wieder weggenommen wird.
Muss man JavaScript deaktivieren, um deine Seite benutzen zu können?
LLAP 🖖
@@Drifter
hast du Javascript deaktiviert?
Nein.
Wenn du auf die Zitrone(!) gehst kommt Schrift, wenn du darauf klickst die Startseite usw.
Zur Startseite komme ich per Tastatur, aber „usw.“ gibt es dort nicht.
Sackgasse – wegen
onFocus="if (this.blur) this.blur()". Man kann Links nicht anwählen, weil der Fokus sofort wieder weggenommen wird.
onFocus="if (this.blur) this.blur()" hatte ich vor ca. 10 Jahren mal eingefügt weil mich der blaue Rahmen der in Firefox um jeden Link herum erschien störte. Inzwischen gibt es das ja nicht mehr bzw. kann mit img border 0 behoben werden. onFocus="if (this.blur) this.blur()" werde ich rausnehmen. Danke!
Muss man JavaScript deaktivieren, um deine Seite benutzen zu können?
LLAP 🖖
„Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
„Hat auf dem Forum herumgelungert …“
(Wachen in Asterix 36: Der Papyrus des Cäsar)
@@Drifter
onFocus="if (this.blur) this.blur()" hatte ich vor ca. 10 Jahren mal eingefügt weil mich der blaue Rahmen der in Firefox um jeden Link herum erschien störte.
Was stört und was notwendig ist, liegt im Auge des Betrachters.
Sorge dafür, dass bei Navigation per Keyboard der Link, der gerade den Fokus hat, deutlich hervorgehoben ist, damit der Nutzer weiß, welchem er bei [Enter] nun folgt. Die Pseudoklasse :focus ist dein Freund.
LLAP 🖖
Danke, ich geh da nochmal in mich...
@@Drifter
onFocus="if (this.blur) this.blur()" hatte ich vor ca. 10 Jahren mal eingefügt weil mich der blaue Rahmen der in Firefox um jeden Link herum erschien störte.
Was stört und was notwendig ist, liegt im Auge des Betrachters.
Sorge dafür, dass bei Navigation per Keyboard der Link, der gerade den Fokus hat, deutlich hervorgehoben ist, damit der Nutzer weiß, welchem er bei [Enter] nun folgt. Die Pseudoklasse
:focusist dein Freund.LLAP 🖖
„Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
„Hat auf dem Forum herumgelungert …“
(Wachen in Asterix 36: Der Papyrus des Cäsar)
Also der "focus" funktioniert jetzt wieder. Es gelingt mir allerdings nicht ihn wunschgemäß zu formatieren. Nur die Hintergrundfarbe ist einstellbar. Farbe und Dicke des Rahmens wird wohl vom Browser vorgegeben. In Firefox kommt leider gar nichts.
@@Drifter
Also der "focus" funktioniert jetzt wieder. Es gelingt mir allerdings nicht ihn wunschgemäß zu formatieren. Nur die Hintergrundfarbe ist einstellbar. Farbe und Dicke des Rahmens wird wohl vom Browser vorgegeben.
Glaub ich nicht. Da du nicht zeigst, was du gemacht hast, kann man dir nichts Genaueres sagen.
In Firefox kommt leider gar nichts.
Bist du sicher, dass du im Firefox mit der Tab-Taste durch die Links navigierst? Ich musste dazu was einstellen.
LLAP 🖖
Guten Morgen!
@@Drifter
Also der "focus" funktioniert jetzt wieder. Es gelingt mir allerdings nicht ihn wunschgemäß zu formatieren. Nur die Hintergrundfarbe ist einstellbar. Farbe und Dicke des Rahmens wird wohl vom Browser vorgegeben.
Glaub ich nicht. Da du nicht zeigst, was du gemacht hast, kann man dir nichts Genaueres sagen.
Derzeit sehen meine Verweise so aus:
a {font-size: 12pt; color: #92AACA;}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover, a:focus {text-decoration: none;color: #FC3;}
a:active {text-decoration: none;}
Ausprobiert hatte ich die Formatierung die hier in Selfhtml.org gezeigt wird:
a:focus { background-color: red; color: black;}
was auch funktioniert hat. Nicht funktioniert dagegen z. B.:
a:focus { border:thin; color: #FC3;}
Safari macht einen dicken, hellblauen Rahmen um die Links. Firefox eine dünne gepunktete Linie in der angegebenen Farbe #FC3. Daher denke ich schon , dass es Browserspezifisch ist.
In Firefox kommt leider gar nichts.
Bist du sicher, dass du im Firefox mit der Tab-Taste durch die Links navigierst? Ich musste dazu was einstellen.
Danke für den Tipp! jetzt geht es auch bei mir!
LLAP 🖖
„Wir haben deinen numidischen Schreiber aufgegriffen, o Syndicus.“
„Hat auf dem Forum herumgelungert …“
(Wachen in Asterix 36: Der Papyrus des Cäsar)
Hallo,
a:focus { border:thin; color: #FC3;}
ich bin nicht sicher, ob die Angabe zu Border so ok ist, ich nehme immer
a:focus { border:1px solid #FC3; }
Siehe Doku
Gruß Jürgen
Hi Jürgen
Hallo,
a:focus { border:thin; color: #FC3;}ich bin nicht sicher, ob die Angabe zu Border so ok ist, ich nehme immer
a:focus { border:1px solid #FC3; }
Geht leider nicht :-(
Siehe Doku
Gruß Jürgen
@@Drifter
a:focus { border:1px solid #FC3; }Geht leider nicht :-(
Geht doch: 
border wird zusätzlich zu outline (aus dem Browserstylesheet) angezeigt.
Da border (im Gegensatz zu outline) die Größe der Box beeinflusst, ist das keine gute Idee, damit bei :hover oder :focus einen Rahmen hinzuzufügen.
LLAP 🖖
Ok. es gibt aber eben keine Möglichkeit das Browser-Stylesheet zu umgehen oder zu überschreiben, oder sehe ich das falsch?
@@Drifter
Ok. es gibt aber eben keine Möglichkeit das Browser-Stylesheet zu umgehen oder zu überschreiben, oder sehe ich das falsch?
Das siehst du falsch. Mit p { margin: 1.5em 0; line-height: 1.5em } bspw. tust du genau das: die im Browserstylesheet für margin und line-height gesetzten Werte mit denen aus deinem Autorenstylesheet überschreiben.
Möchtest du das für outline tun?
a:focus { outline: 1px solid #FC3; }
LLAP 🖖
Jetzt ist der Groschen gefallen, danke! Komisch ist aber, dass in Safari nun Bilder die verlinkt sind nicht mehr umrahmt werden sondern im unteren Bereich eines Bildes ein flaches Rechteck erscheint: Einzelbild Gallery Warum nur?
@@JürgenB
a:focus { border:thin; color: #FC3;}ich bin nicht sicher, ob die Angabe zu Border so ok ist
Kommt drauf an, was „OK“ meint. ;-) Syntaktisch ist sie OK; allerdings ist sie wirkungslos.
Die shorthand property border [Spec] setzt ausgelassene Werte für border-width, border-style, border-color (und border-image) auf ihren Ausgangswert, d.h. 'border: thin' tut dasselbe wie 'border: thin none currentColor'. Und bei 'border-style: none' gibt’s nun mal keinen Rahmen.
LLAP 🖖