Waben Organigramm erstellen inkl. Inschrift und evtl. Verlinckung

[Jonaluu]

Hallo,

ich würde gerne ein Waben-Diagramm auf meiner Seite einbinden. Diese Waben sollen eine Abteilungsorganisation aufzeigen. D.h. jede Wabe sollte eine Übersch/Inschrift und Verlinkung haben.

ich bekomme das leider nicht hin.

Das ist doch sicherlich nicht all zu schwer, oder?

Danke für das Feedback und Hilfe!

Liebe Grüße Jonaluu

[Henry]

Hallo Jonaluu,

suchst du sowas?

Gruss
Henry

[TS]

Hello,

suchst du sowas?

Heute lohnt sich das Mitlesen ja wirklich!

Aber geht das auch ohne Google-Relations?

Liebe Grüße
Tom S.

[Auge]

Hallo

suchst du sowas?

Aber geht das auch ohne Google-Relations?

Warum nicht? Sind doch bloß Schriften, die eingebunden werden.

Tschö, Auge

[marctrix]

Hej Henry,

suchst du sowas?

Das ist aber nicht fertig, so hübsch es auf dem Desktop aussieht. Die Schriften sind auf dem iPhone einfach zu klein, wenn man sie vergrößert, passen sie nicht mehr in die Waben, obwohl die Texte unrealistisch kurz sind. In einem organigramm braucht man Platz für Name, Titel und Abteilung. Besonders die Abteilungen können schon mal lange Namen haben, aber auch Namen (Überschriften?) sind wohl fast immer länger als

this is a title

Marc Haunschild Barrierefreie Frontendentwicklung und QS Barrierefreiheit Abteilung 1234 - Entwicklung und Beratung Geschäftsbereich Endkunden

Außerdem sind organigramme hierarchisch.

Hier gibt es dann auch nich andere Probleme, schon im Markup. Zum Beispiel leere li mit der Klasse pusher. Was macht ein Screenreader daraus? Eben. Hat sich niemand Gedanken drum gemacht…

Sorry, aber so geht das nicht.

Marc

[marctrix]

Hej marctrix,

suchst du sowas?

Das ist aber nicht fertig, so hübsch es auf dem Desktop aussieht.

Keyboard-Bedienung auch unmöglich - probiert auf einem normalen PC ebenso wie auf einem iPad Pro und angeschlossenem Keyboard

Marc

[Henry]

Hallo marctrix,

Keyboard-Bedienung auch unmöglich - probiert auf einem normalen PC ebenso wie auf einem iPad Pro und angeschlossenem Keyboard

Hast du das nur im Codepen ausprobiert oder auch im Original? Dort funktioniert Keyboard, bei mir zumindest, sehr wohl.

Gruss
Henry

[TS]

Hello,

Keyboard-Bedienung auch unmöglich - probiert auf einem normalen PC ebenso wie auf einem iPad Pro und angeschlossenem Keyboard

Hast du das nur im Codepen ausprobiert oder auch im Original? Dort funktioniert Keyboard, bei mir zumindest, sehr wohl.

Bei mir auch.

Liebe Grüße
Tom S.

[marctrix]

Hej Henry,

Keyboard-Bedienung auch unmöglich - probiert auf einem normalen PC ebenso wie auf einem iPad Pro und angeschlossenem Keyboard

Hast du das nur im Codepen ausprobiert oder auch im Original? Dort funktioniert Keyboard, bei mir zumindest, sehr wohl.

Nur im Codepen, das was du als Original bezeichnest, geht bei mir auch (FF ESR unter Win10).

Was mir vorher nicht aufgefallen ist: die Listenpunkte verschieben sich. Wäre nun interessant, ob man eine verschachtelte Liste überhaupt abbilden kann, die man für ein Organigramm ja benötigt und wie sich das dann bei kleinen Bildschirmen verhält.

Derzeit werden ja die Waben neu angeordnet, was in einem Organigramm schlecht sein könnte. Ich meine, hier müsste ein Wechsel auf eine Listendarstellung erfolgen bei kleinen Bildschirmen. Aber das ließe sich ja relativ leicht bewerkstelligen, in dem man das CSS erst ab einer bestimmten Bildschirmgröße einbindet.

Wie gesagt: in meinen Augen noch nicht ganz fertig und vielleicht auch für den hier genannten Zweck nicht geeignet. Das werden wir aber nie erfahren, wenn sich der OP nicht mehr meldet…

Hübsch anzusehen ist es allerdings (jedenfalls mit den Beispielbildern - oder ist da ein Filter drauf gelegt - habe mir den Code nicht komplett angeschaut, aber da lässt sich ja mittels CSS was machen, um Konsistenz sicherzustellen…)

Marc