Google + Frames

[zap]

Hallo allesamt.
Ein tolles informatives Forum.
Ich bräuchte mal eure Hilfe und Anregungen betreffend unserer neuen HTML-Homepage.
Wir wollen wie die meisten in Google & Co gelistet werden und haben da ein paar Hürden zu überwinden.
Die seite (www.ctm.lu) besteht aus einer index.html welche 2 Frames lädt (topframe + mainframe).
- Müssen die meta, keywords etc auf jeder frameglinkten Seite angegeben werden?
- Da das Topframe das Menu beinhaltet werden verlinkte Seiten nur im mainframe geladen. Einige Suchergebnisse ergeben einen treffer auf eine im Mainframe geladene seite, welches jedoch dann nicht die benötigte index.html lädt und schlimmer keine keywords, meta's etc. beinhaltet.
Könnt Ihr mir mal eine Anregung geben, wie ich die seite programmieren soll für maximale Erreichbarkeit über Google&Co konformität und user/creator flexibilität.

Danke für eure Mühe.

 

[Maxi]

Lass einfach die Frames weg und bau die Seite mit divs auf.
Frames machen in Suchmaschinen immer nur Probleme, die Lösung dafür ist, sie einfach wegzulassen.

 

[threadi]

- Müssen die meta, keywords etc auf jeder frameglinkten Seite angegeben werden?

Das einzig Suchmaschinenrelevante Meta-Tag ist description. Das sollte jeweils an den Inhalt der einzelnen HTML-Seite angepasst sein. Meta-Tag keywords kannst Du weglassen.

Könnt Ihr mir mal eine Anregung geben, wie ich die seite programmieren soll für maximale Erreichbarkeit über Google&Co konformität und user/creator flexibilität.

Frames weglassen wäre der erste große und gute Schritt.

 

[zap]

Thx für die schnellen und guten Anregungen.

Das mit den div's ist so ne Sache. Ich versteh nicht richtig wie die funktionnieren.
Könnt Ihr mir vielleicht einen guten Link nennen, wo die div Funktionsweise erläutert wird.

Allgemein: die Programmation der Site wurde mit dreamweaver gemacht (wo in der neuen Version auch hauptsächlich mit div's gearbeitet wird)

Thx

 

[zap]

Hallo nochmals.

Habe mich noch etwas schlau gemacht betreffend div-tags.
Die theorie hab ich jetzt glaub ich begriffen, die Praxis ist noch ein anderes Problem ;)

Mein frage jetz betreffend umprogrammierung meiner framebasierten homepage.
Wenn ich euch richtig verstehe würdet Ihr das TopMenu als div-tag einlesen. Und das auf jeder Seite. Verlangsamt das nicht die Ladezeiten, da die Elemente für jede html neugeladen werden müssen, da ja implementiert?

Thx

 

[Efchen]

Lass einfach die Frames weg und bau die Seite mit divs auf.

Tut mir leid, das sagen zu müssen, aber man baut eine Webseite nicht mit divs auf!
Das ist ungefähr genauso sinnfrei wie die Seite mit Tabellen aufzubauen.

Man vergibt mit HTML seine semantisch sinnvolle Struktur und macht dann das Layout/Design mit CSS. divs spielen nur eine kleine Rolle, man verwendet sie nur, um mehrere Elemente zwecks gemeinsamer Formatierung zu gruppieren. Alles andere wird nur div-Suppe und kennzeichnet einen Von-Tabellen-zu-CSS-Umsteiger, der noch nicht wirklich begriffen hat, worum es bei CSS-Layout eigentlich geht, was damit einher geht.

Das mit den div's ist so ne Sache. Ich versteh nicht richtig wie die funktionnieren.

"funktionieren" hört sich so an, als gäbe es eine tiefere Bedeutung. HTML-Tags aben aber eigentlich alle nur eine einzige, ziemlich oberflächliche Bedeutung. <p> zeichnet Fließtext aus. <h1> eine Überschrift 1. Grades. <address> eine Adresse. <div> ist ein allgemeines Blockelement, mit dem man mehrere Elemente gruppiert. Für Inhalt gibt es immer ein anderes Tag, was den Inhalt besser beschreibt, als ein <div>. Das beschreibt nämlich eigentlich nichts. Außer eben eine Gruppe.

Habe mich noch etwas schlau gemacht betreffend div-tags.
Die theorie hab ich jetzt glaub ich begriffen, die Praxis ist noch ein anderes Problem

Die Theorie ist simpel. Die Praxis genauso.
Hast Du z.B. ein Menü, machst Du daraus eine <ul>. <div> brauchst Du nicht. Willst Du eine Spalte an eine Seite machen, in der das Menü ist und z.B. noch ein Image unter dem Menü, hast Du ein <ul> mit nachfolgendem <img>. Um die beide zusammen an einen Rand zu bekommen, gruppierst Du sie mit <div>, um dann diesem div später wahrscheinlich ein float zuzuweisen. Aber das geht über HTML hinaus, das ist CSS. Beides sauber voneinander getrennt macht eine gute Website mit einer modernen Vorgehensweise aus. Das ist dann aber kein "Website mit divs", sowas gibt es nicht.

Wenn ich euch richtig verstehe würdet Ihr das TopMenu als div-tag einlesen.

Ein Menü ist immer eine <ul>, niemals ein <div>. Und einlesen kann man in HTML nichts. Man zeichnet den Inhalt, also das Menü, als Liste aus, weil das die naheliegendste semantische Bedeutung ist.

Und das auf jeder Seite. Verlangsamt das nicht die Ladezeiten, da die Elemente für jede html neugeladen werden müssen, da ja implementiert?

Wieviel Bytes hat denn so ein übliches HTML-Tag? Naja, so durchschnittlich drei oder? Wie lange dauert es, 3 Bytes mit einem 300baud-Akustikkoppler zu laden? Nun ja, nicht sehr lang :-)

Eine gut strukturierte HTML-Seite (auch ohne div-Suppe) ist nicht sehr lang. Durch die strikte Trennung von Inhalt und Layout landen ALLE gestalterischen Sachen in einem externen Stylesheet, das nur EINMAL geladen wird (Cache). Deswegen reduziert das die Ladezeiten gegenüber Tabellen-Layouts immens. Frames haben etliche andere Nachteile, die den vermeitnlichen Vorteil von kürzeren Ladezeiten zunichte machen.

HTML: Inhaltsbeschreibung, Semantik
CSS: Layout+Design
Beides strilkt getrennt.
Externes Stylesheet.

Das ist moderne Web-Entwicklung und das hat die kürzesten Ladezeiten, die beste Kompatibilität (nämlich 100%ige Nutzbarkeit in wirklich alles Browsern) und Barrierefreiheit.
Wenn man es richtig macht :-)

Gruß,
-Efchen

 

[stachelbeer]

Ein Menü ist immer eine <ul>, niemals ein <div>.

Warum eine unsortierte Liste? Den wenigsten ist es egal, in welcher Reihenfolge ihre Menüpunkte stehen, so dass ein <ol> Geordneteliste durchaus auch angebracht sein kann. Wenn ich Kategorien direkt in die Liste integriere, kann ich auch mit der <dl> Definitionsliste arbeiten. Das einzige was mir sicher erscheint ist, dass ein Menü immer eine Auflistung von Links ist.

 

[Efchen]

Hallo stachelbeer,

Du hast recht, ich hätte auf das Wörtchen "immer" oder auf "unsortierte" verzichten sollen. Ein Menü ist immer eine Liste. Aber in den meisten Fällen ist ein Menü wohl ein oder mehrere <ul>. Am unwahrscheinlichsten empfinde ich persönlich eine <ol>, mir fällt zumindest gerade kein Fall ein, in der die Reihenfolge von Menüpunkten wirklich eine Rolle spielt. UND ich weiß nicht, ob ein Screenreader trotz list-style-type:none; vielleicht ein "Erstens", "Zweitens", "Drittens" davor setzt.

Gruß,
-Efchen

 

[neuroleptika]

.. Am unwahrscheinlichsten empfinde ich persönlich eine <ol>, mir fällt zumindest gerade kein Fall ein, in der die Reihenfolge von Menüpunkten wirklich eine Rolle spielt.

Warum das manchmal gemacht wird weiß ich auch nicht.
Aber Barrierefreies Webdesign: Einfach für Alle - eine Initiative der Aktion Mensch benützt <ol> in der Hauptnavigation. Vielleicht ist es beim überspringen von Listeneinträgen mit irgendwelchen Clients hilfreich.

UND ich weiß nicht, ob ein Screenreader trotz list-style-type:none; vielleicht ein "Erstens", "Zweitens", "Drittens" davor setzt.

Ich meine, zumindest Jaws 9 (mit IE7) ließt die Nummerierung trotz list-style-type:none vor.
Ich werde es heute Abend mal ausprobieren.

 

[Efchen]

Ist Jaws nicht ein standalone Screenreader-Client? Ist Jaws nicht kostenpflichtig und immens teuer? Oder verwechsle ich da was?

Nummerierung vorlesen fände ich in einem Menü eher nicht so schön. Aber dass <ol> für barrierefreies Handling evtl. einen Nutzen hat, wäre nicht abwegig.

 

[neuroleptika]

Ist Jaws nicht ein standalone Screenreader-Client? Ist Jaws nicht kostenpflichtig und immens teuer? Oder verwechsle ich da was?

Was Jaws kostet weiß ich nicht.

Ein 40min.-Demo ist Kostenlos. Nach 40min muss man den Rechner neu starten.
Freedom Scientific Produkte

Jaws ist kein standalone Client/Browser. Er unterstützt diverse Microsoft-Produkte.

Änderung:
Ich habe mir eine ungeordnete Liste mit Jaws vers.8 (IE7) vorlesen lassen:

<ol style="list-style: none;">
<li>Listeneintrag 1</li>
<li>Listeneintrag 2</li>
</ol>

Die Listennumerierung wird auch mit list-style: none; vorgelesen.
Das hört sich dann so an:
"Liste mit zwei Einträgen.
Ein Listeneintrag eins. Zwei Listenintag zwei. Ende."

 

[stachelbeer]

In Barriearmenmenüs findet man auch häufig als unsortierte Listen. Dafür wird dann in das A-Element mittels dem DFN-Element eine Durchnummerierung erzeugt. Und um nach jedem Menüpunkt eine Sprechpause zu erzeugen, kommt nach dem A-Element noch ein Punkt

<li><a href="foo"><dfn>1:</dfn>bar</a>.</li>

Damit der Punkt normalen Bildschrimnutzern nicht gezeigt wird kriegt er noch ein "Ignore-Span"

<li><a href="foo"><dfn>1:</dfn>bar</a><span class="ignore">.</span></li>

Weill Screenreader leider auch das CSS für Bildschrime Interpretieren, wird der ungewünschte Inhalt für Bildschirme mittels CSS an die Linke Seite ins nahezu unendliche geschickt.

 

[neuroleptika]

hm,
ich hab auch schon irgendwo gelesen, dass man einen Punkt hinter <a> setzen sollte.
Zumindest meine Jaws-Testversion macht auch ohne zutun eine kurze Pause nach jedem Listeneintrag.
Blöd ist nur, dass die Listen-Nummerierung mit eins, zwei.. anstelle erstens, zweitens.... vorgelesen wird.
Auch habe ich noch nicht verstanden wo genau der Vorteil von <ol> in Menüs liegt.

Das dfn-Tag kannte ich noch nicht.

 

[stachelbeer]

Blöd ist nur, dass die Listen-Nummerierung mit eins, zwei.. anstelle erstens, zweitens.... vorgelesen wird.

Kannst Du mal Probieren, ob sich das mit sowas:

<li><a href="foo"><dfn>1.:</dfn>bar</a><span class="ignore">.</span></li>

änder?

Auch habe ich noch nicht verstanden wo genau der Vorteil von <ol> in Menüs liegt.

Es ist eine Frage der Auszeichnung. Es betont die Reihenfolge der Menüeinträge.

 

[neuroleptika]

Ich habe es aus neugier ausprobiert:
html

<ul>
<li>
<a href="#"><dfn>1.:</dfn>Listeneintrag 1</a><span>.</span>
</li>
<li>
<a href="#"><dfn>2.:</dfn>Listeneintrag 2</a><span>.</span>
</li>
<ul>

wird so vorgelesen:
"...
Eins Doppelpunkt Listeneintrag Eins.
..."

Das css enthält nur Positionierungsangaben und interessiert Jaws natürlich nicht:
css

  ul li a span {
position: absolute;
left: 1000px;
top: 1000px;
}

  ul li a dfn {
position: absolute;
left: 1000px;
top: 1000px;
}

Ich habe für Menüs immer ungeordnete Listen ohne <dfn> verwendet.
Und wenn oben genanntes Ergebnis alles sein soll, wird es wohl auch so bleiben.
Ich verstehe den Sinn von Nummerierungen, die man für sehende versteckt noch nicht.
Ich bin aber auch nicht geübt. Es gibt bestimmt Möglichkeiten einen Listenpunkt mit Screenreadern direkt anzuwählen.
Die Anzahl der Listeneinträge wird ja vorgelesen. Da müsste man sich vor dem Anwenden Schlau lesen.

Interessant ist es auf jeden Fall.

 

[Efchen]

Interessant ist es auf jeden Fall.

Ja, fand ich auch. Danke, dass Du Dir die Mühe gemacht hast!