Wie heißt dieses GUI-Layout

Tut mir leid, dass ich eine solche Frage stelle, ich muss gestehen, dass ich kein tragbares Gerät besitze, aber ich möchte über Layoutoptionen für die von mir entwickelte Desktop-Anwendung sprechen.

Geben Sie hier die Bildbeschreibung ein

Würden Sie mir bitte den Namen dieses Layouttyps nennen?

Sie..besitzen keinen hh-Handheld?..
Ja, ich mag es, ab und zu unerreichbar zu sein (aus gutem Grund) ...und ich bin mir sicher: eine zu besitzen wäre viel ablenkender als SO ;)
Aber mit einem Smartphone können Sie die SE-App bekommen! <3 :3

Antworten (2)

Scheint mir einfach ein ansprechendes Designmenü zu sein : Wenn eine Website auf mobile Größe verkleinert wird, "migriert" das normalerweise oberste Menü (global) so, dass es sich über der mobilen Website befindet.

Sie können dies testen, indem Sie eine Site nehmen und das Browserfenster verkleinern (das ist nicht wirklich gut genug für die Entwicklung, aber es gibt Ihnen eine Vorstellung. Für Entwickler gibt es Tools, die Ihnen helfen, die Größe richtig zu ändern).

Bearbeiten: Hier ist eine einfache Visualisierung, wie responsives Design funktioniert:

Geben Sie hier die Bildbeschreibung ein

Die Objekte werden neu angeordnet. Was immer häufiger zu werden scheint, ist tatsächlich, ein "normales" Top-Menü zu nehmen und es in ein anklickbares Symbol zu komprimieren, das im Volksmund als "Hamburger" bekannt ist:

Geben Sie hier die Bildbeschreibung ein

Ich empfehle Ihnen auch, sich über Frameworks wie Bootstrap mit responsivem Design zu befassen. Sie haben die meiste schwere Arbeit für Sie erledigt.

Hier ist ein Beispiel für responsives Design; Dies von der Bootstraps-Website. Gesamtbreite:

Geben Sie hier die Bildbeschreibung ein

Und hier in der mobilen Ansicht. Beachten Sie, dass das obere Menü jetzt hinter dem Hamburger "versteckt" wurde:

Geben Sie hier die Bildbeschreibung ein

Heutzutage werden Websites so gebaut, dass sie „mobile first“ genannt werden. Das bedeutet, dass die Frameworks und das Backend-Layout zunächst für mobile Geräte ausgelegt sind. Eine große Mehrheit der Surfer auf der Welt benutzt Mobiltelefone. Machen Sie etwas Benutzerfreundliches im Kleinen, Großes ist kein Problem.

Nach dem Versuch mit Browser Shrink (in der Tat interessante Erfahrung) und Umdenken: Dies ist nicht die Antwort, nach der ich suche. In diesen Feldern müssen wir echte Daten anzeigen.
Es gilt das gleiche Prinzip: Der Inhalt der Boxen ist irrelevant. Und Sie können verschiedene Websites verkleinern, und sie haben eine mehr oder weniger funktionale, responsive Struktur. Diese Seite zum Beispiel ist in dieser Hinsicht hoffnungslos.
Danke, ich verstehe, dass die Frage nach einem einzigen Layout wahrscheinlich das eigentliche Problem unterschätzt. Aber vorerst hatte ich ein Kommunikationsproblem, das durch Zacharias Antwort gelöst zu sein scheint

Dies wird als reaktionsfähiges Design bezeichnet. Twitter Bootstrap verfügt über eine Vielzahl von Tools zur Unterstützung des Webs. Sie können ihre Website anzeigen, um zu sehen, wie ein reaktionsfähiges System verwendet wird.

Dies würde Ihnen helfen, eine reaktionsschnelle Desktop-Website zu entwerfen, die auf einem mobilen Gerät oder Tablet ausgerollt werden kann.

Dies kann über Chrome > Inspect Elements > Emulation > Emulate emuliert werden.

Wenn Sie dies ohne die Verwendung eines vorgefertigten Frameworks tun möchten, sind Medienabfragen für CSS (Cascading Style Sheets) die beste Möglichkeit, dies zu tun.

Es gibt ein paar gute Tutorials online, die Ihnen helfen könnten.

Responsives Design mit CSS3-Medienabfragen

BEARBEITEN: Das Layout im Bild wäre ein "Stack-Layout".

Ich hoffe es hilft :)

Dies hilft auch, aber dies ist nicht der Name des spezifischen Layouts. Ist es einfach ein vertikales "Fließlayout"?
Wenn Sie sich darauf beziehen, dass es sich nur um das von Ihnen gezeigte Layout handelt, wird es als Stapellayout bezeichnet.
Toll, so einfach! Was ist mit der Überarbeitung der Antwort: Der Punkt nach EDIT trifft auf die Frage;)