QR-Code-Design anpassen: Form, Farben, Farbverlauf und Ecken

Einführung

Ein QR-Code auf einem Plakat oder einer Intranetseite ist Teil der Gestaltung, und ein schwarz-weißes Quadrat passt selten dazu. Mit QR Code Generator ändern Sie die Form der Punkte, die Farben und die Eckmarkierungen des Codes. Die Einstellungen befinden sich in den reduzierbaren Abschnitten unter den Datenregisterkarten, und jede Änderung ist sofort in der Vorschau zu sehen. Dieser Artikel beschreibt die Abschnitte Form, Farben, Corner Square, Corner Dots und Error Correction und nennt die Regeln, mit denen ein gestalteter Code lesbar bleibt.

Beim Öffnen des Webparts sind alle Abschnitte reduziert. Klicken Sie auf den Namen eines Abschnitts, um ihn zu erweitern.

Standarddesign

Ein neues Webpart startet mit folgendem Design:

Form

Der Abschnitt Form legt den Stil der kleinen Punkte fest, die die Daten tragen. Die sechs Stile werden als Bilder angezeigt, und ein Klick auf ein Bild wählt den Stil aus:

• einzelne runde Punkte;
• abgerundet – benachbarte Punkte verschmelzen zu Linien mit abgerundeten Enden;
• elegant – Punkte mit zwei abgeschnittenen Ecken;
• elegant abgerundet – dasselbe mit weicheren Ecken;
• quadratisch – das klassische Aussehen eines QR-Codes;
• extra abgerundet – Linien mit stark abgerundeten Enden.

Die Form ändert nur das Aussehen des Codes. Die codierten Daten und die Anzahl der Punkte bleiben gleich.

Farben

Der Abschnitt Farben enthält zwei Farbauswahlen:

• Farbe – die Farbe der Punkte;
• Hintergrundfarbe – die Farbe der Fläche hinter dem Code.

Jede Farbauswahl hat ein Farbfeld, einen Schieberegler für den Farbton und einen für die Transparenz und darunter die Felder Hex, Rot, Grün, Blau und Transparenz für exakte Werte. Um eine Unternehmensfarbe zu verwenden, fügen Sie ihren Code in das Feld Hex ein.

Steht die Transparenz der Hintergrundfarbe auf 100, hat der Code keinen Hintergrund und nimmt die Farbe dessen an, was darunter liegt: des Seitenabschnitts, einer Folie, eines gedruckten Blatts.

Farbverlauf

Aktivieren Sie das Kontrollkästchen Gradient, um die Punkte statt mit einer einzelnen Farbe mit einem Übergang zwischen zwei Farben zu füllen. Es erscheinen zwei weitere Einstellungen:

• die Art des Farbverlaufs – Linear, vom linken Rand des Codes zum rechten, oder Radial, von der Mitte zu den Rändern;
• Second Color – die Farbe, in der der Farbverlauf endet. Der Farbverlauf beginnt mit der unter Farbe festgelegten Farbe.

Der Farbverlauf gilt nur für die Punkte. Die Eckquadrate und die Eckpunkte behalten ihre eigenen Farben.

Corner Square und Corner Dots

In drei Ecken jedes QR-Codes sitzen die Positionsmarkierungen, anhand derer ein Scanner den Code findet und seine Ausrichtung bestimmt. Eine Markierung besteht aus einem äußeren Rahmen und einem inneren Punkt, und für beide gibt es einen eigenen Abschnitt.

Corner Square – der äußere Rahmen:

• Typ – Kreis, Quadrat oder Abgerundetes Rechteck;
• Farbe – die Farbe des Rahmens.

Corner Dots – der innere Punkt:

• Typ – Punkt oder Quadrat;
• Farbe – die Farbe des Punkts.

Error Correction

Ein QR-Code enthält redundante Daten, dank derer ein Scanner ihn auch dann lesen kann, wenn ein Teil des Codes verschmutzt, beschädigt oder verdeckt ist. Der Abschnitt Error Correction legt fest, wie viel Redundanz hinzugefügt wird.

Eine höhere Stufe macht den Code robuster und bei gleichen Daten dichter: Er braucht mehr Punkte, und jeder Punkt wird kleiner.

Den Code lesbar halten

Ein Scanner braucht Kontrast und klare Markierungen dringender als Schönheit. Einige Regeln bewahren einen gestalteten Code vor dem Versagen:

• Dunkel auf Hell. Die Punkte müssen deutlich dunkler sein als der Hintergrund. Einen hellen Code auf dunklem Hintergrund liest nicht jeder Scanner.
• Achten Sie auf den transparenten Hintergrund. Ein Code mit transparentem Hintergrund übernimmt den Hintergrund des Ortes, an dem er verwendet wird. Ein blauer Code, der auf einer weißen Seite lesbar ist, verschwindet auf einem dunklen Abschnitt oder einer dunklen Folie. Wenn Sie nicht wissen, wo der Code verwendet wird, legen Sie eine deckende helle Hintergrundfarbe fest.
• Machen Sie die Punkte nicht transparent. Der Transparenzregler von Farbe verringert den Kontrast genauso wie eine blasse Farbe.
• Prüfen Sie beide Enden eines Farbverlaufs. Sowohl Farbe als auch Second Color müssen sich vom Hintergrund abheben; ein Farbverlauf, der in einen hellen Ton ausläuft, macht einen Teil des Codes unlesbar.
• Halten Sie die Markierungen deutlich. Die Eckmarkierungen müssen sich mindestens so gut vom Hintergrund abheben wie die Punkte.
• Lassen Sie einen Rand. Wenn Sie den Code in ein Layout einsetzen, lassen Sie rundherum eine leere Fläche von etwa vier Punkten Breite.

Zusammenfassung

Die Designabschnitte von QR Code Generator ändern die Form der Punkte, die Farben, den Farbverlauf und die Eckmarkierungen, während die Stufe unter Error Correction die Robustheitsreserve festlegt. Das Design wird zusammen mit den Daten mit der Seite gespeichert, sodass ein einmal gestalteter Code sein Aussehen für jeden Besucher behält.