html - template - responsive webdesign tutorial deutsch




Jquery Mobile oder Responsive Design? (4)

Es ist besser, mit jQuery mobile zu gehen, wenn Sie mobile Geräte und Handheld-Geräte mit kleineren Bildschirmen als einem Desktop verwenden.

Der Vorteil mit jQuery Mobile ist, dass es Ihnen einige zusätzliche Funktionen wie Seitenereignisse, Seitenübergänge, Themes usw. bietet. Es ist einfacher und einfacher als das Schreiben von Code, um all diese manuell durchzuführen.

Außerdem verwendet jQuery Mobile mehr von einem flüssigen Layout, was bedeutet, dass Ihre Seiten in die meisten Bildschirmgrößen passen. Mit dem Responsive Design können Sie Informationen basierend auf der Bildschirmgröße anzeigen / ausblenden.

Ich habe viel über die Entwicklung von Responsive Design geforscht. Also bin ich auf diesen Artikel von hier gestoßen:

Ist es redundant mit jQuery Mobile und einem responsiven Layout / CSS-Medienabfragen?

Und es hat mich nachdenklich gemacht. Responsive Design ersetzt nicht die Erstellung einer Jquery Mobile-Website? Denn Responsive Design ist das Gleiche, was JQ Mobile aber besser macht, weil Sie mehr Kontrolle über jeden Bereich haben. Korrigiere mich, wenn ich falsch liege Ich habe mich nur gewundert und gelehrt! Warum sollte jemand JQuery Mobile verwenden oder sogar JQ Mobile mit einem responsiven Design verwenden?


Sie werden wahrscheinlich nicht jquery mobile verwenden, wenn Sie auch Desktop-Bildschirme unterstützen. Jquery Mobile ist nützlicher, wenn es um Handys und Tablets geht.

Responsive Design hingegen ermöglicht es, Informationen auf Ihrer Website darzustellen und unabhängig von der Bildschirmgröße lesbar und nutzbar zu halten. Ziehen Sie Twitter Bootstrap, wenn Sie alle Bildschirmgrößen unterstützen möchten.

Aktualisieren

Normalerweise haben Sie eine andere Benutzeroberfläche für Desktop und Mobile / Tablets. Anhand der Bildschirmgröße können Sie entscheiden, wie jede Komponente (Kopfzeile, Navigationsleiste, Seitenleiste, Textkörper, Fußzeile) im Ansichtsfenster angeordnet wird und wie das Design aussehen soll.

Zum Beispiel wird Ihre Website ein einzelnes Spaltenlayout für Handys und ein zweispaltiges Layout für Tablets haben, im Gegensatz zu Ihrer Desktop-Version.


Die JQuery Mobile-Symbole können die gewünschte Größe haben, solange sie 14px groß ist ...

Obwohl dies nicht ganz zutrifft, müssen Sie sehr gut verstehen, wie CSS in JQuery Mobile verwendet wird, um die Größe von Symbolen zu ändern, ganz zu schweigen von deren Änderung in Medienabfragen.

Schaltflächen können Text und / oder Symbole enthalten. Es wäre schön, auf einem Desktop-PC Tasten mit Symbol und Text und nur ein Symbol auf einem Mobilgerät zu haben. Nun, das scheint noch schwieriger zu sein, da das Format der Schaltfläche angegeben wird, indem dem <button> (oder <a>) -Element btn-* classes gegeben werden. Zum Beispiel:

<a href="#caddy" class="ui-btn ui-btn-icon-notext ui-corner-all ui-icon-caddy ui-nodisc-icon ui-alt-icon">Caddy</a>

oder:

<a href="#order" class="ui-btn-a ui-corner-all ui-btn ui-btn-icon-right ui-icon-carat-r">Checkout</a>

Daher fügt JQuery Mobile weitere Einschränkungen für CSS hinzu, wodurch es schwieriger wird, responsive Interfaces zu erstellen.


Wenn Sie eine mobile Website erstellen möchten, müssen Sie jQuery mobile verwenden. Wenn Sie Unterstützung für den Desktop-Browser und den mobilen Browser benötigen, müssen Sie das Bootstrap- oder Foundation-Framework verwenden, um eine responsive Website zu erstellen.





responsive-design