nicht angemeldet
Matthias Scharwies
Rolf B
Rolf B
Rolf B
Der Martin
Der Martin
Rolf B
Hallo,
Ich möchte das Bild als 
ablegen, welches dann durch anklicken auf einer separaten Seite als Originalbild geöffnet wird.
Servus!
Hallo,
Ich möchte das Bild als
ablegen, welches dann durch anklicken auf einer separaten Seite als Originalbild geöffnet wird.
Schau mal hier:
JavaScript/Tutorials/DOM/DOM-Manipulation#HTML-Markup
Du hast nen Link. Anstelle eines Linktext hast du das Bild - gib ihm mit width="100" ne kleine Ansicht.
Im href-Attribut steht die URL des großen Bilds.
Um das folgende Javascript brauchst du dich nich kümmern.
Herzliche Grüße
Matthias Scharwies
Hallo Matthias,
Vielen Dank für die Hilfestellung. Ich habe mein Glück versucht, komme jedoch nicht weiter. Irgendetwas mache ich falsch, das Bild wird nicht kleiner dargestellt. Wie gesagt, ich möchte das Bild verkleinert darstellen und mit einem Klick darauf vergrössern können. Hier das Beispiel-Bild: https://img.bildhost.com/file/bildhostcom/2022/05/10/Augsburg_die-Bombenacht-1944.jpg Da ich ein absoluter Laie auf diesem Gebiet bin und die «Befehle» nicht kenne, bitte ich Dich mir die entsprechende, komplette «Formel» mitzuteilen.
Herzliche Grüsse
Peter
Servus!
Hallo,
Ich möchte das Bild als
Schau mal hier:
JavaScript/Tutorials/DOM/DOM-Manipulation#HTML-Markup
Du hast nen Link. Anstelle eines Linktext hast du das Bild - gib ihm mit
width="100"ne kleine Ansicht.Im href-Attribut steht die URL des großen Bilds.
Um das folgende Javascript brauchst du dich nich kümmern.
Herzliche Grüße
Matthias Scharwies
Hallo Peter,
bildhost.com ist sehr fragwürdig.
Die fehlenden Pflichtangaben sind ein hohes juristisches Risiko für den Betreiber. Die Seite ist öffentlich, für jedermann nutzbar, ich bezweifle, dass es da einen "Liebhaber-Rabatt" für die Betreiberpflichten gibt. Was für eine Seite ist das?! Ich unterstelle die Schuldvermutung: "Ist das Produkt kostenlos, ist der Kunde das Produkt", sprich: Tracking ohne Ende, um durch Datenverkauf Gewinn zu machen.
Das Bild selbst ist knapp 50KB groß (brrr, alles Krümel hier!) und damit als Thumbnail tolerierbar. Aber ich hab Dir schonmal gesagt: herunterskalierte Vollbilder sind als Thumbnail nicht zu empfehlen.
Dass HTML keine Befehle kennt, wusste 2006 schon Orlando…
Im Übrigen hast Du mit dem Link zum Wiki-Artikel das nötige Handwerkszeug bekommen. Wenn es bei Dir nicht funktioniert, dann zeig doch bitte mal deinen Arbeitsstand her, in Form eines Links auf diese Seite. Wenn die nicht öffentlich ist, dann bitte das relevante HTML und CSS. Ansonsten können wir Dir nicht sagen, was Du falsch machst. Ein kopierfertiges HTML Snippet kannst Du nicht erwarten, dazu müsste man halt deine Seite kennen.
Rolf
Hallo Rolf,
Danke für die Antwort. Vor langer Zeit konnte ich diese Darstellung in HTML einfügen und damit das Problem lösen.
Gunnar Bittersmann<a href= "https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg " target="_blank">
<img src="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg "border="0" width="120" height="200">
</a>
Damit funktioniert es nicht mehr, vermutlich existieren mittlerweile andere „Befehle“ (sorry, mir kommt keine andere Benennung in den Sinn = Anfänger). Allerdings noch mit „bildhost.com“, jetzt werde ich auf „Bilderhoster“ wechseln.
Peter
Edit Rolf B: HTML mit ~~~html und ~~~ markiert.
Hallo Peter,
nein, die relevanten HTML Elemente (das ist das Wort, das Du statt "Befehle" suchst) sind immer noch die gleichen.
Was unbedingt noch rein muss, ist ein alt-Attribut zum img-Element. Nicht wegen der Größe, sondern für die Zugänglichkeit der Seite. Selfwiki:Bilder im Internet
Und eigentlich sollten die width- und height-Attribute wirken.
Das tun sie höchstens dann nicht, wenn Du noch andere Einflussgrößen hast, wie z.B. ein Stylesheet (CSS), das die Breite und Höhe von Bildern beeinflusst. Sowas findest Du mit den Entwicklerwerkzeugen deines Browsers heraus (dem Elemente-Inspektor).
Deswegen sollst Du ja den Link zu Seite herzeigen.
Das "verschobene" Anführungszeichen vom src-Attribut (da steht ein Space davor statt dahinter) ist ein Kopierfehler ins Forum? Oder ist das tatsächlich so bei Dir? Es sollte eigentlich nichts ausmachen, aber solche Kleinigkeiten können gelegentlich Seltsamkeiten auslösen.
Rolf
Hallo Rolf,
Das ist für mich schon höhere Schule. Hier der Link zur entsprechenden Seite, mehr weiss ich auch nicht:
eBay-Artikel-Nr.:203946211116 (https://www.ebay.de/itm/203946211116) und https://www.ebay.de/lstng?draftId=3392231712701&mode=ReviseItem
Peter
Peter> Hallo Rolf,
Das ist für mich schon höhere Schule. Hier der Link zur entsprechenden Seite, mehr weiss ich auch nicht:
eBay-Artikel-Nr.:203946211116 (https://www.ebay.de/itm/203946211116) und https://www.ebay.de/lstng?draftId=3392231712701&mode=ReviseItem
Peter
Hallo Rolf,
Wie ich anhand der weiteren Kommentare sehen kann, wird "mein" Thema nun auf einem anderen Level diskutiert. Da ich so nicht weiterkomme und mir zusätzlich offensichtlich auch die entsprechenden Grundkenntnisse fehlen, möchte ich mich aus der Diskussion verabschieden. Ich werde weiterhin meine Bilder in Originalgrösse verwenden.
Danke nochmals an alle Diskussionsteilnehmer für die Bemühungen und Geduld.
Beste Grüsse und schöne Festtage
Peter
Hallo Peter,
ich bin auf Reisen und ohne meinen Werkzeugkasten, darum kann ich nicht schauen warum es nicht geht.
Ich vermute aber Einflüsse des ebay Stylesheets.
Letztlich hilft nur: lesen lesen lesen lernen lernen lernen. Haben wir hier auch alle getan. Unsere „Weisheit“ ist nicht vom Himmel gefallen.
Rolf
Hallo,
Unsere „Weisheit“ ist nicht vom Himmel gefallen.
und wir haben sie auch nicht mit Löffeln verabreicht bekommen.
Einen schönen Tag noch
Martin
Hallo Peter,
ich bin auf Reisen und ohne meinen Werkzeugkasten, darum kann ich nicht schauen warum es nicht geht.
Ich vermute aber Einflüsse des ebay Stylesheets.
Letztlich hilft nur: lesen lesen lesen lernen lernen lernen. Haben wir hier auch alle getan. Unsere „Weisheit“ ist nicht vom Himmel gefallen.
Rolf
Hallo Rolf,
Ich habe es mit diesem HTML-Element versucht.
<a href="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg" target="_blank" >
<img src="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg" height="200" width="150" alt="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg" border="1" align="center">
</a>
Es hat geklappt, allerdings muss ich zum vergrössern auf das verkleinerte Bild mit der rechten Maustaste klicken und dann auf den Befehl "Bild im neuen Tab öffnen". Das Originalbild wird dann separat geöffnet.
Für mich ist das Problem damit gelöst.
Danke und Gruss
Peter
@@Peter
Für mich ist das Problem damit gelöst.
Ähm nein, du hast gar nichts gelöst.
<a href="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg" target="_blank" > <img src="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg" height="200" width="150" alt="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg" border="1" align="center"> </a>
Dass es völlig sinnfrei ist, für Thumbnail und für die große Darstellung dieselbe Bilddatei zu verwenden, hat dir @Rolf B wiederholt gesagt. Und was tust du? Verwendest für Thumbnail und für die große Darstellung dieselbe Bilddatei‽ 🤡
Welche übrigens weder für Thumbnail noch für die große Darstellung taugt. Fürs Thumbnail ist sie mit 50 kB zu groß; das sollten maximal 20 kB sein. Für die große Darstellung ist das Bild viel zu unscharf.
Du musst zwei Bilddateien erstellen.[1] Dabei kann es sich anbieten, Höhe und Breite doppelt so groß zu machen wie das Bild dargestellt werden soll, aber hohe Kompression zu wählen. (Der hier oft verlinkte Artikel „Retina Revolution“ scheint depubliziert worden zu sein, ich finde nur noch dieses Follow-up auf niederländisch.)
Es hat geklappt, allerdings muss ich zum vergrössern auf das verkleinerte Bild mit der rechten Maustaste klicken und dann auf den Befehl "Bild im neuen Tab öffnen". Das Originalbild wird dann separat geöffnet.
Ähm nein, da muss man nicht mit rechter Maustaste und Kontextmenü ran. Das funktioniert mit der Verlinkung, siehe Lightbox, fallback with no JavaScript.
Mit JavaScript kann man da progressive enhancement machen: anstatt auf eine neue Seite zu wechseln öffnet die große Darstellung in einem modalen Fenster (dialog-Element) auf der bestehenden Seite.
Per JavaScript wird das Linkziel als src des Bildes im modalen Fenster gesetzt. (Was mit data-src auf einen anderen Wert gesetzt werden kann. Ebenfalls möglich: data-srcset für responsive images.) Lightbox, showModal()
Ein Gimmick ist das Thumbnail als Hintergrundbild. Kostet ja nix, das wurde ja bereits übertragen. Und für die kurze Zeit, in der das Bild für die große Darstellung geladen wird, ist ein unscharfes Bild besser als gar kein Bild.
🖖 Живіть довго і процвітайте
Ich hab das in meinen Beispielen deutlich gemacht, indem ich nicht das gleiche Bild in zwei verschiedenen Größen, sondern verschiedene Bilder für Thumbnail und für die große Darstellung verwendet habe. ↩︎
@@Peter
Für mich ist das Problem damit gelöst.
Ähm nein, du hast gar nichts gelöst.
<a href="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg" target="_blank" > <img src="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg" height="200" width="150" alt="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg" border="1" align="center"> </a>Dass es völlig sinnfrei ist, für Thumbnail und für die große Darstellung dieselbe Dilddatei zu verwenden, hat dir @Rolf B wiederholt gesagt. Und was tust du? Verwendest für Thumbnail und für die große Darstellung dieselbe Dilddatei‽ 🤡
Welche übrigens weder für Thumbnail noch für die große Darstellung taugt. Fürs Thumbnail ist sie mit 50 kB zu groß; das sollten maximal 20 kB sein. Für die große Darstellung ist das Bild viel zu unscharf.
Du musst zwei Bilddateien erstellen.[1] Dabei kann es sich anbieten, Höhe und Breite doppelt so groß zu machen wie das Bild dargestellt werden soll, aber hohe Kompression zu wählen. (Der hier oft verlinkte Artikel „Retina Revolution“ scheint depubliziert worden zu sein, ich finde nur noch dieses Follow-up auf niederländisch.)
Es hat geklappt, allerdings muss ich zum vergrössern auf das verkleinerte Bild mit der rechten Maustaste klicken und dann auf den Befehl "Bild im neuen Tab öffnen". Das Originalbild wird dann separat geöffnet.
Ähm nein, da muss man nicht mit rechter Maustaste und Kontextmenü ran. Das funktioniert mit der Verlinkung, siehe Lightbox, fallback with no JavaScript.
Mit JavaScript kann man da progressive enhancement machen: anstatt auf eine neue Seite zu wechseln öffnet die große Darstellung in einem modalen Fenster (
dialog-Element) auf der bestehenden Seite.Per JavaScript wird das Linkziel als
srcdes Bildes im modalen Fenster gesetzt. (Was mitdata-srcauf einen anderen Wert gesetzt werden kann. Ebenfalls möglich:data-srcsetfür responsive images.) Lightbox, showModal()Ein Gimmick ist das Thumbnail als Hintergrundbild. Kostet ja nix, das wurde ja bereits übertragen. Und für die kurze Zeit, in der das Bild für die große Darstellung geladen wird, ist ein unscharfes Bild besser als gar kein Bild.
🖖 Живіть довго і процвітайте
Für mich ist dennoch das Problem gelöst: Das Thumbnail sieht sauber und klar aus und auch die Vergrösserung aufs Originalbild auf einer separaten Seite ist klar und deutlich abgebildet. Also für mich alles ok.
Ich hab das in meinen Beispielen deutlich gemacht, indem ich nicht das gleiche Bild in zwei verschiedenen Größen, sondern verschiedene Bilder für Thumbnail und für die große Darstellung verwendet habe. ↩︎
@@Peter
Für mich ist dennoch das Problem gelöst:
Der Wurm muss dem Fisch schmecken, nicht dem Angler.
Das Thumbnail sieht sauber und klar aus
Wenn du deine Seite schon öfter aufgerufen hast, ist das Bild in deinem Browsercache und wird sofort angezeigt. Anders bei Nutzern, die zum ersten Mal auf deine Seite kommen: da muss die Bilddatei erst übertragen werden. Und je kleiner die ist, desto schneller wird sie übertragen und das Bild dargestellt. Deshalb muss das Thumbnail so klein wie möglich sein.
und auch die Vergrösserung aufs Originalbild auf einer separaten Seite ist klar und deutlich abgebildet.
Hast du noch einen alten Röhrenmonitor? Auf hochauflösenden Displays sieht’s unscharf aus.
Also für mich alles ok.
Sagte ich schon, dass der Wurm dem Fisch schmecken muss, nicht dem Angler?
🖖 Живіть довго і процвітайте
@@Gunnar Bittersmann
Ein Gimmick ist das Thumbnail als Hintergrundbild. Kostet ja nix, das wurde ja bereits übertragen. Und für die kurze Zeit, in der das Bild für die große Darstellung geladen wird, ist ein unscharfes Bild besser als gar kein Bild.
Funktioniert so nicht. Genauer gesagt: Funktioniert nur beim ersten Öffnen der Lightbox.
Ab dem zweiten Mal steht ja schon der URL des zuvor angezeigten Bildes im src-Attribut[1] und das falsche Bild wird blitzt kurz auf, bevor das anzuzeigende Bild geladen ist. Man müsste also src erst nullen.
Aber wenn man da sowieso ran muss, kann man auch gleich das Vorschaubild dort eintragen anstatt dieses als Hintergrundbild zu setzen. In meinem Codepen sieht’s jetzt so aus:
// show enlarged preview image while big image is being loaded
lightboxImage.src = lightboxThumbnail.src;
requestAnimationFrame(() => {
lightboxImage.src = lightboxThumbnail.dataset.src ?? lightboxLink.href;
});
🖖 Живіть довго і процвітайте
Genauer gesagt: in der src-Eigenschaft des Elementobjekts ↩︎
Aber wenn man da sowieso ran muss, kann man auch gleich das Vorschaubild dort eintragen anstatt dieses als Hintergrundbild zu setzen. In meinem Codepen sieht’s jetzt so aus:
// show enlarged preview image while big image is being loaded lightboxImage.src = lightboxThumbnail.src; requestAnimationFrame(() => { lightboxImage.src = lightboxThumbnail.dataset.src ?? lightboxLink.href; });
Warum an der Stelle requestAnimationFrame, wenn man doch zunächst einen Ladevorgang initiiert?
@@Mitleser 2.0
// show enlarged preview image while big image is being loaded lightboxImage.src = lightboxThumbnail.src; requestAnimationFrame(() => { lightboxImage.src = lightboxThumbnail.dataset.src ?? lightboxLink.href; });Warum an der Stelle requestAnimationFrame, wenn man doch zunächst einen Ladevorgang initiiert?
Man muss dem Browser die Zeit geben, das Vorschaubild aus dem Cache in der Lightbox anzuzeigen, bevor man src wieder ändert.
Ohne das würde der Browser gleich das neue Bild anfragen und, solange das nicht geladen ist, kein Bild bzw. das vorige Bild anzeigen.
🖖 Живіть довго і процвітайте
Warum an der Stelle requestAnimationFrame, wenn man doch zunächst einen Ladevorgang initiiert?
Man muss dem Browser die Zeit geben, das Vorschaubild aus dem Cache in der Lightbox anzuzeigen, bevor man
srcwieder ändert.Ohne das würde der Browser gleich das neue Bild anfragen und, solange das nicht geladen ist, kein Bild bzw. das vorige Bild anzeigen.
Ist das wirklich so? Theoretisch kann ich mir diese Race Condition nur vorstellen, wenn das Zielbild bereits im Browser-Cache liegt. Aber selbst dann hätte ich Zweifel. Die Änderung des SRC dürfte dann dennoch asynchron laufen, also mindestens einen Zyklus dauern. Ob mehr oder weniger als ein "AnimationFrame" weiß ich nicht.
Wenn ich das in Deinem Fiddle zumindest rausnehme, bemerke ich keinen Unterschied?
@@Mitleser 2.0
Wenn ich das in Deinem Fiddle
Fiddle??
zumindest rausnehme, bemerke ich keinen Unterschied?
Ich hab mal einen Fork ohne requestAnimationFrame erstellt. Im Firefox sehe ich genau das von mir beschriebene unerwünschte Verhalten. Chrome scheint etwas anders zu ticken.
Daran, für diesen Test den Browsercache auszuschalten, hast du aber gedacht?
🖖 Живіть довго і процвітайте
Ich hab mal einen Fork ohne
requestAnimationFrameerstellt. Im Firefox sehe ich genau das von mir beschriebene unerwünschte Verhalten. Chrome scheint etwas anders zu ticken.
Hmm... ich kann hier keinen Unterschied erkennen, was auch meiner Erwartungshaltung entspricht. Aber das muss nix bedeuten. An solchen Stellen habe ich schon oft viel mystische Magie seitens der Browserimplementationen beobachtet.
Wirklich schlüssig scheint es mir dennoch nicht.
Schlüssig wäre IMHO: auf das load-event des images warten und dann erst switchen. Bauchgefühl: mit dem requestAnimationFrame emulierst Du den Effekt ohne Load-Handler, den Du in Deinem Setup beobachten kannst.
Daran, für diesen Test den Browsercache auszuschalten, hast du aber gedacht?
Ja, klar. Mit und ohne :-)
@@Mitleser 2.0
Ich hab mal einen Fork ohne
requestAnimationFrameerstellt. Im Firefox sehe ich genau das von mir beschriebene unerwünschte Verhalten. Chrome scheint etwas anders zu ticken.Hmm... ich kann hier keinen Unterschied erkennen
Ich hab mal gefilmt: im Firefox erst auf das rechte Thumbnail 😝 geclickt, dann auf das linke 🤠.
ohne requestAnimationFrame blitzt beim Click auf das 2. Thumbnail 🤠 das vorige große Bild 😝 auf, bevor das neue große Bild 🤠 geladen wird. Meh.
mit requestAnimationFrame blitzt beim Click auf das 2. Thumbnail 🤠 ebendieses 🤠 groß auf, bevor das neue große Bild 🤠 geladen wird. So soll es sein.
(Wie gesagt dienen die verschiedenen Bilder hier zur Veranschaulichung. Bei der wirklichen Anwendung werden das Thumbnail und das große Bild dasselbe Bild in verschiedenen Auflösungen sein.)
🖖 Живіть довго і процвітайте
@@Gunnar Bittersmann
Bei der wirklichen Anwendung werden das Thumbnail und das große Bild dasselbe Bild in verschiedenen Auflösungen sein.
… ansonsten macht es keinen Sinn, dass Thumbnail als Platzhalter groß darzustellen, bis das richtige Bild geladen ist.
Aber werden Thumbnail und das große Bild wirklich dasselbe Bild sein?
Sinnvoller als die verkleinerte Darstellung ist als Thumbnail womöglich, einen markanten Ausschnitt des Bildes zu wählen und diesen dann nicht so stark zu verkleinern. Dann können auch alle Thumbnails in einer Galerie dieselbe Höhe und Breite haben – unabhängig von den Seitenverhältnissen der großen Bilder. Die Idee des Platzhalterbilds zur Verbesserung der percieved performance wäre damit hinfällig.
🖖 Живіть довго і процвітайте
Hallo Mitleser,
Die Änderung des SRC dürfte dann dennoch asynchron laufen, also mindestens einen Zyklus dauern.
Das wird sie definitiv tun. Und ich nehme an, das wird während der Layoutphase ausgelöst, also nachdem das aktuelle JavaScript beendet wurde.
Meines Wissens ist JavaScript so im Browser integriert, dass die Konsequenzen von asynchronen Verarbeitungen sich erst auswirken, wenn der laufende Makrotask der Eventqueue beendet ist.
Die HTML Spec ist wie üblich over-wordy dazu, aber die Kurzfassung ist: Die Event Loop verarbeitet einen Makrotask, dann die offenen Mikrotasks, dann kommt das Rendering und während des Renderings wird der Animation Frame Callback ausgeführt. Was bedeutet, dass dieser Callback eine Telefonzelle aus alten Zeiten ist:
Rolf
Hallo Rolf,
Das "verschobene" Anführungszeichen vom src-Attribut (da steht ein Space davor statt dahinter) ist ein Kopierfehler ins Forum? Oder ist das tatsächlich so bei Dir? Es sollte eigentlich nichts ausmachen
doch, sollte es. So ist nämlich ein abschließendes Leerzeichen Bestandteil des Ressourcennamens. Da würde also jemand 3wyf1ww1.jpg%20 anfordern.
Einen schönen Tag noch
Martin
@@Der Martin
Das "verschobene" Anführungszeichen vom src-Attribut (da steht ein Space davor statt dahinter) ist ein Kopierfehler ins Forum? Oder ist das tatsächlich so bei Dir? Es sollte eigentlich nichts ausmachen
doch, sollte es.
Weil?
So ist nämlich ein abschließendes Leerzeichen Bestandteil des Ressourcennamens.
Sagt wer?
Egal, wer das sagt. Relevant ist, was die HTML-Spec sagt. Wir können mal zusammen reinschauen. Click.
Es geht um ein Attribut des a-Elements. Elements. Click.
Das a-Element versteckt sich unter 4.5 Text-level semantics. Click.
Wir suchen nach dem href-Attribut. Click.
“The href attribute on a and area elements must have a value that is a valid URL potentially surrounded by spaces.”
Also nein:
Da würde also jemand 3wyf1ww1.jpg%20 anfordern.
Nix mit %20 am Ende.
Das fehlende Leerzeichen zwischen " und nächstem Attribut ist tatsächlich ein Fehler. Sagt die Spec in §13.1.2.3 Attributes:
“If an attribute using the double-quoted attribute syntax is to be followed by another attribute, then there must be ASCII whitespace separating the two.” (Dasselbe auch für single-quoted.)
Ein Fehler, den Browser stillschweigend tolerieren. Desöfteren schon in der CSSBattle ausgenutzt. Siehe bspw. Target #111 unter Top Solutions.
🖖 Живіть довго і процвітайте
@@Gunnar Bittersmann
Ein Fehler, den Browser stillschweigend tolerieren. Desöfteren schon in der CSSBattle ausgenutzt. Siehe bspw. Target #111 unter Top Solutions.
⬤ ◆<body bgcolor=F3AC3C style="text-shadow:0 148q,-84q 74q,0-267q,0-162q,-62q -214q;font:142q/1'"text=25434>
Da sind noch andere Optimierungen zu erkennen. V.h.n.v:
text=25434<body>-Tag mit bgcolor- und text-Attributen kürzer als background und color per CSS, insb. wenn wie hier durch einen nur 5stelligen RGB-Wert noch ein Zeichen gespart werden kann. Nicht nur # vorne, auch Nullen am Ende können weggelassen werden, 25434 ist dasselbe wie #254340. Die Vorgabe war #254241. Damit die Abweichung mit einem um 1 verminderten Blau-Wert immer noch 100%ig matcht, ist in diesem Fall der Grün-Wert um 1 zu erhöhen.font:142q/1'q (¼ mm) ist oft ein Zeichen kürzer als in einer anderen Einheit wie px.style-Element oder -Attribut können schließende Klammern oder Anführungszeichen weggelassen werden. '' ist ein gültiger Font-Bezeichner; Leerzeichen zwischen diesem und
line height ist nicht erforderlich.text-shadow:0 148q,-84q 74q,0-267q,0-162q,-62q -214q0 ist keine Einheit nötig; zwischen 0 und - auch kein Leerzeichen. Zwischen q und - leider doch. Ansonsten könnten die anderen Leerzeichen durch + ersetzt werden und wenn der Wert des style-Attributs dann keine Leerzeichen mehr enthielte, könnten die Anführungszeichen darum entfallen.Dass die Vorschau anders aussieht als die Vorlage, liegt daran, dass in dem Headless-Browser auf dem Server, der die Bewertung vornimmt, andere Fonts installiert sind als auf unseren Systemen. Da braucht man ein anderes Vorschau-Tool.
Und für produktive Webseiten git natürlich: All das oben Genannte nicht machen, Kinder!
🖖 Живіть довго і процвітайте
Selbst testen
<a href= "https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg " target="_blank">
<img src="https://www.bilderhoster.net/users/usr/3wyf1ww1.jpg "border="0" width="120" height="200">
</a>
Selbst anklicken:
https://home.fastix.org/Tests/space-in-uri.html
Das von Rolf aus der Spec zitierte
“The href attribute on a and area elements must have a value that is a valid URL potentially surrounded by spaces.”
sagt (auch mir) nichts darüber, was ein Browser wohl daraus macht: Immerhin sind Spaces (an jeder Stelle!) gültige Zeichen in Dateinamen (Linux):
/tmp$ touch "spaceAm Ende "
ll
-rw-rw-r-- 1 user group 0 Dez 18 09:48 'spaceAm Ende '
Ich hätte das selbe Ergebnis wie Martin vermutet („Da würde also jemand 3wyf1ww1.jpg%20 anfordern.“) - aber zumindest Chromium zeigt nicht dieses Verhalten.
Also: Vor mutigen Aussagen immer testen...
Ich hab den Quelltext dennoch als „bad“ markiert, weil $andereSoftware auf den Fehler im HTML mehr „wahrscheinlich“ als „womöglich“ anders reagiert. Die Software (kann auch ein anderer Browser sein) könnte ja auch meckern statt spekulierend zu reparieren: Das ist es, was die Spec (einem Ganzgenauheimer wie mir) sagt, wenn diese eine „valide URL“ fordert - und das Ergebnis von solchen Reparaturversuchen vorhersagen zu wollen ist stets „mutig“: Vorliegend käme
in Frage. Aber wenigstens wissen wir jetzt, warum die Browser so fett sind (300MB und mehr) wie früher ein ganzes Windows NT. Da dürften zahlreiche Regeln für spekulative Reparaturen etlichen Speicherbedarf haben.
Moin,
Aber wenigstens wissen wir jetzt, warum die Browser so fett sind (300MB und mehr) wie früher ein ganzes Windows NT.
aus meinen Experimenten Ende der 90er, Anfang der 2000er Jahre weiß ich noch: Ein Windows 98 belegte bei einer Minimalinstallation (wie vom Installer angeboten) nur rund 50MB.
Da dürften zahlreiche Regeln für spekulative Reparaturen etlichen Speicherbedarf haben.
Möglich; ich denke, dass da auch die Entwicklertools einen erheblichen Anteil haben.
Einen schönen Tag noch
Martin
Hallo Raketenwilli,
Das von Rolf aus der Spec zitierte...
Ich bin doch gar kein Berliner. Aber ein Buchstabe von 6 richtig ist schon gar nicht schlecht 😉
Rolf
Hallo Peter,
je nach Bildgröße ist es nicht sinnvoll, das Original zum Thumbnail herunterzuskalieren. Bei einem gut gepressten 50KB JPEG-Pfannkuchen mag es vertretbar sein, aber wenn das Original ein 4MB Foto ist (was für's Web ebenfalls schon schmerzhaft ist) und Du davon 10 Bilder als Thumbnail auf eine Seite packst, dann bekommt ein Nichtflatrate-Surfer auf seinem NichtLTE Handy zuerst wegen der Wartezeit einen Schreikrampf und danach noch einen, wenn er sein Datenvolumen entdeckt. Bzw. nicht mehr entdeckt.
Nimm Dir die Zeit und erzeuge für deine Bilder echte Thumbnails. Versuche, die Originale als JPEG in einer sinnvollen Auflösung zu speichern. Lektüre im Self-Wiki.
Rolf