@charak
terziffer

Manches braucht mehr als 140 Zeichen …

Auf dieser Website ist Platz für das, wofür mein Twitterprofil @charakterziffer nicht ausreicht. Mein Blog ist als Plus zu meinen Tweets gedacht, eben „@cz+“. // Die letzten drei Artikel:

Mit Spenden werben

Ein Bekannter hat mich gestern in einer Kurznachricht gebeten, seinen Verein zu unterstützen, die AIDS-Hilfe Wuppertal. Eine große Bank macht noch bis 7. November eine bundesweite Aktion, bei der sie tausend Vereinen jeweils 1000 € spendet. Es gibt je nach Vereinsgröße fünf Kategorien, in denen jeweils die 200 Höchstplatzierten die Spende erhalten. Alles, was der Verein tun muss ist, sich zu registrieren und Stimmen für sich zu sammeln.

Ich bin nicht ganz sicher, was ich von der Aktion halten soll. Natürlich, wer könnte etwas dagegen haben, dass Vereine mit einer Geldspende unterstützt werden? Andererseits ist das auch eine sehr offensichtliche Werbeaktion für die Bank. Sie spart sich, eine vergleichbare oder deutlich höhere Summe in eine bundesweite Kampagne zu stecken – und entlohnt somit keine Fotografen, Mediendesigner, Werbetexter und andere Kreativberufe (hab ich erwähnt, dass ich in der Medienbranche arbeite?).

Mehrere Tausend werben für die Bank

Stattdessen lässt die Bank die Vereine (zum überwiegenden Teil) kostenlos für sich arbeiten. Die Engagierten im Verein schreiben Freunde und Bekannte per Mail oder über Social Media an, weisen auf die Aktion hin, bitten um Stimmen und machen dabei auch immer Werbung für die Aktion, die der Bank das positive Image eines sozialen Wohltäters beschert (gerechtfertigt oder auch nicht).

Praktisch entsteht dabei unter den Vereinen eine Konkurrenz um Aufmerksamkeit, was ich für sehr kontraproduktiv halte. Statt gegeneinander zu agieren, sollten sich Vereine vernetzen und sehen, wie sie sich gegenseitig unterstützen können. Eine Aktion, die das fördert, wäre wirklich hilfreich.

Zum dritten werden mit höherer Wahrscheinlichkeit diejenigen Vereine „eine Spende gewinnen“, die sowieso schon eine breite Unterstützerbasis haben. Es zählt die Popularität. Hoffentlich sind das dann auch die Vereine, die wirklich gesellschaftliche Relevanz besitzen und mit dem Geld die beste positive Wirkung für unser Zusammenleben erreichen können. Im Augenblick liegen in den fünf Größen-Kategorien offensichtlich besonders Tierschutz- und Sportvereine recht weit vorne, daneben Tanz- und Musikgruppen.

Übrigens: Letztendlich habe ich meine Stimme trotzdem für den Verein meines Bekannten abgegeben. Werbung für die Bank mache ich hier aber nicht.

---
Artikel kommentieren …

Muster aus CSS-Farbverläufen

Vor fünf Monaten habe ich das Aussehen meines Blogs überarbeitet. Statt eines großflächigen Hintergrundbilds verwende ich seitdem einen grünen Randstreifen mit kristallinem Muster (nur sichtbar, wenn das Browserfenster breit genug ist). Ich brauche dafür keine Bilddatei mehr, sondern erzeuge das Muster durch Code. Es besteht aus mehreren, übereinander gelegten Farbverläufen.

Ein Farbverlauf in CSS

Mit der Auszeichnungssprache CSS kann man die HTML-Elemente einer Website gestalten. Für einen einfachen Verlauf mit drei Farben sorgt der folgende Code:

background-image: linear-gradient(90deg, #fff 5%, #e32 30%, #ccc 80%);

Erklärung: Ein ausgewähltes Element bekommt als Hintergrundbild (background-image) einen linearen Farbverlauf (linear-gradient). Dieser soll aber nicht standardmäßig von unten nach oben laufen, sondern von links nach rechts, also um 90° verdreht (90deg).

Für die ersten 5% unseres Verlaufs wählen wir die Farbe Weiß (mit verkürzter Hexadezimalschreibweise ist das #fff 5%). Das Weiß geht dann über in Rot (bei 30% des Verlaufs: #e32 30%). Ab da verblasst das Rot zu Hellgrau, was bei 80% des Farbverlaufs erreicht ist (#ccc 80%). Diese letzte Farbe behält der Verlauf bis 100%, also bis ganz nach rechts:

Beispiel 1: Farbverlauf von links nach rechts, von Weiß über Rot bis zu Grau.

Musterhafte Wiederholung

Seit 2012/2013 unterstützen moderne Browser auch CSS-Farbverläufe, die sich wiederholen. Der folgende Verlauf umfasst nur etwa ein Viertel der Bildbreite und geht von violett über rosa nach grün. Danach beginnt er wieder bei violett und wiederholt sich über die gesamte Fläche.

Beispiel 2: Ein Farbverlauf von violett über rosa nach grün, der sich danach dreimal wiederholt

Für das CSS benötigen wir nun einen repeating-linear-gradient, einen sich wiederholenden linearen Verlauf. Den Winkel habe ich mit 100deg leicht schräg gewählt. Der Code:

background-image: repeating-linear-gradient(100deg, #839, #fdb 10%, #3a1 25%);

Farbbeginn ist violett (#839, ohne Prozentangabe), bei 10% liegt ein gelbliches Rosa (#fdb 10%) und bis 25% ändert sich das zu grün (#3a1 25%). Die letzte Angabe legt auch fest, wie breit der Verlauf insgesamt ist, bevor er sich wiederholt.

In diesem Beispiel ist zwischen grün und violett eine harte Kante; man sieht, wo der Verlauf neu anfängt. Würde man bei der ersten und letzten Angabe dieselbe Farbe festlegen, bekäme man zwischen den Wiederholungen einen weichen Übergang.

Farbe in Schichten

Der Trick meines grünen Randstreifens besteht darin, Teile des Farbverlaufs transparent zu lassen, dafür aber mehrere Verläufe mit unterschiedlichen Winkeln übereinander zu legen. Hier ein Beispiel mit drei Verläufen:

Beispiel 3: Drei Farbverläufe mit unterschiedlichen Winkeln, teilweise transparent

Der oberste Verlauf geht von transparent nach #deb (hellgrün) und ist 30% breit. Darunter liegt ein Farbverlauf von transparent nach #e32 (rot) und zurück nach transparent – dadurch entsteht keine harte Kante zwischen Ende und Anfang des Verlaufs.

Ganz zuunterst und zu einem großen Teil verdeckt ist der Farbverlauf aus Beispiel 2, hier mit den Farben #fff (weiß) und #839 (violett). Der gesamte Code, ergänzt um Winkel und Prozentangaben sieht so aus:

background-image:
repeating-linear-gradient(160deg, transparent, #deb 30%),
repeating-linear-gradient(40deg, transparent, #e32 20%, transparent 23%),
repeating-linear-gradient(100deg, #fff, #839 25%);

Kombiniere!

Nun haben wir alle Zutaten für den Randstreifen zusammen. Es kommt nur noch auf die richtige Zusammenstellung und Farbgebung an. Man nehme den Verlauf aus Beispiel eins, aber mit den Farben Weiß, Hellgrün und Grün. Darüber lege man die drei Verläufe aus Beispiel 3, aber in transparent-weiß statt farbig:

Beispiel 4: Über einem weiß-grünen Farbverlauf liegen drei transparente-weiße Verläufe, die sich wiederholen.

Der Code dazu ist folgender:

background-image:
repeating-linear-gradient(160deg, transparent, #fff 30%),
repeating-linear-gradient(40deg, transparent, #fff 20%, transparent 23%),
repeating-linear-gradient(100deg, transparent, #fff 25%),
linear-gradient(90deg, #fff 5%, #deb 30%, #3a1 80%);

Für meinen Blog habe ich die Maße und Winkel der Farbverläufe angepasst, das Weiß halbtransparent gemacht (mit der HSLA-Farbangabe hsla(0,0%,100%, 0.3) statt #fff) und die Abstände des weiß-grünen Hintergrunds teilweise fest und teilweise abhängig von der Fensterbreite gesetzt. Deshalb verschwindet der Randstreifen scheinbar, wenn das Browserfenster schmaler wird (tatsächlich sieht man die weißen Verläufe auf weißem Hintergrund nicht mehr).

Erst der Anfang

Das Mozilla Developer Network bietet einen ausführlichen, deutschsprachigen Artikel über CSS-Farbverläufe, auch über radiale Verläufe. Wie unterschiedlich CSS-Muster sein können, zeigt Lea Verou in ihrer CSS3-Muster-Galerie. Hier kann man selbst im Code herumprobieren, zum Beispiel bei den einfacheren diagonalen Streifen.

---
Artikel kommentieren …

Ein gefalteter Stier

Origami-Figuren sind meistens kantig und abstrakt, dabei dennoch gut zu erkennen. Das fasziniert mich am Papierfalten, diese Reduktion auf das Wesentliche. Im folgenden zeige ich eine Anleitung für einen eher einfachen Stier (mit fortgeschrittener Gegenbruchfalte). Auf meiner Quelle für dieses Modell wird als Autor George Rohads genannt.

Übrigens: Wem die ersten vier Schritte hier zu schnell gehen, sollte sich meine vorherige Faltanleitung für einen Karpfen ansehen. Dort führen die Schritte 1 bis 7 auf einem anderen Weg zum gleichen Ergebnis. Und falls es selbst nach mehreren Versuchen nicht klappt mit dem Stier, dann ist eine schöne Papierschachtel bestimmt ein guter Trost. Los geht’s:

1. Man benötigt ein quadratisches Papier, zum Beispiel mit einer Seitenlänge von 15 cm. Die Diagonalen vorfalten. Dann zwei benachbarte Kanten zur entsprechenden Diagonalen falten, damit die Drachenform in Schritt 2 entsteht.

2. Wieder auffalten.

3. Auch die beiden anderen Kanten zur Diagonale falten und wieder entfalten.

4. Nun alle vier Papierkanten an den eben entstandenen Faltlinien zur Diagonale bringen. Die entstehenden Zacken flach zusammenfalten und nach unten legen, so dass die Form wie in Schritt 5 entsteht.

5. Die Form in der Mitte entlang der Diagonale falten, dabei den unteren Teil nach hinten umschlagen, damit die beiden Zacken außen bleiben.

6. Die äußeren Spitzen mit einer Gegenbruchfalte nach oben bringen. Dazu an den gekennzeichneten Linien zunächst gut vorfalten (siehe 6b) und wieder entfalten. Dann die Spitzen oben öffnen und die mittlere Kante umkehren und nach innen holen. Das Ergebnis für die linke Spitze ist im Schritt 6c zu sehen. Mit der rechten Spitze ebenso verfahren.

7. Die rechte Spitze mit einer Gegenbruchfalte wieder nach unten holen. Dabei an der gestrichelten Linie im Bild orientieren, das Ergebnis ist im nächsten Bild zu sehen.
Außerdem die großen Zacken in der Mitte der Figur nach unten falten (jeweils auf Vorder- und Rückseite der Figur).

8. Auch die linke Spitze wieder mit einer Gegenbruchfalte nach unten bringen.

9. Und schon wieder eine Gegenbruchfalte: Die linke Spitze erneut nach oben bringen, so dass ein schöner Stierkopf mit Horn entsteht.

10. Den Kopf an der gestrichelten Linie öffnen (also obere Papierschicht nach oben umfalten, untere nach unten). Das Horn des Stiers dabei nach vorne falten. Es ergibt sich der Nasenrücken, wie bei Schritt 11 zu sehen.

11. & 12. Schließlich die kleine Ecke unterhalb des Horns ein wenig herausfalten, so dass ein Ohr entsteht. Auf der Rückseite wiederholen.

Ich hoffe, euer „Stierkampf“ führt zu einem guten Ergebnis. Wenn am Ende etwas Erfreuliches herauskommt, kann Origami auch eine sehr entspannende, meditative Tätigkeit sein. Viel Vergnügen beim Nachfalten!

---
Artikel kommentieren …

Alle Artikel im Archiv lesen …

Sonstiges

Warum „Charakterziffer“?

Das Wort kombiniert Persönlichkeit (Charakter) mit Sachlichem (Ziffer). Zusammengesetzt ergibt sich ein Synonym für Mediävalziffer, eine Zahlenvariante mit Ober- und Unterlängen.

Schriftarten dieses Blogs

Wenn dein Browser eingebettete Schriften (WOFF/WOFF2) unterstützt, dann liest du die Fließtexte hier in der Source Sans Pro von Paul D. Hunt, erschienen 2012 bei Adobe.

Die Überschriften sind aus der czSlab gesetzt, die ich für dieses Blog gestaltet habe. Sie orientiert sich an Yanones viel ausgefeilterer Antithesis von 2014.


Impressum

Anbieterkennzeichnung nach TMG §5:

Gerhard Großmann · Geibelplatz 10 · 93051 Regensburg
E-Mail: postfach2b [ät] web.​de, SMS: 0178/1961914

Rechtliche Hinweise

§1 Die Verwendung meiner Kontaktdaten zur gewerblichen Werbung ist ausdrücklich nicht erwünscht; ich widerspreche hiermit jeder kommerziellen Verwendung und Weitergabe meiner Daten. // Private Fanpost ist allerdings sehr willkommen!

§2 Dieses Blog verlinkt auf Websites Dritter („externe Links“). Zum Zeitpunkt der erstmaligen Verlinkung waren dort keine Rechtsverstöße ersichtlich. Da ich keinen Einfluss auf fremde Websites habe, kann ich für deren Inhalte und Gestaltung keine Haftung übernehmen. Sollte ich von Rechtsverstößen erfahren, entferne ich die Verlinkung unverzüglich. Eine ständige Kontrolle der externen Links ist ohne konkrete Hinweise aber nicht zumutbar.

Website zuletzt erstellt: 2017-10-04T14:33:37+02:00