Wie lässt sich mithilfe von Adobe XD eine Webseite für die Darstellung auf dem Handy generieren?
Guten Morgen! In den vergangenen Monaten habe ich mit dem Programm Adobe XD eine Webseite erstellt, die für Desktop-Geräte (Laptop, PC) geeignet ist. Nun möchte ich darauf auch noch eine Version für Nutzer von Mobilgeräten schaffen - aber ohne alle Elemente neu anordnen zu müssen. Gibt es da eine Möglichkeit, die bereits bestehende Webseite als Handy-Version zu skalieren oder bleibt mir nichts anderes übrig, als alles händisch in XD erneut zu bauen?
Danke für die Hilfe!
2 Antworten
Also ich denke du hast mit Html und Css gearbeitet, aber ich weiss leider kaum wie xd funktioniert.
Dennoch falls du tatsächlich mit Css arbeiten solltest dann sollte das helfen:
@media only screen and (max-width: 600px) {
body {
background-color: lightblue;
}
}
duch das max-width wird eine max-width bestimmt sobald diese ueberschritten ist, wird der "handy modus" akitivert, du solltest dann also den Code fuer das Handy anpassen können :D
Ich hoffe es hilft dir weiter!
Da hast du schon mal falsch angefangen
Man fängt mit MobileFirst an.
Aber ok.
Natürlich macht man für Handy, Tablet, PC und TV keine extra Variante der Website
Das macht man mit Responsable Design
Ich möchte hier keine ewig lange Diskussion anfangen, aber ich finde es immer eher viel leichter mit der Desktop version anzufagen, und dann einfach 60% der Objekte zu verstecken, aber nur meine Meinung :D
Wieso willst du 60% Verstecken?
Zum einen wollen Mobil User doch den gleichen Inhalt haben, aber viel wichtiger:
Google hat schon lange seine Index Erstellung auf Mobil umgestellt
Das heißt es wird da nicht nur analysiert ob die Website Mobil geeignet ist, sondern der Content wird verwendet um das Google Ranking zu ermitteln.
Wer also Inhalt unsinnigerweise Mobil versteckt mach sein SEO unnötig schlecht.
Keine Ahnung wie du zu dem Unsinnigen Ansatz kommst Mobil nur 40% anzeigen zu wollen
Ich fuege gerne auf die Desktop Anwendung Sachen ein, die einfach nix auf einer Mobile version zu suchen haben. Dass sind z.B. grössere Texte die eigentlich nur zur verschönerung dienen, aber in der Mobile version nur stören. Das hat also was mit meinem Stil zu tun, ich verstehe den oberen Grund nicht weil ich das Google Ranking ziemlich egal finde, aber das hat auch was mit meiner Projektwahl zutun also kann ich den Punkt in Sicht des useres doch verstehen.
btw tut mir leid ich meinte eher 60% des Textes (fällt mir grade beim SChreiben erst auf)
ich verstehe den oberen Grund nicht weil ich das Google Ranking ziemlich egal finde
Wenn du nur eine Hobby Website machst, ist das natürlich egal
Aber die meisten Websites wollen natürlich bei Google gefunden werden.
Texte gehören natürlich auch auf die Mobile Website
Die Texte dienen nie zum verschönern oder Platzhalter
ich meinte eher 60% des Textes
Schon klar vollkommen unverständlich und unnötig 60% zu Verstecken?
Aber ok - es hindert dich natürlich niemand, aber eine gute Website wird das so nie
Mhh ok, ich gebe zu ich habe uebertrieben. 60% vermutlich höchtens 20 xD
Wenn man Google Ranking gefunden will verstehe ich das, aber wenn ich Projekte gestalte haben Sie meinst einen recht individuellen Namen und zweitens greifen bei soetwas wie eine Web-Game-Engine eher auf den Link zu (vorallem bei was so einfachem wie netis.se [ist nur ein Beispiel]), aber da kann ich nur von mir sprechen und wenn man z.B. eine Touri Seite macht oder so ist das ein super krass dummes Argument xD
Texte können tatsächlich als Platzhalter dienen, aber das nur wenn man es darauf abgesehen hat (was bei mir immer der Fall ist lol), ich bin genrell ein Fan von Funktion Websites und die Homepage so simple und mit wie möglich wenig Text zu gestalten, aber wie gesagt ist sobald man diesem Prinzip nicht mehr Nachgeht ein ziemlich schlechtes Argument :D
Also muss ich Ihnen zustimmen das es vermutlich nicht schadet auf dem Mobile zuerst zu machen, mit aussname dein Name ist Dessi, oder Chad (ich indentiviziere mich nicht mit einem 10x Developer oder so lol)
Keine Ahnung was du mit 10x Develover meinst, genauso wenig was deine Beleidigungen und unsinniger Erklärung
Aber im der Frage ging es eindeutig um eine Website
Und deine Art der Herstellung einer Website und Responsable Design hat mit der Realität nichts zu tun.
Aber Danke für die Exkursion in deine eigene Welt
Huh wow, okay leider darf ich glaube ich keine Bilder benutzten aber naja Missverstädnis meiner Seite aus.
btw mit der Realität, lol okay anscheinend zu schwaming ausgedrueckt mhh
Zu der Sache mit dem 10x Developer, kann ich mir vorstellen das du nicht so into Redit bist (wobei das warhscheinlich sogar besser ist xD)
Der Media Query gibt an, dass die Hintergrundfarbe der Webseite einen Blauton annehmen soll, sofern das Browserfenster (bzw. der Viewport) die Breite von 601px unterschreitet. Liegt die Fensterbreite über 600px, wird die Media Query nicht ausgeführt.
Für ein Anpassung an verschiedene mobile Endgeräte macht es Sinn, mehr als eine Media Query zu definieren. Artikel wie dieser beschäftigen sich näher damit.