<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title> &#187; Webdesign</title>
	<atom:link href="http://blog.agentur-lindner.com/category/webdesign-agentur-tour/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.agentur-lindner.com</link>
	<description>Besser gebloggt als vergessen.</description>
	<lastBuildDate>Mon, 26 Jul 2010 12:17:07 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>Browser zur Dateiübertragung mit „Uploadbalken“</title>
		<link>http://blog.agentur-lindner.com/2010-06-19/dateiubertragung-mit-browser-und-uploadbalken/</link>
		<comments>http://blog.agentur-lindner.com/2010-06-19/dateiubertragung-mit-browser-und-uploadbalken/#comments</comments>
		<pubDate>Sat, 19 Jun 2010 15:04:18 +0000</pubDate>
		<dc:creator>Ralph Lindner</dc:creator>
				<category><![CDATA[Agentur-Tour]]></category>
		<category><![CDATA[Software]]></category>
		<category><![CDATA[Surftipps]]></category>
		<category><![CDATA[Systemadministration]]></category>
		<category><![CDATA[Webdesign]]></category>
		<category><![CDATA[extranet]]></category>
		<category><![CDATA[upload]]></category>

		<guid isPermaLink="false">http://blog.agentur-lindner.com/?p=953</guid>
		<description><![CDATA[Die Übersendung von Dateien an die Agentur Lindner kann per Dateiupload über eine spezielle Extranetseite erfolgen. Dieser Beitrag beschreibt die Vorteile gegenüber der Übertragung per E-Mail oder ftp. <a href="http://blog.agentur-lindner.com/2010-06-19/dateiubertragung-mit-browser-und-uploadbalken/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<h3>Daten als E-Mail-Anhang</h3>
<p>Um Dateien an Geschäftspartner zu übertragen wird heute gerne der E-Maildienst verwendet. Es ist ja so einfach Bilder, PDFs, Texte etc. an eine Mail anzuhängen und zu versenden.<span id="more-953"></span><br />
Doch diese „einfache“ Lösung bringt Nachteile mit sich:</p>
<ol>
<li>Alle Anhänge müssen zuerst in ein 7Bit-Datenformat umgewandelt werden, was die Daten deutlich größer macht, als auf dem eigenen Computer.</li>
<li>Man weiß nie, ob die Datei nicht vielleicht doch zu groß zum Versenden ist, da sowohl die Dateigröße als auch die Postfachgröße von Absender und Empfänger limitiert sind.</li>
<li>Geschwindigkeit: Der E-Mail-Dienst ist nicht auf effektive Übertragung größerer Datenmengen optimiert.</li>
<li>Im geschäftlichen Umfeld müssen sowohl Empfänger als auch Versender ihre gesamte Korrespondenz — also auch ihre E-Mails — langfristig archivieren. Es muss also jede E-Mail 10 Jahre lang zugriffsbereit gehalten werden — und bindet so langfristig organisatorische und technische Ressourcen bei Absender und Empfänger.</li>
</ol>
<h2>Die bessere Alternative: Datenversand-Webseite</h2>
<p><img class="alignleft size-full wp-image-961" title="Extranet-Dateiupload" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2010/06/Extranet-Dateiupload.png" alt="Dateiübertragung an die Agentur Lindner" width="290" height="188" />Eine bessere Lösung hat die Agentur Lindner jetzt installiert. Auf dem Intranetserver der sich nicht im Rechenzentrum, sondern direkt im Büro der Agentur befindet, wurde in einem öffentlichen Extranet eine spezielle Kundenwebseite eingerichtet, über die bequem Dateien an die Agentur übertragen werden können: <em>Ganz ohne Registrierung, ohne Anmeldung, ohne ftp-Programm, fast ohne Größenbeschränkung (900 MB) und einfach per Mausklick mit allen aktuellen Browsern.</em> Im gewohnten Dateiauswahlfenster können auch mehrere Dateien zum Versand ausgewählt werden (Strg-Taste beim Anklicken der Dateinamen gedrückt halten). Während der Übertragung informiert ein dynamischer Statusbalken über die verstrichene und die Restzeit.<br />
Nach erfolgter Übertragung werde ich sofort per E-Mail über den Eingang neuer Dateien informiert und kann direkt im lokalen Netz zugreifen — ohne die Daten erneut über das Internet herunterladen zu müssen.<br />
<strong>Gerne teile ich Ihnen die Internetadressse zu meinem Extranet mit Dateiübertragungsdienst mit. <em>Testen Sie den neuen Dienst und schicken Sie mir doch mal was Schönes!</em></strong><br />
<!--more--></p>
<h2>Technische Realisation</h2>
<p>Zum Einsatz kam die Software uploadify, die auf jquery, swfobject und php basiert und viele Möglichkeiten der individuellen Anpassung bietet. Der per DSL angebundene Linux-Server nutzt ddclient und Nameserver von Zoneedit und DynDNS zur Auflösung fester Webadressen an seine temporäre IP-Adresse.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.agentur-lindner.com/2010-06-19/dateiubertragung-mit-browser-und-uploadbalken/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Live bei der Arbeit: schon online — aber noch nicht fertig.</title>
		<link>http://blog.agentur-lindner.com/2010-02-04/festplakate-druckerei/</link>
		<comments>http://blog.agentur-lindner.com/2010-02-04/festplakate-druckerei/#comments</comments>
		<pubDate>Thu, 04 Feb 2010 21:13:53 +0000</pubDate>
		<dc:creator>Ralph Lindner</dc:creator>
				<category><![CDATA[Agentur-Tour]]></category>
		<category><![CDATA[Surftipps]]></category>
		<category><![CDATA[Webdesign]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[Mediengestalter]]></category>

		<guid isPermaLink="false">http://blog.agentur-lindner.com/?p=702</guid>
		<description><![CDATA[Dass gute Webseiten nicht mal so schnell gemacht sind und deren Entwicklung und Konzeption wohl überlegt sein müssen stimmt — im Prinzip. Es gilt aber auch abzuwägen, welche Ziele am wichtigsten sind. Beschließt man am 3.2.2010, dass man eine Webseite &#8230; <a href="http://blog.agentur-lindner.com/2010-02-04/festplakate-druckerei/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Dass gute Webseiten nicht mal so schnell gemacht sind und deren Entwicklung und Konzeption wohl überlegt sein müssen stimmt — im Prinzip. Es gilt aber auch abzuwägen, welche Ziele am wichtigsten sind. Beschließt man am 3.2.2010, dass man eine Webseite zur Vermarktung von Festplakaten an Schausteller und Veranstalter von Volksfesten etc. veröffentlichen möchte — und möchte man auch die Suchmaschinen-Nutzer erreichen, die in den nächsten Tagen für Frühjahrsvolksfeste Plakate einkaufen, dann heißt es ganz schnell sein und bloß keinen Tag verlieren.</p>
<p><span id="more-702"></span>Das Hauptaugenmerk legte ich deshalb auf die <strong>optimale Suchmaschineneignung von Anfang an</strong>, somit also auch auf geeignete Texte und natürlich „sprechende“ URLs, Metatags und das Übliche. Das Design der Webseite interessiert die Suchmaschinen nicht und wird deshalb in diesem Fall erst als zweites erledigt, was problemlos möglich ist, da Inhalt und Design aufgrund der Verwendung der WordPress-Software klar voneinander getrennt sind. Ich gehe also gerade umgekehrt vor, wie man es üblicherweise macht um keinen Tag Platzierung im Suchmaschinenindex zu verlieren. Insofern sieht die Seite 24h nach dem Projektstart noch schrecklich aus, beinhaltet aber schon alles, was hoffentlich Google &amp; Co. gefällt und zu einer schnellen und guten Platzierung führt, wenn jemand nach <em>Veranstaltungsplakaten, Leuchtpapier-Plakate, Plakate Leuchtpapier, Festplakat, Volksfestplakat, plakate drucken </em>oder ähnlichem sucht.</p>
<p>Bin gespannt wie sich die Suchmaschinenplatzierung entwickelt.</p>
<p>Ach ja — erreichbar ist die Seite übrigens unter der Adresse <a title="Druckerei liefert Festplakate auf Leuchtpapier" href="http://www.festplakate.de">www.festplakate.de</a>. Aber sehen sie sich besser NICHT an, außer Sie sind ein <em>Spider von Google oder Bing</em>. Dann rollen wir Ihnen natürlich durch diesen Link einen roten Teppich aus und freuen uns, wenn Sie jedes Wort von der neuen Seite gierig aufsaugen und indexieren. Menschliche Besucher warten besser noch ein paar Tage, außer sie wollen sich über ein unausgereiftes Design aufregen.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.agentur-lindner.com/2010-02-04/festplakate-druckerei/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Automarkt Fürth: Nordbayerns großer, unabhängiger Automarkt</title>
		<link>http://blog.agentur-lindner.com/2009-12-15/automarkt-furth-nordbayerns-groser-unabhangiger-automarkt/</link>
		<comments>http://blog.agentur-lindner.com/2009-12-15/automarkt-furth-nordbayerns-groser-unabhangiger-automarkt/#comments</comments>
		<pubDate>Tue, 15 Dec 2009 22:16:13 +0000</pubDate>
		<dc:creator>Ralph Lindner</dc:creator>
				<category><![CDATA[Agentur-Tour]]></category>
		<category><![CDATA[Corporate Design]]></category>
		<category><![CDATA[Webdesign]]></category>
		<category><![CDATA[Kunden]]></category>
		<category><![CDATA[Referenzen]]></category>

		<guid isPermaLink="false">http://blog.agentur-lindner.com/?p=616</guid>
		<description><![CDATA[Die Agentur Lindner erstellt das Corporate Design für Automarkt Fürth und realisiert Webseiten und konzipiert Werbetechnik und Geschäftsausstattung. <a href="http://blog.agentur-lindner.com/2009-12-15/automarkt-furth-nordbayerns-groser-unabhangiger-automarkt/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>Im Fürther Süden, in Sichtweite der Autohäuser der Marken Mercedes, Audi, VW, Seat, auf einem 15.000m² großem Gelände entsteht 2010 der <strong>Automarkt Fürth</strong>. Die Agentur Lindner freut sich, die beiden Betreiber Arnt und Frank Hintermeier bei diesem interessanten Projekt begleiten zu dürfen. So entsteht derzeit im Eiltempo das <a title="Corporate Designhandbuch Automarkt Fürth" href="http://www.youblisher.com/p/11365-Corporate-Designhandbuch-Automarkt-Fuerth/">Corporate Design </a>für das Gesamtprojekt, welches den Mietern und zukünftig dort ansässigen Kfz-Betrieben einen professionellen Rahmen zur individuellen Entfaltung bietet. Zeitgleich erfolgt die Umsetzung auf Webseite, Beschilderung und Geschäftsausstattung.</p>
<div id="attachment_619" class="wp-caption alignleft" style="width: 330px"><a href="http://blog.agentur-lindner.com/wp-content/UPLOADS/2009/12/automarkt-fürth.jpg" rel="lightbox[616]"><img class="size-medium wp-image-619 " title="automarkt-fürth" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2009/12/automarkt-fürth-320x288.jpg" alt="Die neue Größe im Automarkt Fürth´s: der Automarkt Fürth" width="320" height="288" /></a><p class="wp-caption-text">Die neue Größe im Automarkt Fürth´s: der Automarkt Fürth</p></div>
<p>Die Webseite <a href="http://www.automarkt-fuerth.de/">www.automarkt-fuerth.de</a> ist ab sofort erreichbar und wird in den nächsten Monaten nach und nach weiter entwickelt und mit aktuellen Inhalten und Ergänzungen gefüllt.</p>
<p>Jeder Mieter wird in einem virtuellen Rundgang von der Webseite verlinkt und hat die Möglichkeit seine eigene Webseite direkt als Subdomain unter automarkt-fürth.de einzurichten, also z.B. unter der Adresse http://mustermann.automarkt-fürth.de. Geplant ist weiterhin das gesamte Fahrzeugangebot der entstehenden neun Auto-Verkaufsplätze direkt und komplett auf der Webseite zu integrieren.</p>
<p>Ich wünsche meinen langjährigen Geschäftspartnern viel Erfolg mit ihrem neuen Projekt und hoffe durch meine Arbeit einen guten Beitrag zu leisten!</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.agentur-lindner.com/2009-12-15/automarkt-furth-nordbayerns-groser-unabhangiger-automarkt/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Browser-Kompatibilitätstest: Webseitendarstellung testen</title>
		<link>http://blog.agentur-lindner.com/2009-08-03/browser-kompatibilitatstest-webseitendarstellung-testen/</link>
		<comments>http://blog.agentur-lindner.com/2009-08-03/browser-kompatibilitatstest-webseitendarstellung-testen/#comments</comments>
		<pubDate>Mon, 03 Aug 2009 21:51:13 +0000</pubDate>
		<dc:creator>Ralph Lindner</dc:creator>
				<category><![CDATA[Mediengestalter]]></category>
		<category><![CDATA[Surftipps]]></category>
		<category><![CDATA[Typografie]]></category>
		<category><![CDATA[Webdesign]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[Browserkompatibilität]]></category>
		<category><![CDATA[Browsertest]]></category>
		<category><![CDATA[html]]></category>
		<category><![CDATA[PDF]]></category>
		<category><![CDATA[PDF/X1a]]></category>
		<category><![CDATA[PDF/X3]]></category>
		<category><![CDATA[w3c]]></category>
		<category><![CDATA[Windows]]></category>

		<guid isPermaLink="false">http://blog.agentur-lindner.com/?p=526</guid>
		<description><![CDATA[Warum werden Webseiten unterschiedlich dargestellt? Was man tun sollte um dies als Chance zu nutzen, anstatt an dem "Problem" zu scheitern und wie man die Darstellung einer Webseite in zahlreichen Browsern testen kann - ohne diese zu installieren. <a href="http://blog.agentur-lindner.com/2009-08-03/browser-kompatibilitatstest-webseitendarstellung-testen/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<h2>Was ist anders im Web — als beim Druck?</h2>
<p>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.</p>
<p>Im Onlinebereich verhält es sich (leider) völlig anders.</p>
<p><span id="more-526"></span></p>
<h2>Einflussfaktoren für die Darstellung von Webseiten</h2>
<p>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:</p>
<ul>
<li>Bildschirmauflösung des Betrachters</li>
<li>Betriebssystem und installierte Schriften</li>
<li>Browser, –version und –einstellungen</li>
<li>Farbmanagement von Betriebssystem, Browser und nicht zuletzt die Farbtiefe und Bildschirmeinstellungen</li>
</ul>
<p>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</p>
<ul>
<li>ältere Browser haben mit neueren Standards naturgemäß Probleme</li>
<li>auch einige aktuelle Browser erfüllen nur teilweise die Standardanforderungen</li>
</ul>
<h2>Typografie im Web — Denkste!</h2>
<p>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 <a href="http://kingdesk.com/projects/">wp-typography</a> 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.</p>
<h2>Der Weg aus dem Dilemma</h2>
<p>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.<br />
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:</p>
<ol>
<li>Eine Webseite, die nur aus Bildern besteht ist weder für Suchmaschinen, noch für Menschen mit einem visuellen Handicap „sicht„bar</li>
<li>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.</li>
</ol>
<p>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.</p>
<p>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.<br />
Schließlich ist es doch <strong>gut</strong> 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ß.</p>
<p>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.<br />
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.</p>
<h2>Browserweichen und angepasste Stylesheets einsetzen</h2>
<p>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.</p>
<p>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.</p>
<p>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.</p>
<h2>Fehler eliminieren</h2>
<p>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.</p>
<h2>Moderne Standards nutzen und Workarounds minimieren</h2>
<p>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.</p>
<p>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.</p>
<div id="attachment_537" class="wp-caption alignleft" style="width: 160px"><a href="http://blog.agentur-lindner.com/wp-content/UPLOADS/2009/08/browsershots-org-Webseitensnapshots.png" rel="lightbox[526]"><img class="size-thumbnail wp-image-537" title="browsershots-org Webseitensnapshots" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2009/08/browsershots-org-Webseitensnapshots-150x150.png" alt="So sieht die Seite blog.agentur-lindner.com in 34 verschiedenen Browsern aus" width="150" height="150" /></a><p class="wp-caption-text">So sieht die Seite blog.agentur-lindner.com in 34 verschiedenen Browsern aus</p></div>
<p>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 <a href="http://www.browsershots.org">www.browsershots.org</a>. 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!</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.agentur-lindner.com/2009-08-03/browser-kompatibilitatstest-webseitendarstellung-testen/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Design und Umsetzung für den Pumpen-Service Wagner</title>
		<link>http://blog.agentur-lindner.com/2009-07-07/pumpen-service-wagner-meine-tatigkeiten/</link>
		<comments>http://blog.agentur-lindner.com/2009-07-07/pumpen-service-wagner-meine-tatigkeiten/#comments</comments>
		<pubDate>Tue, 07 Jul 2009 14:14:35 +0000</pubDate>
		<dc:creator>Ralph Lindner</dc:creator>
				<category><![CDATA[Agentur-Tour]]></category>
		<category><![CDATA[Corporate Design]]></category>
		<category><![CDATA[Mediengestalter]]></category>
		<category><![CDATA[Webdesign]]></category>
		<category><![CDATA[Kunden]]></category>
		<category><![CDATA[Referenzen]]></category>

		<guid isPermaLink="false">http://blog.agentur-lindner.com/?p=856</guid>
		<description><![CDATA[Die Firma Pumpen-Service-Wagner GmbH in Nürnberg ist technischer Kundendienst für Reparatur und Wartung von Pumpen. Die Firma ist als GRUNDFOS authorisierter Partner überwiegend bei Kunden im Raum Nordbayern im Einsatz. Für Pumpen-Service-Wagner waren besonders zwei Dinge wichtig: 1.) von der &#8230; <a href="http://blog.agentur-lindner.com/2009-07-07/pumpen-service-wagner-meine-tatigkeiten/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><img style="float: left; margin: 0 10px 10px 0;" title="Logo Pumpen-Service Wagner" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2010/03/Logo_180px.jpg" alt="Logo Pumpen-Service Wagner" width="180" height="75" />Die Firma Pumpen-Service-Wagner GmbH in Nürnberg ist technischer Kundendienst für Reparatur und Wartung von Pumpen. Die Firma ist als GRUNDFOS authorisierter Partner überwiegend bei Kunden im Raum Nordbayern im Einsatz.<br />
Für Pumpen-Service-Wagner waren besonders zwei Dinge wichtig:<br />
1.) von der Zielgruppe gefunden und erreicht werden<br />
2.) die professionelle Leistung zeitgemäß und professionell vermitteln.<br />
Bei den Kunden handelt es sich um Industriekunden, Gewerbe, öffentliche Hand (Versorger), aber auch Privatkunden.<br />
Das Erscheinungsbild sollte nicht zu kühl technisch, sondern modern und freundlich, aber vor allem auch unverwechselbar und individuell mit einem hohen Wiedererkennungswert sein. Selbstverständlich soll es auch den Anforderungen des wichtigen Industriepartners GRUNDFOS genügen. Ein optischer Bezug zum Thema „Pumpe“ sollte herstellbar sein. Wie üblich habe ich das für den Kunden entwickelte Corporate Design wieder in einem <a href="http://www.youblisher.com/p/13942-Corporate-Designhandbuch-Pumpen-Service-Wagner/">Handbuch</a> dokumentiert.</p>
<p>Damit die Webseite von <a title="Pumpen-Service Wagner, Nürnberg" href="http://www.pumpen-service-wagner.de/">Pumpen-Service-Wagner </a>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 <strong>bei allen relevanten Suchbegriffen, </strong>wie z.B. „Pumpenreparatur Nürnberg“, „Grundfos Reparatur“, „Pumpenservice“ <strong>immer auf der ersten Ergebnisseite </strong>relevanter Suchmaschinen angezeigt wird.</p>
<p>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 <strong>Hosting der Webseite</strong> und den Mailserver verantwortlich.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.agentur-lindner.com/2009-07-07/pumpen-service-wagner-meine-tatigkeiten/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Fleischmann &amp; friends Corporate Design</title>
		<link>http://blog.agentur-lindner.com/2009-07-06/fleischmann-friends-corporate-design/</link>
		<comments>http://blog.agentur-lindner.com/2009-07-06/fleischmann-friends-corporate-design/#comments</comments>
		<pubDate>Mon, 06 Jul 2009 19:52:31 +0000</pubDate>
		<dc:creator>Ralph Lindner</dc:creator>
				<category><![CDATA[Corporate Design]]></category>
		<category><![CDATA[Webdesign]]></category>
		<category><![CDATA[Kunden]]></category>
		<category><![CDATA[Referenzen]]></category>

		<guid isPermaLink="false">http://blog.agentur-lindner.com/?p=839</guid>
		<description><![CDATA[Horst Fleischmann konzipiert und vertreibt Drucksachen aller Art. Als Netzwerker arbeitet er mit spezialisierten Designern, Textern, Fotografen und Druckereien zusammen. Ich erstellte für ihn ein modernes Corporate Design, das ich auf seiner Webseite und für Geschäftsdrucksachen umsetzte. Wie bei mir &#8230; <a href="http://blog.agentur-lindner.com/2009-07-06/fleischmann-friends-corporate-design/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><img style="float: left; margin: 0 15px 5px 0;" title="Logo von Fleischmann &amp; friends" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2010/03/logo.gif" alt="" width="273" height="100" />Horst Fleischmann konzipiert und vertreibt Drucksachen aller Art. Als Netzwerker arbeitet er mit spezialisierten Designern, Textern, Fotografen und Druckereien zusammen. Ich erstellte für ihn ein modernes Corporate Design, das ich auf seiner <a href="http://www.fleischmann-druck.de/">Webseite </a>und für Geschäftsdrucksachen umsetzte.<br />
<a href="http://www.youblisher.com/p/13889-Fleischmann-Friends-CD-Handbuch/" target="_blank"><img style="float: right; margin: 0 0 3px 3px;" src="http://www.youblisher.com/files/publications/3/13889/200x300.jpg" alt="Fleischmann &amp; Friends CD-Handbuch" /></a>Wie bei mir üblich erhalten Kunden eine dem Projektumfang angemessene Dokumentation in einem <a href="http://www.youblisher.com/p/13889-Fleischmann-Friends-CD-Handbuch/">Designhandbuch</a>. Sämtliche dem Gestaltungskonzept zugrundeliegenden Informationen sind darin dokumentiert, so dass ggf. auch von ihm beauftragte Grafiker, Gestalter, Werbetechniker etc. dies als Arbeitsgrundlage nutzen können.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.agentur-lindner.com/2009-07-06/fleischmann-friends-corporate-design/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Ein ordentliches Stylesheet zum Drucken</title>
		<link>http://blog.agentur-lindner.com/2009-06-23/webseiten-drucken-mit-print-stylesheet/</link>
		<comments>http://blog.agentur-lindner.com/2009-06-23/webseiten-drucken-mit-print-stylesheet/#comments</comments>
		<pubDate>Tue, 23 Jun 2009 15:00:17 +0000</pubDate>
		<dc:creator>Ralph Lindner</dc:creator>
				<category><![CDATA[Mediengestalter]]></category>
		<category><![CDATA[Webdesign]]></category>
		<category><![CDATA[ausdruck]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[print-stylesheet]]></category>

		<guid isPermaLink="false">http://blog.agentur-lindner.com/?p=48</guid>
		<description><![CDATA[In diesem Artikel möchte ich helfen, ein ordentliches Print-Stylesheet zu bauen und richte mich an Anfänger und Fortgeschrittene in Sachen HTML &#38; CSS. Nicht alle Tricks die man verwenden kann werden hier gelistet, jedoch bestimmt wissenswertes, was man nicht unbedingt &#8230; <a href="http://blog.agentur-lindner.com/2009-06-23/webseiten-drucken-mit-print-stylesheet/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p>In diesem Artikel möchte ich helfen, ein ordentliches Print-Stylesheet zu bauen und richte mich an Anfänger und Fortgeschrittene in Sachen HTML &amp; CSS. Nicht alle Tricks die man verwenden kann werden hier gelistet, jedoch bestimmt wissenswertes, was man nicht unbedingt beim W3C oder SELFHTML erfährt.</p>
<p>Du hast eine Webseite ohne Print-Stylesheet und willst deine Seite für die Druckausgabe optimieren. Gehen wir es an!</p>
<p><span id="more-48"></span></p>
<h2>Der Weg zu einem Print-Stylesheet</h2>
<h3>media=„screen“ oder lieber überschreiben?</h3>
<p>Die Zeile im Head-Bereich unseres (X)HTML-Dokuments, in der das Stylesheet aufgerufen wird schaut für gewöhnlich so aus:<br />
<span style="color: #339966;"><span class="nodeLabelBox repTarget">&lt;<span class="nodeTag">link</span><span class="nodeAttr editGroup"> <span class="nodeName editable">type</span>=„<span class="nodeValue editable">text/css</span>“</span><span class="nodeAttr editGroup"> <span class="nodeName editable">href</span>=„style.css“</span><span class="nodeAttr editGroup"> <span class="nodeName editable">rel</span>=„<span class="nodeValue editable">stylesheet</span>“</span><span class="nodeBracket editable insertBefore"><span style="color: #000000;">.<br />
Das bedeutet, es wird eine CSS-Datei aufgerufen, die für <em>ALLE</em> Medien verwendet wird. Mit folgender Zeile rufen wir eine CSS-Datei auf, die sich nur auf das Medium „Print“ bezieht:<br />
</span></span></span></span><span class="nodeLabelBox repTarget"><span style="color: #339966;">&lt;<span class="nodeTag">link</span><span class="nodeAttr editGroup"> <span class="nodeName editable">type</span>=„<span class="nodeValue editable">text/css</span>“</span><span class="nodeAttr editGroup"> <span class="nodeName editable">href</span>=„<span class="nodeValue editable">print.css</span>“</span><span class="nodeAttr editGroup"> <span class="nodeName editable">rel</span>=„<span class="nodeValue editable">stylesheet</span>“ media=„print“</span></span><span class="nodeBracket editable insertBefore"><span style="color: #339966;">&gt;</span></span></span><br />
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<br />
<span style="color: #339966;"><span class="nodeLabelBox repTarget">&lt;<span class="nodeTag">link</span><span class="nodeAttr editGroup"> <span class="nodeName editable">type</span>=„<span class="nodeValue editable">text/css</span>“</span><span class="nodeAttr editGroup"> <span class="nodeName editable">href</span>=„<span class="nodeValue editable">style.css</span>“</span><span class="nodeAttr editGroup"> <span class="nodeName editable">rel</span>=„<span class="nodeValue editable">stylesheet</span>“ media=„screen“</span><span class="nodeBracket editable insertBefore">&gt;</span></span></span>,<br />
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.</p>
<p>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.</p>
<h3>@print — Anweisungen</h3>
<p>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:<br />
<span style="color: #339966;">@page {<br />
size: auto;<br />
margin: 0.5cm 0.5cm 1cm 1.5cm;<br />
}</span></p>
<p>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.</p>
<h3>Display:none;</h3>
<p><span style="color: #339966;">#navi {<br />
display:none;<br />
}</span></p>
<p>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.</p>
<h2>Brauchbar trotz S/W-Drucker</h2>
<p>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 <a title="Visulisierung des Verweisziels" href="http://aktuell.de.selfhtml.org/artikel/css/drucklayout/index.htm#verweisziel">SELFHTML</a> 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.</p>
<h2>nur für den Druck!</h2>
<p>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.</p>
<h2>Positionierung anders als sonst</h2>
<p>Auf Seiten wie <a title="zur Webseite der Agentur Lindner" href="http://ww.agentur-lindner.com">www.agentur-lindner.com</a> 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.<br />
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.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.agentur-lindner.com/2009-06-23/webseiten-drucken-mit-print-stylesheet/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Blockwerk-Nürnberg — hier gibt´s die Blocks</title>
		<link>http://blog.agentur-lindner.com/2009-05-22/blockwerk-nurnberg/</link>
		<comments>http://blog.agentur-lindner.com/2009-05-22/blockwerk-nurnberg/#comments</comments>
		<pubDate>Fri, 22 May 2009 11:07:34 +0000</pubDate>
		<dc:creator>Ralph Lindner</dc:creator>
				<category><![CDATA[Agentur-Tour]]></category>
		<category><![CDATA[Webdesign]]></category>
		<category><![CDATA[Block]]></category>
		<category><![CDATA[Hosting]]></category>
		<category><![CDATA[Kunden]]></category>
		<category><![CDATA[Referenzen]]></category>

		<guid isPermaLink="false">http://blog.agentur-lindner.com/?p=267</guid>
		<description><![CDATA[Blocks in allen Variationen gibt es auf der Webseite www.blockwerk-nuernberg.de, welche die Agentur Lindner hier vorstellt. <a href="http://blog.agentur-lindner.com/2009-05-22/blockwerk-nurnberg/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<div id="attachment_268" class="wp-caption alignleft" style="width: 310px"><a href="http://blog.agentur-lindner.com/wp-content/UPLOADS/2009/06/blockwerk-nuernberg.png" rel="lightbox[267]"><img class="size-medium wp-image-268" title="blockwerk-nuernberg" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2009/06/blockwerk-nuernberg-300x240.png" alt="Vorschau der Blockwerk-Nuernberg-Webseite" width="300" height="240" /></a><p class="wp-caption-text">Vorschau der Blockwerk-Nuernberg-Webseite</p></div>
<p>Im Mai 2009 stellt die Agentur Lindner die Webseite des <a title="Link zur Webseite des Blockwerk-Nürnberg" href="http://www.blockwerk-nuernberg.de">Blockwerk-Nürnberg </a> für die Druckerei Müller in Nürnberg fertig. Die moderne, im „Schreibtisch mit Block“-Design gestaltete Webseite ist in XHTML 1.0 kodiert und nutzt Web2.0-Techniken für eine ergonomische Bedienung.<br />
Die Agentur Lindner ist für Konzeption, Design, technische Umsetzung sowie das Hosting der Webseite zuständig. Besucher der Webseite, die ein individuell angepasstes Blockdesign wünschen, können Ihre Vorgaben direkt über einen speziellen Webseitendialog mitteilen und erhalten dann ein individuelles Angebot sowohl über die Druck– als auch über die Grafikleistung.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.agentur-lindner.com/2009-05-22/blockwerk-nurnberg/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Logo und Designarbeiten für den Kfz-Handel</title>
		<link>http://blog.agentur-lindner.com/2008-04-08/logo-und-design-fuer-autohandel/</link>
		<comments>http://blog.agentur-lindner.com/2008-04-08/logo-und-design-fuer-autohandel/#comments</comments>
		<pubDate>Tue, 08 Apr 2008 16:05:58 +0000</pubDate>
		<dc:creator>Ralph Lindner</dc:creator>
				<category><![CDATA[Agentur-Tour]]></category>
		<category><![CDATA[Corporate Design]]></category>
		<category><![CDATA[Webdesign]]></category>
		<category><![CDATA[Hosting]]></category>
		<category><![CDATA[Referenzen]]></category>

		<guid isPermaLink="false">http://blog.agentur-lindner.com/?p=371</guid>
		<description><![CDATA[Professionalität ist keine Frage der Größe. Nach diesem Motto arbeitet die Agentur Lindner — und auch einige meiner Kunden fühlen sich diesem Anspruch verpflichtet. So arbeite ich schon seit vielen Jahren für den Autohandel von Frank Hintermeier in Nürnberg-Eibach. 2004 &#8230; <a href="http://blog.agentur-lindner.com/2008-04-08/logo-und-design-fuer-autohandel/">Weiterlesen <span class="meta-nav">&#8594;</span></a>]]></description>
			<content:encoded><![CDATA[<p><strong>Professionalität ist keine Frage der Größe. </strong>Nach diesem Motto arbeitet die Agentur Lindner — und auch einige meiner Kunden fühlen sich diesem Anspruch verpflichtet. <img class="alignright size-full wp-image-411" title="Automarkt-Eibach" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/Automarkt-Eibach.jpg" alt="Automarkt-Eibach" width="320" height="211" />So arbeite ich schon seit vielen Jahren für den Autohandel von Frank Hintermeier in Nürnberg-Eibach. 2004 konnte ich den Inhaber überzeugen, dass der alte Schriftzug (Firmenname in der „70er Jahre“-Schriftart „Cooper“ begleitet von einer Zeichnung eines 50er Jahre SL) nicht mehr dem Anspruch und der Professionalität seines modernen Autohandels gerecht wird.<span id="more-371"></span>So wurde ich mit der Erstellung eines neuen Erscheinungsbildes für den Automarkt Eibach beauftragt.</p>
<p>Welche Eckpunkte ergaben sich aus der Analyse und dem Briefing durch den Kunden?</p>
<ul>
<li>Wunsch die gelbe Farbe als Wiedererkennung beizubehalten;</li>
<li>Große Bedeutung des Internet als Vermarktungsplattform — mit weiteren Zuwachsraten;</li>
<li>europäische (internationale) Ausrichtung des Autohandels;</li>
<li>Seriosität und Professionalität, Verantwortlichkeit des Inhabers, langjährige Erfahrung;</li>
<li>Wunsch einer modernen und markanten, aber auch zeitlosen und gut lesbaren Typografie</li>
<li>Geplante bauliche Veränderungen mit Edelstahl– und anderen Metallelementen</li>
</ul>
<p>Mit diesen Vorgaben machte ich mich an die Arbeit und entwickelte ein einfaches, aber stimmiges und zum Kunden passendes Konzept. Zu einem markanten Element wurde ein gelber Pfeil, der nicht zufällig an einen Mauszeiger erinnert. Metallische Hintergründe, bzw. deren Simulation mit geeigneten Verläufen und Strukturen sind ein wiederkehrendes Designelement. Ein Designkonzept, das seitdem in vielen Produkten, von der Schreibunterlage, den Kfz-Kennzeichenträgern, Nummernschildplatten, Firmenbeschilderung aber auch Visitenkarten und Dokumentvorlagen für Fahrzeugverkaufsschilder umgesetzt wurde.</p>
<div style="float:right">
<div id="attachment_379" class="wp-caption alignleft" style="width: 160px"><a href="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_11.png" rel="lightbox[371]"><img class="size-thumbnail wp-image-379" title="Automarkt Eibach C.D. Handbuch S. 1" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_11-150x150.png" alt="C.D. Seite 1 Automarkt Eibach" width="150" /></a><p class="wp-caption-text">Handbuch S. 1</p></div>
<div id="attachment_382" class="wp-caption alignleft" style="width: 160px"><a href="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_21.png" rel="lightbox[371]"><img class="size-thumbnail wp-image-382" title="Automarkt Eibach C.D. Handbuch S. 2" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_21-150x150.png" alt="C.D. Seite 2 Automarkt Eibach" width="150" /></a><p class="wp-caption-text">Handbuch S. 2</p></div>
<div id="attachment_383" class="wp-caption alignleft" style="width: 160px"><a href="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_3.png" rel="lightbox[371]"><img class="size-thumbnail wp-image-383" title="Automarkt Eibach C.D. Handbuch S. 3" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_3-150x150.png" alt="C.D. Seite 3 Automarkt Eibach" width="150" height="150" /></a><p class="wp-caption-text">Handbuch S. 3</p></div>
<div id="attachment_386" class="wp-caption alignleft" style="width: 160px"><a href="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_4.png" rel="lightbox[371]"><img class="size-thumbnail wp-image-386" title="Automarkt Eibach C.D. Handbuch S. 4" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_4-150x150.png" alt="C.D. Seite 4 Automarkt Eibach" width="150" height="150" /></a><p class="wp-caption-text">Handbuch S. 4</p></div>
<div id="attachment_388" class="wp-caption alignleft" style="width: 160px"><a href="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_5.png" rel="lightbox[371]"><img class="size-thumbnail wp-image-388" title="Automarkt Eibach C.D. Handbuch S. 5" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_5-150x150.png" alt="C.D. Seite 5 Automarkt Eibach" width="150" height="150" /></a><p class="wp-caption-text">Handbuch S. 5</p></div>
<div id="attachment_391" class="wp-caption alignleft" style="width: 160px"><a href="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_6.png" rel="lightbox[371]"><img class="size-thumbnail wp-image-391" title="Automarkt Eibach C.D. Handbuch S. 6" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/handbuch_Seite_6-150x150.png" alt="C.D. Seite 6 Automarkt Eibach" width="150" height="150" /></a><p class="wp-caption-text">Handbuch S. 6</p></div>
</div>
<p>Die für ein Corporate Design geringe horizontale Ausarbeitung ist dem Projektetat und dem Einsatzzweck angemessen. Dennoch erhält hier auch ein inhabergeführter Kleinbetrieb eine professionelle Grundkonzeption mit ordentlicher Dokumentation. So erreicht der Kunde neben einem einheitlichen, professionellem Erscheinungsbild auch eine Unabhängigkeit von seinem Designer. Gerne mache ich meine Kunden durch solche Dokumentationen von mir unabhängig, denn ich möchte, dass meine Kunden gerne und freiwillig zu mir zurückkommen — nicht, weil sonst niemand eine Dokumentation der Kommunikations-Richtlinien kennt.</p>
<h2>Website-Relaunch in 2008</h2>
<p><div id="attachment_421" class="wp-caption alignleft" style="width: 330px"><img class="size-full wp-image-421" title="Visitenkarte_Automarkt-Eibach" src="http://blog.agentur-lindner.com/wp-content/UPLOADS/2004/04/Visitenkarte_Automarkt-Eibach.jpg" alt="Visitenkarte_Automarkt-Eibach" width="320" height="201" /><p class="wp-caption-text">Visitenkarte des Automarkt Eibach</p></div><br />
Die Agentur Lindner ist nicht nur für das Design, sondern auch für die Entwicklung und das Hosting der <a title="Zur Webseite des Automarkt Eibach" href="http://www.automarkt-eibach.de">Webseite des Automarkt Eibach</a> sowie den Mailserver zuständig. Die Webseite wurde 2008 komplett überarbeitet. Integriert wurde ein externes Datenbankangebot, neue statische Seiten, neu aufgenommene Fotos, eine Anfahrtsroutenberechnung und eine Animation für die Startseite. Der Kunde profitiert vom breiten Tätigkeitsbereich der Agentur Lindner. Es freut mich, dass ich ihm bei allen Fragen rund um Grafik, Druck oder Internet als persönlicher Ansprechpartner zur Verfügung stehen kann.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.agentur-lindner.com/2008-04-08/logo-und-design-fuer-autohandel/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
