Benutzerfreundliches Layout und Suchmachinenoptimierung – SELFHTML-Forum Forum als Ergänzung zum SELFHTML-Wiki und zur Dokumentation SELFHTML https://forum.selfhtml.org/self Benutzerfreundliches Layout und Suchmachinenoptimierung Sat, 24 May 08 12:17:42 Z https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248883#m1248883 https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248883#m1248883 <p>Hallo zusammen,</p> <p>ich hatte neulich eine Diskussion über das Design/Layout, das am besten bei den Usern ankommt und nen besseren Traffic (sorry für das englische Wort...ich kann es nicht anders ausdrücken) erzielt.</p> <p>Die Diskussion war über Seiten bzw. Portale, die mit runden Ecken, Bildern und Schatten programmiert sind, gegenüber Seiten, die - sage ich Mal - einfach mit z.B. Linien (oben, rechts, unten und links) etc. erstellt sind. (was eigentlich sich fast nur mit CSS umsetzen lässt)</p> <p>Ich war/bin der Meinung, dass man möglichst auf die vielen Bildern und runden Ecken, Schatten etc. verzichten soll, um eine Seite einerseits benutzerfreundlich zu gestallten, andererseits barrierefrei und zugänglich für die Suchmaschinen zu coden, da es in vielen Fällen dazu kommt, da das Layout den Programmierer zwingt einen, für die Suchmaschinenoptimierung nicht geeigneten Code zu wählen/verwenden (weil es einfach nicht anders geht).</p> <p>Einige Kollegen/Kolleginnen meinten, dass es doch bekannt, dass die, mit Schatten, runden Ecken etc., erstellten Layouts, heute eine sehr gute Rate bei den Usern haben, und daher sollten die Seiten und Portale in diese Richtung gehen.</p> <p>Für meine Frage, ob es einen Artikel oder Ähnliches, wo man sowas lesen könnte, gibt, hatten sie keine Antwort...<br> Kurz gesagt, sie hatten keinen Beweis, der Ihre Aussage untermauern könnte.</p> <p>Ich würde gerne wissen, was ihr dazu sagt.</p> <p>Viele Grüße<br> Mssmar</p> Benutzerfreundliches Layout und Suchmachinenoptimierung Sat, 24 May 08 12:26:57 Z https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248889#m1248889 https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248889#m1248889 <p>Grüße,</p> <blockquote> <p>ich hatte neulich eine Diskussion über das Design/Layout, das am besten bei den Usern ankommt und nen besseren Traffic (sorry für das englische Wort...ich kann es nicht anders ausdrücken) erzielt.</p> </blockquote> <p>du solltest dich nicht entschuldigen - verwenden von fremdsprachigen wörtern die den sinn besser und präziser erfassen ist imho pflicht.</p> <blockquote> <p>Die Diskussion war über Seiten bzw. Portale, die mit runden Ecken, Bildern und Schatten programmiert sind, gegenüber Seiten, die - sage ich Mal - einfach mit z.B. Linien (oben, rechts, unten und links) etc. erstellt sind. (was eigentlich sich fast nur mit CSS umsetzen lässt)</p> </blockquote> <p>NUR mit css</p> <blockquote> <p>Ich war/bin der Meinung, dass man möglichst auf die vielen Bildern und runden Ecken, Schatten etc. verzichten soll, um eine Seite einerseits benutzerfreundlich zu gestallten, andererseits barrierefrei und zugänglich für die Suchmaschinen zu coden, da es in vielen Fällen dazu kommt, da das Layout den Programmierer zwingt einen, für die Suchmaschinenoptimierung nicht geeigneten Code zu wählen/verwenden (weil es einfach nicht anders geht).</p> </blockquote> <p>wenn du barby-puppen über deine seite verkaufst, sind runde ecken fplicht</p> <blockquote> <p>Einige Kollegen/Kolleginnen meinten, dass es doch bekannt, dass die, mit Schatten, runden Ecken etc., erstellten Layouts, heute eine sehr gute Rate bei den Usern haben, und daher sollten die Seiten und Portale in diese Richtung gehen.</p> </blockquote> <p>inhalt imho vor form. die ekcen können noch so rund sein, aber wenn die seite keine interessanten infos bietet....</p> <blockquote> <p>Für meine Frage, ob es einen Artikel oder Ähnliches, wo man sowas lesen könnte, gibt, hatten sie keine Antwort...<br> Kurz gesagt, sie hatten keinen Beweis, der Ihre Aussage untermauern könnte.</p> </blockquote> <p>jo - das ganze ist "imho-bereich". manche mögen rubens, manche lieber picasso - jedem das seine.</p> <p>MFG<br> bleicher</p> <div class="signature">-- <br> __________________________-<br> Menschen an sich , sind nicht schlecht - es sind nur ihre Taten (c).<br> <a href="http://www.sexgott-or-not.com/?test=428054" rel="nofollow noopener noreferrer">http://www.sexgott-or-not.com/?test=428054</a> </div> Benutzerfreundliches Layout und Suchmachinenoptimierung Sat, 24 May 08 12:33:39 Z https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248886#m1248886 https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248886#m1248886 <p>Lieber Mssmar,</p> <p>wie eine Seite aussieht und wie sie technisch realisiert wurde, ist nicht in allen Fällen voneinander abhängig! In Deinem Post stellst Du es so dar, als ob das "Schmücken" einer Seite mit z.B. runden Ecken und mit Schatteneffekten im direkten Gegensatz zu "suchmaschinenfreundlich" bzw. barrierefrei stünde.</p> <p>DEM IST NICHT SO!</p> <p>Wer seine Seite mit sinnvollem bzw. sinnbehafteten ("semantischem") (X)HTML-Code erstellt, um diese dann anhand dieses Codes mit CSS zu gestalten (und Hintergrundbilder sind ein sehr effektives Mittel in Verbindung mit CSS!), erstellt automatisch suchmaschinenfreundliche und zugängliche Seiten.</p> <p><a href="http://www.peutinger-gymnasium.de" rel="nofollow noopener noreferrer">Unsere Schulwebsite</a> wird jedenfalls von Google sehr gut erfasst und ist offensichtlich auch gut zugänglich - und das mit runden Ecken und Schatteneffekten.</p> <p>Nochmal: Damit eine Seite so aussieht, wie sie soll, muss man nicht technisch so vorgehen, damit Barrieren entstehen, oder Suchmaschinen sich verhakeln. Man kann es aber...</p> <p>Liebe Grüße aus <a href="http://www.ellwangen.de/" rel="nofollow noopener noreferrer">Ellwangen</a>,</p> <p>Felix Riesterer.</p> <div class="signature">-- <br> ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:) </div> Benutzerfreundliches Layout und Suchmachinenoptimierung Sat, 24 May 08 12:37:12 Z https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248884#m1248884 https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248884#m1248884 <p>Glück auf Mssmar!</p> <blockquote> <p>ich hatte neulich eine Diskussion über das Design/Layout, das am besten bei den Usern ankommt und nen besseren Traffic (sorry für das englische Wort...ich kann es nicht anders ausdrücken) erzielt.</p> </blockquote> <p>Irgendwie lustig, sich mit "sorry" für die Verwendung eines englischen Wortes zu entschuldigen, welches in einem Satz verwendet wird, welches von englischen Begriffen so wimmelt *SCNR*</p> <p>Freundliche Grüße</p> <p>zwerg Alex</p> Benutzerfreundliches Layout und Suchmachinenoptimierung Sat, 24 May 08 12:42:21 Z https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248885#m1248885 https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248885#m1248885 <p>Hi,</p> <blockquote> <p>Irgendwie lustig, sich mit "sorry" für die Verwendung eines englischen Wortes zu entschuldigen, welches in einem Satz verwendet wird, welches von englischen Begriffen so wimmelt *SCNR*</p> </blockquote> <p>Oh man ;-( Das war ich mir schon bewusst...Aber das ist jetzt nicht das Hauptthema, um darüber zu diskutieren.</p> <p>Gruß<br> Mssmar</p> Benutzerfreundliches Layout und Suchmachinenoptimierung Sat, 24 May 08 12:57:19 Z https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248887#m1248887 https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248887#m1248887 <p>Hi Felix,</p> <blockquote> <p>Wer seine Seite mit sinnvollem bzw. sinnbehafteten ("semantischem") (X)HTML-Code erstellt, um diese dann anhand dieses Codes mit CSS zu gestalten [...]</p> </blockquote> <p>Das stimmt wohl...es wird auch nur mit (X)HTML und CSS gebaut, aber ist das Deiner Meinung nach gut, wenn man ein Hintergrundbild für einen DIV oder auch eine ungeordnete Liste (<ul><li></li></ul>) z.B. hier nimmt und es über nen CSS Selektor einbindet, aber dadurch keinen Alt-Text für das Bild eingeben kann?</p> <p>Es gibt zwar andere Möglichkeiten, aber die bringen mehr Code mit sich und die sind, soweit ich weiß, nur als Inline-Styles oder als direkten Attribute  in dem Element zu definieren z.B.</p> <pre><code class="block language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token special-attr"><span class="token attr-name">style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value css language-css"><span class="token property">background</span><span class="token punctuation">:</span> <span class="token url"><span class="token function">url</span><span class="token punctuation">(</span>bild.jpg<span class="token punctuation">)</span></span><span class="token punctuation">;</span></span><span class="token punctuation">"</span></span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>span</span> <span class="token special-attr"><span class="token attr-name">style</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span><span class="token value css language-css"><span class="token property">display</span><span class="token punctuation">:</span> none<span class="token punctuation">;</span></span><span class="token punctuation">"</span></span></span><span class="token punctuation">></span></span>Alternativer Text<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>span</span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <p>oder</p> <pre><code class="block language-html"> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>div</span> <span class="token attr-name">id</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>xxx<span class="token punctuation">"</span></span> <span class="token attr-name">titel</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>Alternativtext<span class="token punctuation">"</span></span><span class="token punctuation">></span></span><span class="token tag"><span class="token tag"><span class="token punctuation"></</span>div</span><span class="token punctuation">></span></span> </code></pre> <p>Gruß<br> Mssmar</p> Benutzerfreundliches Layout und Suchmachinenoptimierung Sat, 24 May 08 13:18:49 Z https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248888#m1248888 https://forum.selfhtml.org/self/2008/may/24/benutzerfreundliches-layout-und-suchmachinenoptimierung/1248888#m1248888 <blockquote> <p>Das stimmt wohl...es wird auch nur mit (X)HTML und CSS gebaut, aber ist das Deiner Meinung nach gut, wenn man ein Hintergrundbild für einen DIV oder auch eine ungeordnete Liste (<ul><li></li></ul>) z.B. hier nimmt und es über nen CSS Selektor einbindet, aber dadurch keinen Alt-Text für das Bild eingeben kann?</p> </blockquote> <p>Wenn das Bild via CSS eingebaut wird, gehört es nicht zum Inhalt, ein Alternativinhalt ist damit ohnehin unnötig. Wenn das Bild eigentlich Inhalt ist, gehört es allerdings in den (X)HTML-Code!</p> <blockquote> <p>Es gibt zwar andere Möglichkeiten, aber die bringen mehr Code mit sich und die sind, soweit ich weiß, nur als Inline-Styles oder als direkten Attribute  in dem Element zu definieren z.B.<br> (…)</p> </blockquote> <p>Semantisches Markup heißt nicht, auf <code class="language-html">img</code> zu verzichten, sondern es korrekt einzusetzen – also Bilder, die Inhalt sind, auch entsprechend auszuzeichnen.</p> <div class="signature">-- <br> Reden ist Silber, Schweigen ist Gold, meine Ausführungen sind Platin.<br> Self-Code: sh:( ch:? rl:( br:> n4:( ie:{ mo:) va:) de:> zu:} fl:| ss:| ls:~ js:| </div>