Das Skript zum Sonntag: Grafiken als Data-URL mit Base64 kodiert

[Jörg Reinholz]

Moin!

Worauf mich das Forum diese Woche brachte:

Ich fand den Satz "Data-URI-Grafiken lassen sich nur schwer ändern und anpassen." und dachte mir, "Mit einem kleinen Werkzeug geht das sicherlich einfacher."

Hier ist es: (Der selbst erzeugte Schlüssel muss akzeptiert werden)

• Zum Probieren
• Zum Download.

Jörg Reinholz

[Matthias Apsel]

Hallo Jörg Reinholz,

Cool. Die Meldung, dass das Skript 0 Millisekunden gebraucht hat, würde ich nicht beim Erstaufruf einblenden.

Ich werde es im Wiki verlinken - einverstanden?

Bis demnächst
Matthias

[Jörg Reinholz]

Moin!

Hallo Jörg Reinholz,

Cool. Die Meldung, dass das Skript 0 Millisekunden gebraucht hat, würde ich nicht beim Erstaufruf einblenden.

Ich werde es im Wiki verlinken - einverstanden?

Warte mal. Dafür gibts eine bessere Adresse.

Jörg Reinholz

[Jörg Reinholz]

So!

Warte mal. Dafür gibts eine bessere Adresse.

Jörg Reinholz

http://www.fastix.org/test/Data-URL-Generator.php

Ich musste am Content-Security-Header basteln, sonst geht die Vorschau nicht.

Jörg Reinholz

[Matthias Apsel]

Hallo Jörg Reinholz,

Warte mal. Dafür gibts eine bessere Adresse.

http://www.fastix.org/test/Data-URL-Generator.php

test klingt irgendwie so vorübergehend. ;-)

Bis demnächst
Matthias

[Jörg Reinholz]

Moin!

http://www.fastix.org/test/Data-URL-Generator.php

test klingt irgendwie so vorübergehend. ;-)

Ist sogar Absicht: Dann laden sich mehr Leser das Skript herunter und der Server wird entlastet. Außerdem habe eine Ausrede, wenn es wo wremia sa "verschlimmbessern" nicht geht :)

Jörg Reinholz

[Matthias Apsel]

Hallo Jörg Reinholz,

test klingt irgendwie so vorübergehend. ;-)

Ist sogar Absicht:

*g*

Aber wenn du magst, kannst du noch URI statt URL schreiben (Die strenge Einteilung in URL und URN ist historisch gewachsen, künftige Spezifikationen und Dokumentationen sollten den allgemeineren Begriff URI anstelle der restriktivieren Bezeichnungen URL und URN verwenden.

Bis demnächst
Matthias

[1unitedpower]

• Zum Probieren

Es ist keine gute Praxis den Submit-Button zu deaktivieren, wenn das Formular nicht korrekt ausgefüllt ist. Der Submit-Button löst nämlich die interne Formular-Validierung aus und signalisiert ggf. angeschlossener assistiver Software welche Fehler aufgetreten sind.

In deinem Beispiel könntest du dem Eignabefeld

<input id="Datei" name="Datei" type="file" size="50" accept="image/*">

einfach noch ein required-Attribut verpassen. Die JavaScript-Validierung kannst du dir dann vollständig sparen. Wenn du eigene Validierungs-Logik benötigst, dann gibt es dafür die FormValidation-API, die dafür sorgt, dass Fehler auch intern korrekt behandelt und propagiert werden.

Außerdem würde ich mir von dir wünschen, dass du in deinen Beispielen, die gewiss sehr oft von den Anfängern in diesem Forum aufgerufen werden, mit vorbildlichem, semantischem Markup vorausgehen würdest. Das würde ihren praktischen Nutzen langfristig sicher noch wirkungsvoller machen :)

[Jörg Reinholz]

Moin!

In deinem Beispiel könntest du dem Eignabefeld … einfach noch ein required-Attribut verpassen.

[v] erledigt.

Außerdem würde ich mir von dir wünschen, dass du in deinen Beispielen, die gewiss sehr oft von den Anfängern in diesem Forum aufgerufen werden, mit vorbildlichem, semantischem Markup vorausgehen würdest. Das würde ihren praktischen Nutzen langfristig sicher noch wirkungsvoller machen :)

[?] hoffentlich erledigt.

Jörg Reinholz

[1unitedpower]

Außerdem würde ich mir von dir wünschen, dass du in deinen Beispielen, die gewiss sehr oft von den Anfängern in diesem Forum aufgerufen werden, mit vorbildlichem, semantischem Markup vorausgehen würdest. Das würde ihren praktischen Nutzen langfristig sicher noch wirkungsvoller machen :)

[?] hoffentlich erledigt.

Ich wollte auf so ganz einfache Dinge hinaus, wie zum Beispiel keine <br>-Elemente zu verwenden, wenn es keine semantische Grundlage für einen Zeilenumbruch gibt. Oder solche kleinen Sünden wie <p><strong>Typ:</strong></p>, wo <fieldset><legend>Typ:</legend> so gut passen würde. Oder die korrekte Angabe der Viewportgröße über ein Meta-Tag. Solche Dinge sind ohne großen Aufwand realisierbar, aber haben guten Vorbildcharakter und wirken sich positiv auf die Neugierde der Lernenden aus.

[Jörg Reinholz]

Moin!

Ich wollte auf so ganz einfache Dinge hinaus, wie zum Beispiel keine <br>-Elemente zu verwenden, wenn es keine semantische Grundlage für einen Zeilenumbruch gibt. Oder solche kleinen Sünden wie <p><strong>Typ:</strong></p>, wo <fieldset><legend>Typ:</legend> so gut passen würde. Oder die korrekte Angabe der Viewportgröße über ein Meta-Tag. Solche Dinge sind ohne großen Aufwand realisierbar, aber haben guten Vorbildcharakter und wirken sich positiv auf die Neugierde der Lernenden aus.

[v] getan.

Jörg Reinholz

[pl]

Schön ;) Erinnert mich an meine Scripts die ich für meine Domäne i-netlab.de entwickelt habe, da war sowas auch dabei.

Auch von mir