+ Antworten
Seite 1 von 4 1 2 3 4 LetzteLetzte
Ergebnis 1 bis 10 von 32

Thema: Allgemein: Web-Optimierung

  1. #1
    Kommt häufiger vorbei
    Registriert seit
    08.04.2010
    Beiträge
    364
    Bedankte sich
    14
    Erhielt 70 Danksagungen
    in 54 Beiträgen

    Standard Allgemein: Web-Optimierung

    Linksammlung:

    Rechtliches bei der Erstellung einer Webseite:

    1. Das Impressum:
    In Deutschland besteht grundsätzlich die Impressumspflicht!

    Was ist ein Impressum:
    - http://www.e-recht24.de/artikel/datenschutz/209.html

    Wie erstelle ich ein Impressum
    Eine Variante wäre die Online-Variante:
    - http://www.e-recht24.de/impressum-generator.html

    Die sicherere wäre ein vertrauenswürdiger Jurist!

    2. Die Datenschutzhinweise:
    Falls Google Analystics verwendet wird, ist auch ein Datenschutzhinweis nötig!
    Diesen findet Ihr hier:
    - http://www.google.com/intl/de_ALL/analytics/tos.html

    Es gibt ein Gesetz, dass besagt, dass der Besucher seine Daten auf der fremden gespeicherten Webseite einsehen darf.
    Der Betreiber der Webseite muss diese dann unverzüglich schriftlich zusenden.
    Dieser Dienst ist kostenlos. Ich suche später nochmal den richtigen § dazu.


    __________________________________________________ __________________________________________________ __________________________



    Wichtiges beim Erstellen der Webseite selbst:

    1. Der Doctype:
    Der XHTML 1.0 Transitional Doctype, den viele Editoren vorschlagen, wird nicht mehr genutzt.

    Warum?
    • Er ist langsam
    • Er verursacht viele Fehler

    Statdessen?
    Eine erhebliche bessere Wahl ist der XHTML 1.0 Strict Doctype.

    Beispiel:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

    2. externe CSS-Definitionen:
    CSS-Definitionen sollten immer in einen extra Ordner (z.B /htdocs/css/) abgelegt werden und im jeweiligen Dokument im Header eingebunden werden.

    Warum?
    • Weniger Quellcode in den jeweiligen Daten
    • Erhebliche Beschleunigung der Ladezeiten
    • Schnellere indizierung durch die Suchmaschinen

    Beispiel:
    FALSCH
    <table stlye="width:20px; height:10px"></table

    RICHTIG
    <link rel="stylesheet" type="text/css" href="verzeichnis/meinestyles.css">
    <table class="css_table_extern"></table>

    meinestyle.css

    .css_table_extern {
    width: 20px;
    height: 10px;
    }

    3. Zeichenkodierung:
    Die Zeichenkodierung sollte immer auf UTF-8 stehen.

    Warum?
    • Richtige Darstellung der Sonderzeichen. (Ö Ä Ü usw.)
    • Bessere und schnellere Verarbeitung der W3C Validatoren.

    Beispiel:
    <meta **********="Content-Type" content="text/html; charset=UTF-8" />

    WICHTIG: Auch der Editor mit dem Ihr arbeitet muss auf UTF-8 abspeichern!

    4. Spaghetti-Code:
    Spaghetti-Code sind HTML Elemente, die den Text bzw andere Formatierungen ausüben. Diese sollte man meiden!
    Formatierungen sollten ausschließlich über externe CSS-Definitionen vorgenommen werden.

    Warum?
    • Erschwertes nachträgliches Designen. (Mit externen CSS-Definitionen kein problem)
    • Unnötiger Quellcode, der die Seite langsamer macht.

    Beispiel:
    <table width="20px" height="10px" text-align="left"></table>
    4. Layout-Tabellen:
    Layout-Tabellen liegen hinter der heutigen Zeit und sollten nicht mehr verwendet werden.
    Man kann wirklich alles mit externen CSS-Definitionen lösen!


    Warum?
    • Erschwertes nachträgliches Designen. (Mit externen CSS-Definitionen kein problem)
    • Unnötiger Quellcode, der die Seite langsamer macht.
    • Keine skalierung durch den Webbrowser möglich. (Usability, Barrierefreiheit)

    Beispiel:
    <table>
    <tr>
    <td></td>
    <td></td>
    </tr>
    </table>


    <div class="table_css">
    <ul>
    <li></li>
    <li></li>
    </ul>
    </div>

    5. Applets & Framesets:
    Applets & Framesets sind vollkommen veraltet und versauen so ziemlich Alles zur Barrierefreiheit und Usability.
    NICHT verwenden!

    Statdessen?
    Anstelle der Applets werden Javascript Applikationen benutzt. Gutes Stichwort: jQuery
    Framesets einfach sterben lassen. Ohne Worte.

    6. Language-Key:
    Der xml:lang Key und der Meta Bereich für die Language muss vergeben sein!

    Warum?
    • Richtige sprachliche Einsortierung der Suchmaschinen.
    • Möglichkeit die Seite von gewissen Diensten übersetzen zu lassen. (Usability)

    Beispiel:
    <meta **********="Content-Language" content="de" />
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
    7. ALT-Attribute für Bilder:
    Ein unbedingtes MUSS ist die Ausfüllung des Alt-Attributs in Bildern!!(!)

    Warum?
    • Bei fehlendem Bildern oder Textbrowsern weiss ein User dennoch, was dort sein SOLLTE. (Usability)
    • Die Suchmaschinen können Bilder ohne Alt-Attribut nicht interpretieren. Mit Alt-Tag wird dieser aufgenommen.

    Hinweis:
    Bilder, die für's Layout benutzt werden (z.B Hintergründe) sollten zwar auch das Alt-Tag besitzen, aber unausgefüllt!

    Beispiel:
    Conten-Bild:
    Kurze präziese Stichworte/Keywords
    - Aber nicht übertreiben, denn stark wiederholdende Keywords werden abgestraft und mindern die Wertung der Suchmaschinen -
    <img src="http://www.example.org/grafiken/baeckerei.gif" alt="Bäckerei Müller">

    Layout-Bild
    <img src="http://www.example.org/grafiken/baeckerei.gif" alt="">

    8. Title-Attribute für Links:
    Ein unbedingtes MUSS ist die Ausfüllung des Title-Attributs in Links!!(!)

    Warum?
    • Zusätzliche Informationen für den Besucher, wo der Link hinführt. (Usability)
    • Zusätzlicher Content für die Suchmaschinen.

    Beispiel:
    <a href="/kontakt" title="Kontakt zu uns aufnehmen">Kontakt </a>

    9. Meta-Description:
    Die Meta Description ist auch ein wichtiger Fakt für die Suchmaschinen.

    Warum?
    • Taucht als Beschreibung bei den Suchmaschinen auf.
    • Fließt mit ins Keyword-Ranking der Suchmaschinen ein.

    Hinweis:
    Die Description sollte nicht mehr als 150 Zeichen haben. Alles was über die 150 Zeichen hinaus geht wird von Google 'abgehackt' und ist nicht lesbar.
    Außerdem sollte jede Seite eine andere passende Beschreibung mit möglichst treffenden Keywords haben. Aber benutzt nicht zuviele Keywords.
    Menschen lesen diese Beschreibung auch!

    Beispiel:
    <meta name="description" content="150 Zeichen einer netten Beschreibung der aktuellen Seite kommen hier rein"/>
    10. <title>-Tag:
    Nutz den Title-Tag und förder damit das Keyword-Ranking und die Usability!

    Warum?
    • Keywords werden aufgenommen.
    • Informationen für den Besucher. (Usability)
    • Der Besucher weiss bei richtiger Anwendung, wo er gerade ist. (Usability)


    Hinweis:
    Jede Seite muss einen anderen Title-Tag besitzen. Siehe Beispiel

    Beispiel:

    Name - Wo ist man - Keywords - Slogan

    <title>Fotografie Karmashots- KontaktAnsprechpartner und Kontaktdaten, Ihr Fotograf in Krefeld</title>
    oder
    <title>Fotografie Karmashots- Über michGeschichte und Motto, Ihr Fotograf in Krefeld</title>
    oder
    <title>Fotografie Karmashots- GalerieBildergalerie und Referenzobjekte, Ihr Fotograf in Krefeld</title>

    usw
    11. Andere HTML Tags:
    Nutzen Sie die verschiedenen Tags. Sie werden unterschiedlich von den Suchmaschinen gewertet.


    Hinweis:
    Die Überschriften Tags <h1> - <h6> sollten genutzt werden, da die Suchmaschinen diese unterschiedlich stark anerkennt.
    Außerdem wird der <b> Tag ebenfalls beachtet.

    Mehr dazu findet Ihr im angegebenen Link 'Seo für Einsteiger'
    - http://www.sistrix.de/suchmaschineno...er-einsteiger/

    Beispiel:
    <h1>Bäckerei Kirkens</h1>
    <h2>Qualität. Geruch. Geschmack. Bei uns stimmt alles!</h2>

    Wir sind eine leckere Bäckerei mit <b>internationalen Spezialitäten</b> und <b>Gemüse</b>
    <h3> internationalen Spezialitäten </h3>
    Auflistung....
    Geändert von KAISERslin (30.07.2010 um 11:15 Uhr)

  2. Erhielt Danksagungen von:


  3. #2
    Kommt häufiger vorbei
    Registriert seit
    08.04.2010
    Beiträge
    364
    Bedankte sich
    14
    Erhielt 70 Danksagungen
    in 54 Beiträgen

    Standard

    Linksammlung:

    Nachträgliche Optimierung einer Webseite:

    1. Verh. Content zu Quelltext:
    Das Verhältnis zwischen Quelltext und Content ist für Suchmaschinen sehr wichting und geht stark auf das Ranking ein.

    Hinweise:
    Das optimale Verhältnis liegt bei ca. 42%!
    Also schreibt Content für eure Webseiten! (Klauen via Copy & Paste ist strafbar und ausgeschlossen!)
    Deswegen: Quelltext immer so einfach wie möglich gestalten und möglichst klein halten!

    Beispiel:
    Ein SCHLECHTES Beispiel sind die Artisteer Templates
    Finger weg!

    2. DMOZ:
    Trage deine Webseite ins DMOZ ein. Dieses Verzeichnis ist der ultimative Ranking-Boost.
    Allerdings dauert es bis zum Eintrag mehrere Jahre.

    http://dmoz.de/


    3. XML-Sitemap:
    Eine XML-Sitemap ist ebenfalls wichtig zur Seitenindizierung für die Suchmaschinen!
    Eine Sitemap bringt Ihre Webseite schneller in die Suchmaschinen und gibt diesen vor, was aufgenommen werden soll.
    Der Bot kommt dadruch in die kleinsten Winkel der Webseite.

    Gute Komponente: Xmap

    http://extensions.joomla.org/extensi.../site-map/3066


    4. robots.txt:
    Mit der robots.txt gibt man den Google Bots (Crawlern) genauer vor, was sie dürfen und was nicht.
    Ein Link mehr als Tausend Worte. Direkt als Tutorial verpackt .

    http://www.gn-webdesign.de/seo-kurz-...robotstxt.html


    5. Interne Links:
    Links innerhalb der Webseite sind wichtig!

    Warum?
    • Es macht die Besucher neugierig.
    • Es steigert das Ranking in den Suchmaschinen

    Hinweise:
    Als optimale Untergrenze sollte man 20 interne Links haben.
    Als Obergrenze gilt 100 Links (Schon sehr unübersichtlich für einen Menschen).

    6. Externe Links:
    Nach außen verweisende Links sind ebenfalls wichtig!

    Warum?
    • Es leitet die Benutzer zu anderen hoffentlich interessanten Webseiten weiter.
    • Es steigert das Ranking in den Suchmaschinen.

    Hinweise:
    Links sollten nur auf 'gute' Webseiten verweisen. Google setzt für alle gelisteten Webseiten einen Pagerank.
    Wenn der Pagerank der gelinkten Seite eine hohen Wert [1+] hat, ist dies auch für die eigene Seite sehr wertvoll.
    Ist die gelinkte Seite aber ein 'spuddliges' Webseitenverzeichnis, in dem noch unseriöse Werbung verbaut ist, wertet das den Rang der eigenen Seite ab.

    Gute Seiten mit guten Seiten verlinken = Top.
    Gute Seiten mit schlechten Seiten verlinken = Flopp!


    Der durchschnittliche Pagerank Wert einer neuen Seite ist 0!

    7. Social Media:
    Social Media Seiten sind ebenfalls recht hilfreich für den Pagerank.

    Warum?
    • Benutzer halten somit Ihre Seite fest.
    • Wichtige Backlinks werden erstellt.

    Hinweise:
    Benutzer wollen die Möglichkeit, Webseiten in Ihren eigenen seriösen Verzeichnissen zu speichern.
    Also gebt euren Besuchern diese Möglichkeiten mit 'Social bookmarks'.

    Dort unterscheidet man zwischen Indirektes und Direktes Bookmarking:

    - Beim Direkten Bookmarking wird der Artikel, das Produkt oder die Seite direkt im Verzeichnis gespeichert.
    - Beim Indirekten Bookmarking wird eine kleine Profil Seite in einem Netzwerk gespeichert, auf der die Artikel, Produkte oder Seiten verlinkt werden.

    Beispiele:
    Direkt:
    - Mr. Wong http://www.mister-wong.de/
    - de.licio.us http://delicious.com/

    Indirekt:
    - Twitter http://www.twitter.com
    - Facebook http://www.facebook.com
    9. Individuelle Fehlerseiten:
    Individuelle Fehlerseiten sind ebenfalls wichtig für die Usability.
    Hier eine Auflistung:
    - http://www.netconcept24.de/nuetzlich.../tutorial2.php

    Warum?
    • Normale Besucher können mit '404' nichts anfangen und finden nicht zurück.
    • Erklärend, was genau passiert .
    • Führt einen User weiter auf der Website.

    Beispiel:
    ERROR 5000001#22342#12!

    Wisst Ihr, was das ist? Viele Benutzer bei 'nem 404 auch nicht

    10. Größen der Daten:
    Die Größen der HTML,JS,CSS und Bilder sollte möglichst klein gehalten werden.

    Warum?
    • Erhöht die Geschwindigkeit der Seite.

    Größen?
    • Die gesamten HTML Daten sollten nicht größer sein als 30KByte.
      Wenn eure HTML Daten sehr groß sind, versucht diese zu Gzippen (Google für Infos.)!
      Das hat den Vorteil einer ENORMEN Verkleinerung.
    • CSS Daten sollten nicht größer als 20KByte sein. (Auch hier ist Gzip möglich)!
    • JS Daten sollten ebenfalls nicht die 20KByte erreichen. (Auch hier ist Gzip möglich)!

    Die Anzahl der Requests sollte ebenfalls möglichst klein gehalten werden.
    Requests sind die Daten, die beim Seitenaufruf geladen werden.
    10 Requests = 10 Daten.

    Verkleinern kann man das, indem man CSS Daten oder JS Daten zusammenfasst oder das Design umstrukturiert.

    11. Flash Objekte:
    Auf Flash Obejkte sollte in der Regel verzichtet werden.
    Diese werden nicht von den Suchmaschinen erkannt und viele Browser oder Geräte können Flash nicht darstellen.
    - Zur Zeit kein einziges Handy -

    Außerdem sind sie sehr groß.
    Geändert von KAISERslin (02.08.2010 um 09:56 Uhr)

  4. Erhielt Danksagungen von:


  5. #3
    Kommt häufiger vorbei Avatar von Tortenboxer
    Registriert seit
    11.11.2008
    Beiträge
    459
    Bedankte sich
    123
    Erhielt 39 Danksagungen
    in 32 Beiträgen

    Standard

    sehr löblich, da du soviele sachen schreibst..aber das sind nu wirklich hinlänglich bekannte und tausendfach kopierte inhalte

  6. Erhielt Danksagungen von:


  7. #4
    Kommt häufiger vorbei
    Registriert seit
    08.04.2010
    Beiträge
    364
    Bedankte sich
    14
    Erhielt 70 Danksagungen
    in 54 Beiträgen

    Standard

    Reserviert für - Wer weiss :P
    Geändert von KAISERslin (30.07.2010 um 10:13 Uhr)

  8. #5
    Gute Seele des Boards Avatar von Indigo66
    Registriert seit
    30.10.2007
    Ort
    München
    Beiträge
    10.687
    Bedankte sich
    338
    Erhielt 3.354 Danksagungen
    in 3.244 Beiträgen

    Standard

    Zitat Zitat von Tortenboxer Beitrag anzeigen
    sehr löblich, da du soviele sachen schreibst..aber das sind nu wirklich hinlänglich bekannte und tausendfach kopierte inhalte
    Woher soll Kaiserslin wissen, dass Du so ein Crack bist? Hier im Forum werden solche Fragen meist von Newbies gestellt. Ist ja auch im Forenteil "Erste Schritte...."
    Geändert von Indigo66 (30.07.2010 um 09:54 Uhr)

  9. Erhielt Danksagungen von:


  10. #6
    Gehört zum Inventar Avatar von ronny7362
    Registriert seit
    04.10.2008
    Ort
    London
    Alter
    50
    Beiträge
    6.741
    Bedankte sich
    184
    Erhielt 2.077 Danksagungen
    in 1.913 Beiträgen

    Standard

    Zitat Zitat von KAISERslin Beitrag anzeigen
    Updates folgen im Laufe des Vormittags.
    Auf der Arbeit kommt immer mal was dazwischen
    ja die arbeit

    hast du ja nett geschrieben, denke nur das die leute im forum die webdesign
    professionell oder semiprofessionell betreiben es wissen, oder andere info quellen nutzen

    und die hobbybastler es kaum kuemmert, solange ihre seite huebsch und nett aussieht

    vielleicht gibt es aber einigen einen denkanstoss, das eine webseite eben doch mehr ist
    als nur bunte bilder , darum danke

    gruss ronny

  11. Erhielt Danksagungen von:


  12. #7
    Wohnt hier Avatar von oldlady
    Registriert seit
    17.09.2008
    Ort
    München
    Beiträge
    4.848
    Bedankte sich
    357
    Erhielt 1.409 Danksagungen
    in 1.290 Beiträgen

    Standard

    Klar gibt es alle Infos schon überall für den der zu suchen versteht - aber grad hier ist es für Neulinge interessant. Die Mods sollten es aber lieber nach "How-To" oder irgendwohin verschieben wo es nciht gleich wieder untergeht.
    Grüße, Christiane
    Joomla braucht dich!

  13. Erhielt Danksagungen von:


  14. #8
    Kommt häufiger vorbei
    Registriert seit
    08.04.2010
    Beiträge
    364
    Bedankte sich
    14
    Erhielt 70 Danksagungen
    in 54 Beiträgen

    Standard

    Danke

    Naja werde wirklich oft danach gefrag!
    Eine Verweismöglichkeit wird da bald mal notwendig.

    EDIT:
    Könnte man 'Tortenboxer' 's Kommentar löschen oder verschieben? Brauche wohl mehr Platz :/

    EDIT2:
    Hab jetzt Feierabend. Mache Montag weiter :P

    Cheers
    Geändert von KAISERslin (30.07.2010 um 11:04 Uhr)

  15. #9
    Gehört zum Inventar Avatar von albatros
    Registriert seit
    16.08.2006
    Beiträge
    7.840
    Bedankte sich
    1.118
    Erhielt 1.890 Danksagungen
    in 1.748 Beiträgen

    Standard

    Zitat Zitat von KAISERslin Beitrag anzeigen
    5. Applets & Framesets:
    Applets & Framesets sind vollkommen veraltet und versauen so ziemlich Alles zur Barrierefreiheit und Usability.
    NICHT verwenden!

    Statdessen?
    Anstelle der Applets werden Javascript Applikationen benutzt. Gutes Stichwort: jQuery
    Frameworks einfach sterben lassen. Ohne Worte.
    Hi,

    kann es sein, dass Du Dich da verschrieben hast?

    hth

    albatros
    1.FAQ 2.SuFu 3.Google
    Hilfestellungen und Lösungen können nur im Forum von allen genutzt werden. Bitte keine Supportanfragen per PN!
    ...und setz mich auf mein achtel Lorbeerblatt und mache was ich will.

  16. Erhielt Danksagungen von:


  17. #10
    Molly_68
    Gast

    Standard

    ich finde das super, alles schön gebündelt und übersichtlich verpackt
    Danke!

+ Antworten
Seite 1 von 4 1 2 3 4 LetzteLetzte

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein