Dropdown-Menu zur Sprachenerweiterung

[Gustav]

Hallo,

ich habe mir nach längerem Suchen eines schlanken html5-Templates vor einiger Zeit ein selfhtml-Template angesehen und das könnte sich wohl insgesamt auch auf meine Bedürfnisse hin anpassen lassen. Dabei wollte ich zunächst auf ein Dropdown-Menu verzichten, um den Zugang möglichst barrierefrei zu gestalten. Ich hatte mit Deutsch und Englisch zwei Sprachversionen eingeplant und habe diese per Menupunkt umschaltbar angelegt.

Nun scheint es aber sinnvoll, die Anzahl der Sprachen zu erweitern. Wenn ich es richtig verstanden habe, wäre zur Erhaltung der Barrierefreiheit nur eine Javascript-Lösung, wie sie hier vorgestellt wird, möglich. Ich bin den Code mal durchgegangen, vermute aber, dass ich davon eigentlich nur einen Bruchteil für meine Herausforderung benötige.

Zum besseren Verständnis füge ich hier einen Link zum responsive Layout mit ein: http://1.eyes2k.com Der rechte Menu-Eintrag (de) soll beim Überfahren bzw. Anklicken nun mehrere Sprachen zur Auswahl anzeigen.

Kann mir da jemand einen Tip geben, wie ich das schlank umsetzen kann?

Beste Grüße und auch Geburtstagswünsche ans Forum, Gustav

[Gunnar Bittersmann]

@@Gustav

Der rechte Menu-Eintrag (de) soll beim Überfahren bzw. Anklicken nun mehrere Sprachen zur Auswahl anzeigen.

Nein, funktioniert nicht. „de“ gibt (inbesondere anderssprachigen Nutzern (m/w/d)) keinerlei Hinweis über seine Funktion; es ist nicht erkennbar, dass es sich dabei um ein Sprachauswahlmenü handelt.

(Bebilderte Beispiele im anderen Thread.)

Überhaupt sind Auswahllisten zur Sprachauswahl problematisch.

Was spricht denn dagegen, die verfügbaren Sprachen anzuzeigen, wie es auf der eben verlinkten Seite gemacht wird?

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[klawischnigg]

Mein lieber Gunnar,

Nein, funktioniert nicht. „de“ gibt (inbesondere anderssprachigen Nutzern (m/w/d)) keinerlei Hinweis über seine Funktion; es ist nicht erkennbar, dass es sich dabei um ein Sprachauswahlmenü handelt.

Man kann sich natürlich beliebig blöd stellen, aber "de" nicht als Sprachauswahl zu erkennen, das schafft vermutlich nicht einmal der derzeitige us-amerikanische Präsident...

(was selbstverständlich das sonst von Dir Gepostete in keiner Weise in Abrede stellen soll😉)

[Tabellenkalk]

Hallo,

Man kann sich natürlich beliebig blöd stellen, aber "de" nicht als Sprachauswahl zu erkennen, das schafft vermutlich nicht einmal der derzeitige us-amerikanische Präsident...

dem traut man ja vieles vermutlich zu Unrecht zu. Aber warum genau meinst du, dass er in Lage ist, etwas das er möglicherweise mit "germ" abkürzen würde, mit "de" zu assoziieren?

Gruß
Kalk

[kai345]

Man kann sich natürlich beliebig blöd stellen, aber "de" nicht als Sprachauswahl zu erkennen, das schafft vermutlich nicht einmal der derzeitige us-amerikanische Präsident...

dem traut man ja vieles vermutlich zu Unrecht zu. Aber warum genau meinst du, dass er in Lage ist, etwas das er möglicherweise mit "germ" abkürzen würde, mit "de" zu assoziieren?

Ist ohnehin ein unsinniges Argument (schon von Gunnar) Wieso sollte "Mr.President" (oder andere nicht-deutschsprachige) das überhaupt erkennen sollen? Fremdsprachler erkennen entweder ihr eigenes Kürzel –sofern vorhanden– oder "en"

[Gunnar Bittersmann]

@@kai345

Fremdsprachler erkennen entweder ihr eigenes Kürzel

Nein. Warum sollte ein Mandarinsprecher „zh“ als Kürzel für Chinesisch erkennen?

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Der Martin]

Hallo,

Fremdsprachler erkennen entweder ihr eigenes Kürzel

Nein. Warum sollte ein Mandarinsprecher „zh“ als Kürzel für Chinesisch erkennen?

warum nicht? Weil es "seins" ist?

Live long and pros healthy,
 Martin

[Gunnar Bittersmann]

@@Der Martin

Fremdsprachler erkennen entweder ihr eigenes Kürzel

Nein. Warum sollte ein Mandarinsprecher „zh“ als Kürzel für Chinesisch erkennen?

warum nicht? Weil es "seins" ist?

Warum sollte ein Mandarinsprecher überhaupt lateinische Buchstaben kennen müssen, um zur Seite in chinesischer Schrift zu gelangen?

Anderes Beispiel: Warum sollte eine Griechin wissen, dass „el“ für Griechisch steht?

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[klawischnigg]

Hi there,

Anderes Beispiel: Warum sollte eine Griechin wissen, dass „el“ für Griechisch steht

Weil sie das, oder zumindest "ελ" schon hunderte, ja tausende Male auf Webseiten gesehen hat?

(nur so als Erklärungsversuch, aber wie schon geschrieben, blöd stellen darf sich jeder, sanktionsfrei. Ich seh' sie schon vor mir, die Abermillionen Deutschen, Österreicher und Schweizer, wie sie fassungslos und grübelnd stundenlang vor einer Abkürzung "de." sitzen und nicht weiterwissen...)

[Der Martin]

Hallo,

Anderes Beispiel: Warum sollte eine Griechin wissen, dass „el“ für Griechisch steht

Weil sie das, oder zumindest "ελ" schon hunderte, ja tausende Male auf Webseiten gesehen hat?

als ελ vielleicht nicht, aber el ist Teil eines internationalen Standards, den man zumindest in dem Teilbereich kennen sollte, der einen selbst betrifft.

nur so als Erklärungsversuch

Schon klar.

aber wie schon geschrieben, blöd stellen darf sich jeder, sanktionsfrei. Ich seh' sie schon vor mir, die Abermillionen Deutschen, Österreicher und Schweizer, wie sie fassungslos und grübelnd stundenlang vor einer Abkürzung "de." sitzen und nicht weiterwissen...)

😀

Live long and pros healthy,
 Martin

[Gunnar Bittersmann]

@@Der Martin

als ελ vielleicht nicht, aber el ist Teil eines internationalen Standards, den man zumindest in dem Teilbereich kennen sollte, der einen selbst betrifft.

Nein. Als normaler Internetnutzer muss man noch nie von ISO 639-1 gehört haben, um sich durchs Web zu bewegen.

Außerdem: Wie Gustav das vorhat zu implmentieren, muss man ja erstmal „de“ kennen, um dahinter eine Sprachauswahl zu vermuten. Und „de“ geht für Nichtdeutschsprecher über den Teilbereich hinaus, der sie selbst betrifft.

🖖 Stay hard! Stay hungry! Stay alive! *Stay home!

[Gunnar Bittersmann]

@@klawischnigg

blöd stellen darf sich jeder, sanktionsfrei.

Dein Denkfehler. Wenn jemand eine Webseite nicht bedienen kann, dann ist nicht der Nutzer der Blöde, sondern der Seitenentwickler.

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[klawischnigg]

Hi there,

blöd stellen darf sich jeder, sanktionsfrei.

Dein Denkfehler. Wenn jemand eine Webseite nicht bedienen kann, dann ist nicht der Nutzer der Blöde, sondern der Seitenentwickler.

In der Tat. Dieser Denkfehler und der Umstand, noch dümmer zu sein als ein Anwender, der "de" nicht versteht, machen mich endlich glaubhaft geeignet für betreutes Denken und vorzeitige Ruhestandsprogramme...

[klawischnigg]

Hi there,

Man kann sich natürlich beliebig blöd stellen, aber "de" nicht als Sprachauswahl zu erkennen, das schafft vermutlich nicht einmal der derzeitige us-amerikanische Präsident...

dem traut man ja vieles vermutlich zu Unrecht zu. Aber warum genau meinst du, dass er in Lage ist, etwas das er möglicherweise mit "germ" abkürzen würde, mit "de" zu assoziieren?

Das bezog sich eher auf seine prinzipiellen kognitiven Fähigkeiten als auf das konkrete Beispiel. Ich denke, die Botschaft hab' ich trotzdem 'rübergebracht.

Natürlich gibt es wesentlich bessere und auch von Gunnar verlinkte Möglichkeiten, eine Sprachauswahl zu gestalten. Ich hab mich nur an der Behauptung gestört, daß es bei "de" nicht erkennbar sei (er schreibt ja sogar von "keinerlei" Hinweis), dass es sich dabei um ein Sprachauswahlmenü handelt.

Und vor allem - entscheidend ist ja nicht, daß irgendein amerikanischer ******präsident ein "de" erkennt sondern daß ein was auch immer Sprechender seine Auswahl erkennt.

Wenn man natürlich der Meinung ist, daß man jemandem, der ohnehin nicht deutsch spricht (denn sonst würde er "de" ja verstehen), die unglaubliche reizvolle Möglichkeit nimmt, die Seite in einer ihm völlig fremden Sprache zu betrachten ("lesen" kann man das ja wohl nicht nennen), dann, ja dann und nur dann macht der Einwand von Gunnar einen echten Sinn. Aber spätestens da sind wir an einem Punkt, wo man die Usability, um es vorsichtig zu formulieren, zart übertrieben hat...

[Der Martin]

Hallo,

Wenn man natürlich der Meinung ist, daß man jemandem, der ohnehin nicht deutsch spricht (denn sonst würde er "de" ja verstehen), die unglaubliche reizvolle Möglichkeit nimmt, die Seite in einer ihm völlig fremden Sprache zu betrachten ("lesen" kann man das ja wohl nicht nennen), dann, ja dann und nur dann macht der Einwand von Gunnar einen echten Sinn. Aber spätestens da sind wir an einem Punkt, wo man die Usability, um es vorsichtig zu formulieren, zart übertrieben hat...

das erinnert mich an eine Silvesterfeier vor einigen Jahren. Wir waren bei der Verwandtschaft im Raum München zu Besuch, und zu vorgerückter Stunde (und entsprechendem Promille-Pegel) kam meine Tante mit der Bedienungsanleitung eines Küchengeräts an. In ungefähr einem Dutzend Sprachen. Und dann hieß es: Jeder soll bitte mal einen Absatz in einer völlig fremden Sprache vorlesen.

Mir ist Finnisch zugelost worden.

Aber auch als andere Familienmitglieder Türkisch, Polnisch oder Kroatisch vorgelesen haben (mit dem richtigen Pegel geht das prima!), lagen wir teilweise vor Lachen unter dem Tisch.

Live long and pros healthy,
 Martin

[klawischnigg]

Hi there,

das erinnert mich an eine Silvesterfeier vor einigen Jahren. Wir waren bei der Verwandtschaft im Raum München zu Besuch, und zu vorgerückter Stunde (und entsprechendem Promille-Pegel) kam meine Tante mit der Bedienungsanleitung eines Küchengeräts an. In ungefähr einem Dutzend Sprachen. Und dann hieß es: Jeder soll bitte mal einen Absatz in einer völlig fremden Sprache vorlesen.

Naja, ich sag's einmal so: wer sich an eine Silvesterfeier erinnern kann, der hat sie nicht erlebt...😉

[Rolf B]

Hallo Gustav,

Überhaupt sind Auswahllisten zur Sprachauswahl problematisch.

und bevor Du daran denkst: Flaggen auch.

Rolf

[Gustav]

Hallo an alle,

ausgeschriebene Sprachnamen mögen noch nutzerfreundlicher sein, mir erscheint es aber too much. Das Beispiel der von dir, Gunnar verlinkten W3C-Seite zeigt das eigentlich auch. Auf kleinem Dipslay bricht es nach meinem Eindruck dann grafisch sogar auseinander.

Die Verwendung von zwei Buchstaben sehe ich auf anderen Seiten nicht nur regelmäßig sondern inzwischen fast überwiegend und habe insofern nicht den Eindruck, dass das eine Nutzer-Überforderung darstellen könnte, sondern sich eher zu einem Standard entwickelt hat. Da ich die Sprachauswahl auf jeder Unterseite anbieten möchte, erscheint es mir die sinnvollste Lösung. Die Auswahl über ein Dropdown-Menu vornehmen zu lassen, würde die Darstellung im konkreten Fall zudem auch auf kleineren Displays sortiert lassen.

Was spricht vor diesem Hintergrund denn gegen ein Dropdown-Menu mit javascript?

Schöne Grüße, Gustav

[Gunnar Bittersmann]

@@Gustav

Die Verwendung von zwei Buchstaben sehe ich auf anderen Seiten nicht nur regelmäßig sondern inzwischen fast überwiegend und habe insofern nicht den Eindruck, dass das eine Nutzer-Überforderung darstellen könnte

Von deinem höchst subjektiven Eindruck solltest du dich nicht überwältigen lassen. Wenn du Klarheit willst, mach einen Nutzertest.

Es mag spezielle Nutzergruppen geben, denen die Sprachkürzel vertraut sind. Es mag andere geben, denen die damit nichts anfangen können.

Da ich die Sprachauswahl auf jeder Unterseite anbieten möchte, erscheint es mir die sinnvollste Lösung.

Die sinnvollste Lösung zur Sprachauswahl ist die, die keine Nutzerinteraktion erfordert: Sprachvereinbarung (language negotiation). (Welche auch auf verlinkter Seite zum Einsatz kommt.)

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Gustav]

Hallo Gunnar,

Danke für deine Anregung der Sprachvereinbarung. Da es hierbei einige Nachteile geben kann, möchte ich dem Nutzer überlassen, sich auf der Seite auch anders entscheiden zu können.

Für die Bezeichnung der Sprachen präferiere ich aus den genannten Gründen die 2 Buchstaben-Lösung (bis auf englisch die TLDs), deshalb noch einmal die Frage:

Was spricht denn ansosnten gegen ein Dropdown-Menu mit javascript?

Schöne Grüße, Gustav

[Der Martin]

Hallo,

Danke für deine Anregung der Sprachvereinbarung.
Da es hierbei einige Nachteile geben kann, möchte ich dem Nutzer überlassen, sich auf der Seite auch anders entscheiden zu können.

das ist gut und richtig - Language Negotiation dürfte in den allermeisten Fällen die richtige, vom Nutzer gewollte Sprache ergeben. Für die seltenen Fälle, wo's mal nicht passt (sei es weil man einen fremdsprachigen Gast hat, der den Rechner mal benutzen darf, oder auch nur weil man selbst mal sehen will, wie denn dieser Absatz in Französisch lautet), sollte man auf jeden Fall eine Möglichkeit vorsehen, die automatische Sprachauswahl zu übersteuern.

Für die Bezeichnung der Sprachen präferiere ich aus den genannten Gründen die 2 Buchstaben-Lösung (bis auf englisch die TLDs)

Achtung: Das stimmt nur "zufällig" bei einigen Ländern überein! Die Länder- und Sprachkürzel nach ISO 3166 sind separat definiert. Das geht schon bei Dänemark (DK) vs. dänische Sprache (da) los, oder Japan (JP) vs. japanische Sprache (ja).

Ganz zu schweigen von Ländern, in denen mehrere Sprachen gesprochen werden und keine davon eine deutliche Mehrheit darstellt (z.B. Schweiz, Belgien). Oder umgekehrt: Sprachen, die in mehreren Ländern gesprochen werden (Englisch, Spanisch, Arabisch, Deutsch).

Was spricht denn ansosnten gegen ein Dropdown-Menu mit javascript?

Nur die Tatsache, dass es nicht mehr funktioniert, wenn Javascript aus irgendeinem Grund mal nicht zur Verfügung steht.

Live long and pros healthy,
 Martin

[Gunnar Bittersmann]

@@Der Martin

Für die Bezeichnung der Sprachen präferiere ich aus den genannten Gründen die 2 Buchstaben-Lösung (bis auf englisch die TLDs)

Achtung: Das stimmt nur "zufällig" bei einigen Ländern überein! Die Länder- und Sprachkürzel nach ISO 3166 sind separat definiert. Das geht schon bei Dänemark (DK) vs. dänische Sprache (da) los, oder Japan (JP) vs. japanische Sprache (ja).

Ich führte ja schon Griechisch (el) an – vs. Griechenland (GR).

Aber man muss gar nicht in die Ferne schweifen, direkt in der Nachbarschaft: Tschechien (CZ) vs. tschechisch (cs). Oder gleich hinterm Badewannenrand: Schweden (SE) vs. schwedisch (sv).

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[JürgenB]

Hallo Martin,

Was spricht denn ansosnten gegen ein Dropdown-Menu mit javascript?

Nur die Tatsache, dass es nicht mehr funktioniert, wenn Javascript aus irgendeinem Grund mal nicht zur Verfügung steht.

nein. Das angesprochene Menü im Wiki verwendet Javascript nur für einige Komfortfunktionen, die man aber bei nur einem Menu-Block garnicht benötigt.

Das Menü basiert auf details/summary. Bis auf alte IE/Edge kommt damit jeder Browser klar, ohne Javascript.

@Gustav
Ich würde bei bis zu drei oder vier Sprachen auf ein Menü verzichten und die Sprachkürzel immer sichtbar nebeneinander setzen, z.B.

de en es fr

Wenn es zu Unsicherheiten bei den Besuchern kommt, könnte man auch noch vor oder über die Sprachauswahllinks so etwas wie „Weitere Sprachen:“ setzen.

Wenn man so etwas auf einer Seite sieht, dürfte eigentlich (?) jedem klar sein, das es sich um eine Sprachauswahl handelt. Mein Arbeitgeber macht es so, und der hat seine Seiten u.A. von „Leuten von der Straße“ beurteilen lassen. Viele haben übrigens gefragt, warum man keine Flaggen nimmt.

Gruß
Jürgen

[Gunnar Bittersmann]

@@JürgenB

Ich würde bei bis zu drei oder vier Sprachen auf ein Menü verzichten und die Sprachkürzel immer sichtbar nebeneinander setzen, z.B.

de en es fr

Schlechtes Beispiel. Du hast ausschließlich Sprachen verwendet, wo das Sprachkürzel mit dem Landeskürzel eines(!) Landes übereinstimmt, in dem diese Sprache gesprochen wird. Westeuropäische Beschränktheit.

Nochmal: Was spricht dagegen, deutsch English español français auszuschreiben? (Und sage niemand Platzmangel! Platzmangel gibt es auf Webseiten nicht.)

Wenn es zu Unsicherheiten bei den Besuchern kommt, könnte man auch noch vor oder über die Sprachauswahllinks so etwas wie „Weitere Sprachen:“ setzen.

In welcher Sprache sollte denn „Weitere Sprachen:“ stehen?

Wenn man so etwas [de en es fr] auf einer Seite sieht, dürfte eigentlich (?) jedem klar sein, das es sich um eine Sprachauswahl handelt.

Nein.

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[JürgenB]

Hallo Gunnar,

Ich würde bei bis zu drei oder vier Sprachen auf ein Menü verzichten und die Sprachkürzel immer sichtbar nebeneinander setzen, z.B.

de en es fr

Schlechtes Beispiel. Du hast ausschließlich Sprachen verwendet, wo das Sprachkürzel mit dem Landeskürzel eines(!) Landes übereinstimmt, in dem diese Sprache gesprochen wird. Westeuropäische Beschränktheit.

OK, mit diesen Kürzeln habe ich hin und wieder zu tun. Aber: wie viele Besucher kennen die TLD-Kürzel, wie viele Besucher die Sprachkürzel nach Norm …? Oder wäre es besser, die Länderkürzel vom KFZ-Kennzeichen zu nehmen? Wobei TLD/Kennzeichen <=> Sprache nicht immer eindeutig ist. Oder sollte man das nehmen, wovon man glaubt (oder aus Tests weiß), das es die Besucher kennen?

Nochmal: Was spricht dagegen, deutsch English español français auszuschreiben? (Und sage niemand Platzmangel! Platzmangel gibt es auf Webseiten nicht.)

Wenn es wenige Sprachen sind, nichts. Auf einer meiner Seiten steht oben rechts „English Version“. Bei vielen Sprachen (z.B. >10) wird der Platz zwar nicht eng, aber der Sprachwahlblock recht dominierend.

Wenn es zu Unsicherheiten bei den Besuchern kommt, könnte man auch noch vor oder über die Sprachauswahllinks so etwas wie „Weitere Sprachen:“ setzen.

In welcher Sprache sollte denn „Weitere Sprachen:“ stehen?

ehrliche Antwort: keine Ahnung. Ich habe auf einer anderen Seite den Google-Übersetzer eingerichtet, der Button zum Auswahlmenü hat den Text „Translate by Google“.

Wenn man so etwas [de en es fr] auf einer Seite sieht, dürfte eigentlich (?) jedem klar sein, das es sich um eine Sprachauswahl handelt.

Nein.

OK, da haben die Userbefragungen der Agentur, die die Seiten meines Arbeitgebers designed hat, etwas Anderes ergeben.

Gruß
Jürgen

[Gunnar Bittersmann]

@@JürgenB

Aber: wie viele Besucher kennen die TLD-Kürzel, wie viele Besucher die Sprachkürzel nach Norm …?

Landeskürzel ≙ Land ≙ Flagge – und Flaggen stehen nicht für Sprachen. Auch Landeskürzel stehen nicht für Sprachen.

Oder wäre es besser, die Länderkürzel vom KFZ-Kennzeichen zu nehmen?

Nein, IMHO. Es ist schon ärgerlich genug, dass es verschiedene Systeme gibt (ISO 3166, KFZ, Sport). Noch ärgerlicher wird’s, wenn die außerhalb ihres Kontexts verwendet werden. Warum sollte ein Internetnutzer KFZ-Kennzeichen kennen? Für Länder (nicht für Sprachen) würde ich im Netz ISO 3166 verwenden, aber:

Es wäre besser, erstmal zu hinterfragen, ob man überhaupt Kürzel verwenden sollte.

Wenn man so etwas [de en es fr] auf einer Seite sieht, dürfte eigentlich (?) jedem klar sein, das es sich um eine Sprachauswahl handelt.

Nein.

OK, da haben die Userbefragungen der Agentur, die die Seiten meines Arbeitgebers designed hat, etwas Anderes ergeben.

Wenn ihr durch Nutzertest mit Nutzern aus eurer Zielgruppe herausgefunden habt, dass Kürzel für eure Zielgruppe OK sind, dann könnt ihr die für eure Zielgruppe verwenden.

Man muss sich nur dafür hüten, das auf andere Zielgruppen zu übertragen.

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[MudGuard]

Hi,

In welcher Sprache sollte denn „Weitere Sprachen:“ stehen?

Hintereinander in allen betroffenen Sprachen - in einem marquee-Element ;-)

cu,
Andreas a/k/a MudGuard

[Gunnar Bittersmann]

@@MudGuard

In welcher Sprache sollte denn „Weitere Sprachen:“ stehen?

Hintereinander in allen betroffenen Sprachen - in einem marquee-Element ;-)

Des marquee mir.

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Tabellenkalk]

Hallo,

In welcher Sprache sollte denn „Weitere Sprachen:“ stehen?

Hintereinander in allen betroffenen Sprachen - in einem marquee-Element ;-)

Lassen sich marquee-Elemente verschachteln?

<marquee>
    weitere Sprachen
    <marqueee>
         englisch, spanisch, österreichisch
    </marqueee>
    other languages
    <marqueee>
         german, spanish, aussie
    </marquee>
    !el diverso speranto
    <marqueee>
         allamano, britico, schluchtsico
    </marqueee>
</marquee>

Gruß
Kalk

[MudGuard]

Hi,

In welcher Sprache sollte denn „Weitere Sprachen:“ stehen?

Hintereinander in allen betroffenen Sprachen - in einem marquee-Element ;-)

Lassen sich marquee-Elemente verschachteln?

<marquee>
    weitere Sprachen
    <marqueee>
         englisch, spanisch, österreichisch
    </marqueee>
    other languages
    <marqueee>
         german, spanish, aussie
    </marquee>
    !el diverso speranto
    <marqueee>
         allamano, britico, schluchtsico
    </marqueee>
</marquee>

Muß ja sein, denn wie sollte das sonst gehen, daß die arabischen/persischen Varianten andersrum marqueeren als die europäischen?

cu,
Andreas a/k/a MudGuard

[Rolf B]

Hallo Tabellenkalk,

wenn Du konsistent marquee statt marqueee schreibst - ja.

Und es sieht GRUSELIG aus 🤯

Rolf

[Tabellenkalk]

Hallo,

Und es sieht GRUSELIG aus 🤯

leider hatten wir bis eben kein tag ‚grusel‘…

Gruß
Kalk

[Gunnar Bittersmann]

@@Tabellenkalk

Lassen sich marquee-Elemente verschachteln?

Ja, wo laufen sie denn?

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Mitleser 2.0]

Nochmal: Was spricht dagegen, deutsch English español français auszuschreiben? (Und sage niemand Platzmangel! Platzmangel gibt es auf Webseiten nicht.)

Das Argument finde ich bei z.B. 30 ausgeschriebenen Sprachen uffem Smartphone irgendwie schwierig. Erhellen Sie mich bitte, Herr Bittersmann.

[Mitleser 2.0]

Nochmal: Was spricht dagegen, deutsch English español français auszuschreiben? (Und sage niemand Platzmangel! Platzmangel gibt es auf Webseiten nicht.)

Das Argument finde ich bei z.B. 30 ausgeschriebenen Sprachen uffem Smartphone irgendwie schwierig. Erhellen Sie mich bitte, Herr Bittersmann.

Aaah, da kommt wohl nix mehr. Aber ich hab da ne Idee! Vielleicht kann man das ja auch via „aria-label="multilingual" für das doch nicht so doofe Auswahlmenü progressive enhancen. LOL

PS: Dieser Beitrag ist kontraproduktiv und trägt zur Verschlechterung der Forumsstimmung bei.

[Gunnar Bittersmann]

@@Mitleser 2.0

Aaah, da kommt wohl nix mehr.

Ich bin im andern Ast mit Dem Martin im Gespräch. Man muss halt Prioritäten setzen. Und da bist du halt weiter unten.

PS: Auch dieser Beitrag ist kontraproduktiv und trägt zur Verschlechterung der Forumsstimmung bei. 😜

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Gunnar Bittersmann]

@@Mitleser 2.0

So, nun zu dir.

Erhellen Sie mich bitte, Herr Bittersmann.

Ein neuer Tag bricht an; es werde Licht.

Nochmal: Was spricht dagegen, deutsch English español français auszuschreiben? (Und sage niemand Platzmangel! Platzmangel gibt es auf Webseiten nicht.)

Das Argument finde ich bei z.B. 30 ausgeschriebenen Sprachen uffem Smartphone irgendwie schwierig.

30 Sprachkürzel sich nicht weniger schwierig. Zumal man die nicht eng aneinander klatschen kann, weil Nutzer die mit ihren Wurstfingern auch treffen können sollen.

Wenn nun aber die Schaltflächen eine gewisse Große haben müssen, dann passt auch die ausgeschriebene Sprachbezeichnung rein.

Es ist aber sicher unschön, wenn auf kleinem Viewport von einer Seite initial nur das Sprachmenü zu sehen ist. (Wir sind uns einig, dass das Sprachmenü am Anfang der Seite stehen muss?)

Da könnte dann ein Aufklappmenü angebracht sein, was sich beim Click auf das Sprachmenü-Icon (wir sprachen drüber) öffnet. Und schon hat man wieder allen Platz der Welt.

Es gibt keinen triftigen Grund, Sprachkürzel zu verwenden.

Der Dem-Bittersmann-haste’s-aber-gegeben-Punkt sei dir aber trotzdem gegönnt. Dass sich immer jemand findet, der ohne nachzudenken auf Plus drückt, da kannst du ja nichts für.

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[JürgenB]

Hallo Gunnar,

Es ist aber sicher unschön, wenn auf kleinem Viewport von einer Seite initial nur das Sprachmenü zu sehen ist. (Wir sind uns einig, dass das Sprachmenü am Anfang der Seite stehen muss?)

Da könnte dann ein Aufklappmenü angebracht sein, was sich beim Click auf das Sprachmenü-Icon (wir sprachen drüber) öffnet. Und schon hat man wieder allen Platz der Welt.

und was könnte man als „Sprachmenü-Icon“ nehmen? Wie Gustav es plant eine Weltkugel? Der „Turm zu Babel“ nimmt bestimmt zu viel Platz ein.

Gruß
Jürgen

[Der Martin]

Hallo,

und was könnte man als „Sprachmenü-Icon“ nehmen?

in irgendeinem Beitrag hatte Gunnar ein extra dafür designtes Symbol verlinkt. Nur: Wer kennt dieses Symbol? Wer würde es verstehen?

Wie Gustav es plant eine Weltkugel?

Eher nicht. Zumindest bei den Webauftritten größerer Organisationen erwarte ich bei einer Weltkugel als Icon intuitiv sowas wie "Unsere Niederlassungen weltweit".

Live long and pros healthy,
 Martin

[Matthias Apsel]

Hallo Der Martin,

in irgendeinem Beitrag hatte Gunnar ein extra dafür designtes Symbol verlinkt. Nur: Wer kennt dieses Symbol? Wer würde es verstehen?

http://www.languageicon.org/

Nur: Wer kennt dieses Symbol? Wer würde es verstehen?

s. a. https://t3n.de/news/internationale-website-sprachumschaltung-748172/ dort: Die Sprachumschaltungs-Icon-Initiative

Bis demnächst
Matthias

[Mitleser 2.0]

in irgendeinem Beitrag hatte Gunnar ein extra dafür designtes Symbol verlinkt. Nur: Wer kennt dieses Symbol? Wer würde es verstehen?

http://www.languageicon.org/

Habe ich persönlich noch nie in der freien Wildbahn im Einsatz gesehen. Gebaut wurde das Icon 2011. Durchaus ernüchternd, oder?

[Rolf B]

Hallo Mitleser,

in der Tat. Ich dachte, ich hätte es mal in MDN gesehen, aber das war ein Irrtum oder sie sind wieder davon weg.

Microsoft.com verwendet einen Globus.

ibm.com schickt mich gnadenlos auf die de-de Subsite, obwohl ich Französisch (Suisse) als vorrangige Sprache eingestellt habe. Offenbar haben sie meine deutsche IP erkannt.

Steam schreibt Text: "language" auf der engl. Seite. US-Arroganz...

Spotify verwendet Flaggen, immerhin mit der Zielseite "Select your country". Für die Schweiz bieten sie ausschließlich deutsch an. Bündnerromanen hören scheinbar keine Musik, und Tessiner oder Genfer müssen sich als Italiener oder Franzosen ausgeben. Hmpf. Fail.

Aber immerhin: Youtube verwendet eine flat-Version des Icons (im Einstellungen-Dropdown versteckt). Und der Sprachselektor von Wikipedia auch.

Die Sprachauswahl der großen Player scheint nichts von Gunnars Empfehlungen (bzw. von den von ihm zitierten Empfehlungen) zu wissen.

Rolf

[Matthias Apsel]

Hallo Rolf B,

Aber immerhin: Youtube verwendet eine flat-Version des Icons (im Einstellungen-Dropdown versteckt). Und der Sprachselektor von Wikipedia auch.

Die Ubernauten verwenden https://fontawesome.com/icons/language?style=solid.

Bis demnächst
Matthias

[Gunnar Bittersmann]

@@Mitleser 2.0

in irgendeinem Beitrag hatte Gunnar ein extra dafür designtes Symbol verlinkt. Nur: Wer kennt dieses Symbol? Wer würde es verstehen?

http://www.languageicon.org/

Habe ich persönlich noch nie in der freien Wildbahn im Einsatz gesehen.

Ich schon; genau dieses oder in abgespeckter Version ohne dieses 3D-Dingens: zwei Buchstaben aus verschiedenen Schriftsystemen (lateinisches/kyrillisches/griechisches A und beim languageicon.org-Icon ist’s wohl ein Hangeul-ㅊ) und ein Pfeil.

Da könnte man intuitiv drauf kommen, dass es um Sprachen und den Übergang von einer zur anderen geht. Ich weiß nicht, ob das Icon gut genug ist; mir fiele aber kein besseres ein.

Wie Rolf schon sagte, ist es auch in Wikipedia und YouTube präsent (mit chinesischem/japanischem Zeichen und ohne Pfeil).

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[JürgenB]

Hallo zusammen,

ich habe das Icon mal in die Tutorials-Navi eingebaut:

http://test.berkemeier.eu/selfwiki/Zugängliche Navigation/Beispiel_Menue_mit_details_und_sprachwahl.html

Was meint ihr?

Gruß
Jürgen

[Rolf B]

Hallo JürgenB,

zu klein. Auf languageicon.org steht, dass es mindestens 20x24 sein sollte, und du limitierst es auf 16. In dieser Größe finde ich es schlecht erkennbar. Ja ich weiß, man muss dann noch etwas basteln damit es nicht den Rest der Navi zerreißt.

Ansonsten, yup, kann man so machen. Find ich. Schade, dass das Icon nicht als SVG vorliegt.

Rolf

[JürgenB]

Hallo Rolf

zu klein.

finde ich auch.

man muss dann noch etwas basteln damit es nicht den Rest der Navi zerreißt.

genau 😉

Schade, dass das Icon nicht als SVG vorliegt.

und mein Versuch, im Adobe Illustrator (das Icon liegt auch als .ai vor) alsSVG zu spiechern, ist kläglich gescheitert. Es wurden nur so ca. 10% aus der Mitte gespeichert. Aber ich versuche es noch mal mit Corel Draw.

Gruß
Jürgen

[JürgenB]

Hallo,

ich habe jetzt mal eine Weltkugel und das Language-Icon zum vergleichen eingebaut, beide 2em hoch:

http://test.berkemeier.eu/selfwiki/Zugängliche Navigation/Beispiel_Menue_mit_details_und_sprachwahl.html

Gruß
Jürgen

[Matthias Apsel]

Hallo JürgenB,

am Handy gefällt mir das Language-Symbol besser.

Bis demnächst
Matthias

[Tabellenkalk]

Hallo,

ich habe jetzt mal eine Weltkugel und das Language-Icon zum vergleichen eingebaut, beide

Spräche etwas dagegen, beide im selben Menupunkt einzubauen?

Gruß
Kalk

[Rolf B]

Hallo JürgenB,

das sieht deutlich besser aus. Das Problem bei der Weltkugel ist, dass das keine Kugel ist, sondern ein leeres Meridiannetz. Deswegen finde ich das nicht so intuitiv.

Rolf

[Tabellenkalk]

Hallo,

Das Problem bei der Weltkugel ist, dass das keine Kugel ist, sondern ein leeres Meridiannetz. Deswegen finde ich das nicht so intuitiv.

Du Mensch des 21. Jahrhunderts, denkt doch nicht so 2-dimensional!

Gruß
Kalk

[Rolf B]

Hallo Tabellenkalk,

pöh, hat ein Kreis etwa Meridiane? 😉

Rolf

[kai345]

Hallo JürgenB,

das sieht deutlich besser aus. Das Problem bei der Weltkugel ist, dass das keine Kugel ist, sondern ein leeres Meridiannetz. Deswegen finde ich das nicht so intuitiv.

Bei mir ist es umgekehrt. Da ich solche oder ähnliche Symbole schon seit vielen Jahren relativ häufig auf Websites gesehen habe, ist das für mich wesentlich intuitiver als das Language-Icon. Insbesondere, da man i.d.R. mit dessen linken Symbol wenig anfangen kann (wenn man es denn überhaupt als mehr als eine Krakelei identifizieren kann)) und das „A“ rechts ist verwirrend, da „A“ meist in Verbindung mit der Möglichkeit zur Änderung der Schriftgröße verwendet wird/wurde. Mit Sprachänderung bringe ich das nicht in Verbindung, wenn ich es vorher nicht weiß.

[JürgenB]

Hallo Rolf,

… Das Problem bei der Weltkugel ist, dass das keine Kugel ist, sondern ein leeres Meridiannetz. Deswegen finde ich das nicht so intuitiv.

aber ein Globus mit Kontinenten ist schlecht skalierbar und für diese Größe zu filigran.

Gruß
Jürgen

[Matthias Apsel]

Hallo JürgenB,

… Das Problem bei der Weltkugel ist, dass das keine Kugel ist, sondern ein leeres Meridiannetz. Deswegen finde ich das nicht so intuitiv.

aber ein Globus mit Kontinenten ist schlecht skalierbar und für diese Größe zu filigran.

Der Gerhard hat da was erfunden.

Bis demnächst
Matthias

[Der Martin]

Hi Jürgen,

… Das Problem bei der Weltkugel ist, dass das keine Kugel ist, sondern ein leeres Meridiannetz. Deswegen finde ich das nicht so intuitiv.

aber ein Globus mit Kontinenten ist schlecht skalierbar und für diese Größe zu filigran.

er muss ja die Kontinente nicht exakt abbilden. Ein Kreis, der durch Schattierungen die Illusion einer Kugel bekommt. Überwiegend blau mit ein paar bräunlich-grünen Flecken. Oben und unten ein kleines weißes Fleckchen, fertig. Natürlich als SVG.

Wie gut das dann auf 24px herunterskaliert aussieht, müsste man mal probieren.

Live long and pros healthy,
 Martin

[Matthias Apsel]

Hallo JürgenB,

Schade, dass das Icon nicht als SVG vorliegt.

online mit https://convertio.co/ (aus der .eps-Datei)

Bis demnächst
Matthias

[JürgenB]

Hallo Matthias,

danke, aber ich konnte es schon mit Corel Draw umwandeln.

Gruß
Jürgen

[JürgenB]

Hallo,

ich habe jetzt noch mal eine andere Weltkugel eingebaut:

http://test.j-berkemeier.de/selfwiki/Zugängliche Navigation/Beispiel_Menue_mit_details_und_sprachwahl.html

Gruß Jürgen

[Rolf B]

Hallo JürgenB,

schick. Dagegen fällt das Language-Icon langweilig aus.

Aber mit height: 3em; transform: translateY(-0.9em); (nur am Icon, nicht an der Kugel) gleicht sich das aus. Finde ich.

Rolf

[JürgenB]

Hallo Rolf,

das Icon darf nur nicht zu groß werden, es steht ja in einer Linie mit den Textlinks.

Gruß
Jürgen

[Rolf B]

Hallo JürgenB,

die genannten Zahlen hatte ich in den Entwicklerwerkzeugen ausprobiert, da hat's noch gepasst.

Rolf

[JürgenB]

Hallo Rolf,

ich habe es jetzt auf 2.5em gesetzt, 3em fand ich etwas zu groß. Ich habe die Sprachwahllinks auch mal an den rechten Rand geschoben.

@All

• Soll ich das Navi-Tutorial um den Sprachwahllink erweitern?
• Wenn ja, soll ich das Language-Icon nehmen, oder die Weltkugel (oder was ganz anderes)?

Gruß
Jürgen

http://test.j-berkemeier.de/selfwiki/Zugängliche Navigation/Beispiel_Menue_mit_details_und_sprachwahl.html

[Matthias Apsel]

Hallo JürgenB,

• Soll ich das Navi-Tutorial um den Sprachwahllink erweitern?

Ja, bitte.

• Wenn ja, soll ich das Language-Icon nehmen, oder die Weltkugel (oder was ganz anderes)?

Ich wäre für das Language-Icon.

Bis demnächst
Matthias

[Rolf B]

Hallo Jürgen,

ist okay so. Die open/close Logik müsste dann noch auf die beiden Dropdowns ausgedehnt werden.

Danke schön, dass Du das erforscht hast.

Rolf

[JürgenB]

Hallo Rolf,

ist okay so. Die open/close Logik müsste dann noch auf die beiden Dropdowns ausgedehnt werden.

done

Gruß
Jürgen

[JürgenB]

Hallo zusammen,

ich habe gerade eine repräsentative Befragung durchgeführt - bei meiner Frau. Sie konnte mit dem Language-Icon überhaupt nichts anfangen („Läuft da jemand weg?“), bei der Weltgugel war ihr sofort klar, was sich dahinter verbirgt.

Gruß
Jürgen

[Mitleser 2.0]

Sie konnte mit dem Language-Icon überhaupt nichts anfangen („Läuft da jemand weg?“)

Hier ähnlich. Fluchtweg / Drehtür waren meine Assoziationen zu dem Teil.

bei der Weltgugel war ihr sofort klar, was sich dahinter verbirgt.

Wäre ich auf der Suche nach einer Sprachwahl, würde ich da im Zweifel auch mal drauf drücken. Erster Gedanke aber analog Martin: hier komme ich zu den weltweiten Filialen von Firma X.

[Mitleser 2.0]

ich habe das Icon mal in die Tutorials-Navi eingebaut:

http://test.berkemeier.eu/selfwiki/Zugängliche Navigation/Beispiel_Menue_mit_details_und_sprachwahl.html

Mich würde ein UX-Test mit 100 randomisierten Teilnehmern interessieren, die einmal diese Variante und eine Version der Flagge der USA präsentiert bekommen.

[Mitleser 2.0]

Es ist aber sicher unschön, wenn auf kleinem Viewport von einer Seite initial nur das Sprachmenü zu sehen ist. (Wir sind uns einig, dass das Sprachmenü am Anfang der Seite stehen muss?)

Da könnte dann ein Aufklappmenü angebracht sein, was sich beim Click auf das Sprachmenü-Icon (wir sprachen drüber) öffnet. Und schon hat man wieder allen Platz der Welt.

Gut, dann sind wir uns ja einig. „Und sage niemand Platzmangel! Platzmangel gibt es auf Webseiten nicht.“ hat sich noch ganz anders angehört…

Dann kommen wir mal zum „Sprachmenü-Icon“. Du sprichst ja oft und zu Recht die Bedeutung von UX-Tests an. Wir dürfen wohl unterstellen, dass beispielsweise Amazon sich dem auch widmet. Was sieht man unter www.amazon.de / www.amazon.com? Eine Flagge! So falsch eine Flagge inhaltlich hier ja auch sein mag: es ist ganz schön etabliert.

[Tabellenkalk]

Hallo,

Was sieht man unter www.amazon.de / www.amazon.com? Eine Flagge! So falsch eine Flagge inhaltlich hier ja auch sein mag: es ist ganz schön etabliert.

Dort kann dann aber sowohl die Sprache als auch das Land/die Region ausgewählt werden, was dann auch m.E. vertretbar ist.

Gruß
Kalk

[Matthias Apsel]

Hallo JürgenB,

de en es fr

Wenn es zu Unsicherheiten bei den Besuchern kommt, könnte man auch noch vor oder über die Sprachauswahllinks so etwas wie „Weitere Sprachen:“ setzen.

Wenn man so etwas auf einer Seite sieht, dürfte eigentlich (?) jedem klar sein, das es sich um eine Sprachauswahl handelt. Mein Arbeitgeber macht es so, und der hat seine Seiten u.A. von „Leuten von der Straße“ beurteilen lassen. Viele haben übrigens gefragt, warum man keine Flaggen nimmt. [Hervorhebung von mir]

Ich denke auch, dass sich dies inzwischen zu einem Standard entwickelt hat, gefühlt erwartet man eine solche Auswahl oben rechts. Für Nichtsehende dürfen auf jeden Fall die entsprechenden aria-Angaben nicht vergessen werden, sonst fragt er sich vielleicht, was Defrenes bedeuten soll.

Bis demnächst
Matthias

[Gustav]

Hallo an alle,

...ich möchte mal ein Zwischenfazit ziehen. Offenbar gibt es zum Thema Sprachauswahl einiges mehr zu berücksichtigen.

1. Die automatisierte Sprachvereinbarung sollte genutzt werden und eine weitere Auswahl auf der Seite ist ebenfalls ratsam.
2. Oben rechts auf der Webseite ist dabei eine gängige Position. 3.a Bei wenigen Sprachen sind direkte Links durchaus sinnvoll. 3.b Bei mehr als 5 Sprachen kann ein Dropdown-Menu sinnvoll werden.
3. Sprachkürzel nach der ISO-Norm 3166-1 sind nicht selten zu finden, aber es gibt auch die Perspektve, die Sprachnamen auszuschreiben und dann auch möglichst in der sprachentypischen Art mit Groß- oder Kleinschreibung. Es gibt auch Mischformen, wo die Anzeige aus den ISO-Kürzeln besteht, bei Aktivieren des Menus dann aber die ausgeschriebenen Sprachnamen zu lesen sind.
4. Auch ist zu berücksichtigen, ob allein Sprachen der westlichen Hemisphäre angeboten werden.

In meinem konkreten Fall sollen es voraussichtlich 8-10 Sprachen sein, deren Schriftsystem mit UTF-8 darzustellen ist. Für eine Darstellung im Dropdown-Menu könnte ich mir eine Mischform vorstellen, so dass nach automatisierter Sprachvereinbarung bei Aufruf der Seite das in aller Regel für Nutzer* bekannte ISO-3166-1 Sprachkürzel und bei Überfahren des Menupunktes eine Liste der Sprachen mit den Namen in ausgeschriebener Form erscheint.

Damit wäre zumindest auch meinem Anliegen einer in allen Display-Größen aufgeräumten und systematisch möglichst gleichen Darstellung Rechnung getragen.

@JürgenB

nein. Das angesprochene Menü im Wiki verwendet Javascript nur für einige Komfortfunktionen, die man aber bei nur einem Menu-Block garnicht benötigt.

Das Menü basiert auf details/summary. Bis auf alte IE/Edge kommt damit jeder Browser klar, ohne Javascript.

Wäre das auf meine Herausforderung übertragbar?

Euch einen guten Wochenstart, Gustav

[JürgenB]

Hallo Gustav,

nein. Das angesprochene Menü im Wiki verwendet Javascript nur für einige Komfortfunktionen, die man aber bei nur einem Menu-Block garnicht benötigt.

Das Menü basiert auf details/summary. Bis auf alte IE/Edge kommt damit jeder Browser klar, ohne Javascript.

Wäre das auf meine Herausforderung übertragbar?

du brauchst nur eine Liste mit den Sprachwahllinks. Wenn die nicht alle gezeigt werden sollen, legst du die Liste in ein details/summary. Problem bei dieser Lösung ist, was nimmt man als Überschrift (summary).

• Versteht ein Amerikaner, was ihn unter „Weitere Sprachen“ erwartet?
• Gibt es einen weltweit bekannten Begriff oder ein Icon für die Sprachwahl?
• Versteht der Besucher den Sinn von zehn neben- oder untereinanderstehenden Iso-Sprachkürzeln?
• Ist ein Block oder mit zehn ausgeschriebenen Sprachlinks zu dominierend?

Fragen, die ich leider allgemein nicht beantworten kann.

Gruß
Jürgen

[Gunnar Bittersmann]

@@Gustav

1. Die automatisierte Sprachvereinbarung sollte genutzt werden und eine weitere Auswahl auf der Seite ist ebenfalls ratsam.

Nicht bloß ratsam, sondern nötig.

3.b Bei mehr als 5 Sprachen kann ein Dropdown-Menu sinnvoll werden.

Ein solches muss dann so gekennzeichnet werden, dass auch Nutzern, welche die aktuelle Sprache der Seite nicht verstehen, dieses als Sprachauswahlmenü erkennen können. Ein Icon könnte sich anbieten (sag ich doch), dessen Verständlichkeit wäre auch ein Fall für einen Nutzertest mit der jeweiligen Zielgruppe.

In meinem konkreten Fall sollen es voraussichtlich 8-10 Sprachen sein, deren Schriftsystem mit UTF-8 darzustellen ist.

UFT-8 kann sämtliche Unicode-Zeichen codieren, also sämtliche in Unicode enthaltene Schriften (die von Version zu Version immer mehr werden).

bei Überfahren des Menupunktes eine Liste der Sprachen mit den Namen in ausgeschriebener Form erscheint.

Was bedeutet „bei Überfahren“ für Tastaturnutzer? Was für Nutzer von Touch-Geräten?

Das Menü basiert auf details/summary. Bis auf alte IE/Edge kommt damit jeder Browser klar, ohne Javascript.

Kommt auch jeder Screenreader mit details/summary klar?

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[JürgenB]

Hallo Gunnar,

Kommt auch jeder Screenreader mit details/summary klar?

ob jeder, weiß ich nicht. Aber meine Recherchen, als ich die details/summary-Navigation geschrieben habe, haben auch einige Gründe dagegen gefunden. Die mangelnde Unterstützung war nicht dabei. Wer details/summary nicht kennt, zeigt alles.

Gruß
Jürgen

[Gustav]

@Gunnar

Mit Überfahren meinte ich einen Hoover-Effekt, der bei einer details/summary Lösung aber wohl ausscheidet.

@ JürgenB

...dann werde ich versuchen, die nächsten Tage das umzusetzen. Ich melde mich dann noch mal.

Bis hierher schon mal allen herzlichen Dank für die Anregungen,

Gustav

[Matthias Apsel]

Hallo Gustav,

Mit Überfahren meinte ich einen Hoover-Effekt, der bei einer details/summary Lösung aber wohl ausscheidet.

Du musst vollständig lesen:

Was bedeutet „bei Überfahren“ für Tastaturnutzer? Was für Nutzer von Touch-Geräten?

Hervorhebung von mir.

<klugscheiß>hover. Schweben, nicht saugen.</klugscheiß>

Bis demnächst
Matthias

[Matthias Apsel]

Hallo Matthias Apsel,

<klugscheiß>hover. Schweben, nicht saugen.</klugscheiß>

Beide kommen zusammen, wenn man versucht, einen in einem Trichter befindlichen Tischtennisball durch den Trichter mit einem Staubsauger einzusaugen (aerodynamisches Paradoxon).

Bis demnächst
Matthias

[Gustav]

Hallo an alle,

ich habe mir die unterschiedlichen Icons in meiner Testumgebung angesehen und zumindest eine Weltkugel lässt sich einigermaßen entschlüsseln. Das Language-Icon ist in dieser Größe eher schwierig, aber ich werde später noch Farbvarianten ausprobieren.

Die details/summary-Navigation habe ich dann gestern eingefügt und so einiges ausprobiert, allerdings bekomme ich es bislang nicht hin, dass Pfeil und Weltkugel wie die übrigen Menu-Einträge einen grauen Rand zeigen. Statt dessen zeigen ausgeklappt nur die einzelnen Sprachangebote jeweils einen grauen Rahmen.

<nav>
  <ul>
    <li><a aria-current="page"><img src="../img/homeS.png" width="18" height="18" alt="home"></a></li>
    <li><a href="../kat1.html">Kategorie1</a></li>
    <li><a href="../kat2.html">Kategorie2</a></li>
    <li><a href="../kat3.html">Kategorie3</a></li>
    <li><details>
		<summary><img src="img/globe.png" width="18" height="18" alt="Globe">
  	 	</summary>
		<a href="../">EN</a>
		<a href="../de/">DE</a>
		<a href="../fr/">FR</a>
		<a href="../es/">ES</a>
		<a href="../pt/">PL</a>
		<a href="../it/">IT</a>
		<a href="../nl/">NL</a>
		<a href="../ru/">RU</a>
		<a href="../po/">PO</a>
		<a href="../jp/">JP | 和</a>
		<a href="../cn/">CN | 中国</a>
	</details></li>
  </ul>
</nav>Quelltext hier

Offenbar sind meine Kenntnisse hier zu begrenzt. Hat jemand von Euch einen Tip, was ich anders machen muss?

Zur Verdeutlichung füge ich hier mal zwei MockUps an, wie es in etwa aussehen sollte.

Schöne Grüße, Gustav

[Rolf B]

Hallo Gustav,

die Ränder passen nicht, weil Du die entsprechenden Eigenschaften am <a> Element setzt. Du solltest das am <li> Element stylen.

Ich habe mit den Entwicklerwerkzeugen mal etwas gespielt. Ich hätte zwei Ideen.

Variante 1

nav li {
   flex: 3 0 auto;
   margin: 0 1em;
   border: 1px solid gray;
   border-radius: 0.5em;
}

und für nav a nimmst Du margin, border und border-radius weg. Problem: Aufklappen des details Blocks bläst jetzt alle Menüpunkte in der Höhe auf. Das hat es auch vorher getan, aber da hat man es nicht gesehen...

Eine Lösung dafür kann sein, den li Elementen noch position:relative zu geben und das details-Element mit position:absolute aus dem Elementfluss herauszunehmen. Nun kannst Du es aufklappen, ohne dass das Elternelement sich vergrößert. Du musst ihm dann noch eine Hintergrundfarbe geben, damit der Text unter dem Menü weggeblendet wird.

Variante 2

Wenn Du möchtest, dass das Aufklappen des Sprachmenüs den Text darunter nicht überlagert, sondern wegschiebt, dann könnte man das Styling auf den <a> Elementen lassen, und auf das <details> Element ausdehnen:

nav > ul > li > a, nav li > details {
    border: 1px solid gray;
    border-radius: 0.5em;
    margin: .5em 0;
    padding: .5em 0.5em;
    line-height: 1.5em;
}

border, margin und padding nimmst du vom a Element weg. Der > Kombinator bewirkt, dass nur diejenigen a getroffen werden, die direkte Kindelemente von li sind. Die im details-Block stehenden <a> Element trifft es nicht. Wobei - hm - das ist ja eigentlich auch eine Liste. Eigentlich müsste man die Links im Sprachblock als Liste auszeichnen. Der Selektor nav > ul > li > a, den ich oben verwendet habe, ist genau dafür da. Eine untergeordnete Liste würde nicht getroffen.

Das Details-Element ist etwas höher als die Links, darum sind die Menüelemente nicht gleich hoch. Das habe ich ausgeglichen, indem ich mit line-height gearbeitet habe. Dadurch werden die Zeilen der inline-Elemente höher und es gibt Platz für Höhenunterschiede. Zum Ausgleich habe ich das padding verringert.

Klappst Du das Sprachmenü jetzt auf, verändert sich nur der Rahmen ums das Sprachmenü. Die übrigen Rahmen bleiben gleich.

Rolf

[Gustav]

Hallo Rolf,

obwohl ich grundsätzlich zu deinem ersten Vorschlag tendiere, weil sich dort die Language-Liste über dem Text öffnen könnte, habe ich mir deine beiden Vorschläge inzwischen angesehen und auch noch diverse Variationen davon probiert. Aber da passt einiges noch nicht. Ich schreibe jetzt nur noch zu Vorschlag 1 und beziehe ich auf deine Angaben:

Solange ich keine background-color für die nav details angebe, öffnet sich die Language-Liste auf einem Smartphone-Screen, wie beabsichtigt, über dem Text. Allerdings fehlen wie auch auf einem Laptop-Screen der graue Menurahmen und die Positionen von Pfeil und Weltkugel sind auch verrutscht. Beim Öffnen oder Schließen des Menus zeigt sich immer ein blauer Ereignisrahmen. Öffne ich das Menu rutschen auf einem Laptop-Screen Pfeil und Weltkugel nach rechts, noch außerhalb des gedachten Menurahmens und die Liste öffnet sich damit auch rechts des Textes. Auch die Abstände zwischen den Menus stimmen in allen Screeneinstellungen nun nicht mehr.

Gebe ich dann eine background-color für nav details ein, rutschen Pfeil und Weltkugel untereinander, haben aber neben dem blauen Ereignisrahmen zumindest auch wieder einen, wenn auch verkleinerten, aber immerhin grauen Menurahmen. Öffne ich die Language-Auswahlliste blasen alle übrigen Menu-Punkte ebenso auf und schieben den Text doch wieder nach unten.

Hast du noch ne Idee, wie ich das hinbekomme oder habe ich bei dem Vorschlag auch etwas falsch verstanden?

Schöne Grüße, Gustav

[Rolf B]

Hallo Gustav,

diverse Probleme.

1. Syntax

nav details {
  position:absolute
  background-color: ffffff;
}

• CSS Eigenschaften werden mit einem Semikolon abgeschlossen (fehlt bei position:relative auch)
• RGB-Farbangaben benötigen ein vorangestelltes #

nav details {
  position:absolute;
  background-color: #ffffff;
}

2. Flex-Basis

  flex: 3 0 auto;
  flex: 1 1 0%

Beides nicht so gut, wenn der Inhalt einer Box absolut positioniert wird. Da der absolut positionierte Inhalt aus dem Flow 'raus ist, hat die Box keinen Inhalt mehr, der die Breite bestimmt. Ich würde in beiden Fällen 3em oder so (oder mehr, je nach Lage) als flex-basis angeben, also dem 3. Parameter der flex Eigenschaft.

3. Ich lag falsch.

Was ich jetzt beim Probieren gemerkt habe: ich war auf dem Holzweg. Das <details> Element darf nicht position:absolute bekommen. Ich habe mir nochmal Jürgens Tutorial aus unserem Wiki angeschaut. Leg ein <div> um deine Sprachlinks und mach das position:absolute. Damit lösen sich einige Probleme in Luft auf, unter anderem die Breite der Hauptmenüpunkte. Dann noch ein paar Justierungen für paddings und margins, damit der Globus sauber platziert ist, und das Popup-div platzierst Du im Cinemascope-Modus mit right:0, und im Handymodus mit right: 50%; transform: translate(50%,0);

Achso: die Background-color muss nur auf das Popup-div. Nicht aufs Details-Element.

Rolf

[Gunnar Bittersmann]

@@Rolf B

• CSS Eigenschaften werden mit einem Semikolon abgeschlossen

Und ich dachte, mit einem Doppelpunkt, der da zwischen Eigenschaft und Wert steht.

Deklarationen werden mit einem Semikolon … – nee stimmt nicht. So is’ richtig: Deklarationen in einem Block werden mit Semikolons^[1] voneinander getrennt. (Das Semikolon gehört nicht zur Deklaration dazu.)

• RGB-Farbangaben benötigen ein vorangestelltes #

Browser verstehen Farbangaben bei background-color und color auch ohne # (nicht jedoch bei der Sammeleigenschaft background).

Ich verwende color:F7EC7D u.dgl. desöfteren in der CSS Battle. (background-color:62306D natürlich nicht, background:#62306D ist kürzer.)

Auch bei den Werten der HTML-Attribute bgcolor und text kann man das # weglassen. (Vermutlich auch bei link etc.)

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

---

1. Und sage niemand, die Pluralform wäre nicht richtig. ↩︎

[Gustav]

Hallo Rolf,

entschuldige bitte zunächst, mindestens das fehlende Semikolon hätte ich auch selbst sehen können.

Die Länderliste habe ich jetzt mal konform der Sprachencodierung ISO-639-1 aufgesetzt; und zwar ausgeschrieben sowie durch Senkrechtstriche abgetrennt mit den Zweibuchstaben-Kürzeln. Ich möchte zumindest mal versuchen, es so hinzubekommen, dass es trotz der Länge auf allen Display-Größen funktioniert.

Da du auf den blauen Ereignisrahmen nicht eingehst, ist der vermutlich bei dieser Lösung nicht zu vermeiden, richtig?

Zu den Anleitungen im letzten Absatz muss ich noch mal nachfragen, da ich da nicht versiert bin. Ich habe jetzt in der html-Datei innerhalb des details- und nach dem summary-Element die Sprachlinks in ein div eingebunden. In der CSS-Datei habe ich folgendes eingebaut:

nav div {
  position:absolute;
  background-color: #ffffff;
}

Padding und margin habe ich versucht, bei nav li:last-of-type einzubauen, zeigt aber keine Wirkung, so dass ich damit vermutlich falsch liege, oder?

In der Layout-Rubrik habe ich bei den unterschiedlichen Screen-Beschreibungen dann noch Folgendes eingefügt

nav div {
  right: 50%; 
  transform: translate(50%,0);
}   

nav div {
  right: 0; 
}

War das so von dir gemeint?

Feine Grüße, Gustav

[Gustav]

@ Rolf B

Hallo Rolf,

ich bin mir nicht sicher, ob du meine Antwort, die ich unterhalb von Gunnars Antwort eingefügt hatte, gelesen hast, deshalb antworte ich hier noch mal direkt auf dich.

Entschuldige bitte zunächst, mindestens das fehlende Semikolon hätte ich auch selbst sehen können.

Die Länderliste habe ich jetzt mal konform der Sprachencodierung ISO-639-1 aufgesetzt; und zwar ausgeschrieben sowie durch Senkrechtstriche abgetrennt mit den Zweibuchstaben-Kürzeln. Ich möchte zumindest mal versuchen, es so hinzubekommen, dass es trotz der Länge auf allen Display-Größen funktioniert.

Da du auf den blauen Ereignisrahmen nicht eingehst, ist der vermutlich bei dieser Lösung nicht zu vermeiden, richtig?

Zu den Anleitungen im letzten Absatz muss ich noch mal nachfragen, da ich da nicht versiert bin. Ich habe jetzt in der html-Datei innerhalb des details- und nach dem summary-Element die Sprachlinks in ein div eingebunden. In der CSS-Datei habe ich folgendes eingebaut:

nav div {
  position:absolute;
  background-color: #ffffff;
}

Padding und margin habe ich versucht, bei nav li:last-of-type einzubauen, zeigt aber keine Wirkung, so dass ich damit vermutlich falsch liege, oder?

In der Layout-Rubrik habe ich bei den unterschiedlichen Screen-Beschreibungen dann noch Folgendes eingefügt

nav div {
  right: 50%; 
  transform: translate(50%,0);
}   

nav div {
  right: 0; 
}

War das so von dir gemeint?

Feine Grüße, Gustav

[Rolf B]

Hallo Gustav,

ich war wohl geistig abwesend.

Was du mit dem blauen Ereignisrahmen meinst, weiß ich nicht genau. Ich sehe nichts blaues. Nur graue Hinterlegung bei den Menüpunkten, und einen dünnen gestrichelten Rahmen um das Summary-Element, der zu sehen ist wenn es den Fokus hat. Um die <a> Elemente ist bei mir bei Fokus ein kräftiger schwarzer Rahmen zu sehen. Das ist ein "outline", es wird vom Browser vorgegeben. Da Du den Fokus durch einen grauen Hintergrund darstellst, könntest Du den Outline mit outline:none auf den Links und dem <summary> entfernen.

Die Justierung des Popup-Div ist für Schmal- und Breitmodus verschieden. Im "Normalmodus" (Schmal) nimmst Du right:50% und transform:translate(50%, 0). Im Breitmodus ist es right:0 und transform:none, dadurch ist das Popup im Breitmodus rechtsbündig.

Was gar nicht passt, ist das flex-grow:2; beim Sprachenmenü. Es macht das Menüelement viel zu breit. Es sollte, wie das Menu-Item für "Home", ein flex-grow:0 haben. Und eine genügend große Flex-Basis (Parameter 3 der Flex-Eigenschaft), damit zwischen Pfeil und Kugel nicht umgebrochen wird. Das hat Auswirkung auf die Breite des Popup-div, aber das gleichst Du mit width:12em; für dieses div (nur im Breitmodus) wieder aus.

Das vertikale Padding geht schief weil Du Pixel als px angeben musst. padding: 4 0.5em; ist falsch und wird ignoriert.padding: 4px 0.5em; wäre besser. Aber 0.25em statt 4px wäre noch besser.

Pfeil und Kugel sind auch schlecht ausgerichtet. Das liegt daran, dass das Image keine anständige Baseline hat und deshalb am oberen Rand der Box klebt. Schiebe es nach unten, mit vertical-align: bottom;. Und nimm die width/height Angaben aus dem HTML heraus. Da sind nur Pixel erlaubt, im CSS kannst Du die Größe in em ausdrücken. Z.B. mit height: 1.25em;, das sieht bei mir ganz gut aus. Wenn das <summary> Element dann auch ein vertikales Padding von 0.5em bekommt, so wie die <a> Elemente, passt auch die Höhe.

Dass die Rahmen um die Menüpunkte aneinanderkleben war Absicht? War da nicht mal eine Lücke (margin)?

Rolf

[Matthias Apsel]

Hallo Rolf B,

Was du mit dem blauen Ereignisrahmen meinst, weiß ich nicht genau. Ich sehe nichts blaues. Nur [...] einen dünnen gestrichelten Rahmen um das Summary-Element, der zu sehen ist wenn es den Fokus hat.

So sieht wahrscheinlich in seinem Browser die Formatierung für :focus aus.

Bis demnächst
Matthias

[Gustav]

Hallo Rolf,

Danke erst einmal für deine umfangreiche Antwort.

Ich füge hier mal einen Screenshot ein, wie das bei mir in Safari aussieht, in Firefox ist der erwähnt blaue Ereignisrahmen dann grau.

Diese zusätzliche Einrahmung möchte ich gern ausblenden, ist das wie Matthias meint, über Focus zu definieren?

Ich habe nun entsprechend deiner Ausführungen den Link aus der html-Datei entfernt und folgendermaßen in die CSS-Datei verschoben und dabei auch die outline-Beschreibung mit eingebaut. Mit outline an dieser Stelle blendet der Ereignisrahmen sich bei mir aber nicht aus.

nav summery {
  vertical-align: bottom;
  background: url('../img/globeB.png') no-repeat;
  height: 1.25em;
  padding: .5em;
  outline:none;

Nun zeigt sich zudem der Globus nicht mehr. Das Problem hatte ich auch schon früher beim home-button, den ich eigentlich auch lieber im CSS eingebettet sehen würde. Offenbar finde ich da nicht die richtige Stellvertreterbeschreibung.

Dann habe ich die nav li-Elemente mit einem

margin: 0 4em; 

ausgestattet, was den ursprünglich geplanten Abstand der einzelnen Menupunkte zueinander, wie du richtig erinnerst, wieder herstellt.

flex-grow: 2 oder flex:2... habe ich im CSS nirgendwo finden können, deshalb weiss ich noch nicht so genau, was du da meinst, die Justierung für das PopUp-div funktioniert mit deinen Angaben jetzt jedenfalls gut.

Dann habe ich noch eine Frage zu der Normalmodus-Darstellung. Dort sind die Menurahmen nicht über die gesamte Breite angelegt, haben zueinander keine Abstände und unterhalb des Menunamens ist ein größerer Abstand zum Rahmen als oberhalb. Wie kann ich das in Form bringen?

In Firefox ist mir dann aufgefallen, dass das Logo unten abgeschnitten und zudem zu groß dargestellt wird. Liegt das daran, dass ich dort eine svg-Datei verwende und die in ihrer Größe definieren müsste?

Schöne Grüße, Gustav

[Gunnar Bittersmann]

@@Gustav

Diese zusätzliche Einrahmung möchte ich gern ausblenden

Bevor du das tust, solltest du überlegen, wie du den Hat-den-Fokus-Zustand denn anders kenntlichmachen willst. Gar nicht ist keine Option.

Nun zeigt sich zudem der Globus nicht mehr. Das Problem hatte ich auch schon früher beim home-button, den ich eigentlich auch lieber im CSS eingebettet sehen würde.

Stimmen denn deine Pfade? Relative Pfade im HTML-Dokoment beziehen sich aufs HTML-Dokoment; relative Pfade im CSS-Dokoment beziehen sich aufs CSS-Dokoment.

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Rolf B]

Hallo Gustav,

(1) Heißt es summary, nicht summery (in deiner .css Datei) - das bringt Dir den Globus wieder

(2) schaltest Du für die Links das Outline ab und eine graue Hinterlegung bei :focus und :hover ein. Das musst Du für das summary-Element auch machen.

Allerdings: warum die gewohnte Benutzererfahrung mit Outlines kaputt machen? Vorhandene Browserfeatures abzuschalten und dann selbst neu zu machen ist so als würdest von deinem Auto die Räder abschrauben, es auf einen Hubwagen laden und dann klagen, dass der Antrieb nicht gut funktioniert.

Rolf

[Gustav]

@ Rolf @ Gunnar

Ich denke, ich verstehe, was ihr da meint. Danke für den Hinweis. Das hatte ich so noch nicht gesehen.

@ Rolf

Ich schick hier noch mal ein Screenshot aus meiner Firefox-Darstellung im Normalmodus.

Siehst du vielleicht, was da falsch läuft?

Schöne Grüße, Gustav

[JürgenB]

Hallo Gustav,

nur zur Info: ich habe das Menü im Wiki um eine Sprachwahl erweitert:

https://wiki.selfhtml.org/extensions/Selfhtml/example.php/Beispiel:Menue_mit_details.html

Gruß
Jürgen

[Gustav]

Hallo Jürgen,

war das von dir so gemeint, dass ich mir html und CSS-Datei des wikis als Vorbild ansehen könnte?

Schöne Grüße, Gustav

[JürgenB]

Hallo Gustav,

du hattest ja das Wiki-Totorial zur Navigation erwähnt. Ich habe die Diskussion hier zum Anlass genommen, das Tutorial um den Punkt Sprachnavigation zu erweitern. Und darauf wollte ich dich nur hinweisen.

Gruß
Jürgen

[Gunnar Bittersmann]

@@Gustav

Danke für deine Anregung der Sprachvereinbarung. Da es hierbei einige Nachteile geben kann,

Nein, es kann dabei keine Nachteile geben.

möchte ich dem Nutzer überlassen, sich auf der Seite auch anders entscheiden zu können.

Natürlich muss ein Sprachauswahlmenü vorhanden sein, um den Nutzern das letzte Wort zu geben. Steht doch auch genau so im verlinkten Artikel.

Für die Bezeichnung der Sprachen präferiere ich aus den genannten Gründen die 2 Buchstaben-Lösung

Was du präferierst, ist irrelevant. Was präferieren die Nutzer deiner Seiten?

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Linuchs]

Moin,

die mehr als ausführliche Diskussion um die Benennung von Sprachen kann ich nicht ganz nachvollziehen.

Es gibt internationale Normen. Die Einheit der elektrischen Spannung ist V, der (das) Meter m.

Sprachkürzel sind nach ISO-639 genormt in lateinischer Schrift. Ich habe es vor vielen Jahren so gelöst:

Damals noch guter Hoffnung, dass Veranstaltungen in ihren Dialekten angekündigt werden.

Jetzt ein euer Aspekt:

In welcher Sprache liefert ihr aus, wenn ihr de, en, nl anbietet, die Anfrage aber in ja kommt?

Google gibt bei Aufruf von Seiten - so weit ich weiß - keine Sprache an. Bisher habe ich bei Aufruf von remso.de de geliefert, bei Aufruf von remso.eu oder remso.org en.

Nun habe ich remso.de umgeleitet auf https://remso.eu - demnach werden sprachlose Makler und alle deren Leser die Oberfläche auf english bekommen.

Moment mal - die Verwirrung ist ja noch größer. Google hats auf en bekommen und kündigt an: „New Events - remso.eu“ beim Aufruf dieser Fundstelle sendet mein Browser aber de und ich erhalte die Seite unter dem Titel „Neue Veranstaltungen“.

Linuchs

[Der Martin]

Hallo,

Sprachkürzel sind nach ISO-639 genormt in lateinischer Schrift.

das war bzw. ist ja auch mein Standpunkt.

In welcher Sprache liefert ihr aus, wenn ihr de, en, nl anbietet, die Anfrage aber in ja kommt?

Wenn ich eine Site in mehreren Sprachen anbiete, erkläre ich eine davon zum Default. Das ist dann je nach Zielgruppe üblicherweise Deutsch oder Englisch.

Kommt jetzt ein Sprachen-Wunsch, den ich nicht erfüllen kann, gibt's halt die Default-Sprache.

Google gibt bei Aufruf von Seiten - so weit ich weiß - keine Sprache an. Bisher habe ich bei Aufruf von remso.de de geliefert, bei Aufruf von remso.eu oder remso.org en.

Du meinst den Google-Bot? Ja, der nimmt vermutlich einfach ohne spezielle Vorlieben, was da so kommt.

Google selbst, also der Suchmaschinen-Dienst, ist aber sehr wohl sprachspezifisch.
Ich habe in meinen Browsern Englisch als bevorzugte Sprache eingestellt, also präsentiert sich mir die Liste der Google-Suchtreffer in Englisch. Das ist in Ordnung.
Allerdings werden dabei auch bevorzugt Treffer gelistet, die das Gesuchte in Englisch anbieten, auch wenn ein deutscher oder italienischer Treffer inhaltlich ein höheres Ranking haben könnte.

Moment mal - die Verwirrung ist ja noch größer. Google hats auf en bekommen und kündigt an: „New Events - remso.eu“ beim Aufruf dieser Fundstelle sendet mein Browser aber de und ich erhalte die Seite unter dem Titel „Neue Veranstaltungen“.

Das ist nichts Ungewöhnliches. Dafür gibt's ja dann noch ein "Manual Override".

Live long and pros healthy,
 Martin

[JürgenB]

Hallo,

Sprachkürzel sind nach ISO-639 genormt in lateinischer Schrift.

das war bzw. ist ja auch mein Standpunkt.

und wenn dann, weil es so viele Sprachen sind, die Sprachwahllinks in einem Pull-Down-Menü versteckt werden, welche Überschrift gebe ich dann dem Menü? Die aktuell eingestellte Sprache ist da keine gute Idee.

Gruß
Jürgen

[Linuchss]

Moin,

welche Überschrift gebe ich dann dem Menü?

Das ist einfach. Bei Eingabe eines Events ist die Heimatsprache des Mitglieds ja bekannt, beim Registrieren wurde sie angegeben:

Die aktuell eingestellte Sprache ist da keine gute Idee.

Die Ratlosigkeit in diesem Faden habe ich vernommen. Ich mache es halt so, wie ich denke.

Wobei die ursprüngliche Idee von 2008 eines vielfältigen und vielsprachigen kulturellen und sportlichen Angebots von Events nie wahr wurde. Nachdem ich keine französischen und polnischen Mitglieder bekommen konnte (direkte Nachbarländer), habe ich die Oberfläche in fr und pl beerdigt und biete nur noch de, en und nl an.

Die europäische Idee ist was für Sonntagsreden, ich war vermutlich der Einzige, der die flüchtigen Worte in einen Veranstaltungskalender umgesetzt hat. Völliges Unverständnis z.B. bei Partnerschaftsvereinen (jumelage), einen gemeinsamen Kalender mit ihren Partnerstädten zu bekommen.

Ein großer Programmieraufwand war auch die Eingabe und Anzeige eines Events in beliebig vielen Sprachen. Wurde vor Jahren einmal genutzt von einem Trödelmarkt-Betreiber, der in seinem italienischen Zweitwohnsitz oder Urlaubsort einen Markt veranstaltet hat.

So blieb der mit großen Erwartungen programmierte internationale Veranstaltungskalender im Wesentlichen ein Mitteilungsblatt für Shanty-Chöre und ein paar Trödelmärkte. Manchmal kommen ein paar Perlen rein durch Veranstalter von musikalischen Events in europäischen Städten.

Doch ich bereue das nicht, war dieser Kalender doch Testmedium für neue Web-Möglichkeiten, die ich bei Kunden gegen Geld verkaufen konnte.

[Gunnar Bittersmann]

@@Linuchs

Es gibt internationale Normen. Die Einheit der elektrischen Spannung ist V, der (das) Meter m.

Sag das mal einem US-Amerikaner! (Weltkarte)

Außerhalb der USA ist das Meter wohlbekannt, und auch mit Volt werden viele Menschen etwas anfangen können.

Sprachkürzel sind nach ISO-639 genormt in lateinischer Schrift.

Die sind aber nicht in weiten Bevölkerungsschichten bekannt. Warum auch?

Es gibt spezielle Nischen, wo Sprachkürzel bekannt sind. Wenn man eine solche Nische als Zielgruppe hat, kann man für diese Zielgruppe Sprachkürzel verwenden. Allgemein nicht.

Ich habe es vor vielen Jahren so gelöst:

Welchen Sinn sollen die Sprachkürzel in Klammern haben?

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Der Martin]

Hallo,

Es gibt internationale Normen. Die Einheit der elektrischen Spannung ist V, der (das) Meter m.

Sag das mal einem US-Amerikaner! (Weltkarte)

amerikanische Ingenieure und Wissenschaftler sind wohl auch mit dem metrischen System vertraut; das "gemeine Volk" eher nicht.

Andererseits: Mein Physik-Prof an der FH hat uns empfohlen, Naturkonstanten in möglichst "handlichen" und anschaulichen Einheiten zu merken. Die Lichtgeschwindigkeit beispielsweise als ungefähr ein Fuß pro Nanosekunde. Beides sind für einen Elektroniker gängige Einheiten, der Quotient daher auch recht gut vorstellbar.

Welchen Sinn sollen die Sprachkürzel in Klammern haben?

Sie verraten denen, die mit der Prosabezeichnung nichts anfangen können, welche Sprache sich wirklich dahinter verbirgt.

Live long and pros healthy,
 Martin

[Gunnar Bittersmann]

@@Der Martin

Welchen Sinn sollen die Sprachkürzel in Klammern haben?

Sie verraten denen, die mit der Prosabezeichnung nichts anfangen können, welche Sprache sich wirklich dahinter verbirgt.

Nein, das tun sie nicht.

Oder was verrät dir هَوُسَا (ha)?

Nochmal: Sprachkürzel sind nicht in weiten Bevölkerungsschichten bekannt. Man kann sich hier den Mund fusslig reden.

Man kann die Sprachbezeichnung zusätzlich auch in der aktuellen Sprache der Webseite anzugeben – Tooltip könnten dafür angebracht sein; so wie’s auch auf den Seiten W3C Internationalisierung gemacht wird, bspw. auf dieser hier: Angabe der Sprache in HTML

Auf ebendieser Seite steht auch, wie’s geht:

<span title="Spanisch">
  <a lang="es" href="….es">Español</a>
</span>

So sollte’s auch gehen:

<a title="Spanisch" href="….es">
  <span lang="es">Español</span>
</a>

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Der Martin]

Hallo Gunnar,

Welchen Sinn sollen die Sprachkürzel in Klammern haben?

Sie verraten denen, die mit der Prosabezeichnung nichts anfangen können, welche Sprache sich wirklich dahinter verbirgt.

Nein, das tun sie nicht.

Oder was verrät dir هَوُسَا (ha)?

dass es um die afro-asiatische Sprache Hausa geht. Denn mit ha kann ich in der ISO-639-Liste nachschlagen. Mit den Schriftzeichen in der entsprechenden Sprache nicht, da ich sie nicht einmal kenne und daher nicht eindeutig von ähnlichen Zeichen unterscheiden könnte.

Nochmal: Sprachkürzel sind nicht in weiten Bevölkerungsschichten bekannt. Man kann sich hier den Mund fusslig reden.

Dann tu das meinetwegen gern. Ich bin trotzdem anderer Meinung.

Live long and pros healthy,
 Martin

[Gunnar Bittersmann]

@@Der Martin

Sie verraten denen, die mit der Prosabezeichnung nichts anfangen können, welche Sprache sich wirklich dahinter verbirgt.

Nein, das tun sie nicht.

Oder was verrät dir هَوُسَا (ha)?

dass es um die afro-asiatische Sprache Hausa geht. Denn mit ha kann ich in der ISO-639-Liste nachschlagen.

Ähm, „kann ich nachschlagen“ ist was völlig anderes als „sie verraten, welche Sprache sich dahinter verbirgt“.

Eigentlich wollte ich auf dieser Webseite etwas ganz anderes tun, aber jetzt schlage ich erstmal nach, was diese zweibuchstabigen Kürzel so bedeuten. —kein Nutzer, jemals

Ich halte die Sprachkürzel an dieser Stelle für visuelles Rauschen. Sie bringen keinen Mehrwert.

Wenn man die Sprachen auch in der aktuellen Seitensprache angeben will, dann dies auch in Prosa: هَوُسَا (Hausa) – was den Platzbedarf fürs Sprachmenü verdoppelt.

Oder halt mit Tooltips. Mir ist durchaus bewusst, dass Tooltips nicht für alle Nutzer zugänglich sind. Hier handelt es sich aber um zusätzliche, nicht unbedingt notwendige Information. Progressive enhancement at work.

---

Mit den Schriftzeichen in der entsprechenden Sprache nicht, da ich sie nicht einmal kenne und daher nicht eindeutig von ähnlichen Zeichen unterscheiden könnte.

Arabische Schrift lesen zu lernen steht auch noch auf meiner Liste. Kann doch aber eigentlich auch nicht viel schwerer sein als hebräische …

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Der Martin]

n'Abend,

Oder was verrät dir هَوُسَا (ha)?

dass es um die afro-asiatische Sprache Hausa geht. Denn mit ha kann ich in der ISO-639-Liste nachschlagen.

Ähm, „kann ich nachschlagen“ ist was völlig anderes als „sie verraten, welche Sprache sich dahinter verbirgt“.

nein, das finde ich nicht.

Eigentlich wollte ich auf dieser Webseite etwas ganz anderes, aber jetzt schlage ich erstmal nach, was diese zweibuchstabigen Kürzel so bedeuten. —kein Nutzer, jemals

Außer denen, die prinzipiell ein Interesse an anderen Sprachen haben.

Ich halte die Sprachkürzel an dieser Stelle für visuelles Rauschen. Sie bringen keinen Mehrwert.

Sie bringen eine eindeutige Information. So wie RGB-Farbangaben^[1] in CSS anstatt phantasievoller Prosabezeichnungen.

Mit den Schriftzeichen in der entsprechenden Sprache nicht, da ich sie nicht einmal kenne und daher nicht eindeutig von ähnlichen Zeichen unterscheiden könnte.

Arabische Schrift lesen zu lernen steht auch noch auf meiner Liste. Kann doch aber eigentlich auch nicht viel schwerer sein als hebräische …

Haken, Würmer und Ösen? Halte ich für ein ehrgeiziges Ziel, weil es ein völlig anderes Schriftsystem ist, als wir Europäer gewöhnt sind. Nicht, weil Arabisch von rechts nach links geschrieben und gelesen wird (das ist ja bei Hebräisch auch so). Sondern eher, weil die arabische Schrift meines Wissens nur Konsonanten abbildet (etwa wie Stenographie) und die Vokale der Phantasie des Lesers überlässt.
Deswegen sind ja auch die Namen Mohammed, Mahmud oder Mehmet eigentlich gleich - zumindest geschrieben. Ich stelle mir das jedenfalls sehr schwierig vor.

Live long and pros healthy,
 Martin

---

1. Oder meinetwegen HLS, obwohl sich mir der RGB-Farbraum immer noch leicher erschließt. ↩︎

[Gunnar Bittersmann]

@@Der Martin

Eigentlich wollte ich auf dieser Webseite etwas ganz anderes, aber jetzt schlage ich erstmal nach, was diese zweibuchstabigen Kürzel so bedeuten. —kein Nutzer, jemals

Außer denen, die prinzipiell ein Interesse an anderen Sprachen haben.

Sollte ein Sprachmenü ein Quiz sein, auch für Nutzer, die kein spezielles Interesse an anderen Sprachen haben? Ich denke, nein.

Ich halte die Sprachkürzel an dieser Stelle für visuelles Rauschen. Sie bringen keinen Mehrwert.

Sie bringen eine eindeutige Information.

Ausgeschrieben (Hausa statt ha) bringt’s das weitaus besser.

Haken, Würmer und Ösen?

Da ist sie, die Schwierigkeit: arabische Buchstaben haben bis zu vier Formen, je nachdem, ob sie vorn (also rechts), in der Mitte, hinten oder allein stehen.

Nicht, weil Arabisch von rechts nach links geschrieben und gelesen wird (das ist ja bei Hebräisch auch so). Sondern eher, weil die arabische Schrift meines Wissens nur Konsonanten abbildet (etwa wie Stenographie) und die Vokale der Phantasie des Lesers überlässt.

Das ist bei Hebräisch auch so. (Bei der hebräischen Sprache. Im Jiddischen sind einige Buchstaben zu Vokalen umgedeutet.)

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Der Martin]

Hallo,

Sollte ein Sprachmenü ein Quiz sein, auch für Nutzer, die kein spezielles Interesse an anderen Sprachen haben? Ich denke, nein.

natürlich nicht. Diejenigen, die die Kürzel nicht kennen bzw. mit ihnen nichts anfangen können, ignorieren sie einfach. Du weißt doch, ich bevorzuge generell codifizierte, eindeutige Angaben gegenüber Prosa. Also bei USB zum Beispiel 12Mbps anstatt Full Speed.

Ich halte die Sprachkürzel an dieser Stelle für visuelles Rauschen. Sie bringen keinen Mehrwert.

Sie bringen eine eindeutige Information.

Ausgeschrieben (Hausa statt ha) bringt’s das weitaus besser.

Dann ist es aber wieder sprachabhängig.
Genau das will man ja mit den ISO-Kürzeln eliminieren.

Live long and pros healthy,
 Martin

[Gunnar Bittersmann]

@@Der Martin

Diejenigen, die die Kürzel nicht kennen bzw. mit ihnen nichts anfangen können, ignorieren sie einfach.

Auf einer Webseite sollte nichts sein, was kognitiven Aufwand erfordert, um dann doch (von den meisten) ignoriert zu werden.

Ausgeschrieben (Hausa statt ha) bringt’s das weitaus besser.

Dann ist es aber wieder sprachabhängig.

„Hausa“ gerade nicht. 😜

Ansonsten: Ja, und? Dann wechsle ich zu einer Sprache, die ich verstehe, und bekomme auf jener Seite die Sprachen für mich verständlich aufgelistet.

Und selbst wenn man die Sprache der aktuellen Seite kaum versteht, „klingoński“ sagt einem immer noch mehr als „tlh“.

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Tabellenkalk]

Hallo,

Eigentlich wollte ich auf dieser Webseite etwas ganz anderes tun, aber jetzt schlage ich erstmal nach, was diese zweibuchstabigen Kürzel so bedeuten. —kein Nutzer, jemals

mit Ausnahme der neugierigen Nutzer. Ein unbekanntes Schriftsystem ist sowas von abtörnend! Wenn aber durch ein Kürzel ein Einstiegspunkt gegeben wird, sieht das wieder ganz anders aus…

Gruß
Kalk

[Matthias Apsel]

Hallo Gunnar Bittersmann,

Mann kann die Sprachbezeichnung zusätzlich auch in der aktuellen Sprache der Webseite anzugeben – Tooltip könnten dafür angebracht sein; so wie’s auch auf den Seiten W3C Internationalisierung gemacht wird, bspw. auf dieser hier: Angabe der Sprache in HTML

Frau nicht?

Auf ebendieser Seite steht auch, wie’s geht:

<span title="Spanisch">
  <a lang="es" href="….es">Español</a>
</span>

So sollte’s auch gehen:

<a title="Spanisch" href="….es">
  <span lang="es">Español</span>
</a>

Ist das hreflang-Attribut sinnvoll oder notwendig?

Bis demnächst
Matthias

[Gunnar Bittersmann]

@@Matthias Apsel

Mann kann … Frau nicht?

Sogar Nicht-Binäre. Berichtigt.

Ist das hreflang-Attribut sinnvoll oder notwendig?

Bin ich überfragt, ob es tatsächlich user agents gibt, die hreflang irgendwie auswerten.

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Gunnar Bittersmann]

@@Linuchs

BTW, wenn man’s richtig schick machen will, verwendet man eine Schriftart, die auch bulgarische Glyphvarianten enthält:

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[Linuchs]

Hallo Gunnar,

wenn man’s richtig schick machen will,

die Diskussion geht in die Richtung, dass ich vollkommen unbedarften Lesern die Fülle der möglichen Sprachen erklären möchte.

Das Ziel ist aber, dass angemeldete Mitglieder ihre Events in ihrer Sprache eingeben können, damit sie von ihren Landsleuten verstanden wird. z.B. in türkisch. Warum aber sollte ich dem türkischen Leser eine Lektion anbieten, dass es die Sprache Suaheli gibt? Die ist nur für die eine Suahelin gedacht, die versehentlich mal vorbeikommt. Aber die freut sich 'nen Ast und erzählt es weiter.

In Wirklichkeit gleiche ich die vom Browser angeforderte Sprache mit der Sprache der eingegebenen Events ab. Bei Übereinstimmung bekommt der Leser seine Sprache. Das ist schon alles.

Die Möglichkeit, ein Event in mehreren Sprachen einzugeben, wird aber von keinem Mitglied genutzt.

Linuchs

[klawischnigg]

Hi there,

BTW, wenn man’s richtig schick machen will, verwendet man eine Schriftart, die auch bulgarische Glyphvarianten enthält:

Interessant. Deine bulgarischen Glyphen schauen für mich wie russische Schreibschrift aus. Wird das in Bulgarien tatsächlich für Druck verwendet...?

[Gunnar Bittersmann]

@@klawischnigg

BTW, wenn man’s richtig schick machen will, verwendet man eine Schriftart, die auch bulgarische Glyphvarianten enthält:

In der Wikipedia kann man das auch sehen:

Die Umschaltung macht der Browser automatisch anhand des lang-Attributs.

Interessant. Deine bulgarischen Glyphen schauen für mich wie russische Schreibschrift aus.

Ja, die bulgarischen Glyphen haben mehr Ähnlichkeit mit der Kursivschrift. Oder eben der Schreibschrift. S.a. Testseite топла вода.

Wird das in Bulgarien tatsächlich für Druck verwendet...?

Ja. S.a. Artikel Typofest Bulgaria

🖖 Stay hard! Stay hungry! Stay alive! Stay home!

[klawischnigg]

Hi there,

Die Umschaltung macht der Browser automatisch anhand des lang-Attributs.

Wobei sich weissrussisch und ukrainisch offenbar nur sehr wenig unterscheiden.

Ja, die bulgarischen Glyphen haben mehr Ähnlichkeit mit der Kursivschrift. Oder eben der Schreibschrift. S.a. Testseite топла вода.

Komisch. Mein Browser zumindest macht bei Deiner Warmwasserseite keinen Unterschied zwischen den einzelnen Sprachen... (oder hab ich da was mißverstanden?)

[Gunnar Bittersmann]

@@klawischnigg

Ja, die bulgarischen Glyphen haben mehr Ähnlichkeit mit der Kursivschrift. Oder eben der Schreibschrift. S.a. Testseite топла вода.

Komisch. Mein Browser zumindest macht bei Deiner Warmwasserseite keinen Unterschied zwischen den einzelnen Sprachen... (oder hab ich da was mißverstanden?)

Mein Safari auch nicht – weder auf macOS noch auf iOS. Firefox und Chrome können’s.

🖖 Stay hard! Stay hungry! Stay alive! Stay home!