menü fett

schere · 16 April 2008

hi

ich hab ein problem und zwar bin ich grad am basteln einer hp.
oben hab ich ein menü.. ich hätt gern dass wenn ich auf den menüpukt klicke dass dieser dauerhaft fett bleibt bis ich einen anderen anklicke.
wie mach ich das?

so dann hab ich noch was.. wenn ich auf einen menüpunkt klicke dann öffnet sich ein fenster in nem neuen "content" ich hab aber 2 contents un möchte dass wenn ich einen menüpunkt klicke, dass sich in beiden was ändert. beim klick ändert sich bisher nur ein menüpunkt:

<a href="../nav/home.html" target="content1">Home</a>
hat jemand ne lösung?

danke
gruß
schere

threadi · 16 April 2008

Mit HTML:

Code:

 <a href="../nav/home.html" target="content1"><strong>Home</strong></a>

Mit CSS:

Code:

 <a href="../nav/home.html" target="content1" style="font-weight: bold;">Home</a>

Oder meintest du etwas anderes?

schere · 16 April 2008

hi

ja wenn ich das so mach ist der menüpunkt immer fett ich hab aber mehrere menüpunkte

un da soll beim draufklicken der fett werden der angeklickt wird.. wenn ich nen anderen anklick soll wiederrum dieser fett werden und der alte wieder normal

gruß
schere

threadi · 16 April 2008

Dann musst du auf jeder HTML-Seite den jeweils aktuellen Menü extra (wie oben geschrieben) hervorheben. Geht mit Hilfe von php relativ fix.

koslowski · 16 April 2008

Hi,

schere schrieb:
hi
ja wenn ich das so mach ist der menüpunkt immer fett ich hab aber mehrere menüpunkte
un da soll beim draufklicken der fett werden der angeklickt wird.. wenn ich nen anderen anklick soll wiederrum dieser fett werden und der alte wieder normal
gruß
schere

am einfachsten und unkompliziertesten geht das mit ganz normalen (X)HTML/CSS.
Scriptlösungen sind dabei absolut nicht notwendig:

(X)HTML

Code:

<body id="startseite>
<ul id="navigation">
      <li id="navi01"><strong>Startseite</strong></li>
      <li id="navi02"><a href="kontakt.htm">.htm">Kontakt</a></li>
</ul>
</body>

Jede Seite bekommt eine id.
ul und jeder Menüpunkt bekommen eine id.
Der Menüpunkt der aktuellen Seite wird nur mit ausgezeichnet, damit er nicht auf sich selber zeigt.

css dazu:

Code:

#navigation a,
#navigation strong  {
    display:block;
    color:#fff;
    background-color:#000;
    padding:0.5em 0em;
         }
#navigation a:focus,
#navigation a:hover,
#startseite #navi01 a,
#startseite #navi01 strong,
#kontakt #navi02 a,
#kontakt #navi02 strong  {
    color:#000;
    background-color:#fff;
    font-weight:bold;
        }

a und strong bekommen display:block und etwas padding um die anklickbare Fläche zu vergrößern. strong deshalb, damit der aktuelle Menüpunkt mit andersfarbigem Hintergrund größer ist.

Im hover, focus-Zustand wird Schrift,- und HG.-Farbe verändert und die Schrift fett dargestellt.

Mehr brauchts im Prinzip nicht um den aktuellen Menüpunkt immer hervorgehoben darzustellen und ihn nicht auf sich selber zeigen zu
lassen.;)

koslowski

Efchen · 17 April 2008

Moin,

threadi schrieb:
Mit HTML:

Code:

<a href="../nav/home.html" target="content1">Home</a>

Das ist definitiv falsch. ist ein HTML-Tag, dient also der Auszeichnung. bedeutet soviel wie "dieser Inhalt ist enorm wichtig". Folglich wird er auch so interpretiert. Ein Vorlesebrowser würde hier das Wort "Home" betonen, der Zuhörer würde den Sinn dieser Aktion nicht verstehen.
Des weiteren gibt es keine Richtlinien, welche CSS-Eigenschaften ein HTML-Tag haben muss. Dass das in den meisten Browsern fett ist, ist also reiner Zufall und niemand muss sich daran halten.
Und, HTML ist eine Auszeichnungssprache. Für das Aussehen in einem grafischen Browser ist CSS zuständig, die richtige Lösung kann also nur der zweite Code sein.

koslowski schrieb:
am einfachsten und unkompliziertesten geht das mit ganz normalen (X)HTML/CSS.
Scriptlösungen sind dabei absolut nicht notwendig:

Auch das ist so nicht ganz richtig. Es ist richtig, dass man kein Script braucht, um die aktuelle Seite irgendwie zu markieren. Aber was die Usability angeht, wird oft verlangt, dass man die aktuelle Seite im Menü nicht mehr anklicken können soll, und das geht dann nur mit einer Scriptlösung.

Und Du hast das auch noch übernommen, Schande über Dich ;-)

Gruß,
-Efchen

koslowski · 17 April 2008

Moin,

Efchen schrieb:
Moin,
Das ist definitiv falsch. ist ein HTML-Tag, dient also der Auszeichnung. bedeutet soviel wie "dieser Inhalt ist enorm wichtig". Folglich wird er auch so interpretiert. Ein Vorlesebrowser würde hier das Wort "Home" betonen, der Zuhörer würde den Sinn dieser Aktion nicht verstehen.
Des weiteren gibt es keine Richtlinien, welche CSS-Eigenschaften ein HTML-Tag haben muss. Dass das in den meisten Browsern fett ist, ist also reiner Zufall und niemand muss sich daran halten.
Und, HTML ist eine Auszeichnungssprache. Für das Aussehen in einem grafischen Browser ist CSS zuständig, die richtige Lösung kann also nur der zweite Code sein.
Auch das ist so nicht ganz richtig. Es ist richtig, dass man kein Script braucht, um die aktuelle Seite irgendwie zu markieren. Aber was die Usability angeht, wird oft verlangt, dass man die aktuelle Seite im Menü nicht mehr anklicken können soll, und das geht dann nur mit einer Scriptlösung.
Und Du hast das auch noch übernommen, Schande über Dich ;-)
Gruß,
-Efchen

so wie ich es beschrieben habe ist es die unter erfahrenen Webdesignern übliche Vorgehensweise um den aktuellen Menüpunkt hervorzuheben und ihn nicht auf sich selber zeigen zu lassen (von solchen habe ich das auch gelernt).

 heißt hervorheben im Sinne von "der Inhalt ist besonders wichtig".
Genau das ist in dem Fall ja auch beabsichtigt und somit die korrekte semantische Auszeichnúng.

Screenreader lesen es deshalb besonders betont vor, damit der Sehbehinderte den für ihn wichtigen Hinweis bekommt, auf welcher Seite er sich gerade befindet.

Diesbezüglich hast du da wohl einiges in den falschen Hals bekommen.

koslowski

Efchen · 17 April 2008

koslowski schrieb:
um den aktuellen Menüpunkt hervorzuheben und ihn nicht auf sich selber zeigen zu lassen

Ich sehe in Deiner Vorgehensweise aber keinen Hinweis darauf, wie Du den Link auf die aktuelle Seite ausschaltest. Genaugenommen hast Du in Deinem Beispiel gar keinen Link auf die aktuelle Seite und schreibst, dass der Link auf der aktuellen Seite fehlt. Ja, aber man hat doch ein Menü nicht auf jeder Seite, sondern nur einmal· Also muss doch eine Scriptlösung her, die auf der aktuellen Seite kein a-Tag ausgibt, denn per CSS kannst Du das ja auch nicht abstellen, bzw. stellst es in Deinem Code ja auch nicht ab.

Erklär mir das doch nochmal bitte, wie CSS dafür sorgt, dass der Link auf sich selbst deaktiviert wird.

heißt hervorheben im Sinne von "der Inhalt ist besonders wichtig".
Genau das ist in dem Fall ja auch beabsichtigt und somit die korrekte semantische Auszeichnúng.

Hmmm...ich habe das noch nie aus der Perspektive betrachtet. Für mich war die Markierung der aktuellen Seite bisher immer Beiwerk. Aber nach Deiner Antwort denke ich, Du hast recht. Es ist ja in der Tat durchaus wichtig, dass dieser Menüpunkt die aktuelle Seite markiert, und auch durchaus korrekt, dass das dann beim Vorlesen betont wird.

Edit: Beim nochmal drüberlesen kam mir eine Sache, die ich in den falschen Hals bekommen habe: Die Frage war, wie etwas fett dargestellt wird. Da ist - ganz pauschal - die Antwort "" natürlich falsch. Bis zum Auszeichnen des aktuellen Menüpunkt habe ich bei der Antwort nicht gedacht. Ich bitte um Verzeihung.

Gruß,
-Efchen

koslowski · 17 April 2008

Moin,

Efchen schrieb:
Ich sehe in Deiner Vorgehensweise aber keinen Hinweis darauf, wie Du den Link auf die aktuelle Seite ausschaltest. Genaugenommen hast Du in Deinem Beispiel gar keinen Link auf die aktuelle Seite und schreibst, dass der Link auf der aktuellen Seite fehlt. Ja, aber man hat doch ein Menü nicht auf jeder Seite, sondern nur einmal· Also muss doch eine Scriptlösung her, die auf der aktuellen Seite kein a-Tag ausgibt, denn per CSS kannst Du das ja auch nicht abstellen, bzw. stellst es in Deinem Code ja auch nicht ab.

Erklär mir das doch nochmal bitte, wie CSS dafür sorgt, dass der Link auf sich selbst deaktiviert wird.
Gruß,
-Efchen

jep.
Allerdings wird das in meinem Beispiel im Quelltext definiert.

Code:

<body id="startseite>
<ul id="navigation">
      <li id="navi01"><strong>Startseite</strong></li>
      <li id="navi02"><a href="kontakt.htm">.htm">Kontakt</a></li>
</ul>
</body>

in meinem Beispiel wird der a-Tag der aktuellen Seite durch ersetzt, deshalb kann er nicht mehr auf sich selber zeigen.

Dadurch das die aktuelle Seite eine eigene id bekommen hat (body id="startseite) und die menüpunkte ebenfalls eine eigene id haben und ich strong beim Gestalten miteinbeziehe, kann ich alles per CSS regeln.

Bastel dir mal einen Testcase anhand meines Beispiels weiter oben, um die Technik auszuprobieren.

Ich hab das schon so in meiner "Vorlagen-CSS" drin.
Per copy/paste einfügen, Namen evtl. austauschen oder ergänzen, Eigenschaften anpassen oder ergänzen, fertig.

Für mich persönlich ist es einfach und effektiv zu händeln.:-)

koslowski

Efchen · 17 April 2008

koslowski schrieb:
Allerdings wird das in meinem Beispiel im Quelltext definiert.

Eben. Das heißt aber doch, Du brauchst für jede Seite ein eigenes, vollständiges Menü. Oder Du baust das Menü per Script auf, das dann entscheidet, welcher Menüpunkt keinen Link bekommt.
Also brauchst Du doch ein Script.

Dadurch das die aktuelle Seite eine eigene id bekommen hat (body id="startseite) und die menüpunkte ebenfalls eine eigene id haben und ich strong beim Gestalten miteinbeziehe, kann ich alles per CSS regeln.

Das hab ich schon verstanden, das ist ja ziemlich einfach. Aber der reine CSS-Part kann Dir nicht den Link ausblenden.

Oder habe ich immer noch etwas missverstanden?

Gruß,
-Efchen

koslowski · 17 April 2008

Hi,

Efchen schrieb:
Eben. Das heißt aber doch, Du brauchst für jede Seite ein eigenes, vollständiges Menü. Oder Du baust das Menü per Script auf, das dann entscheidet, welcher Menüpunkt keinen Link bekommt.
Also brauchst Du doch ein Script.

Das hab ich schon verstanden, das ist ja ziemlich einfach. Aber der reine CSS-Part kann Dir nicht den Link ausblenden.

Oder habe ich immer noch etwas missverstanden?

Gruß,
-Efchen

Neue Seiten mache ich, indem ich die alte Seite einfach umbenenne, und strong und a fürs Menü entsprechend ändere.

Mein CSS-Beispiel läßt sich natürlich um beliebig viele Menüpunkte erweitern, selbst wenn mehrere Menüs da sind, muss das Beispiel nur entsprechend erweitert und evtl. angepaßt werden.

Ich kann dir wirklich versichern, daß diese Technik sehr beliebt und vielfach erprobt ist.
Eben weil sie so einfach ist.

Verstehe jetzt gerade nicht was du mit ausblenden meinst, ich denke aber du meinst, das wenn man die Seite wechselt, die Hervorhebung der alten Seite zurückgenommen wird und der Menüpunkt der neuen Seite hervorgehoben wird.
Das funktioniert natürlich nur, wenn jede Seite ihre eigene id hat
(body id="startseite" oder body id="kontakt" usw.).

Hoffe dich richtig verstanden zu haben.

koslowski

Efchen · 17 April 2008

koslowski schrieb:
Neue Seiten mache ich, indem ich die alte Seite einfach umbenenne, und strong und a fürs Menü entsprechend ändere.

Ahhh *Erleuchtung*.
Sowas hatte ich befürchtet, aber bei Dir nicht wahrhaben wollen. So arbeite ich ja schon seit Jahrtausenden nicht mehr :-)
Meine Menüs sind entweder in einer eigenen Include-Datei, oder werden serverseitig aus Datenbankinhalten aufgebaut.
Nach Deiner Methode musst Du in einem 500-Seiten-Projekt ja 500 Dateien editieren, um einen Menüpunkt zu ändern!

Ich kann dir wirklich versichern, daß diese Technik sehr beliebt und vielfach erprobt ist. Eben weil sie so einfach ist.

Das mag sich auf den CSS-Teil beziehen, aber das mit der Markierung der aktuellen Seite oder ein Menü in jede Seite aufs neue zu schreiben, macht doch keiner.

Gruß,
-Efchen

koslowski · 17 April 2008

Efchen schrieb:
Ahhh *Erleuchtung*.
Sowas hatte ich befürchtet, aber bei Dir nicht wahrhaben wollen. So arbeite ich ja schon seit Jahrtausenden nicht mehr :-)
Meine Menüs sind entweder in einer eigenen Include-Datei, oder werden serverseitig aus Datenbankinhalten aufgebaut.
Nach Deiner Methode musst Du in einem 500-Seiten-Projekt ja 500 Dateien editieren, um einen Menüpunkt zu ändern!

Das mag sich auf den CSS-Teil beziehen, aber das mit der Markierung der aktuellen Seite oder ein Menü in jede Seite aufs neue zu schreiben, macht doch keiner.
Gruß,
-Efchen

Hier in diesem Forum gehts i.d.R. nicht um 500-Seiten-Projekte, warum sollte also sich jemand groß mit PHP/MySql beschäftigen wenn es einfacher geht.

Bei 1 - 50 Seiten-Projekten sollte man das so machen, denn warum soll ich einem Kunden eine Datenbank + PHP andrehen wenn das für sein Projekt nicht notwendig ist.
Ich finde so etwas unseriös, denn das dient nur dem Geldbeutel des Webdesigners, ist aber sicher nicht im Interesse des Kunden.

Es ist ja toll, wie du dich so mit PHP, Datenbanken usw. auskennst, da bin ich wirklich beeindruckt.

Jedoch denke ich, das der Fragesteller nicht unbedingt eine Datenbank aufbauen will, um ein relativ einfaches CSS-Problems effektiv zu händeln.

Da die Diskussion langsam eine Richtung annimmt, wo es eher darum geht "auf einen Tisch zu springen und sich laut brüllend auf die Brust zu trommeln", werde ich sie an dieser Stelle für mich beenden.

Es ist imho alles gesagt worden, um dem Fragesteller die nötigen Hilfen an die Hand zu geben.

koslowski

Efchen · 17 April 2008

koslowski schrieb:
Hier in diesem Forum gehts i.d.R. nicht um 500-Seiten-Projekte, warum sollte also sich jemand groß mit PHP/MySql beschäftigen wenn es einfacher geht.

Groß mit PHP beschäftigen? Ein include() reicht aus. Schon wenn ich zwei Seiten habe, lohnt sich der include einer eigenen Menüdatei. Niemand würde sich die Arbeit zweimal machen...hab ich gedacht, bis jetzt. Außerdem braucht man dafür auch kein PHP, SSI reicht auch schon.

Bei 1 - 50 Seiten-Projekten sollte man das so machen, denn warum soll ich einem Kunden eine Datenbank + PHP andrehen wenn das für sein Projekt nicht notwendig ist.
Ich finde so etwas unseriös, denn das dient nur dem Geldbeutel des Webdesigners, ist aber sicher nicht im Interesse des Kunden.

Tut mir leid, aber das will ich nicht glauben, dass Du das ernst meinst.
Und das ist sicher auch nicht bei "erfahrenen Webmastern weit verbreitet".

Es ist ja toll, wie du dich so mit PHP, Datenbanken usw. auskennst, da bin ich wirklich beeindruckt.

Es geht nicht darum, was ich kann, oder ob ich damit jemanden beeindrucken will, es geht darum, wie man Probleme mit dem geringsten Aufwand lösen kann.
Und zu einer guten Website gehört zumindest SSI oder PHP (eigentlich letzteres, weil man sicher auch das ein oder andere Formular auswerten will) einfach dazu, alles andere sind Spielereien.

Jedoch denke ich, das der Fragesteller nicht unbedingt eine Datenbank aufbauen will, um ein relativ einfaches CSS-Problems effektiv zu händeln.

Wenn es so einfach wäre, würde ich Dir recht geben. Aber eine gute Vorgehensweise, das Menü immer wieder neu zu schreiben, ist es nicht.

Da die Diskussion langsam eine Richtung annimmt, wo es eher darum geht "auf einen Tisch zu springen und sich laut brüllend auf die Brust zu trommeln", werde ich sie an dieser Stelle für mich beenden.

Das hat nichts mit auf der Brust trommeln zu tun, aber ich bin mit Dir einer Meinung, was das Beenden dieser Diskussion angeht.

Es ist imho alles gesagt worden, um dem Fragesteller die nötigen Hilfen an die Hand zu geben.

Zustimmung.

Schönen Tag noch,
-Efchen

menü fett

schere

Neues Mitglied

threadi

Moderator

schere

Neues Mitglied

threadi

Moderator

koslowski

Neues Mitglied

Efchen

Guest

koslowski

Neues Mitglied

Efchen

Guest

koslowski

Neues Mitglied

Efchen

Guest

koslowski

Neues Mitglied

Efchen

Guest

koslowski

Neues Mitglied

Efchen

Guest

Neueste Beiträge