<?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>professional WebDesign barrierefrei &#187; usability</title>
	<atom:link href="http://www.webdesign-in.de/category/usability/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.webdesign-in.de</link>
	<description>Professional WebDesign barrierefrei ist effizient, leistbar und bringt Kunden.</description>
	<lastBuildDate>Wed, 23 Nov 2011 16:23:11 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.8.6</generator>
	<language>en</language>
	<sy:updatePeriod>daily</sy:updatePeriod>
	<sy:updateFrequency>4</sy:updateFrequency>
			<item>
		<title>Suchergebnisse nach Relevanz auf WebDesign in de</title>
		<link>http://www.webdesign-in.de/mts/suchergebnisse-nach-relevanz-auf-webdesign-in-de/</link>
		<comments>http://www.webdesign-in.de/mts/suchergebnisse-nach-relevanz-auf-webdesign-in-de/#comments</comments>
		<pubDate>Fri, 12 Sep 2008 20:07:57 +0000</pubDate>
		<dc:creator>mts</dc:creator>
				<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.webdesign-in.de/?p=879</guid>
		<description><![CDATA[Die Suchergebnisse versuchte ich benutzerfreundlicher zu gestalten, indem ich WP Plugins nutzte, die das Ergebnis nach Relevanz ordnen und gleichzeitig das Suchwort hervorheben. ]]></description>
			<content:encoded><![CDATA[Copyright &copy; 2012 <a href="http://www.webdesign-in.de">mts</a>. Visit the original article at <a href="http://www.webdesign-in.de/mts/suchergebnisse-nach-relevanz-auf-webdesign-in-de/">http://www.webdesign-in.de/mts/suchergebnisse-nach-relevanz-auf-webdesign-in-de/</a>.<br /><dl class="left" style="width:480px;">
<dt> Ansicht der Suchergebnisse &nbsp;</dt>
<dd><img src="http://www.webdesign-in.de/wp-images/0908/webdesign-08-suche.gif" alt=" Ansicht der Suchergebnisse auf WebDesign-in.de" width="475" height="174" /></dd>
</dl>
<p> <span class="caplize">W</span>ordPress hat die Angewohnheit die Suchergebnisse ebenfalls nach dem Ver&#246;ffentlichungsdatum anzuzeigen. Au&#223;erdem durchsucht es nur Artikel. Keine statischen Seiten, keine benutzerdefinierten Felder und keine individuellen Ausz&#252;ge, so man diese getippt hat.</p>
<h3>Search everything</h3>
<p>Dieses WP Plugin hat eine Konfigurationsseite und so kann man einstellen was WordPress durchsuchen soll. Search everything ist von <a href="http://dancameron.org/wordpress/plugins/search-everything" title="null">Dan Cameron</a>.</p>
<p>Damit lasse ich alles &#8211; bis auf private <span id="more-879"></span>Seiten- durchsuchen. Ich habe zwar derzeit keine, doch wer wei&#223; und &#8220;privat&#8221; soll &#8220;privat&#8221; bleiben.</p>
<h3>Relevante Textstellen anzeigen</h3>
<p>Mit dem WP Plugin Search Excerpt kann man die relevanten Textstellen anzeigen. Somit sieht der Suchende besser, ob das Suchergebnis auch wirklich das ist wonach er suchte. </p>
<p>Search Excerpt ist von <a href="http://scott.yang.id.au/code/search-excerpt/" title="Search Excerpt">Scott Yang</a>. </p>
<h3>Die Datenbank suchen lassen und nicht WordPress</h3>
<p>Mit Search Everything schafft man WordPress an &#8220;was&#8221; es durchsuchen soll und mit Search Reloaded &#8220;wie&#8221; es durchsucht wird. Das WP Plugin Search Reloaded nimmt die Volltextsuche der Datenbank und es kommt von Semiologic. </p>
<p>Dies kann auch zur Folge haben, dass man <abbr title="Hyper Text Markup Language"><span class="abbr" title="Hyper Text Markup Language">HTML</span></abbr> oder <abbr title="Cascading Style Sheet"><span class="abbr" title="Cascading Style Sheet">CSS</span></abbr> sieht, wenn darin das Suchwort vorkommt. </p>
<h3>The_title ebenfalls hervorheben</h3>
<p>Nun w&#252;rde alles gefunden und hervorgehoben, aber nicht, wenn es im Artikeltitel vorkommt. Damit auch dies ber&#252;cksichtigt wird, kann man im Template search.php folgendes machen.</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">  <span style="color: #b1b100;">while</span> <span style="color: #009900;">&#40;</span>have_posts<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">:</span> the_post<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> 
	<span style="color: #000088;">$title</span> 	<span style="color: #339933;">=</span> get_the_title<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #000088;">$keys</span><span style="color: #339933;">=</span> <span style="color: #990000;">explode</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot; &quot;</span><span style="color: #339933;">,</span><span style="color: #000088;">$s</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
	<span style="color: #000088;">$title</span> 	<span style="color: #339933;">=</span> <span style="color: #990000;">preg_replace</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'/('</span><span style="color: #339933;">.</span><span style="color: #990000;">implode</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">'|'</span><span style="color: #339933;">,</span> <span style="color: #000088;">$keys</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">.</span><span style="color: #0000ff;">')/iu'</span><span style="color: #339933;">,</span>
		<span style="color: #0000ff;">'&lt;strong class=&quot;search-excerpt&quot;&gt;\0&lt;/strong&gt;'</span><span style="color: #339933;">,</span>
		<span style="color: #000088;">$title</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre></div></div>

<p>Nun nach dem Template Tag</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">&lt;?php</span> the_title<span style="color: #009900;">&#40;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span> <span style="color: #000000; font-weight: bold;">?&gt;</span></pre></div></div>

<p>suchen und den so ab&#228;ndern:</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">&lt;?php</span> <span style="color: #b1b100;">echo</span> <span style="color: #000088;">$title</span><span style="color: #339933;">;</span> <span style="color: #000000; font-weight: bold;">?&gt;</span></pre></div></div>

<p>Hat das verwendete Theme keine search.php einfach die archive.php oder index.php als search.php abspeichern.</p>
<h3>Das CSS anpassen</h3>
<p>Die style.css des verwendeten Themes &#246;ffnen und an einer Stelle, die man selber wiederfindet folgendes erg&#228;nzen und die Farben passend &#228;ndern:</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #666666; font-style: italic;">/*-----suchergebnisse---*/</span>
strong<span style="color: #339933;">.</span>search<span style="color: #339933;">-</span>excerpt<span style="color: #009900;">&#123;</span>
background<span style="color: #339933;">-</span>color<span style="color: #339933;">:</span><span style="color: #666666; font-style: italic;">#2e5b7d;
</span>color<span style="color: #339933;">:</span><span style="color: #666666; font-style: italic;">#fff;
</span>padding<span style="color: #339933;">:</span>2px 3px<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span></pre></div></div>

<p>Das war es. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/zwinker.gif' alt=':zwinker:' class='wp-smiley' />  3 Plugins aktiviert. Minimale Ver&#228;nderungen in einem Template und in der style.css und schon sind die Suchergebnisse  </p>
<ol>
<li>1. relevanter und
</li>
<li>2. sicher benutzerfreundlicher, dies kann
</li>
<li>3. bewirken, dass die Besucher gerne l&#228;nger bleiben.</li>
</ol>
<div class="sign">Weitersagen ausdr&#252;cklichst erw&#252;nscht, mts</div>
]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-in.de/mts/suchergebnisse-nach-relevanz-auf-webdesign-in-de/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Tools, die ablenken</title>
		<link>http://www.webdesign-in.de/mts/tools-die-ablenken/</link>
		<comments>http://www.webdesign-in.de/mts/tools-die-ablenken/#comments</comments>
		<pubDate>Sun, 06 Jul 2008 16:25:00 +0000</pubDate>
		<dc:creator>mts</dc:creator>
				<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.webdesign-in.de/mts/tools-die-ablenken/</guid>
		<description><![CDATA[Ich suchte ein Farbentool - Colour Contrast Check- und landete bei einer  Cartoon - Vectorgrafik Spielerei -Befunky Cartoonizer. Was gewittrige Sonntage alles bewirken. ]]></description>
			<content:encoded><![CDATA[Copyright &copy; 2012 <a href="http://www.webdesign-in.de">mts</a>. Visit the original article at <a href="http://www.webdesign-in.de/mts/tools-die-ablenken/">http://www.webdesign-in.de/mts/tools-die-ablenken/</a>.<br /><dl class="left" style="width:355px;">
<dt> Katze als Cartoon &nbsp;</dt>
<dd><img src="http://www.webdesign-in.de/wp-images/0708/cat-befunky.jpg" alt=" Katze als Cartoon mit befunky" width="350" height="288" /></dd>
</dl>
<p><span class="caplize">U</span>m die Benutzerfreundlichkeit von Webseiten zu erh&#246;hen ist es empfehlenswert auf die Farben zu achten. Unabh&#228;ngig der Tatsache, dass Farben Stimmungen transportieren und so zum Weiterlesen animieren oder nicht. Es geht auch um den Kontrast.  Nun ich wu&#223;te, dass ich unter all meinen Favoriten &#8211; geordnet nach Ordnern &#8211; so ein Tool wo drin habe.  &#8220;<span lang="en"  xml:lang="en">Colour Contrast Check</span>&#8221; hei&#223;t es und begleitet mich schon lange.  Was brauche ich Suchmaschinen! Ich habe doch Ordnung in meinen Favoriten. (&#8230;.) Unter &#8220;usability&#8221; fand ich es denn dann auch, doch vorher war dort ein anderes Tool.  Der Befunky Cartoonizer. Keine Ahnung wer denn da reinschummelte &#8211; ich habe doch Ordnung..</p>
<p>Nun denn hier sind einige der Ergebnisse des <a href="http://www.befunky.com/cartoonizer/index.php" title="Befunky Cartoonizer">Befunky Cartoonizers</a>, der Suchtcharakter hat. Zumindest wenn es drau&#223;en tr&#252;b ist, sich ein Gewitter n&#228;hert und man so an und f&#252;r sich v&#246;llig was anderes machen <span id="more-849"></span>sollte.  zB.: Farben auf Kontrast pr&#252;fen.  So sehr ich auch dieses <a href="http://snook.ca/technical/colour_contrast/colour.html" title="Colour Contrast Tool">Farb Kontrast Pr&#252;f &#8211; Tool</a> sch&#228;tze, gegen den Funky Cartoonizer ist es einfach machtlos &#8211; ich auch.  </p>
<dl class="left" style="width:255px;">
<dt>Mini Zug-Linzer Hauptplatz </dt>
<dd><img src="http://www.webdesign-in.de/wp-images/0708/zug-befunky.jpg" alt="Mini Zug meiner Stadt Linz als Cartoon" width="259" height="206" /></dd>
</dl>
<dl class="left" style="width:250px;">
<dt>Tulpen</dt>
<dd><img src="http://www.webdesign-in.de/wp-images/0708/tulpe-befunky.jpg" alt=" Tulpen als Cartoon" width="250" height="206" /></dd>
</dl>
<div class="sign">Viel Spa&#223; und nicht vergessen beide Tools in die Favoriten legen und die sch&#246;n ordnen.</div>
]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-in.de/mts/tools-die-ablenken/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>WordPress 2.5 hat ein neues Admincenter-meine Augen tun weh-Widgets komplizierter</title>
		<link>http://www.webdesign-in.de/mts/wordpress-2-5-admincenter-unlesbar-loesung/</link>
		<comments>http://www.webdesign-in.de/mts/wordpress-2-5-admincenter-unlesbar-loesung/#comments</comments>
		<pubDate>Thu, 28 Feb 2008 12:40:39 +0000</pubDate>
		<dc:creator>mts</dc:creator>
				<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.webdesign-in.de/mts/wordpress-2-5-admincenter-unlesbar-loesung/</guid>
		<description><![CDATA[WordPress 2.5 wird das Admincenter ver&#228;ndern. Neue Farben, neue Aufteilungen erwarten einem. Ich habe mir die Entwicklerversion geladen und schildere hier meine ersten Eindr&#252;cke und die Tatsache, dass ich nichts lesen kann und mir nach gut 30 Minuten die Augen weh tun. ]]></description>
			<content:encoded><![CDATA[Copyright &copy; 2012 <a href="http://www.webdesign-in.de">mts</a>. Visit the original article at <a href="http://www.webdesign-in.de/mts/wordpress-2-5-admincenter-unlesbar-loesung/">http://www.webdesign-in.de/mts/wordpress-2-5-admincenter-unlesbar-loesung/</a>.<br /><dl class="left" style="width:315;">
<dt> WP 2.5 Login&nbsp;</dt>
<dd><img src="http://www.webdesign-in.de/wp-images/0208/wp-25-login.gif" alt=" Login von WP 2.5" width="307" height="398" /></dd>
</dl>
<p><span class="caplize">D</span>as neue WordPress 2.5 hat viel f&#252;r ein neues Admincenter gemacht. Aufger&#228;umter und auch (un)logischer werden einige Aufgaben nun zu machen sein. Andererseits hat dieses neue Adminincenter auch neue Farben und eine neue Breite und viel kleinere Schrift. </p>
<p>Ich werde hier aufzeigen wie ich das neue WP 2.5. Admincenter auf meinem 1440px Bildschirm sehe und wie ich mit ganz wenigen Mitteln mir dann eine Umgebung machte, die ich zumindest  lesen kann und wo mir vor allem meine Augen nicht mehr so weh tun.</p>
<p>Und ich zeige auf, woran man sich vermutlich gew&#246;hnen wird m&#252;ssen, oder hoffen, dass all dies nur in der Entwicklerversion so ist- stark hoffen <img src='http://www.webdesign-in.de/wp-includes/images/smilies/zwinker.gif' alt=':zwinker:' class='wp-smiley' /> </p>
<p>Dies ist ein Artikel &#252;ber das unangenehme beim neuen WP 2.5. &#8211; loben kann ich es an anderer<span id="more-825"></span>  Stelle <img src='http://www.webdesign-in.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<h3>Beitr&#228;ge in WP 2.5. schreiben, alle Felder ausf&#252;llen-zum Speichern nach oben scrollen</h3>
<p><strong>Achtung:</strong> Folgender Screenshot ist 1440px breit und elends lang. Bei all den kleinen Screenshots hat man nicht das richtige Feeling dachte ich mir. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' />  <small>Einfach auf das kleine Gr&#252;ne Pfeilchen unten klicken und der Screen geht voll auf. </small></p>
<p>Er zeigt wie man zuk&#252;nftig in WordPress Beitr&#228;ge schreiben kann. All die n&#252;tzlichen Dinge von der rechten Seite sind jetzt unterhalb des Schreibfeldes zu finden und dann wenn man speichern oder <strong>ver&#246;ffentlichen</strong> mag, muss man wieder nach <strong>oben scrollen</strong>. Die Logik dahinterentzieht sich mir vollends. </p>
<p><span class="firstletter">W</span>enn schon alles unterhalb des Schreibfeldes, dann doch auch den Speichern-Ver&#246;ffentlichen Button &#8211; k&#228;m mir sinnvoller vor. </p>
<p>Nun der Screenhot: <a href="http://www.webdesign-in.de/wp-images/0208/wp-25-interface.gif" title="Beitr&#228;ge in WP 2.5 ver&#246;ffentlichen">Beitr&#228;ge in WP 2.5 ver&#246;ffentlichen</a>.</p>
<h3>Zu breit ich kann es nicht lesen</h3>
<p>Fluide oder full Screen Layouts sind ja sehr modern und immer wieder wird gefragt:<a href="http://www.webdesign-in.de/mts/meine-homepage-optimieren-bildschirmaufloesungen-im-vergleich/" title="Homepage Breite"> Auf was soll ich meine Homepage optimieren</a>.  </p>
<p>Es gibt viele Menschen wie mich, die eine Brille ben&#246;tigen. Mancher eine Gleitsichtbrille. Die Menschen, die WordPress benutzen sind nicht nur sehr junge Menschen. Es ist fast unm&#246;glich eine 1100px breite Zeile zu lesen. Man verliert den Faden, die Zeile. WordPress 2.5 macht aber genau das. </p>
<p>V&#246;llig unn&#246;tig noch dazu. </p>
<p>Au&#223;erdem schmerzt mich die Kombination Hellblau mit Wei&#223; sehr in meinen Augen. Ich griff zur Selbsthilfe:</p>
<p>wp-admin/wp-admin.css folgende wenige &#196;nderungen und ich kann WP 2.5 zumindest lesen und es ist f&#252;r mich angenehmer.</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #339933;">&lt;</span>code<span style="color: #339933;">&gt;</span>html<span style="color: #339933;">,</span> body <span style="color: #009900;">&#123;</span>font<span style="color: #339933;">-</span>size<span style="color: #339933;">:</span><span style="color: #cc66cc;">101</span><span style="color: #339933;">%;</span>
	height<span style="color: #339933;">:</span><span style="color: #cc66cc;">100</span><span style="color: #339933;">%;</span>
	background<span style="color: #339933;">:</span> <span style="color: #666666; font-style: italic;">#464646;
</span><span style="color: #009900;">&#125;</span>
<span style="color: #666666; font-style: italic;">#wpwrap { background:#fff;
</span>	position<span style="color: #339933;">:</span> relative<span style="color: #339933;">;</span> 
	min<span style="color: #339933;">-</span>height<span style="color: #339933;">:</span> <span style="color: #cc66cc;">100</span><span style="color: #339933;">%;</span>
	width<span style="color: #339933;">:</span><span style="color: #cc66cc;">80</span><span style="color: #339933;">%;</span>
	margin<span style="color: #339933;">:</span><span style="color: #cc66cc;">0</span> auto<span style="color: #339933;">;</span>
<span style="color: #009900;">&#125;</span><span style="color: #339933;">&lt;/</span>code<span style="color: #339933;">&gt;</span></pre></div></div>

<p>Immer noch 1440x breit immer noch viel zu scrollen, aber der Hintergrund ist grau und nicht mehr so blendend und die generelle Breite setzte ich auf 80% &#8211; somit hat eine Zeile ~ 730px und dies kann ich leicht lesen.</p>
<p><strong>Screenshot</strong> &#8220;Meines&#8221; Admincenters jetzt.<a href="http://www.webdesign-in.de/wp-images/0208/wp-25-interface--lesbar.gif" title="lesbares WP 2.5">WP 2.5 lesbar</a>. <small>Einfach auf das kleine Gr&#252;ne Pfeilchen unten klicken und der Screen geht voll auf. </small></p>
<dl class="right" style="width:330;">
<dt> Widgets WP 2.5 &nbsp;</dt>
<dd><a href="http://www.webdesign-in.de/wp-images/0208/wp-25-widget.gif" title="Widgets in W 2.5. anders"><img src="http://www.webdesign-in.de/wp-images/0208/wp-25-widget-kl.gif" alt=" Widgets in WP 2.5." width="329" height="355" /></a></dd>
</dl>
<h3>Widget Verwaltung wird komplizierter</h3>
<p>Wie immer: ich habe die Entwicklerversion und hoffe es wird vielleicht anders. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<p>Bis dato sah man die Sidebar und zog ein Widget einfach mit drag und drop hinein. Damit ist jetzt Schluss. </p>
<ol>
<li>Zuerst rechts oben die Sidebar ausw&#228;hlen wo das Widget hinsoll. </li>
<li>In der Reihenfolge in der man die Widgets ausw&#228;hlt in der Reihenfolge sind sie dann in der Sidebar. Drag and Drop Verschiebungen sind nicht mehr m&#246;glich. </li>
<li>Dann links + oder &#8211; bei dem gew&#252;nschten Widget klicken.</li>
<li> Danach auf *bearbeiten* klicken. </li>
<li>Entfernen kann man ein Widget nur mehr nach dem Klick *bearbeiten* und dann rechts auf *entfernen*.</li>
</ol>
<p>Die Sichtbarkeit des Tuns ist weg. </p>
<h3>Andere zum Thema:</h3>
<ul>
<li>Lisa Sabin-Wilson.</li>
<li><a href="http://www.tubetorial.com/wordpress-24-administration-panel-preview/" title="Video">Das Video </a></li>
<li><a href="http://www.blogherald.com/2008/02/18/are-you-ready-for-wordpress-25/" title="Lorelle">Lorelle im Blogherald</a></li>
</ul>
<div class="sign">mts</div>
]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-in.de/mts/wordpress-2-5-admincenter-unlesbar-loesung/feed/</wfw:commentRss>
		<slash:comments>15</slash:comments>
		</item>
		<item>
		<title>Sidebar eines Blogs &#8211; voll oder leer oder unwichtig sowieso</title>
		<link>http://www.webdesign-in.de/mts/sidebar-eines-blogs-voll-oder-leer-oder-unwichtig-sowieso/</link>
		<comments>http://www.webdesign-in.de/mts/sidebar-eines-blogs-voll-oder-leer-oder-unwichtig-sowieso/#comments</comments>
		<pubDate>Fri, 01 Feb 2008 05:49:47 +0000</pubDate>
		<dc:creator>mts</dc:creator>
				<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.webdesign-in.de/mts/sidebar-eines-blogs-voll-oder-leer-oder-unwichtig-sowieso/</guid>
		<description><![CDATA[Die Sidebar eines Weblogs ist selten derzeit wirklich auf der Seite zu finden, wenn dann Rechts. F&#252;r viele ist die rechte Sidebar das Erkennungszeichen, dass es sich hier um Blog handelt. Und es stellte sich die Frage, was soll denn in so einer Sidebar sein und wonach sucht niemand in so einer Sidebar. ]]></description>
			<content:encoded><![CDATA[Copyright &copy; 2012 <a href="http://www.webdesign-in.de">mts</a>. Visit the original article at <a href="http://www.webdesign-in.de/mts/sidebar-eines-blogs-voll-oder-leer-oder-unwichtig-sowieso/">http://www.webdesign-in.de/mts/sidebar-eines-blogs-voll-oder-leer-oder-unwichtig-sowieso/</a>.<br /><p><span class="caplize">V</span>ladimir aka Perun fragt was denn so in eine <a href="http://www.perun.net/2008/01/23/blogparade-was-soll-in-die-sidebar/" title="Was soll in die Sidebar eines Weblogs. ">Sidebar eines Weblogs</a> geh&#246;rt. Die Sidebar eines Weblogs ist das, was bei vielen anderen Websites Navigation oder Men&#252; hei&#223;t. Mittlerweile ist die Sidebar eines Weblogs sehr oft unterhalb des Inhalts zu finden.  </p>
<p>Seit gut 1994 kenne ich die Navigation oder das Men&#252; Links  und seit damals st&#246;rt es mich, dass ich als Rechtsh&#228;nderin &#252;ber den Inhalt fahren muss, damit ich navigieren kann.  So finde ich den Brauch der Blogs, das Men&#252; &#8211; die Sidebar eben- auf der rechten Seite zu haben als sehr hilfreich. </p>
<p>Was mich &#8211; bis auf Veranstaltungshinweise &#8211; noch niemals interessiert hat ist ein Kalender. Oder gar ein Archiv nach Monaten &#8211; au&#223;er bei einer Online Zeitung. Was jemand am Tag X schrieb interessiert mich einfach nicht.  Mich interessiert der Inhalt und wenn geht gut <span id="more-777"></span>strukturiert.</p>
<h3>Was finde ich in einer Sidebar eines Blogs sinnvoll f&#252;r mich</h3>
<ul>
<li>Ich mag es, wenn leicht erkennbar ist, was inhaltlich zusammengeh&#246;rt.</li>
<li>Ich mag Kategorien wesentlich lieber als Tags /Stichwortlisten. Da gehte es mir wie  Cindy, Tagwolken  sind mir meist zu un&#252;bersichtlich. </li>
<li>Links Ok, ist es aber eine elendslange Blogroll seh ich mir keinen einzigen Link dort an, das schreckt mich eher ab.</li>
<li>Die Suchfunktion mag ich oft, aber die muss nicht unbedingt in der Sidebar sein.</li>
<li>Thematisch passende Artikel, da muss dann nicht immer eine Kategorien&#252;bersicht sein, wenn ich eine direkten Link zur Startseite auf Anhieb finde.</li>
<li>Ich mag  Platz in der Sidebar zwischen den Punkten.<br />ist in der Sidebar leicht erkennbar was wie zusammengeh&#246;rt, dann kann die Sidebar aus zwei , drei oder vier Teilen bestehen, auch vollgepackt sein &#8211; aber eben mit Platz oder erkennbarer Aufteilung.</li>
</ul>
<h3>Worauf habe ich in einer Sidebar kaum noch geklickt</h3>
<ol>
<li>Den Kalender.</li>
<li>Die letzten Kommentare.</li>
<li>Das Wetter von Morgen oder Heute.</li>
<li>Von welchen L&#228;ndern, die einzelnen Besucher des Blogs kamen.</li>
<li>Now reading &#8211; also Buchlisten  oder welche Musik jemand gerade h&#246;rt.</li>
<li>Webcam Bilder oder &#228;hnliches.</li>
<li>Die letzten Leser des Blogs oder meine Freunde bei XYZ.</li>
</ol>
<h3>Was schreckt mich in einer Sidebar richtig ab</h3>
<ol>
<li>Zwangsh&#246;ren von Musik, wo ich erst m&#252;hsamst suchen muss wie man die wieder abstellt.</li>
<li>Blinkende Buttons.</li>
<li>Eine Sidebar, die mehrfach l&#228;nger als der Inhalt einer Startseite ist.</li>
<li>Wenn die Sidebar mehrfach breiter als der Inhalt ist. &#8211; Manche Blogs haben ja zwei Sidebars und da passiert dies schon mal.</li>
<li>Wenn ich vor lauter Werbung keinen weiterf&#252;hrenden Links mehr finde.</li>
<li>Wenn ich kommentieren mag und das Eingabefeld in der Sidebar ist, die Kommentare aber dann ganz woanders. Das ist mir einfach zu umst&#228;ndlich.</li>
</ol>
<p>Als Sicherheitsrisiko erachte ich Adminlinks, den kann man sich doch auch so merken <img src='http://www.webdesign-in.de/wp-includes/images/smilies/zwinker.gif' alt=':zwinker:' class='wp-smiley' /> </p>
<p>Wer wo schreibt, das &#8220;erlese&#8221; ich mir in alter Tradition aus dem hoffentlich vorhandenen Impressum. Ob da Werbung drin ist in der Sidebar oder nicht, ist mir h&#252;bsch egal, solange sie mir nicht den Blick auf die inhaltlich weiterf&#252;hrenden Links nimmt. </p>
<h3>Widersprechen</h3>
<p> mag ich Nadine. Sie meint </p>
<blockquote><p>&#220;bersichtlichkeit und ein logischer und systematischer Aufbau, sollte immer im Vordergrund stehen. Wichtiges nach oben, unwichtiges nach unten.</p>
</blockquote>
<p>Ob ich einen Blog in meinen Newsreader gebe oder nicht, entscheide ich erst nach dem Lesen. Also am <strong>Ende eines Artikels</strong> &#8211; nicht oben.  Betrachtet man eine Sidebar als eine Liste mit Dingen, dann geh&#246;rt meiner Meinung in diese Sidebar-Liste &#8211; wie sonst bei Listen auch- das eher Unwichtigere in die Mitte. Weil in der Mitte lese ich ja hoffentlich den Artikel und sehe nicht nach Links oder Rechts. </p>
<p>Doch vermutlich ist dies genauso wie mit dem Geschmack- man kann sich stundenlang bei einem Kaffee dar&#252;ber austauschen &#8230;.</p>
<p>Spannende Frage Perun <img src='http://www.webdesign-in.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' />  </p>
<div class="sign">mts</div>
]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-in.de/mts/sidebar-eines-blogs-voll-oder-leer-oder-unwichtig-sowieso/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Anleitung f&#252;r die Print.css, denn  Datei -&gt; Drucken ist nach wie vor sehr beliebt &#8211; das Drucklayout</title>
		<link>http://www.webdesign-in.de/mts/print-css-und-datei-drucken/</link>
		<comments>http://www.webdesign-in.de/mts/print-css-und-datei-drucken/#comments</comments>
		<pubDate>Tue, 12 Jun 2007 16:42:09 +0000</pubDate>
		<dc:creator>mts</dc:creator>
				<category><![CDATA[Webdesign Tutorial]]></category>
		<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.webdesign-in.de/?p=139</guid>
		<description><![CDATA[Kunden wollen den Inhalt ausdrucken und den lesbar. Biete  dies mit einer print.css. Auch ausgedruckt noch eine gute Figur machen und dem Inhalt den meisten Platz einr&#228;umen.]]></description>
			<content:encoded><![CDATA[Copyright &copy; 2012 <a href="http://www.webdesign-in.de">mts</a>. Visit the original article at <a href="http://www.webdesign-in.de/mts/print-css-und-datei-drucken/">http://www.webdesign-in.de/mts/print-css-und-datei-drucken/</a>.<br /><p><span class="caplize">D</span>rucken und <abbr title="Personal Computer ">PC </abbr> sind siamesische Zwillinge.  So lernt jeder PC Neuling relativ rasch, dass sich oben Links beim Browser unter dem Wort <strong>&#8220;Datei&#8221; die Druckm&#246;glichkeit</strong> versteckt, wenn er das Druckersymbol nicht findet. </p>
<p>Mittlerweile l&#246;st es bei vielen Menschen Verwirrung aus, wenn diese Funktion woanders zu finden ist.  Wieso auch immer, dies hat sich als (Web)Standard etabliert.</p>
<blockquote>
<p>Standards erleichtern uns die Bedienung vieler Ger&#228;te deren Hintergrundtechnik wir nicht verstehen, die wir jedoch benutzen wollen und k&#246;nnen.</p>
<p>Webstandards sind da nicht anders. </p>
</blockquote>
<p>Mit einer <strong>print.css</strong> kann man das <strong>Drucklayout</strong> gestalten. Viele Menschen wollen Artikel ausdrucken und dann offline nachlesen. </p>
<p><span class="firstletter">O</span>ftmals wird dies jedoch zur unendlichen Papierflut, weil man verga&#223; ein Drucklayout f&#252;r die eigene Homepage anzugeben. Unabh&#228;ngig davon wei&#223; jeder aus eigener leidvollen Erfahrung <strong>Druckerpatronen sind irr teuer</strong>.</p>
<p> Man mag nichts anders als einen Artikel und auf einmal rattert der Drucker 14 Seiten buntest raus. Navigation, Formularfelder etc. kommen gleich mit. </p>
<p>Oder die Homepage hat einen schwarzen Hintergrund mit wei&#223;er Schrift.  Da ist eine Tintenpatrone schneller leer <span id="more-139"></span>als man schauen kann&#8230; <img src='http://www.webdesign-in.de/wp-includes/images/smilies/icon_sad.gif' alt=':(' class='wp-smiley' /> </p>
<dl class="right" style="width:260;">
<dt> Drucklayout print.css</dt>
<dd><img src="http://www.webdesign-in.de/wp-images/0607/printscreen.jpg" alt=" Screenshot des Drucklayouts von WebDesign in de .print.css" width="250" height="237" /></dd>
</dl>
<p>Oder Frames- ja es gibt sie noch und dann dort den Inhalt ausdrucken &#8211; dies ist die hohe Kunst schlechthin.  Portale oder Blogs mit zwei Sidebars &#8211; wozu all diese Links ausdrucken?</p>
<p>Wozu Adsense, Banner etc mitdrucken lassen &#8230; </p>
<p>Ein<strong> Drucklayout </strong>anzubieten ist f&#252;r mich somit einfach ein Akt der H&#246;flichkeit. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/zwinker.gif' alt=':zwinker:' class='wp-smiley' />  Webstandard sowieso und au&#223;erdem verschwindet dann ganz automatisch wieder eine &#8220;Barriere&#8221; &#8211; also auch ein &#8220;Muss&#8221; des barrierenfreien WebDesigns.<br class="clear" /></p>
<h3>Wieso hei&#223;t die Drucklayout Datei &#8220;Print.css&#8221;</h3>
<p>Einfach damit man als WebDesigner, Webmaster den Durchblick bei all den verschiedenen <abbr title="Cascading Style Sheet"><span class="abbr" title="Cascading Style Sheet">CSS</span></abbr> Dateien nicht verliert. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<p>Man kann sie auch  drucklayout.css oder hastenichtgesehen.css nennen, wobei letzteres kaum Widererkennungswert hat&#8230;</p>
<h3>Wie wirkt diese Print.css</h3>
<p>Links oben ist bei 99,999999% aller Browser die Angabe: Datei==>Drucken. [<span lang="en"  xml:lang="en">File=>print</span>] Oder der Browser bietet bereits ein Druckersymbol an. Und genau diesen Ausdruck gestaltet eine print.css.  </p>
<h3>Wie verlinkt man eine Print.css korrekt im  HTML Header.</h3>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">	<span style="color: #339933;">&lt;</span>link rel<span style="color: #339933;">=</span><span style="color: #0000ff;">&quot;stylesheet&quot;</span>
   type<span style="color: #339933;">=</span><span style="color: #0000ff;">&quot;text/css&quot;</span>
   media<span style="color: #339933;">=</span><span style="color: #0000ff;">&quot;print&quot;</span>
   href<span style="color: #339933;">=</span><span style="color: #0000ff;">&quot;../print.css&quot;</span> <span style="color: #339933;">/&gt;</span></pre></div></div>

<p><span class="firstletter">1. </span>Schriftfarbe, Hintergrundfarbe, Schriftgr&#246;&#223;e definieren und alle Hintergrundbilder verbieten:</p>
<p>Schriftgr&#246;&#223;e gibt man f&#252;r den Druck mit pt angegeben wird. &#8220;pt&#8221; ist die Angabe aus dem Druck und hat nur dort etwas verloren.;)</p>
<p>Das !important sagt:unbedingt musst Du das tun.</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">body<span style="color: #009900;">&#123;</span>
       font<span style="color: #339933;">:</span>11pt<span style="color: #339933;">/</span><span style="color: #cc66cc;">120</span><span style="color: #339933;">%</span> Arial<span style="color: #339933;">,</span> serif<span style="color: #339933;">;</span>
       background<span style="color: #339933;">-</span>color<span style="color: #339933;">:</span> white <span style="color: #339933;">!</span>important<span style="color: #339933;">;</span>
       background<span style="color: #339933;">-</span>image<span style="color: #339933;">:</span> none <span style="color: #339933;">!</span>important<span style="color: #339933;">;</span>
       color<span style="color: #339933;">:</span>black<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span></pre></div></div>

<p><span class="firstletter">2.</span> Floats m&#252;ssen aufgel&#246;st werden in einer print.css</p>
<p>Die Angabe &#8220;float&#8221; bewirkt beim Ausdruck ein &#8220;Ineinanderflie&#223;en&#8221; diverser Elemente. Niemand mag, dass das Bild &#252;ber den Text ausgedruckt wird. D.h. alle Angaben in der normalen style.css durchgehen und &#252;berall wo ein &#8220;float&#8221; vorkommt zusammenfassen und dann verbieten:</p>
<p>z.B.:</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #990000;">dl</span><span style="color: #339933;">,</span> 
dt<span style="color: #339933;">,</span> 
dd <span style="color: #009900;">&#123;</span>
      float<span style="color: #339933;">:</span>none <span style="color: #339933;">!</span>important<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span></pre></div></div>

<blockquote><p>Wenn jemand etwas ausdrucken mag, dann deswegen, weil ihm der Inhalt interessiert.</p>
</blockquote>
<p>Daraus folgt muss alles weggeben, was nicht zum Inhalt geh&#246;rt.</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">Display<span style="color: #339933;">:</span>none</pre></div></div>

<p>wird der gro&#223;e Freund beim Erstellen einer Print.css.</p>
<p><span class="firstletter">3.</span> Alles was man nicht ausdrucken mag bei der Anzeige verbieten:</p>
<p>z.B. hier auf WebDesign in de ist dies derzeit (Fr&#252;hjahr 2007 )</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">div<span style="color: #339933;">.</span>footerinnen small<span style="color: #339933;">,</span>
div<span style="color: #339933;">.</span>footerinnen img<span style="color: #339933;">,</span>
<span style="color: #339933;">.</span>invisible<span style="color: #339933;">,</span>
<span style="color: #339933;">.</span>postmeta<span style="color: #339933;">,</span>
<span style="color: #339933;">.</span>navigate<span style="color: #339933;">,</span>
<span style="color: #339933;">.</span>navigate01<span style="color: #339933;">,</span>
div<span style="color: #339933;">.</span>navinnen ul<span style="color: #339933;">,</span>
<span style="color: #339933;">.</span>postinnen <span style="color: #339933;">.</span>sidebar<span style="color: #339933;">,</span>
<span style="color: #339933;">.</span>commentline<span style="color: #339933;">,</span>
<span style="color: #339933;">.</span>ohne<span style="color: #339933;">,</span>
<span style="color: #666666; font-style: italic;">#commentform,
</span><span style="color: #339933;">.</span>aehnliche<span style="color: #339933;">,</span>
<span style="color: #339933;">.</span>top<span style="color: #009900;">&#123;</span>
             display<span style="color: #339933;">:</span>none<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span></pre></div></div>

<p><span class="firstletter">4.</span> Die Links &#8211; die Verweise speziell gestalten:</p>
<p>Ein bisschen Farbe darf es schon sein.</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">a<span style="color: #339933;">:</span><span style="color: #990000;">link</span><span style="color: #339933;">,</span>
   a<span style="color: #339933;">:</span>visited <span style="color: #009900;">&#123;</span>
         color<span style="color: #339933;">:</span> <span style="color: #666666; font-style: italic;">#7A1E19;
</span>         background<span style="color: #339933;">:</span>white<span style="color: #339933;">;</span>
          text<span style="color: #339933;">-</span>decoration<span style="color: #339933;">:</span>none<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span></pre></div></div>

<p><span class="firstletter">4.a</span> Oft hat man ja Bilder, die als Link genutzt werden:</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">&nbsp;
img<span style="color: #339933;">,</span>
img a<span style="color: #339933;">:</span><span style="color: #990000;">link</span><span style="color: #339933;">,</span>
img a<span style="color: #339933;">:</span>visited<span style="color: #009900;">&#123;</span>
            border<span style="color: #339933;">-</span>bottom<span style="color: #339933;">:</span>1px solid <span style="color: #666666; font-style: italic;">#C30099;
</span>            margin<span style="color: #339933;">-</span>right<span style="color: #339933;">:</span>12px<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span></pre></div></div>

<p><span class="firstletter">4.b.</span> Bei Links kann man auch die URL anzeigen lassen, auch wenn dies nicht jeder Browser kann:</p>
<p>Bei mir sind dies die Links, die in der CSS class &#8220;content&#8221; zu finden sind. Anpassen nicht vergessen und bitte auch die eigne Domain angeben.</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;"><span style="color: #339933;">.</span>content a<span style="color: #339933;">:</span><span style="color: #990000;">link</span><span style="color: #339933;">:</span>after<span style="color: #339933;">,</span>
	<span style="color: #339933;">.</span>content a<span style="color: #339933;">:</span>visited<span style="color: #339933;">:</span>after <span style="color: #009900;">&#123;</span>
   	content<span style="color: #339933;">:</span> <span style="color: #0000ff;">&quot; (&quot;</span>attr<span style="color: #009900;">&#40;</span>href<span style="color: #009900;">&#41;</span><span style="color: #0000ff;">&quot;)&quot;</span><span style="color: #339933;">;</span>
   	font<span style="color: #339933;">-</span>size<span style="color: #339933;">:</span> <span style="color: #cc66cc;">90</span><span style="color: #339933;">%;</span><span style="color: #009900;">&#125;</span>
&nbsp;
<span style="color: #339933;">.</span>content a<span style="color: #009900;">&#91;</span>href^<span style="color: #339933;">=</span><span style="color: #0000ff;">&quot;/&quot;</span><span style="color: #009900;">&#93;</span><span style="color: #339933;">:</span>after <span style="color: #009900;">&#123;</span>
   content<span style="color: #339933;">:</span> <span style="color: #0000ff;">&quot;(http://www.webdesign-in.de&quot;</span> attr<span style="color: #009900;">&#40;</span>href<span style="color: #009900;">&#41;</span><span style="color: #0000ff;">&quot;)&quot;</span><span style="color: #339933;">;</span> <span style="color: #009900;">&#125;</span></pre></div></div>

<p><span class="firstletter">5.</span> Abk&#252;rzungen anzeigen lassen.</p>
<p>Oft ist es sinnvoll die benutzten Abk&#252;rzungen auch bei der Print.css anzuzeigen.</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">&nbsp;
acronym<span style="color: #009900;">&#91;</span>title<span style="color: #009900;">&#93;</span><span style="color: #339933;">:</span>after<span style="color: #339933;">,</span> 
  abbr<span style="color: #009900;">&#91;</span>title<span style="color: #009900;">&#93;</span><span style="color: #339933;">:</span>after <span style="color: #009900;">&#123;</span>
            content<span style="color: #339933;">:</span> <span style="color: #0000ff;">' ('</span> attr<span style="color: #009900;">&#40;</span>title<span style="color: #009900;">&#41;</span> <span style="color: #0000ff;">')'</span><span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span></pre></div></div>

<p><span class="firstletter">6.</span> Code speziell gestalten .</p>
<p>Ich habe hier die ganzen Codebeispiele speziell gestaltet. Damit diese Codebeispiele auch im Drucklayout gut aussehen nutze ich diese Angaben:</p>
<p>Eine spezielle Schriftart.  Das overflow auto l&#246;se ich mit overflow visible wieder auf. Die H&#246;he soll sich automatisch ergeben. Da ich eine andere Farbe hier anzeigen lasse, gebe ich extra nochmals die Farbe und die Hintergrundfarbe f&#252;r den Ausdruck an. Sicher ist sicher <img src='http://www.webdesign-in.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">pre<span style="color: #339933;">,</span>
code <span style="color: #009900;">&#123;</span>
    font<span style="color: #339933;">:</span>10pt <span style="color: #339933;">/</span>2em  <span style="color: #0000ff;">&quot;Courier New&quot;</span><span style="color: #339933;">,</span>Courier<span style="color: #339933;">,</span> monospace<span style="color: #339933;">;</span>
    color<span style="color: #339933;">:</span> black<span style="color: #339933;">;</span>
    background<span style="color: #339933;">:</span>white<span style="color: #339933;">;</span>
    margin<span style="color: #339933;">-</span>left<span style="color: #339933;">:</span>2px<span style="color: #339933;">;</span>
   padding<span style="color: #339933;">:</span>1em<span style="color: #339933;">;</span>
    border<span style="color: #339933;">-</span>left<span style="color: #339933;">:</span> 1px solid <span style="color: #666666; font-style: italic;">#930;
</span>   overflow<span style="color: #339933;">:</span>visible<span style="color: #339933;">!</span>important<span style="color: #339933;">;</span> 
   white<span style="color: #339933;">-</span>space<span style="color: #339933;">:</span>normal<span style="color: #339933;">;</span>
    width<span style="color: #339933;">:</span><span style="color: #cc66cc;">90</span><span style="color: #339933;">%;</span>
    height<span style="color: #339933;">:</span>auto<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span></pre></div></div>

<p><span class="firstletter">7.</span> Gustost&#252;ckchen und spezielles nicht vergessen:</p>
<p>Dies ist von Layout zu Layout unterschiedlich.</p>

<div class="wp_syntax"><div class="code"><pre class="php" style="font-family:monospace;">h1<span style="color: #339933;">,</span>h2<span style="color: #339933;">,</span>h3<span style="color: #339933;">,</span>h4<span style="color: #339933;">,</span>h5<span style="color: #339933;">,</span>h6<span style="color: #009900;">&#123;</span>font<span style="color: #339933;">-</span>size<span style="color: #339933;">:</span>13pt<span style="color: #339933;">;</span>line<span style="color: #339933;">-</span>height<span style="color: #339933;">:</span><span style="color: #cc66cc;">110</span><span style="color: #339933;">%;</span>margin<span style="color: #339933;">:</span><span style="color: #cc66cc;">0</span><span style="color: #339933;">;</span>padding<span style="color: #339933;">:</span><span style="color: #cc66cc;">0</span><span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span>
div<span style="color: #339933;">.</span>content<span style="color: #339933;">,</span>
div<span style="color: #339933;">.</span>contenth <span style="color: #009900;">&#123;</span>margin<span style="color: #339933;">-</span>left<span style="color: #339933;">:</span>0<span style="color: #339933;">.</span>8em<span style="color: #339933;">;</span>padding<span style="color: #339933;">-</span>top<span style="color: #339933;">:</span>1em<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span>
h3<span style="color: #339933;">.</span>comments<span style="color: #009900;">&#123;</span>font<span style="color: #339933;">-</span>weight<span style="color: #339933;">:</span>normal<span style="color: #339933;">;</span>font<span style="color: #339933;">-</span>size<span style="color: #339933;">:</span>11pt<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span>
body img<span style="color: #339933;">.</span>wp<span style="color: #339933;">-</span>smiley <span style="color: #009900;">&#123;</span>border<span style="color: #339933;">:</span>none<span style="color: #339933;">;</span><span style="color: #009900;">&#125;</span></pre></div></div>

<p>Damit man auch wei&#223; woher man sich was ausgedruckt hat und ich dies nicht dem Zufall &#252;berlassen mag, ob jemand die Kopf und Fu&#223;zeile des Standarddrucklayouts beibehalten hat. Habe ich im Footer hier den Namen der Domain stehen und den lasse ich auch ausdrucken. </p>
<p>Man k&#246;nnte nat&#252;rlich auch ein einfaches, kleines Logo nur f&#252;r den Ausdruck machen. </p>
<p>Das ganze wirkt recht viel und lang, doch die print.css von WebDesign-in.de sieht derzeit so aus:Es ist eine Textdatei wie alle CSS Dateien:<a href="http://www.webdesign-in.de/wp-content/themes/webdesign-07/print.css" title="Print.css">Print.css</a>.</p>
<h3>Zusammenfassung der wichtigen Punkte f&#252;r ein Drucklayout einer print.css.</h3>
<p><strong>Was muss die print.css alles angeben, damit der Ausdruck gut lesbar ist.</strong></p>
<ul>
<li>Das Hintergrundbild und das Logo ist unn&#246;tig. Besser ist ein wei&#223;er Hintergrund eine schwarze Schriftfarbe.</li>
<li>Die versteckten Anweisungen sind unn&#246;tig.</li>
<li>Ebenso die Navigation.</li>
<li>Die Anweisung &#8220;float&#8221; muss aufgehoben werden, damit keine Inhalte &#252;berlappen. </li>
<li>&#220;berschriften und Links im Text  ben&#246;tigen eine andere Farbe. </li>
<li>Links im Text mag man sichtbar machen, damit der Kunde wei&#223; wo er weiteren guten Inhalt findet. (Dies funktioniert nicht, wenn der Kunde den Internet Explorer  nutzt, aber diese Anweisung st&#246;rt den Browser auch nicht.) </li>
<li>Die Kommentarfelder sind unn&#246;tig.</li>
<li>Die Angabe wo was wann abgespeichert wurde und die Hinweise auf die Kommentarfunktion sind  unn&#246;tig.</li>
<li>Die Breite des Inhaltes muss vergr&#246;&#223;ert werden, um die volle Breite einer A4 Seite auszunutzen. Oder zumindest nicht unn&#246;tig verkleinern.</li>
<li>Die Schriftgr&#246;&#223;e muss f&#252;r Printmedien angegeben werden also in &#8220;pt&#8221;.</li>
</ul>
<p>Andere zum Thema:Print.css und Datei drucken:</p>
<ol>
<li><a href="http://www.alistapart.com/articles/goingtoprint/" title="Externer Link:Alistapart in English">Alistapart.com</a> . Ein noch immer g&#252;ltiger Artikel aus dem Jahr 2002!</li>
<li><a href="http://www.intensivstation.ch/css/print/" title="CSS Print">Intensivstation</a></li>
<li>Und nat&#252;rlich SELFHTML: <a href="http://aktuell.de.selfhtml.org/artikel/css/drucklayout/index.htm" title="Drucklayout">Print.css</a></li>
</ol>
<h3>&#220;besetzungen</h3>
<p>Ganz herzlichen Dank an Bohdan Zograf, der diesen Artikel in Belorussian &#252;bersetzte.<a href="http://www.designcontest.com/show/print-css-und-datei-drucken-be" title="Belorussion "> Designcontest</a>.</p>
<h3>Artikelhistorie:</h3>
<p>Erstfassung:09.10.05<br />
ge&#228;ndert am 14.04.2011 &#220;bersetzung hinzugef&#252;gt.</p>
<div class="sign">mts</div>
]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-in.de/mts/print-css-und-datei-drucken/feed/</wfw:commentRss>
		<slash:comments>13</slash:comments>
		</item>
		<item>
		<title>Technorati im neuen Look mit uralter Tickertechnik &#8211; tut das Not</title>
		<link>http://www.webdesign-in.de/mts/technorati-im-neuen-look-mit-uralter-tickertechnik-tut-das-not/</link>
		<comments>http://www.webdesign-in.de/mts/technorati-im-neuen-look-mit-uralter-tickertechnik-tut-das-not/#comments</comments>
		<pubDate>Wed, 23 May 2007 16:53:15 +0000</pubDate>
		<dc:creator>mts</dc:creator>
				<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.webdesign-in.de/mts/technorati-im-neuen-look-mit-uralter-tickertechnik-tut-das-not/</guid>
		<description><![CDATA[Technorati ist eine Blogsuchmaschine. Neu gestaltet, neues Design, neue Technik. Doch ganz oben ein Newsticker wie in Uralttagen, als das Web einfach Web und noch nicht Web 2.0 war.]]></description>
			<content:encoded><![CDATA[Copyright &copy; 2012 <a href="http://www.webdesign-in.de">mts</a>. Visit the original article at <a href="http://www.webdesign-in.de/mts/technorati-im-neuen-look-mit-uralter-tickertechnik-tut-das-not/">http://www.webdesign-in.de/mts/technorati-im-neuen-look-mit-uralter-tickertechnik-tut-das-not/</a>.<br /><p><span class="caplize">T</span>echnorati, eine Meta Blogsuchmaschine hat sich erneuert. Die Suche funktioniert schneller, keine Frage, die Farben sind reiner und dadurch wirkt vieles nicht mehr so bla&#223;- auch gut.</p>
<p>Technorati ist f&#252;r mich wie ein Aush&#228;ngeschild des Web 2.0. Also auf zu Newstickern <span id="more-585"></span>auf den Blogs und Websites&#8230;&#8230;&#8230;</p>
<blockquote><p>Come check out the refreshed www.technorati.com!<br />
Dave Sifry<br />
Posted by Dave Sifry on May 23, 2007<cite>Technorati Blog</cite></p>
</blockquote>
<p>Mit Technorati wurden &#8220;tagging&#8221; &#8220;tags&#8221; bekannt. Heute suche ich wirklich vergebens nach Technorati Tags auf der Website. Ich finde typische Social Media  Features, wie <span lang="en"  xml:lang="en">What is Hot and Why </span>. Jede Menge an Toplisten werden mir offeriert. </p>
<p>Und vor allem die wirklich uralten <strong>Newsticker</strong> feiern ab jetzt bei Technorati fr&#246;hliche Urst&#228;nd. Sollten die kleinen Worte, die ganz oben viel zu schnell vorm Auge davonflitzen etwa die urspr&#252;ngliche Tagcloud sein&#8230; </p>
<p>Ich kann Favoriten erstellen, nat&#252;rlich sind dies andere Blogs, ich kann Technorati mit meinen Tags f&#252;ttern, und wom&#246;glich Trends in anderen Herren L&#228;nder erkennen. </p>
<p>K&#246;nnen tu ich dies alles jetzt bei Technorati &#8211; aber nutzen werde ich es wohl weniger als vorher&#8230;</p>
<h3>Wer eine Community sein mag, sollte sich auch so verhalten.</h3>
<p><span lang="en"  xml:lang="en">Social Media like</span> pr&#228;sentiert sich Technorati. Doch User von Neuerungen absolut unzureichend zu informieren, wie es mit dem neuen  &#8220;Authority&#8221; geschah, l&#228;&#223;t schalen Beigeschmack zur&#252;ck. Da schlie&#223;e ich mich <a href="http://randaclay.com/2007/05/23/technorati-is-not-winning-any-awards-for-customer-service/" title="Kein Award f&#252;r Benutzerfreundlichkeit  - Englisch">Randaclay.com </a>an. </p>
<p>Fehlende Features beim neuen Design werden erst wieder eingebaut, wenn es User wollen, dies ist ebenfalls uralt &#8220;Beta&#8221;, damals war n&#228;mlich bei &#8220;Beta&#8221; wirklich noch nicht alles fertig <img src='http://www.webdesign-in.de/wp-includes/images/smilies/zwinker.gif' alt=':zwinker:' class='wp-smiley' /> </p>
<p><span class="firstletter">D</span>af&#252;r sucht Technorati jetzt auch nach <a href="http://www.socialmash.de/2007/05/23/technorati-facelifting-und-neue-schwerpunkte/" title="Facelifting">Videos, Fotos und Musik</a>. Diese Entwicklung ist logisch, denn wenn Suchmaschinen immer mehr community Charakter annehmen m&#252;ssen sie  dem Communitymitglied alles bieten, um es bei der Stange zu halten.  Dies sieht auch <a href="http://www.micropersuasion.com/2007/05/blog_search_is_.html" title="Steve Rubel zu den Trends der Suchmaschinen">Steve Rubel </a>so. </p>
<p><a href="http://www.webdesign-in.de/mts/benedikt-rieke-benninghaus-interview/" title="Interview mit Benedikt">Benedikt</a> gef&#228;llts das neue Design &#8211; mir auch- aber h&#252;bsches Design ist nicht das A und O einer Suchmaschine.</p>
<div class="sign">mts</div>
]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-in.de/mts/technorati-im-neuen-look-mit-uralter-tickertechnik-tut-das-not/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Silver Surfer st&#252;rmen das Internet und die deutsche Blogosph&#228;re betreibt Nabelbeschau</title>
		<link>http://www.webdesign-in.de/mts/silver-surfer-deutsche-blogosphaere/</link>
		<comments>http://www.webdesign-in.de/mts/silver-surfer-deutsche-blogosphaere/#comments</comments>
		<pubDate>Sun, 13 May 2007 13:05:04 +0000</pubDate>
		<dc:creator>mts</dc:creator>
				<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.webdesign-in.de/mts/silver-surfer-deutsche-blogosphaere/</guid>
		<description><![CDATA[Silver Surfer nutzen immer &#246;fter das Internet. Blogs k&#246;nnten Online Journalisten sein. Doch in der deutschen Blogosph&#228;re wird der Trend verschlafen - daf&#252;r wird gez&#228;hlt was das Zeuchs h&#228;lt.]]></description>
			<content:encoded><![CDATA[Copyright &copy; 2012 <a href="http://www.webdesign-in.de">mts</a>. Visit the original article at <a href="http://www.webdesign-in.de/mts/silver-surfer-deutsche-blogosphaere/">http://www.webdesign-in.de/mts/silver-surfer-deutsche-blogosphaere/</a>.<br /><p><span class="caplize">S</span>ilver Surfer sind laut Definition Menschen, die das 50zigste Lebensjahr &#252;berschritten haben &#8211; oder knapp davor sind. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' />  Ich bin diese Zielgruppe, die ist ja kein Geheimnis und laut <a href="http://www.ard.de/intern/presseservice/ard-zdf-online-studie/-/id=8058/nid=8058/did=601530/aiu42e/" title="Studie 2007">ARD/ZDF Studie 2007 </a>st&#252;rmen auch die 60j&#228;hrigen das Internet. Beruflich bin ich als WebDesignerin und mittlerweile auch als Internet Marketing Fachfrau logischerweise sehr lange bereits im Internet. Privat nutze ich es zum &#8220;Finden&#8221;. Als Privatperson handle ich nicht anders als all die anderen in meinem Alter.  </p>
<blockquote><p>Ich mache um die deutsche Blogosph&#228;re einen gro&#223;en Bogen <cite><a href="http://www.sajonara.de/2007/04/22/weblogzahlung-aufruf/#comment-9561" title="Kommentar auf Sajonara"> ich selbst in einem Kommentar bei Sajonara</a></cite></p>
</blockquote>
<p>Die deutsche Blogosph&#228;re ist f&#252;r mich tats&#228;chlich zum <strong>klein</strong> Bloggersdorf geworden. Wie ein Verein, der immer mehr davon lebt seine Mitglieder in immer wieder neuer Art und Weise zu z&#228;hlen. Andrerseits mag ich ja solche Statussymbollisten und seh sie mir immer wieder neugierig <span id="more-576"></span>geworden an, weil sie etwas &#252;ber die Intention der Z&#228;hlenden und Top Ten Listen Ersteller aussagen.</p>
<h3>mein Verhalten im Internet als angehende Silver Surferin &#8212; als Privatperson</h3>
<ol>
<li>Ich gebe meinen Suchbegriff-meist ein ganzer Satz- in den Suchschlitz der bekanntesten Suchmaschine. Lese die kurzen Anreissertexte darunter. </li>
<li>Spricht mich was an, klicke ich darauf. </li>
<li>Finde ich dort nicht gleich was ich suche, klicke ich weg.</li>
<li>Kann ich es nicht lesen, weil entweder die Schrift zu klein oder eine einzige Zeile auf <a href="http://www.blogcensus.de/" title="Unlesebar">1440px </a>auseinanderf&#228;hrt, klicke ich weg.</li>
<li>Lande ich auf einer Website, die mich zu einer anderen weiterleitet, klicke ich darauf &#8211; lande ich dann wieder auf einer, die mich weiterleitet, weil sie etwas *via* pr&#228;sentiert,ist meine Geduld am Ende und ich gehe zur&#252;ck zu den Suchergebnissen.</li>
</ol>
<h3>Beobachtungen &#252;ber das Internetverhalten von Seniorinnen</h3>
<p>Ich habe dar&#252;ber keine Statistik, nur meine Beobachtungen in meinem privaten  Umfeld.</p>
<p>Senioren und Seniorinnen haben bei der Suche ein wenig mehr Geduld. Sie lesen sehr aufmerksam, wenn sie lesen k&#246;nnen und sie bleiben dann treu, wenn sie was gefunden haben.</p>
<h3>die Blogosph&#228;re und ich, als knapp 50j&#228;hrige </h3>
<p>Ich nutze die Blogsuche nur beruflich. Technorati nahm ich zum Suchen in den Anfangstagen, als ich dort noch die Stichworte *tags* wirklich &#252;bersichtlich fand, derzeit ist mir <strong>Technorati zum Finden einfach zu umst&#228;ndlich</strong> geworden. Mein Sinnen und Trachten in einer technorati online Community zu sein, h&#228;lt sich gegen Null. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/zwinker.gif' alt=':zwinker:' class='wp-smiley' /> </p>
<p>Liefert mir die Suchmaschine nichts passendes nutze ich <strong>Social Medie Dienste</strong>, wohl wissend, dass ich damit zu den wenigen Eingeweihten meines Alters geh&#246;re, die diese &#252;berhaupt kennen. Diese Vereine des Internets,wie ich sie gerne nenne, haben jedoch auch die Tendenzen zum Selbstzweck zu mutieren &#8212; wie derzeit <strong>Mr Wong</strong> mit seiner dreimal t&#228;glichen Schwanzvergleichsschau &#8212; und sp&#228;testens dann werden sie denselben Weg wie Technorati bei mir gehen &#8211; unbrauchbar!</p>
<p>Unbrauchbar f&#252;r mich als Privatperson, die ja finden mag, aber sehr wohl brauchbar f&#252;r mich als <abbr title="Suchmaschinenoptimierung oder Suchmaschinenoptimierer"><span class="abbr" title="Suchmachinenoptimierung oder Suchmaschinenoptimierer">SEO</span></abbr> &#8211; Linkbaiting wird m&#246;glich und sogar am silbernen Teller serviert, was mag ich mehr in meinem Beruf.;)</p>
<h3>die Blogosph&#228;re und ich in meinem Beruf</h3>
<p><strong>Vorneweg:</strong> ich sehe mich selbst nicht als &#8220;t&#228;glich alles&#8221; Onlinejournalistin. </p>
<p>Das Privatleben einer erwachsenen Frau, die betrunken Auto f&#228;hrt und dann daf&#252;r grade stehen muss interessiert mich nicht. Ob Frau X mit Herrn Y und ob der mit dem oder nicht ist  mir auch egal. Die ewig gleichen Videos unter anderer Internetadresse lassen mich kalt. Podcasts mit erkennbar  norddeutscher Aussprache oder technisch schlecht gemacht sind f&#252;r mich auch nicht das A und O der Welt. </p>
<p>Ich bin verdammt anspruchsvoll als private Surferin. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' /> </p>
<h3>deutsche  Blogosph&#228;re wird zum geschlossenen Verein</h3>
<p>Die deutsche Blogosph&#228;re ist eine in sich fast geschlossene Gruppe. Ich brauche mir nur drei oder vier Blogrolls anzusehen, denn in all den anderen sind einfach immer dieselben Links drin. </p>
<p>Ich brauche nur drei oder vier Blogs &#252;berhaupt zu lesen, denn die anderen tun nichts anders als *via* wieder darauf zu verlinken. Betonung auf: diese Blogs tun nichts anders. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/zwinker.gif' alt=':zwinker:' class='wp-smiley' />   </p>
<p>Extrem wenige haben es geschafft &#252;ber diese geschlossene Gruppe hinaus gefunden zu werden. Extrem viele in der  Blogosph&#228;re glauben, dass allein das Verlinken eines guten Bloggers bereits ber&#252;hmt macht. Frei nach dem Motto: Hauptsache ich bin dabei.</p>
<h3>die deutsche Blogosph&#228;re und ich in meinem Beruf &#8211; Trends erkennen</h3>
<p>Mag ich wissen was als n&#228;chstes Trend in der deutschen Blogosph&#228;re ist, ruf ich <a href="http://www.basicthinking.de/blog/" title="Roberts Blog">Basicthinking </a>auf. Robert macht Trends und vor allem er bleibt seinem Thema *Berichterstattung* treu. Ich kann mich darauf verlassen, dass ich bei meinen manchmal 14t&#228;gigen Rundgang durch sein Blog *Berichterstattung* finde. Selbst wenn man Robert stark kritisert, man muss auf ihn Bezug nehmen. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' />  Das schaffen nur Trendsetter&#8230;</p>
<h3>die deutsche Blogosph&#228;re &#8211; Schuster bleib bei deinen Leisten</h3>
<p>Ruf ich bueltge.de auf, wei&#223; ich was mich erwartet. Schau ich in Gabis Blogh&#228;uschen vorbei find ich Vertrautes. </p>
<p>Rufe ich meine Favoriten auf, egal wo gespeichert und finde auf einmal v&#246;llig andere Inhalte bin ich meist h&#246;chst irritiert. Vom guten Programmierer wird man auf einmal zum Suchmaschinenoptimierer, weil das Thema SEO viele anspricht. </p>
<h3>die deutsche Blogosph&#228;re &#8211; Blog Karneval</h3>
<p>Blogger Karneval &#8211; geb&#252;ndeltes Wissen versandet im Nirwana, liegt es wirklich nur am <a href="http://www.einfach-persoenlich.de/2007-05-11/blogging-tipps-blogkarneval-welchen-namen-bekommt-das-kind.html" title="Welchen Namen bekommt das Kind?">absolut unpassenden Namen</a>?</p>
<p>Erfolg und PR ging im Februar dieses Jahres zu Ende. Versprochen wurde ein .pdf. </p>
<blockquote><p>Jetzt beginnt f&#252;r uns eine arbeitsreiche Zeit. Wir wollen die Beitr&#228;ge sortieren und in eine PDF-Form bringen. Das wird einige Zeit in Anspruch nehmen, bitte nicht ungedulgig werden. Wir werden daran mit Hochdruck arbeiten.<cite>18.02.2007 | Rubrik: Business &#8211; Blog &#8211; Karneval, PR &#038; Medienarbeit  | 1 Kommentare </cite></p>
</blockquote>
<p>Es ist fast Mitte Mai, ich bin nicht der Meinung ungeduldig zu sein, wenn ich frage. &#8220;Wo ist das Ergebnis&#8221;. Auf der Hauptseite prankt die Werbung f&#252;r ein Buch, Links in Kommentaren werden per Script weitergeleitet, was sicher nur eine Spamvorsorge ist und nichts damit zu tun hat, dass man so absolut gezielt den Linkpop der Domain f&#252;r die eigenen Domains gut nutzen kannn. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/zwinker.gif' alt=':zwinker:' class='wp-smiley' />  </p>
<p>Als Mitmachende merke ich, dass ich mich missbraucht f&#252;hle. Dies wurde mir erst klar, als ich wieder einmal von jemanden eingeladen wurde und weil mir der Veranstalter nicht klar sagen konnte was mit diesem Karneval bezweckt wurde, ich dankend ablehnte. </p>
<p><a href="http://www.alles-internet.com/blog/?p=392" title="1.Business Karneval">1.Business Karneval Herbst 2006</a>, bietet all das Wissen zum Thema Akquise und Kundenbindung als <a href="http://www.selbst-und-staendig.de/50226711/das_wissensdossier_zum_thema_akquise_und_kundenbindung.php" title="Wissensdosier">downloadbares pdf</a> an. Eine fantastische Umsetzung und Organisation eines Blog Karnevals. Hut ab und Danke f&#252;r diese Sammlung. </p>
<p>Auch Michael vertrau ich, dass sein Blog Karneval nicht im Nirvana versandet, sondern tats&#228;chlich eine Hilfe wird. Deshalb machte ich mit meinen liebsten <a href="http://www.texto.de/meine-wordpress-plugins-liste-damit-auch-aus-deinem-blog-ein-cms-wird-439/" title="WordPress Plugins f&#252;r ein CMS">WordPress Plugins</a> auch gerne mit. </p>
<h3>die deutsche Blogosph&#228;re &#8211; Schwanzvergleichsslisten</h3>
<p><a href="http://www.sajonara.de/2007/04/22/weblogzahlung-aufruf/" title="Weblogs werden gez&#228;hlt">Weblogs werden gez&#228;hlt</a>, aber keiner wei&#223; was gez&#228;hlt wird..</p>
<blockquote><p>&#8220;Es gibt drei Arten von L&#252;gen: L&#252;gen, verdammte L&#252;gen und Statistiken.&#8221; <cite>Benjamin Disraeli,Autor und britischer Premierminister</cite>  </p>
</blockquote>
<p>Charts sind immer Statussymbole. Egal, ob man in den klassischen Suchmaschinen unter den <a href="http://www.webdesign-in.de/mts/top-ten-listen-halten-was-sie-versprechen/" title="TopTen Listen halten was sie versprechen">TopTen </a>mag, selbst wenn das Keywort absolut Nonsense ist. Egal, ob man einen hohen Google Page Rank haben mag, egal, ob man bei Blogscout oder sonst wo oben sein mag.</p>
<p>WordPress ist als Blogsoftware bekannt geworden. Immer mehr nutzen es als kleines, handliches CMS f&#252;r die Business Website. Aber deswegen ist dies noch kein *Blog*. </p>
<p>Suchmaschinen verursachen Traffic, der kostet Geld. In Suchmaschinen gelistet zu sein ist eine Frage des Marketings. Ich gebe f&#252;r Marketing nur dann Geld aus, wenn es mir was bringt. </p>
<p>Was bringt mir die Z&#228;hlung der deutschen Blogs?  </p>
<p>Eine Antwort auf diese Frage kann ich nicht finden. Die Website nicht lesen  &#8211; wozu sollte ich also dieser Suchmaschine den Zutritt erlauben?</p>
<h3>an die deutsche Blogosph&#228;re &#8211; ich mag Euch finden </h3>
<p>Ich lese ein Blog nicht, weil es ein Blog ist, sondern weil der Inhalt interessant ist. Ich suche nicht automatisch nach Blogs mit einem bestimmten Inhalt, sondern ich nutze ganz normal die g&#228;ngigen Suchmaschinen.  Ob es  20tausend oder 5tausend deutsche Blogs gibt, ist f&#252;r Marketingfachleute interessant, die dies f&#252;r ihre Zielgruppenanalyse brauchen. Mir als Privatperson ist dies h&#252;bsch egal. </p>
<p>Ich mag inhaltlich gut recherchierte Artikel. Mag diese finden und ich mag diese dann einfach lesen k&#246;nnen &#8211; so rein technisch betrachtet. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/zwinker.gif' alt=':zwinker:' class='wp-smiley' /> </p>
<p>Im Dezember des Vorjahres erkannte man, dass die wenigsten <strong>Onlinezeitungen</strong> tats&#228;chlich <strong>einen Mehrwert</strong> bieten. </p>
<p>Bietet die deutsche Blogsoph&#228;re einen Mehrwert &#8211; auch f&#252;r die Silver Surfer &#8211; ich bin mir oft unsicher&#8230;.</p>
<p>Aber diese Karnevals k&#246;nnten mir dies schon bieten,&#8230;.</p>
<p><a href="http://www.jobblog.ch/" title="Jobblog von Marcel">Marcel Widmer</a>, der genau wie ich nicht nur f&#252;r Blogger bloggt w&#252;nscht sich einen *unbloggigen* Namen f&#252;r den Blogger Karneval. <a href="http://www.weblogs-und-wikis.de/" title="Weblogs und Wikis">Martin</a> hat ein <a href="http://www.brainr.de/brainstorming/show/812" title="Brainstorming f&#252;r den Blog Karneval">Brainstorming </a>ins Leben gerufen. </p>
<p>Meine Ideen:</p>
<ol>
<li>BB f&#252;r BlogBundle</li>
<li>PingYourMind[dann das Thema]</li>
</ol>
<div class="sign">mts</div>
]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-in.de/mts/silver-surfer-deutsche-blogosphaere/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>Wie soll ich meine Homepage optimieren- 1440-1100-1024-800 -oder ganz anders</title>
		<link>http://www.webdesign-in.de/mts/meine-homepage-optimieren-bildschirmaufloesungen-im-vergleich/</link>
		<comments>http://www.webdesign-in.de/mts/meine-homepage-optimieren-bildschirmaufloesungen-im-vergleich/#comments</comments>
		<pubDate>Wed, 17 Jan 2007 19:12:55 +0000</pubDate>
		<dc:creator>mts</dc:creator>
				<category><![CDATA[WebDesign]]></category>
		<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.webdesign-in.de/mts/wie-soll-ich-meine-homepage-optimieren-1440-1100-1024-800-oder-ganz-anders/</guid>
		<description><![CDATA[Immer wieder wird gefragt auf welche Bildschirmaufl&#246;sung man denn optimieren sollte. Ich sage auf keine! Fluides Layout ist gut, wenn es eine maximale Gr&#246;&#223;e hat. ]]></description>
			<content:encoded><![CDATA[Copyright &copy; 2012 <a href="http://www.webdesign-in.de">mts</a>. Visit the original article at <a href="http://www.webdesign-in.de/mts/meine-homepage-optimieren-bildschirmaufloesungen-im-vergleich/">http://www.webdesign-in.de/mts/meine-homepage-optimieren-bildschirmaufloesungen-im-vergleich/</a>.<br /><p><span class="caplize">I</span>m <a href="http://www.abakus-internet-marketing.de/foren/viewtopic/t-36938.html" title="Externer Link:Abakus">Suchmaschinenforum</a> Abakus kam mal wieder die Frage auf, auf welche Breite man eine Website denn optimieren sollte. </p>
<p>Ich vertrete bei solchen Fragen immer die Ansicht: <strong>Man optimiert auf keine fixe Bildschirmaufl&#246;sung!</strong></p>
<div class="eyecatch">
<p>Zuviele <strong>unterschiedliche Bildchirmaufl&#246;sungen </strong>werden genutzt und ein Layout sollte in allen (halbwegs) gut aussehen.  Auf alle F&#228;lle immer benutzbar bleiben. Soweit es geht, dass horizontale Scrollen verhindern. Aber man sollte bei einem fluidem Layout darauf achten, dass die Maximall&#228;nge einer Zeile beschr&#228;nkt wird. Es wird sonst unlesbar. </p>
</div>
<p><a href="http://rechtlegal.de/" title="Externer Link:Rechtlegal ist  Anwalt Kronenberghs">Rechtlegal</a> fragte im Zuge dieser Diskussion, ob es denn eine Seite g&#228;be wo man unterschiedliche Bildschirmaufl&#246;sungen sich ansehen k&#246;nne. Nun ich bringe sicher nicht die ultimtivsten Anschauungsscreenshots. Aber ich zeige<strong> jetzt Screenshots in den diversen Bildschirmaufl&#246;sungen</strong>. 1440, 1100,1024,800 sind die Breiten.</p>
<p><span class="firstletter">A</span>nschauungsobjekte sind der besagte Thread aus Abakus und die Domain seo-in.de.<br />
Seo-in.de darf mindestens 120px breit werden, kann 97% von der Bildschirmgr&#246;&#223;e einnehmen aber maximal 1200px breit werden. (min-width:120px;max-width:1200px;width:97%;).</p>
<h3>Zu den Screenshots:</h3>
<p>Bildschirmaufl&#246;sung 1440px breit.<br />
Dann die einzelnen Bildschirmaufl&#246;sungen mit der Web Developer Toolbar erstellt.<br />
Anschlie&#223;end die Bilddatei auf 1024px reduziert, das Verh&#228;ltnis bleibt gleich, aber sonst kann sich jemand, der keinen <span id="more-531"></span>Widescreen hat, nichts ansehen.<br />
F&#252;r alle WideScreen Nutzer gibt es einen Screenshot, der alle Aufl&#246;sungen im Verh&#228;ltnis zu 1440px Breite zeigt.</p>
<p><em>Achtung!</em><br />
Beim Klick auf das Thumb erscheint das gro&#223;e Bild.<br />
Diese Screens sind sehr gro&#223;, daher kann das Laden dauern.<br />
Mit der Retourtaste des Browsers kommt man dann wieder hier zu diesem Artikel.</p>
<dl class="left" style="width:210;">
<dt>Bildschirmaufl&#246;sung <br />800px zu 1440px</dt>
<dd><a href="http://www.webdesign-in.de/wp-images/0107/abak-800.gif" title="Abakus mit 800px Bildschirmaufl&#246;sung"><img src="http://www.webdesign-in.de/wp-images/0107/800.gif" alt=" Bildschirmaufl&#246;sung 800px" width="200" height="100" /><br />Abakus</a><br />
<a href="http://www.webdesign-in.de/wp-images/0107/seo-800.gif" title="Seo in de mit 800px Bildschirmaufl&#246;sung"><img src="http://www.webdesign-in.de/wp-images/0107/800.gif" alt=" Bildschirmaufl&#246;sung 800px" width="200" height="100" /></a><br />Seo-in.de</dd>
</dl>
<dl class="left" style="width:210;">
<dt>Bildschirmaufl&#246;sung <br />1024px zu 1440px</dt>
<dd><a href="http://www.webdesign-in.de/wp-images/0107/abak-1024.gif" title="Abakus mit 1024px Bildschirmaufl&#246;sung"><img src="http://www.webdesign-in.de/wp-images/0107/1024.gif" alt=" Bildschirmaufl&#246;sung 1024px" width="200" height="100" /><br />Abakus</a><br />
<a href="http://www.webdesign-in.de/wp-images/0107/seo-1024.gif" title="Seo in de mit 1024px Bildschirmaufl&#246;sung"><img src="http://www.webdesign-in.de/wp-images/0107/1024.gif" alt=" Bildschirmaufl&#246;sung 1024px" width="200" height="100" /></a><br />Seo-in.de</dd>
</dl>
<dl class="left" style="width:210;">
<dt>Bildschirmaufl&#246;sung <br />1100px zu 1440px</dt>
<dd><a href="http://www.webdesign-in.de/wp-images/0107/abak-1100.gif" title="Abakus mit 1100px Bildschirmaufl&#246;sung"><img src="http://www.webdesign-in.de/wp-images/0107/1100.gif" alt=" Bildschirmaufl&#246;sung 1100px" width="200" height="100" /><br />Abakus</a><br />
<a href="http://www.webdesign-in.de/wp-images/0107/seo-1100.gif" title="Seo in de mit 1100px Bildschirmaufl&#246;sung"><img src="http://www.webdesign-in.de/wp-images/0107/1100.gif" alt=" Bildschirmaufl&#246;sung 1100px" width="200" height="100" /></a><br />Seo-in.de</dd>
</dl>
<dl class="left" style="width:210;">
<dt>Bildschirmaufl&#246;sung <br />1440px</dt>
<dd><a href="http://www.webdesign-in.de/wp-images/0107/abak-1400.gif" title="Abakus mit 1440px Bildschirmaufl&#246;sung"><img src="http://www.webdesign-in.de/wp-images/0107/1400.gif" alt=" Bildschirmaufl&#246;sung 1440px" width="200" height="100" /><br />Abakus</a><br />
<a href="http://www.webdesign-in.de/wp-images/0107/seo-1400.gif" title="Seo in de mit 1440px Bildschirmaufl&#246;sung"><img src="http://www.webdesign-in.de/wp-images/0107/1400.gif" alt=" Bildschirmaufl&#246;sung 1440px" width="200" height="100" /></a><br />Seo-in.de</dd>
</dl>
<dl class="left" style="width:210;">
<dt>Alle Bildschirmaufl&#246;sungen auf einmal<br /> [Bildgr&#246;&#223;e 1024]</dt>
<dd><a href="http://www.webdesign-in.de/wp-images/0107/abak-alle-1024.gif" title="Abakus mit allen Bildschirmaufl&#246;sungen"><img src="http://www.webdesign-in.de/wp-images/0107/alle.gif" alt=" alle Bildschirmaufl&#246;sungen" width="200" height="100" /><br />Abakus</a><br />
<a href="http://www.webdesign-in.de/wp-images/0107/seo-alle-1024.gif" title="Seo in de mit allen Bildschirmaufl&#246;sung"><img src="http://www.webdesign-in.de/wp-images/0107/alle.gif" alt="alle  Bildschirmaufl&#246;sungen" width="200" height="100" /></a><br />Seo-in.de</dd>
</dl>
<dl class="left" style="width:210;">
<dt>Alle Bildschirmaufl&#246;sungen auf einmal <br />[Bildgr&#246;&#223;e 1440]</dt>
<dd><a href="http://www.webdesign-in.de/wp-images/0107/abak-alle.gif" title="Abakus mit allen Bildschirmaufl&#246;sungen"><img src="http://www.webdesign-in.de/wp-images/0107/alle.gif" alt=" alle Bildschirmaufl&#246;sungen" width="200" height="100" /><br />Abakus</a><br />
<a href="http://www.webdesign-in.de/wp-images/0107/seo-alle.gif" title="Seo in de mit allen Bildschirmaufl&#246;sung"><img src="http://www.webdesign-in.de/wp-images/0107/alle.gif" alt="alle  Bildschirmaufl&#246;sungen" width="200" height="100" /></a><br />Seo-in.de</dd>
</dl>
<p><br class="clear" /></p>
<p>Man kann auf den Screenshots zumindest gut erkennen wie breit eine Zeile in 1440 werden kann, wenn ein fluides Layout einfach nicht aufh&#246;rt zu wachsen. <img src='http://www.webdesign-in.de/wp-includes/images/smilies/zwinker.gif' alt=':zwinker:' class='wp-smiley' />  </p>
<div class="sign">mts </div>
]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-in.de/mts/meine-homepage-optimieren-bildschirmaufloesungen-im-vergleich/feed/</wfw:commentRss>
		<slash:comments>14</slash:comments>
		</item>
		<item>
		<title>Web 2.0 bei Yahoo und Kunstverst&#228;ndnis bei Google</title>
		<link>http://www.webdesign-in.de/mts/web-20-bei-yahoo-und-kunstverstaendnis-bei-google/</link>
		<comments>http://www.webdesign-in.de/mts/web-20-bei-yahoo-und-kunstverstaendnis-bei-google/#comments</comments>
		<pubDate>Tue, 12 Dec 2006 15:24:29 +0000</pubDate>
		<dc:creator>mts</dc:creator>
				<category><![CDATA[blogger]]></category>
		<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.webdesign-in.de/mts/web-20-bei-yahoo-und-kunstverstaendnis-bei-google/</guid>
		<description><![CDATA[Die einen verkraulen Benutzer mit dem Hinweise, doch einen neuen Browser herunterzuladen, die anderen demonstrieren Zeitgeist der eher Stillosigkeit genannt werden kann.]]></description>
			<content:encoded><![CDATA[Copyright &copy; 2012 <a href="http://www.webdesign-in.de">mts</a>. Visit the original article at <a href="http://www.webdesign-in.de/mts/web-20-bei-yahoo-und-kunstverstaendnis-bei-google/">http://www.webdesign-in.de/mts/web-20-bei-yahoo-und-kunstverstaendnis-bei-google/</a>.<br /><dl class="left" style="width:230;">
<dt>Edvard Munch und <br />Googles Kunstverst&#228;ndnis</dt>
<dd><a class="imagelink" href="http://www.webdesign-in.de/wp-content/uploads/munch-google.gif" title="Edvard Munch und Googles Kunstverst&#228;ndnis"><img id="image512" src="http://www.webdesign-in.de/wp-content/uploads/munch-google.thumbnail.gif" alt="Edvard Munch und Googles Kunstverst&#228;ndnis" height="81" width="128" /></a></dd>
</dl>
<p>An den Geburtstag von Edvard Munch zu erinnern ist eine ehrenvolle Sache. Ob man die Werke des Edvard Munch mag oder nicht mag ist ja eine andere Sache.  Als modernes Unternehmen macht die Suchmaschine Google auf solche und &#228;hnliche Ereignisse aufmerksam. Der Stil ist  diskutierbar.  </p>
<p>Ich pers&#246;nlich erachte es als Affront gegen&#252;ber einen K&#252;nstler, diesen einerseits zu ehren und andererseits sein Werk zu demolieren.</p>
<h3>Wieso betrachte ich das heutige Logo von Google als Demontage von der Schrei (1893 entstanden)</h3>
<p><strong>Lebensfries</strong> ist eine aus 22 Teilen bestehende Bilderfolge in der es um die &#8220;Keimen der Liebe&#8221;, &#8220;Bl&#252;hen und Vergehen der Liebe&#8221;, &#8220;Lebensangst&#8221; und &#8220;Tod&#8221; geht.  Der Schrei ist ein Bild aus der Lebensfries und das Bild mit &#214;l auf Karton gemalt lebt durch die Farben in Verbindung <span id="more-510"></span>mit dem markanten Kopf. Die tiefe Einsamkeit und das Erkennen derselben, obwohl nicht alleine, der Aufbau des Bildes, der Kontrast des gelbgr&#252;nlichen, gr&#252;nlichgelben nackten Kopfes zum &#8220;Himmel&#8221;, der in warmen rot-gelb T&#246;nen sich zeigt und so &#8220;das Andere&#8221; pr&#228;sentiert ergeben u.a.die Dynamik wie sie eben nur ein Impressionist darzustellen vermag. </p>
<p>Es ist nicht die Tatsache, dass in dieses Bild Google geschrieben wurde, dies ist noch verschmerzbar. Doch <strong>das Blau in dem heutigen Logo </strong>zerst&#246;rt das Bild. Ich behaupte wer auf die Idee kam in dieses Bild dieses Blau zu geben h&#228;tte auch gleich sagen k&#246;nnen: Wer war Munch? Was ist Impresssionismus? </p>
<p>Man mag mich steinigen, aber wenn ein Gro&#223;konzern dieser Art sowenig an Kunstverstand aufweist tut es weh und &#8220;Pisa&#8221; l&#228;&#223;t gr&#252;&#223;en.  Und wenn ein Gro&#223;konzern unf&#228;hig ist sich diesbez&#252;glich beraten zu lassen, ist es auch kein Renomee.</p>
<p>Aber nicht nur die eine Suchmaschine greift tief in die Fettn&#228;pfchen unserer Tage. Yahoo kann es mindestens genauso gut.</p>
<dl class="left" style="width:230;">
<dt>Yahoo <br /> Web 2.0 Interaktion </dt>
<dd><a class="imagelink" href="http://www.webdesign-in.de/wp-content/uploads/yahoo-web20.gif" title="Yahoo und die moderne Web 2.0 Interaktion mit dem User"><img id="image513" src="http://www.webdesign-in.de/wp-content/uploads/yahoo-web20.thumbnail.gif" alt="Yahoo und die moderne Web 2.0 Interaktion mit dem User" height="96" width="105" /></a></dd>
</dl>
<p>Yahoo hat Web 2.0 entdeckt. Zumindest wollte es dies tun. Mit hinweisen, dass man erst eine Software herunterladen oder eine vorhandene erneuern sollte, hat man schon vor einigen Jahren Benutzer mehr als verkrault.  Web 2.0 auf die Fahnen zu heften ist eine Sache, es auch zu leben eine andere.<br class="clear" /></p>
<div class="sign">mts </div>
]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-in.de/mts/web-20-bei-yahoo-und-kunstverstaendnis-bei-google/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>der Shop ist auf Suchmaschinenfreundlichkeit getrimmt</title>
		<link>http://www.webdesign-in.de/mts/shop-seo-tauglich/</link>
		<comments>http://www.webdesign-in.de/mts/shop-seo-tauglich/#comments</comments>
		<pubDate>Tue, 25 Jul 2006 19:50:17 +0000</pubDate>
		<dc:creator>mts</dc:creator>
				<category><![CDATA[usability]]></category>

		<guid isPermaLink="false">http://www.webdesign-in.de/mts/shop-seo-tauglich/</guid>
		<description><![CDATA[Ich bin auf der Suche nach einem Shop. Suchmaschinentauglichkeit ist das oberste Prinzip. ]]></description>
			<content:encoded><![CDATA[Copyright &copy; 2012 <a href="http://www.webdesign-in.de">mts</a>. Visit the original article at <a href="http://www.webdesign-in.de/mts/shop-seo-tauglich/">http://www.webdesign-in.de/mts/shop-seo-tauglich/</a>.<br /><p><span class="caplize">S</span>hop ist auf Suchmaschinenfreundlichkeit getrimmt,-der Shop ist SEO tauglich  &#8230; Ich kann diesen Satz schon nicht mehr lesen.</p>
<p>Klar es ist mein Begehr, ich mag ein Shop System finden, dass absolut optimiert f&#252;r Suchmaschinen ist.  Aber mehr als obigen Satz verr&#228;t kaum ein Shop Software Anbieter.</p>
<p>Ich kann seitenlang lesen, dass ich in der Shop Software Artikel hochladen kann. Sorry liebe Shop Software Ersteller, was tut man denn sonst in einer Shop Software au&#223;er Artikel hochladen?</p>
<p>Ich bin ja bereit f&#252;r so eine Shop Software mehr als tausend Euros auszugeben. Aber ich mag Anworten auf die wirklich relevanten Fragen<span id="more-440"></span>.</p>
<h3>der Shop ist SEO tauglich </h3>
<h3>Shop ist auf Suchmaschinentauglichkeit gtrimmt</h3>
<ul>
<li>
Ist das Shop auf Frames aufgebaut==> Hoffentlich nicht!
</li>
<li>Kann ich pro Artikel eigene title tags und eigene meta description angeben?==>Hoffentlich JA!
</li>
<li>Sind die Session IDs sichtbar? ==> Hoffentlich nicht!
</li>
<li>Wird mod-rewrite unterst&#252;tzt?==>Hoffentlich JA!
</li>
<li> Ist ein suchmaschinenfreundliches URL Design Standard bei der Shop Software?==>  Bei an die 1000Euro hoffe ich doch wohl:JA!<br />
<br />meinedomain.tld/artikel/shopsoftware/enterprise-edition/ ==> So sieht so eine suchmaschinenfreundliche URL aus. <br />
meinedomain.tld/id_342/_id_876/ ist es mit Garantie nicht.
</li>
<li>Kann ich die Bilder mit Untertitel hochladen?==>Hoffentlich JA!
</li>
<li>Kann ich wie bei einem CMS auch Beitr&#228;ge ver&#246;ffentlichen==>Hoffentlich JA! Ich mag ja Zusatznutzen und Mehrwert in meinem Shop anbieten.
</li>
<li>Werden RSS oder Atom Feeds unterst&#252;tzt?==>Hoffentlich JA!
</li>
</ul>
<p>So als absolutes Schmankerl, wo ich selbst bei &#252;ber tausend  Euro schwache Knie bekommen t&#228;t und bei Euch einkaufen w&#252;rde w&#228;re:</p>
<ul>
<li>Entspricht das html und das CSS auch g&#228;ngigem Webstandard==>Hoffentlich JA!, denn ich mag ja auch, dass &#228;ltere Menschen bei mir einkaufen k&#246;nnen.
</li>
<li>Gibt es Fallbackl&#246;sungen bei javascript und entspricht dies der Technik des Jahres 2006 oder ist der Code aus dem Jahre 1990&#8230;
</li>
</ul>
<p>Ich wei&#223;, wer eine Shop Software anbietet ist meist Programmierer und kein Verk&#228;ufer. Ich wei&#223; allerdings auch, dass hunderte, wenn nicht tausende Kunden Euch verloren gehen, weil ihr Antworten auf Fragen gebt, die niemand gestellt hat und die wichtigen Dinge im Laufe der Jahre &#252;berseht.</p>
<p><span class="firstletter">W</span>as n&#252;tzt mir der h&#252;bscheste, sch&#246;nste Shop, wenn ihn keiner findet!</p>
<p>Und wenn ich dann nachfragen will per Email, ob Euer Shop mir das bietet, was ich f&#252;r mein Gesch&#228;ft ben&#246;tige, wollt ihr &#8211;als absolute Spitze der Negativfreundlichkeit gegen&#252;ber dem Kunden &#8212; meine Hausnummer, meine Stadt, meine Telefonnummer.</p>
<p>Wie wei&#223; ich denn, dass diese Abfrage nicht nur dazu dient meine Daten zu verkaufen?<br />
In jedem Laden auf jeder Gesch&#228;ftsstrasse der mir bekannten Welt kann ich nachfragen, ohne meine Adresse angeben zu m&#252;ssen! Ja die wollen nicht einmal meinen Namen.</p>
<p>Email Adresse von  mir reicht aus, damit sie und ich in eine erfolgreiche Partnerschaft, Kunden-was wei&#223; ich was -gehen k&#246;nnen.</p>
<p>So haben sie mich schon verkrault, bevor ich noch die Ladent&#252;re aufgemacht habe.</p>
<div class="sign"> meine Wut ist weg und jetzt such ich weiter,mts</div>
<p>Ich ersuche sie in keinem (negativen )Kommentar einen Shop Namen anzuf&#252;hren, dies k&#246;nnte von irgendwem als Wettbewerbsverletzung oder wie auch immer gewertet werden und die Abmahnkosten trage ich und nicht sie als Kommentierender. Danke</p>
]]></content:encoded>
			<wfw:commentRss>http://www.webdesign-in.de/mts/shop-seo-tauglich/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
	</channel>
</rss>

