Meine Tätigkeit umfasst:

• Konzeption und Vorbereitung: Wer soll wie oft, womit, und wie erreicht werden?
• Kalkulation: komplette Kalkulation wiederkehrender Mailingaktionen inkl. Grafik, Druck, Adressierung, Versand und ggf. Adresspflege
• Gestaltung: Ich gestalte Ihr Mailing modern, zielführend und individuell.
• Datenerstellung und Druck inkl. Weiterverarbeitung, Handling etc.
• Adressierung und Posteinlieferung — Pflege der Adressdaten, Adressoptimierung
• weitere Optionen: individuelle Landing-Pages, Bildpersonalisierte Mailings, Individualmailings, Integration von Response-Elementen, Erstellung von Online-Versionen für Webseite und vieles mehr.

Fragen Sie — ich freue mich auf Ihre Anfrage.

Monatliche Kundenpost für GVS

Die GVS Lebensmittelhandel GmbH & Co. beliefert von ihren beiden Stützpunkten Nürnberg und Weiden aus zahlreiche Gastronomiekunden in Nordbayern und angrenzenden Gebieten. Darüber hinaus bietet das SB-Warenhaus in Nürnberg auch für Privatkunden die Möglichkeit italienische und asiatische Lebensmittel und an einer eigenen Metzgerei einzukaufen. Alle registrierten Kunden erhalten zum Monatsanfang ein Mailing per Infobrief, das auf vier DIN A4-Seiten die aktuellen Angebote vorstellt.

Klicken Sie auf das Vorschaubild um in der Ausgabe Juli 2010 zu blättern

Die Agentur Lindner ist seit Juni 2010 für Neukonzeption, Bildverarbeitung, Satz, Druckvorstufe sowie die komplette Herstellung bis zur Versandeinlieferung verantwortlich.

Das jeweils aktuelle Kundenmailing kann auf der Webseite www.gvsgroup.de heruntergeladen werden.

Selbstverständlich bin ich nicht Autor des Buches, die Rechte entsprechen der Lizensierung der Wikipedia. Die immer aktuelle Version des Buches findet sich auf der Wikipediaseite Mediengestalterbuch.

Was es heutzutage alles gibt: Da hat man schneller ein 200seitiges Buch erstellt — als gelesen. Bin gespannt, was sich in „meinem“ Buch alles Interessantes findet.

Klicken Sie auf das Vorschaubild wenn Sie im Katalog blättern möchten.

Für den Kunden RHG Reha und Rollstuhl Handels GmbH in Leipzig durfte ich auch dieses Jahr wieder den Elektromobilekatalog erstellen. Ziel des 36seitigen Kataloges im DIN A5-Format ist es den Fachberatern eine Unterstützung bei der Vermittlung des umfangreichen Sortiments an Elektrofahrrädern, Elektromobilen und Elektrorollern am die Hand zu geben. Darüber hinaus sollen auch die anderen Tätigkeitsbereiche von RHG: das Sanitätshaus, der Bereich Objekteinrichtung sowie „Leben im Alter“ vorgestellt werden.
Das Logo, sowie das durchgängige Farbkonzept wurde 2008 von mir für den Kunden entwickelt und seitdem konsequent umgesetzt.

Das diesjährige Farbschema orientiert sich an dem wunderbaren Rosenrot der „Tom Wood“-Rose, die auch die Titelseite ziert.

Klicken Sie auf das Vorschaubild um sich die beiden Seiten online anzusehen.

Diese Arbeit vermittelte mir selbst in diesen verschneiten Wintertagen bereits eine Vorfreude auf den Rosensommer.

Microsoft Publisher ist eine Software, welche die meisten Grafiker und Drucker am liebsten abschaffen möchten. Nicht etwa, weil sie so gut ist, sondern weil die Daten, die damit erzeugt werden nicht zu gebrauchen sind¹.

Doch was macht man nun als „Verarbeiter“ mit pub-Datein von Kunden? Entweder man bittet den Kunden irgendwie eine PDF-Datei zu erstellen (was mitunter dazu führt, dass man erklären muss, wie das geht) oder man macht diese Pub-Datei sichtbar, indem man selbst ein PDF daraus generiert. Doch sicherlich bin ich nicht der einzige „Druckvorstufler“, der sich weigert sowas wie den Microsoft Publisher auf seinem Computer zu installieren. Erfreulicherweise ist das aber auch nicht möglich, denn es gibt eine Webseite, die Datein in pdf konvertiert — und auch Publisher-Dokumente annimmt, zumindest wenn diese nicht größer sind als 6 MB.

Die Webseite heißt conv2pdf

Alle möglichen Dateien können dorthin übertragen werden und werden dann von diesem Server in eine PDF konvertiert. Selbstverständlich verbietet es sich dorthin vertrauliche Daten zu senden! Man kann wählen, ob man die generierte PDF herunterladen oder per E-Mail versenden möchte.

Die erhaltene PDF ist natürlich NICHT für den Druck geeignet — aber zumindest erhält man hierdurch eine vage Vorstellung davon, was der Kunde eigentlich möchte.

conv2pdf ist ein toller kostenfrei nutzbarer Dienst, den wir gerne weiterempfehlen!

Tipp:

¹ Laut einem Microsoft youtube-Video kann man mit dem Publisher 2010 auch PDF für die Druckvorstufe erzeugen. Ich habe das nicht geprüft. Wer aber seine Drucksachen gerne mit Publisher gestalten möchte, der soll doch bitte so freundlich sein und diese Funktion auch benutzen — und dann druckgeeignete PDF abliefern. Wer nicht die aktuelle Version des Publishers einsetzen, aber selbst Grafiken erstellen oder seine Drucksachen gestalten möchte (ohne Geld für kommerzielle Software auszugeben) der sollte mal inkscape als Grafikprogramm (freie Alternative zu Corel Draw oder Illustrator), Gimp als Bildverarbeitungsprogramm und Scribus als Layoutprogramm probieren.

Klicken Sie auf das Vorschaubild um beide Seiten anzusehen

Für den Bayerischen Zentralbibelverein (BZBV) in Nürnberg habe ich wieder eine Kalenderkarte mit Jahreslosung gestalten dürfen.

Das Künstlermotiv mit Jahreslosung wurde auch für eine Postkartenproduktion verwendet.

Weitere Informationen über mein Taschenkalenderangebot finden Sie auf meiner Webseite www.taschenkalender.org.

Um so erstaunter war ich deshalb, als ich beim Test der Illustrator Version CS4 die Möglichkeit entdeckte auch im Format alter Illustratorversionen CS1, CS2, CS3 zu speichen.

Eine sehr schöne Sache für Leute wie mich, die sich mit der Testversion beschäftigen, aber noch nicht entschlossen sind die „alte“ Version einzustampfen — dachte ich mir. Doch die Enttäuschung folgte sogleich beim Versuch das mit Illustrator CS4 erstellte Dokument im (angeblichen) Format der CS1 mit Illustrator CS1 zu öffnen. Es geht nämlich nicht. Wer nun vermutet, dass es sich um ein sehr kompliziertes Dokument handelt bei dem Funktionen, die erst CS4 und noch nicht CS1 bietet benötigt, der irrt. Alles was in diesem Dokument gemacht wurde, hätte man genausogut auch mit CS1 Illustrator machen können: ein bisserl Flächen, ein wenig Farbe, etwas Text und das war´s.

Stattdessen erhielt ich zur Information das hübsche Mitteilungsfenster:

Übrigens gelang es auch nicht die Datei mit Illustrator CS1 zu öffnen, nachdem sowohl die Einbettung eines ICC Profils, als auch die Kompression deaktiviert wurde. Das sind zwar auch alte Sachen, die CS1 schon konnte, aber mit diesen Einstellungen gelang es wenigstens eine LEERE DIN A4-Seite mit Illustrator CS4 zu speichern und mit CS1 zu öffnen. Immerhin, funktioniert es schon mal bei leeren 1,3 MB großen Dokumenten ohne Inhalt Wer sagt´s denn — wird schon… Ein echter Rückschritt für Leute wie mich — ein Fortschritt bei Adobes Kunden„bindungs„strategie ist die Tatsache, dass wohl auch Dateien, die in den alten Legacy-Formaten (z.B. Illustrator 10) gespeichert wurden, nicht mehr im Illustrator CS geöffnet werden können. Dieser Workaround funktionierte noch bei meiner CS 1-Version.

Einziger noch verbleibender Workaround ist das Speichern in einer PDF-Datei. Jedoch scheinen hierbei auch dann die Ebeneneinstellungen verloren zu gehen, wenn man im Speicherdialog in Illustrator CS4 ausdrücklich angibt, dass die Ebeneneinstellungen in der PDF gespeichert werden sollen. Alle Elemente landen in einer Ebene, was die Bearbeitung komplexer Dokumente leider unmöglich macht.

Die Vorhersehbarkeit des Darstellungsergebnisses von Webseiten hängt von zahlreichen Faktoren ab und ist leider nur bedingt vorhersehbar. Darin unterscheiden sich Online-Publikationen ganz erheblich von Drucksachen. In der Druckvorstufe wurden Standardformate und spezielle Workflows entwickelt, um keine bösen Überraschungen in der Produktion zu erleben (siehe PDF/X1a, PDF/X3 etc.). Hält sich der Grafiker bzw. Druckdatenersteller an den vereinbarten Standard, verwendet er normierte, profilierte Farbangaben und berücksichtigt die Papiereigenschaften, kann er sich ziemlich sicher sein, am Ende auch das gewünschte Ergebnis auf Papier in Händen halten zu können. Und — ist die Drucksache erst mal produziert — wird auch wirklich jeder Betrachter das gleiche Druckergebnis in Händen halten können.

Im Onlinebereich verhält es sich (leider) völlig anders.

Einflussfaktoren für die Darstellung von Webseiten

Leider ist es keine Selbstverständlichkeit, dass eine Webseite beim Betrachter X auch nur annähernd so aussieht, wie beim Betrachter Y. Denn nicht jeder Betrachter betrachtet die vom Server ausgelieferte Seite unter gleichen Bedingungen. Einfluss auf das konkrete Darstellungsergebnis haben:

• Bildschirmauflösung des Betrachters
• Betriebssystem und installierte Schriften
• Browser, –version und –einstellungen
• Farbmanagement von Betriebssystem, Browser und nicht zuletzt die Farbtiefe und Bildschirmeinstellungen

Die Einhaltung von Webstandards wie XHTML 1.0 oder HTML 4.x bieten leider nur bedingt eine Gewähr für ein vorhersehbares Ergebnis, denn

• ältere Browser haben mit neueren Standards naturgemäß Probleme
• auch einige aktuelle Browser erfüllen nur teilweise die Standardanforderungen

Typografie im Web — Denkste!

Für professionelle Drucksachengestalter ist es eine Selbstverständlichkeit Elemente durch Tabulatoren oder optimierten Zeichenausgleich bündig auszurichten, den Zeilenumbruch durch eine Worttrennung zu optimieren, „typografische Anführungszeichen“ einzusetzen, zwischen Bindestrich und Halbgeviert zu unterscheiden etc. All dies wurde leider bis heute im www nicht einmal in den aktuellen Standards berücksichtigt. Es gibt zwar erfreuliche Ansätze hierzu, wie z.B. das auf dieser Webseite verwendete WordPress-Plugin wp-typography welches u.a. eine Silbentrennung und zumindest unterschiedliche Anführungs– und Schlusszeichen ermöglicht. (Nachtrag vom 20.8.09: Toll, dass nach dem heutigen Update und der Änderung der Einstellung der Anführungszeichen in „deutsch“ auch „richtige deutsche Anführungszeichen“ verwendet werden. Dieses empfehlenswerte Modul stellt einen Meilenstein für die Web-Typografie dar!). Aber letztlich können solche Hilfsmittel nur durch einen zusätzlichen Implementationsaufwand auf einer Webseite verwendet werden.

Der Weg aus dem Dilemma

Vor einigen Jahren meinten einige Designer, dass der beste Weg um eine einheitliche Darstellung von Webseiten zu gewährleisten darin bestünde die Seiten möglichst komplett als Bilder zu speichern und auszuliefern. Oft wurden die Webseiten aus mehreren Einzelbildern zusammengesetzt, um so z.B. das Bild für den Inhalt unabhängig von Kopf– oder Fußbereich zu wechseln — z.B. durch eine entsprechende Interaktion wie einen Menüklick des Benutzers. Diese zerschnittenen Einzelbilder wurden dann in einer Tabelle wieder zusammen gesetzt.
Diese „Lösung“ welche die Grundidee von Hypertext — und dabei handelt es sich schließlich beim www — ad absurdum führt, erregte die Gemüter nicht nur der Programmierer und derjenigen, die der Meinung waren eine Webseite würde in erster Linie Inhalt — also Texte und Links transportieren und eine Tabelle wäre zur tabellarischen Darstellung von Inhalten da. Auch bei gemäßigterer Interpretation ergaben sich ernsthafte Kritikpunkte:

1. Eine Webseite, die nur aus Bildern besteht ist weder für Suchmaschinen, noch für Menschen mit einem visuellen Handicap „sicht„bar
2. Eine Webseite, die aus Bildern aufgebaut ist, gibt eine fixe Größe in Pixel vor — unabhängig von der Bildschirmauflösung des Betrachters. Ob die Schrift also im Ergebnis 4mm groß auf dem Bildschirm erscheint, oder nur 1mm groß ist eben gerade nicht vorhersehbar, das Ziel der Designer folglich verfehlt.

Solche Pixelseiten sind erfreulicherweise mittlerweile kaum noch anzutreffen. Und auch Webseiten, die kompetente Autoren mit Werkzeugen wie Flash erstellt haben sind nicht mehr zwangsläufig „Pixelseiten“ sondern können durchaus kompatibel, barrierefrei und Suchmaschinenfreundlich sein.

Stattdessen hat sich in den letzten Jahren die Einsicht durchgesetzt, dass eine pixelidentische Darstellung von Webseiten unter allen Bedingungen nicht das Ziel sein sollte. Denn — von den oben bezeichneten Problemen dies zu erreichen einmal abgesehen — eleminiert man die Vorzüge, die man durch die Beteiligung zweier Seiten (dem Server der die Seiten generiert und ausliefert und dem Client mit Browser an dem sie betrachtet werden) an der Darstellung einer Webseite erreichen könnte.
Schließlich ist es doch gut und kein Problem, wenn z.B. ein kurzsichtiger Benutzer oder einer an einem sehr hoch auflösenden Bildschirm, bei dem ein Pixel folglich sehr klein ist, die Möglichkeit haben die Darstellung der Schrift im Browser zu vergrößern. Oder wenn ein Mobiltelefon mit einem sehr schmalen Display Inhalte in einer Spalte darstellt, die man auf dem PC in mehreren Spalten nebeneinander sieht. Das „Problem“ der unterschiedlichen Darstellung ist eigentlich nicht unbedingt eines, sondern kann zu einem Vorteil gereichen, wenn man die Möglichkeiten von XHTML 1.0 bzw. HTML4.x zu nutzen weiß.

Doch der Designer, der naturgemäß alles unter seiner Kontrolle haben möchte, (aber auch der technisch unbedarfte Kunde) hat damit oft ein Problem, schließlich führt z.B. eine Vergrößerung der Schrift zu veränderten Zeilenumbrüchen und einer Verkleinerung der Abstände zwischen der Schrift. Befindet sich die Schrift in einer fixen Spalte, oder vor Hintergrundgrafiken, z.B. im Menü, kann es dazu führen, dass die Schrift über die vorgesehenen Bereiche hinausragt.
Ein Meilenstein zur Lösung dieser Probleme war die Einführung der Skalierung von Bildern, die zunächst Opera, dann auch Firefox und mittlerweile auch der Internet Explorer (ab Version 7) eingeführt hat. Nun vergrößert und verkleinert der Benutzer über entsprechende Interaktion nicht nur den Text, sondern in gleichem Maße auch die Grafiken.

Browserweichen und angepasste Stylesheets einsetzen

Eine Möglichkeit die Darstellung einer Seite unter einer ganz bestimmten Umgebung zu beeinflussen, ist für genau diese Bedingung einen speziell hierfür konzipierten Inhalt auszuliefern. Ein häufig verwendeter Fall ist z.B. bei der Verwendung von PNG-Grafiken mit Alphakanal (für weiche Transparenzen) eine Spezialversion für den Internet-Explorer vor Version 7 auszuliefern, da der IE erst abVersion 7 PNG mit Alphakanal beherrscht.

Das Problem bei solchen Weichen ist, dass zunächst ganz genau ermittelt werden muss unter welchen Bedingungen eine abweichende Version ausgeliefert werden soll. Diese Bedingung muss sauber formuliert und ebenso sauber umgesetzt werden. Hätte man z.B. zu Zeiten, als es noch keinen Internet Explorer 7 gab eine PNG-Weiche programmiert, die für den Internet Explorer eine abweichende Version liefert, so wäre diese Umsetzung mit Einführung des Internet Explorers 7 überholt gewesen.

Man muss sich klar sein, dass jede Browserweiche einen zusätzlichen Implementations– und Testaufwand bedeutet. Folglich sollte man diesen Lösungsansatz nur im Ausnahmefall wählen und auf jeden Fall ausgiebig testen.

Fehler eliminieren

Mit Fehlern im html-Code wird von verschiedenen Browsern unterschiedlich umgegangen. Der eine Browser „rät“, was gemeint sein könnte, der andere ignoriert ein fehlerhaftes Element einfach. Wer eine einheitliche Darstellung von Webseiten erreichen möchte, sollte deshalb auf einen standardkonformen validierten Code wert legen, der möglichst keine Fehler aufweist. Dass dies in der Praxis meist nicht zu 100% erreicht werden kann sollte nicht dazu führen, dass man dieses Ziel aus den Augen verliert.

Moderne Standards nutzen und Workarounds minimieren

Idealerweise stellen alle modernen Browser eine Webseite die fehlerfreien Code enthält identisch dar. Von diesem Ziel ist man gar nicht mehr so weit entfernt. Aktuelle Versionen von Opera, Firefox und Internet Explorer beherrschen weitgehend die aktuellen W3C-Standards. Für welche Browser sich eine individuelle Anpassung und Optimierung lohnt ist immer individuell anhand der Zielgruppe, der Reichweite des Projektes und des damit einhergehenden Budgets sowie der zu erwartenden Quote an Nutzern zu entscheiden. Ob es sich lohnt für einen Browser, den 2% der Webseitenbesucher nutzen zu optimieren und evtl. einen workaround zu erstellen, das muss jeder für sich entscheiden. Heutzutage (Stand August 2009) nutzen bedauerlicherweise immer noch zwischen 5 und 10% der Webseitenbesucher (meiner Webseiten) den Internet Explorer in der Version 6. Diese nicht geringe Anzahl lässt einen Test und eine Anpassung für den IE 6 sinnvoll erscheinen.

Doch wie testet man die Darstellungsergebnisse mit verschiedenen Browsern. Die gängisten Browser und Systeme sollte man selbst auf einem Live-System testen, also z.B. Windows XP, Vista und Windows 7 mit Internet Explorer 7 und 8 sowie Firefox 3. Natürlich sollte man bei der Wahl seiner Testsysteme auch die Zielgruppe im Auge behalten. Eine Webseite, die sich mit OS X-Themen und Druckvorstufe beschäftigt, sollte auch für Mac-User verträglich sein, wohingegen das bei einer Schnäppchenjägerseite für gebrauchte Computerteile evtl. eher keine Rolle spielt. Um nicht einen ganzen Rechnerpark in die Ecke stellen zu müssen, empfiehlt es sich mit virtuellen Maschinen zu arbeiten. So kann z.B. eine Basisinstallation von Windows XP mit Internet Explorer in einer virtuellen Maschine ebenso gute Dienste leisten, wie ein Internet Explorer 5 in einer Windows 2000 VM.

So sieht die Seite blog.agentur-lindner.com in 34 verschiedenen Browsern aus

Doch egal wie viele PCs und VMs man in die Ecke stellt, irgendwann ist Schluss und manchmal ist es auch einfach zu aufwändig für eine schnelle Revalidierung Tests an mehreren Rechnern direkt durchzuführen. Die Alternative hierzu heißt www.browsershots.org. Dieser Webdienst liefert Bildschirmabbildungen der gewünschten Webseite unter fast allen Betriebssystemen und Browsern an. Selbst Exoten können hiermit getestet werden. Interessant ist auch die Möglichkeit eine bestimmte Bildschirmbreite oder Farbtiefe vorzugeben. Browsershots leitet die Anfrage an eine Vielzahl von Systeme mit unterschiedlichsten Browsern und Betriebssystemen weiter und erhält von diesen die jeweiligen Bilder der angefragten Webseite wieder zurück um sie dann an den Anfrager auszuliefern. Die Bilder können als PNG-Grafiken im Browser angesehen oder als ZIP-Archiv heruntergeladen werden. Eine geniale Sache! Jede Webseite sollte vor Abschluss der Arbeiten mit diesem System überprüft werden!

Damit die Webseite von Pumpen-Service-Wagner auch im Internet gefunden wird, wurde die Seite von Anfang an für Suchmaschinen optimiert. Das fing bei der Wahl des CMS und seiner Module an, wurde aber auch mit relevanten Suchbegriffen im Inhalt umgesetzt, der Meta-Bereich wurde optimiert und die Seite thematisch verlinkt. Mit Freude kann ich feststellen, dass die Seite bei allen relevanten Suchbegriffen, wie z.B. „Pumpenreparatur Nürnberg“, „Grundfos Reparatur“, „Pumpenservice“ immer auf der ersten Ergebnisseite relevanter Suchmaschinen angezeigt wird.

Für den Pumpen-Service-Wagner gestaltete ich nicht nur Logo und Design, liefere Drucksachen und Werbeschilder, erstelle die Homepage, sondern bin auch für das Hosting der Webseite und den Mailserver verantwortlich.

Du hast eine Webseite ohne Print-Stylesheet und willst deine Seite für die Druckausgabe optimieren. Gehen wir es an!

Der Weg zu einem Print-Stylesheet

media=„screen“ oder lieber überschreiben?

Die Zeile im Head-Bereich unseres (X)HTML-Dokuments, in der das Stylesheet aufgerufen wird schaut für gewöhnlich so aus:
<link type=„text/css“ href=„style.css“ rel=„stylesheet“.
Das bedeutet, es wird eine CSS-Datei aufgerufen, die für ALLE Medien verwendet wird. Mit folgender Zeile rufen wir eine CSS-Datei auf, die sich nur auf das Medium „Print“ bezieht:
<link type=„text/css“ href=„print.css“ rel=„stylesheet“ media=„print“>
Achtung: Haben wir diese 2 Zeilen in der selben Reihenfolge wie oben in unserer (X)HTML-Datei stehen, wird erst style.css für alle Medien aufgerufen, da das Attribut „media“ nicht genutzt wird und standartmäßig auf „all“ gesetzt ist, dann wird print.css aufgerufen, und überschreibt für den Druck alle Style-Anweisungen, die vorher schon in style.css aufgerufen wurden. Man könnte es auch anders machen: wäre die erste Zeile
<link type=„text/css“ href=„style.css“ rel=„stylesheet“ media=„screen“>,
so würde style.css garkeine Style-Anweisungen für den Druck zu vergeben haben. Wir müssten also theoretisch jeden einzelnen Selektor, den wir auf dem Medium Druck ansprechen möchten nochmals seinen „Style“ geben.

Bevor wir mit unserer print.css anfangen sollten wir also gut überlegen, was hier für uns einfacher ist; gegebene Styles überschreiben oder alle neu anlegen.

@print — Anweisungen

Als allererstes, ganz oben in unsere Datei print.css müssen die Anweisungen für das Medium print erscheinen. Bei mir sieht das so aus:
@page {
size: auto;
margin: 0.5cm 0.5cm 1cm 1.5cm;
}

Diese Zeilen helfen dem Browser, die Seite einzurichten und geben einen Rand zum Inhalt an — dieses Beispiel zeigt einen Satzspiegel mit 0,5cm Kopf– und Außensteg, 1cm Fußsteg und 1,5cm Innensteg. Aber Achtung! Wir können keine Angaben über Außen– und Innensteg machen. Ich gehe bei dem Beispiel davon aus, das Außensteg rechts und Innensteg links ist.

Display:none;

#navi {
display:none;
}

Diese Eigenschaft lässt ein Element von der Ausgabe verschwinden. Im Gegensatz zur Eigenschaft „visibility“ wird auch der Platz an dem das Element steht für andere Elemente freigemacht. Auf diese Weise können Menu und andere Bereiche auf der Seite ausgeblendet werden.

Brauchbar trotz S/W-Drucker

Viele Gestalter setzen bei typografischen Auszeichnungen im Internet auf Farbe — wie wir in diesem Blog — beispielsweise Hyperlinks werden im knalligen Orange oder Blau angezeigt. Doch viele Internetsurfer haben keinen Farbdrucker, farbige Links würden somit Grau aus dem Drucker kommen — die Links sind schlechter lesbar und Hervorhebungen evtl. überhaupt nicht erkennbar. Daher sollten die Auszeichnungen für den Druck angepasst werden! Geeignet sind die CSS-Eigenschaften font-weight, letter-spacing, font-variant, text-decoration oder auch border und background (z.B. grau). Auf SELFHTML wird gezeigt, wie man die Attribute der HTML-Elemente im Druck visualisieren kann, beispielsweise gibt es Stylesheet-Anweisungen, die das Ziel für einen Hyperlink nach selbigem anzeigen lassen.

nur für den Druck!

Auf den Seiten agentur-lindner.com und taschenkalender.org haben wir Elemente untergebracht, die nur im Druck angezeigt werden. Dies erreichen wir indem wir dem Element auf dem Medium „Screen“ die Eigenschaft display:none; und auf dem Medium „Print“ display:inline oder block geben. Auf diesem Weg kann man beispielsweise am Rande darauf hinweisen, dass die Seite gedruckte Seite für die Druckausgabe optimiert und nicht mit dem Screendesign identisch ist.

Positionierung anders als sonst

Auf Seiten wie www.agentur-lindner.com werden beim Layout absolut positionierte Elemente eingesetzt. Sie „kleben“ an den Rändern des Browserfensters oder haben einen festen Abstand zu den Rändern oben, unten rechts, oder links, egal wie man das Fenster vergrößert oder verkleinert. Im Druck wird sowas jedoch ziemlich witzlos: „position:absolute;“ bedeutet für den Druck, dass das Element auf jeder gedruckten Seite auf seiner Position angezeigt wird und kann somit auf der 2ten und folgenden Seiten den Inhalt überdecken. Layouts, die von der absoluten Positionierung leben müssen komplett überdacht werden, möchte man ein absolut positioniertes Element auch auf dem bedruckten Blatt Papier zu sehen bekommen.
Dieses Verhalten der Browser bei der Druckausgabe bietet allerdings auch neue Möglichkeiten: ein Wasserzeichen auf jede gedruckte Seite zu setzen oder ein Layoutelement auf jeder gedruckten Seite am unteren Rand anzuzeigen. Wer kreativ ist, dem fallen bestimmt noch weitere Möglichkeiten ein.

In der Praxis stellt sich für den Gestalter die Frage — wie komme ich zu geeigneten, hochwertigen und günstigen Schriften? Natürlich kann man Schriften einfach bei den Profis von Adobe, Linotype, Fonts.com, myfonts.com, ITC etc. kaufen — übrigens eine sehr gute Idee, wenn ausreichend Budget zur Verfügung steht, denn dort gibt es nur hochwertige Schriften.

Doch für Gelegenheits– und Hobbygestalter aber auch für beginnende Mediengestalter mit kleinem Budget sind kostengünstige Alternativen wichtig, die wir in diesem Artikel aufzeigen möchten.

Zunächst ein paar Worte zu den skalierbaren (also verlustfrei vergrößerbaren) Schriftformaten. Früher gab es nur sogenannte Postscript-Fonts (das waren Dateien mit den Endungen pfm und pfb), diese Dateien unterschieden sich für Mac und PC (Windows). Dann kamen unter Windows Truetype-Schriften (TTF) auf, welche es dann auch für den Mac gab — auch diese Schriftart unterscheidet sich für Mac und PC und die Schrift vom einen System kann nicht ohne Konvertierung auf dem anderen verwendet werden. Seit einigen Jahren etabliert sich das OpenType-Schriftformat (OTF), eine Modernisierung von Truetype, die nun die Verwendung einer Schriftdatei sowohl unter Windows (PC) als auch unter OS X (Mac) ermöglicht. Außerdem können (müssen aber nicht) OpenType-Schriften typografische Feinheiten beinhalten, welche zumindest im Truetype-Schrift nicht möglich waren.

Am besten also, man erhält gute OpenType-Schriften– oder man achtet bei Truetype oder Postscript-Schriften darauf, dass diese im richtigen Format (PC/Mac) vorliegen.

Quelle 1) Das Betriebssystem

Jedes moderne Betriebssystem bringt eine Menge an Schriften mit. Nicht nur das aktuelle Windows. Auch XP brachte eigene Schriften mit — und Windows 98 tat dies auch. Haben Sie die Schriften gesichert und geprüft ob Sie zu einer weiteren Verwendung berechtigt sind — auch wenn Sie das Betriebssystem mittlerweile nicht mehr einsetzen? Auch die verschiedenen Linux-Systeme und Mac OS X bringen Schriften mit. Was die Linux-Schriften angeht, muss man deshalb kein anderes OS installieren — es handelt sich um GPL lizensierte Schriften.

Praxistipp: Archivieren Sie die Schriften aber auch die Kaufbelege und dokumentieren Sie die Herkunft der Schriften, deren Nutzungsrecht Sie bereits zusammen mit anderer Software erworben haben. Vermutlich verlieren Sie das Nutzungsrecht an der Schrift nicht dadurch, dass Sie die „eigentliche“ Software nicht mehr einsetzen. Auch Schriften aus der PC-Frühzeit vor 15 oder 20 Jahren können heute noch eingesetzt werden. In der Praxis ist es allerdings meist nicht mehr möglich nach so vielen Jahren über die Herkunft der Schriften Auskunft zu geben.

Quelle 2) kostenfreie Quellen lizensierter Schriften — z.B. von Adobe, Microsoft

Adobe verteilt kostenfrei die Acrobat Reader genannte Software. Diese Software beinhaltet aber auch Schriften, nämlich die Myriad Pro, Minion Pro und Courier Std. im OpenType-Format. Da man diese Schriften ungefragt auf die Festplatte bekommt, stellt sich natürlich die Frage, ob man Einschränkungen bei deren Nutzung beachten muss. Ich bin kein Jurist und gebe an dieser Stelle keine Ratschläge. Vergleicht man die Situation allerdings mit der realen Welt, passt folgender Vergleich: Jemand wirft Dir als Werbegag einen 20 EUR Schein in Deinen Briefkasten. Du kaufst damit wo anders ein und nicht wie beabsichtigt beim Verteiler — kann sich dann der Verteiler beschweren?

Quelle 3) kostenfreie Quellen „freier“ Schriften — z.B. GPL-Schriften

Es gibt im Internet unzählige Quellen kostenfreier Schriften — Google ist Dein Freund! (An dieser Stelle ergänze ich demnächst eine Liste der wichtigsten Webseiten — Tipps per Kommentarfunktion werden von mir gerne aufgegriffen.)

• Linux Libertine (OpenType
• freedesktop.org (Links zu mehreren Schriftquellen)

Quelle 4) Schriften als Beigabe zu kostengünstiger und gebrauchter Software

Wer arbeitet heute noch mit Corel Draw in der Version 9.0? Kaum jemand, dementsprechend ist diese Software auch gebraucht kaum noch zu verkaufen. Wer sie dennoch findet, z.B. bei ebay, wird wohl nicht mehr als 1,- EUR dafür bezahlen müssen. Wir meinen dies ist ein Superpreis, bedenkt man, dass sogar schon Corel Draw 5.0 über Hunderte teilweise professioneller Schriften verfügte. Ähnliches gilt natürlich auch für die Grafikpakete von Adobe wie Illustrator oder die alten Freehandversionen. Auch diese Programme enthielten Schriften — im Unterschied zu Corel meist sogar die original lizensierten Schriften — allerdings in geringerem Umfang.

Auch wenn Sie Originalsoftware gebraucht kaufen, erwerben Sie daran ein Nutzungsrecht. Wenn die Software Schriften beinhaltet erwerben Sie damit auch ein Nutzungsrecht an den Schriften.

Vorteile:

• Supergünstig
• umfangreiche Schriftsammlung (bei Corel Draw)
• hochwertige Originalschriften günstig (z.B. bei Freehand oder Illustrator)

Nachteile:

• Nur wenige Schriften liegen in zahlreichen Schriftschnitten vor, viele Schriften gibt es nur in normal, fett, kursiv und fett kursiv — aber ohne extended, expanded, light etc. (bei Corel Draw)
• Wenn es sich nicht um Originalschriften handelt, werden auch nicht die geschützten Originalnamen verwendet. So mag z.B. eine Humanist777 der Frutiger sehr ähnlich sein — es ist aber keine Frutiger.(bei Corel Draw)
• „alte“ Schriften ohne €-Symbol

Quelle 4) Schriften von Schriftwebseiten

Es gibt viele Internetseiten, die Schriften zum kostenlosen und kostengünstigen Download bereit stellen, z.B.

• 1001fonts
• dafont.com
• fonts101

(Diese Liste wird demnächst noch ergänzt und erweitert. Tipps per Kommentarfunktion werden von mir gerne aufgegriffen.)

Einmalige Einrichtungsgebühr D…X-Pakete und B…Web-Pakete je 9,90 €, jeweils für P…Plus-Pakete 14,90 €. Preis-Aktion bis 28.02.2009: alle BasicWeb-Pakete nur 0,- €/Mon. jeweils für 6 Monate, D…X Basic nur 0,99 €/Mon. für 6 Monate, alle P…Plus-Pakete nur 2,99 €/Mon. jeweils für 6 Monate, danach B…Web für 0,99 €/Mon., P…Plus XL für 24,90 €/Mon. Mindestvertragslaufzeit für alle Pakete 12 Monate. Bei Software-Bestellung 6,90 € Versandkosten, Preise inkl. MwSt.

Mit anderen Worten: aus dem Schnäppchen zu 2,99 EUR/Monat wird nun folgendes:

6 x 2,99 = 17,94 EUR
6 x 24,90 = 149,40 EUR
Einrichtung 14,90 EUR

SUMME = 182,24 EUR/Jahr im ersten Jahr, danach 298,00 EUR/Jahr.

Und wo ist nun das Schnäppchen? Ich weiß ja nicht wie Sie das halten, aber ich fühle mich durch solche Anbieter verarscht. Und ich kaufe aus Prinzip nichts bei Leuten, die mich verarschen.

Die Agentur Lindner lebt von langjährigen, zufriedenen Kunden. Da ich mich nicht gerne verarschen lasse — mache ich das auch nicht mit meinen Kunden — auch nicht bei Webhostingangeboten. Bei mir kostet Leistung Geld, wenig Leistung kostet wenig und mehr Leistung mehr. Ich berate Sie gerne und verkaufe Ihnen genau das, was Sie brauchen und zwar zu fairen Preisen auf Dauer und von Anfang an. Da bin ich nicht der Einzige, das machen andere seriöse Anbieter auch. Gehen Sie zu mir oder gehen Sie zu den fairen Kollegen. Aber bitte, lassen Sie sich nicht verarschen und werden Sie nicht bei denen Kunde, die auf die Dummheit und Trägheit ihrer Kunden setzen.

Möglichkeit b)
Man speichert die Dateien jedes mal unter neuem Namen ab.
Vorteile:
+ alle Versionsstände jederzeit verfügbar

Nachteile:
– höherer Speicherplatzbedarf
– Unübersichtlichkeit bei schlechter Namensgebung

Der gewichtigste Nachteil bei Möglichkeit b) kann jedoch problemlos durch eine gute Namensvergabe umgangen werden.
Was sind gute, was schlechte Namen um die Dateiversion zu kennzeichnen?

Wenn man sich für Möglichkeit b) entscheidet, dann stellt sich die Frage WIE man die Dateien benennen sollte. Beliebt aber wenig sinnvoll ist es einer neueren Dateiversion ein NEU im Namen zu verpassen. Das kann funktionieren, wenn es tatsächlich die NEUe Version bleibt, was aber, wenn es zu einer weiteren Änderung kommt? Mitunter wird dann der Zusatz FINAL bemüht, doch auch hier das gleiche Dilemma, was wenn aus der Finalen eine spätere Version als die Neue, aber eben noch nicht die Endgültige wird? Auch Dateien nachträglich wieder umzubenennen ist überhaupt keine gute Idee, da dann keine Abstimmung mit dem Empfänger mehr vorgenommen werden kann.

Die Namen sollten also LOGISCH aufgebaut sein, etwa indem für jede Version ein _VerX angehängt wird.
Es gibt dann schlimmstenfall eine _Ver1, _Ver2, _Ver3 usw. so ist immer auf einen Blick klar, welche Position in der Versionsgeschichte die Datei darstellt.

Manchmal kann es auch sinnvoll sein ein Datum mit in die Datei aufzunehmen. Dies macht keinen Sinn, wenn es darum geht das Erstelldatum der Datei zu speichern, da dies sowieso als Dateieigenschaft mitgespeichert wird. Wenn es aber z.B. darum geht Dateien welche einen bestimmten Stand, oder ein Aufnahmedatum (das vom Bearbeitungsdatum abweicht) zu dokumentieren, ist die Vergabe eines Datums im Namen sinnvoll. In welcher Form sollte das Datum in den Dateinamen geschrieben werden? In Deutschland ist als Datumsschreibweise TT.MM.JJ üblich. Diese schreibweise empfinde ich als unpraktisch, da sie beim Sortieren der Dateien nach Namen zu unlogischen Ergebnissen führt (Es wird nach Jahr, dann Tag und nicht nach Jahr, dann Monat, dann Tag sortiert). Besser ist das Datumsformat nach ISO 8601:2004 und EN 28601 zu verwenden: YYYYMMDD (Basisformat) oder YYYY-MM-DD (erweitertes Format mit Mittelstrich als Trennzeichen). Ansonsten gleichnamige Dateien welche zusätzlich das Datum beinhalten werden bei einer Sortierung des Ordners nach Dateinamen folglich nach Datum sortiert.

So weit ist das Konzept einfach konsequent umzusetzen.
Schwieriger und unübersichtlicher wird es, wenn die Dateinamen nicht selbst vergeben, sondern Dateien vom Kunden übernommen werden.
Der Kunde hält sich vermutlich nicht an die oben beschriebene Konzeption und vergibt seine Dateinamen vermutlich beliebig. Wie also diese Dateien in eine „ordentliche“ Organisation integrieren?
Eine Möglichkeit besteht darin die eingegangenen Dateien des Kunden zunächst in einem Eingangsordner zu isolieren.
Hat man ein klares Konzept nach dem die Dateinamen aufgebaut sein sollen und entsprechen die Dateien diesem nicht, kann man die Dateien nach der eigenen Konzeption umbenennen und dies in einer entsprechenden Textdatei dokumentieren.
z.B. erst mal an der Kommandozeile in dem Verzeichnis mit dir » namensgebung.txt eine Textdatei mit allen Dateien erstellen.

Welcher Grafiker/Setzer kennt das nicht? Da kommt der Kunde und möchte ein „ganz normale„
Schrift, „die gleiche wie beim letzten mal halt“ und legt irgendeinen früheren fremden Druck auf den Tisch. Nun bin ich vermutlich nicht der einzige Sammler — die Chance eine zumindest sehr ähnliche Schrift „zu haben“ ist groß — aber wie deren Namen rauskriegen?

Wie heißt diese Schrift — kein Problem dank www.whatthefont.com

Nun kann man natürlich hoch qualifizierte Praktikanten einsetzen, die einen Tag durch die Gegend klicken. Aber wer macht dann die Schnittchen? Wäre es nicht toll, wenn man die Schrift einfach einscannen und einen Computer mit der Suche nach der Schrift beauftragen könnte? Genau das
geht mit http://www.myfonts.com/WhatTheFont/

Einfach das Bild eines beliebigen Textes uploaden, die Buchstaben benennen und Vorschläge machen lassen, welche Schriften ähnlich sind.

Ich habe diese Funktion auch schon erfolgreich genutzt um eine Schrift zu finden, die als Ausgangsmaterial für ein Logo herangezogen werden konnte, indem ich einfach per Hand ein paar markante Buchstaben gezeichnet habe. Die Ergebnisse sind oft gut, manchmal überraschend aber
zumindest immer anregend.

Eine andere, aber nicht weniger spannende Art eine Schrift zu identifizieren, ist die anhand eines „Fragebogens“. Vor allem, wenn man einen annähernd vollständigen Zeichensatz einer Schrift vorliegen hat, kann man mit dem Fragebogen auf www.identifont.com eine Schrift identifizieren.

Stattdessen werden die Dinger immer lichthungriger und blitzen selbst bei leicht bewölktem Himmel ins Unendliche — was natürlich das Verwackeln nicht verhindert. Doch gegen Verwackeln gehen die Hersteller dann eben mittels Software vor — ein Workaround gegen den Pixelwahn der Marketingspezialisten.

Schade, dass gute preisgünstige Kameras, mit vernünftigen Eckdaten scheinbar bei Aldi und Co. keinen Markt mehr finden und deshalb kaum noch zu finden sind.

Eine nützliche Softwarefunktion vermisse ich: Jedes Objektiv — auch gute — bringen eine gewisse optische Verzerrung mit sich. Was läge also näher, als diese „Fehler“ der Optik — gleich in der Kamera mit einem speziellen Profil für diese Optik zu korrigieren? Ähnlich wie ein ICC-Geräteprofil die Farben an die Eigenschaften eines Gerätes anpasst, könnte es doch vielleicht mittels eines „Entzerrungsprofils“ die optische Verzerrung von Objektiven definiert und diese dann — am besten gleich in der Kamera — per Software korrigiert werden. Welch beeindruckend gute Ergebnisse das bringen könnte, kann man anschaulich anhand der Software PTLens sehen, welche genau dies nachträglich macht: anhand von zahlreichen Objektivprofilen die Verzerrung aus den Bildern rausrechnen. Erstaunliche Ergebnisse! PTLens ist in einer Testversion verfügbar und man kann es als Standalone oder Photoshop-Plugin einsetzen.

Wer Fotos ungefragt und ohne entsprechende Erlaubnis von fremden Webseiten kopiert und sie für seine eigenen Zwecke einsetzt, begeht einen Urheberrechtsverstoß, denn der Fotograf verfügt (als Urheber) über alle Rechte an seinen Bildern. Falls Personen abgebildet sind haben auch diese ein „Recht am eigenen Bild“. Der Fotograf kann entgeldlich oder unentgeldlich bestimmte oder alle Nutzungsrechte abgeben — und dies machen immer mehr Fotografen auf speziellen Webseiten, auf denen sie Ihre Bilder „lizenzfrei“ zum Herunterladen anbieten. Die Bilder sind oft in verschiedenen Auflösungen verfügbar und so auch für die Verwendung in Drucksachen geeignet.

Teilweise handelt es sich um Projekte von Hobbyfotografen, welche völlig auf eine Bezahlung bei Verwendung ihrer Bilder verzichten, teilweise handelt es sich aber auch um durchaus kommerzielle Projekte, bei denen man Nutzungsrechte an Bildern bereits ab 1 EUR erwerben kann. In jedem Fall hat man die Auswahl zwischen Hunderttausenden Bildern. Zu den meisten Themen findet man wirklich viel brauchbares Material. Nur wenn Menschen mit auf dem Bild sein sollen, dann sieht es bei dem freien und fast kostenlosen Angebot eher düster aus.

Unsere Hitliste der nützlichsten Webseiten mit „günstigen“ verwertbaren Bildmaterial:
(Wir unterscheiden hier nicht zwischen Webseiten, bei denen Bilder für wenige EUR zu haben sind und Webseiten bei denen Bilder kostenfrei erhältlich sind.)

1. www.dreamstime.com
2. www.istockphoto.de
3. www.aboutpixel.de Bilder können kostenlos auch kommerziell verwendet werden.
4. de.fotolia.com Kauf per Guthabenspunkte, ACHTUNG Guthaben verfällt nach 1 Jahr!
   
5. www.piqs.de
6. www.picspack.de
7. www.photocase.de
8. www.bildertube.de
9. www.sxc.hu
10. www.intuitivmedia.de
11. www.creativity103.com
12. www.pixelio.de
13. www.zoonar.de Variable Preise von billig bis nicht mehr ganz so…

Kennst Du weitere Seiten, die unbedingt in diese Liste müssen?

In Webseiten werden Bilder üblicherweise auf 3 Arten platziert:

1. links ausgerichtet mit rechts umfließenden Text
2. rechts ausgerichtet mit links umfließenden Text
3. Bild mittig ohne umfließenden Text

So gut wie nie benötigt man ein links oder rechts ausgerichtetes Bild OHNE umfließenden Text.

Wenn man eine Webseite „per Hand„erstellt, dann legt man am besten drei Styles für diese Zwecke an, also z.B. <img class=„left“ src=… >, <img class=„right“ src=…>, <img class=„center“ src=…>. Die Styles werden dann z.B. folgendermaßen definiert:

img.left{
	float: left;
	margin: 5px 13px 5px 0;
}

entsprechend für die rechts ausgerichteten Bilder:

img.right{
	float: right;
	margin: 5px 0px 5px 13px;
}

So erreicht man, dass zwischen Bild und Text ein Abstand von 13px erhalten bleibt, ein Bild, das am linken Rand ausgerichtet ist, aber nicht vom Rand weg gerückt wird.

In Joomla geht es leider nicht so einfach wie OHNE CMS. Das CMS macht uns das Leben schwer, indem es für Bilder nicht eine Klasse definiert, die man dann bequem in der Stylesheetdatei so formatieren kann, wie man es will, sondern Joomla verwendet statt dessen direkt die Formatierung <img style=„float:right“ …>.

Mir ist leider kein Weg bekannt, wie man Joomla dazu bewegen kann (ohne im Code zu hacken oder Erweiterungen zu installieren, die dann mehr Probleme mitbringen, als sie lösen) eine Möglichkeit zu bieten Bilder bündig am Seitenrand und mit Abstand zum umfließenden Text zu formatieren. Ich kann gar nicht glauben, dass es dafür keine „saubere“ Lösung gibt. Das Problem müsste doch jeder haben, der Joomla einsetzt. Wie kann es sein, dass es nur uns stört — oder haben wir eine ganz banale Lösung für dieses Problem einfach ÜBERSEHEN?

Wie macht ihr das?

1. Das Foto eines Clowns soll im Druck möglichst „bunt“ rüber kommen.
2. Ein Landschaftsfoto mit Wäldern, Bergen und Seen soll so umgesetzt werden, dass die feinen Farbabstufungen erhalten bleiben
3. Ein Firmenlogo sowie Text, aber kein Foto soll auf Visitenkarten gedruckt werden.

1. => Empfohlene Methode: Sättigung
2. => Empfohlene Methode: Perzeptiv
3. => Empfohlene Methode: Absolut Farbmetrisch

Es werden überwiegend PDF/X1a-Daten an Offsetdruckereien übergeben. Je nach verwendetem Papiersorten werden die aktuellen Profile „ISO Coated V2 (ECI)“ für gestrichene Papiere oder „ISO Uncoated“ eingebunden.

Mit Produzenten, welche die optimale Separation der profilierten Farbdaten selbst vornehmen möchten, sprechen wir gerne einen individuellen Ablauf ab und übergeben z.B. unseparierte PDF/X3-Daten.

Kunden, die farbverbindliche Proofs unserer Daten wünschen, stellen wir unsere fertigen Daten zur Verfügung oder lassen durch ein Partnerunternehmen (z.B. www.crossover-mediagroup.de überregional, oder die Druckerei Tümmels in Nürnberg-Eibach einen normgerechten und FOGRA-zertifizierten PROOF erstellen).