Webseitengröße anpassen?! Bitte helfen! ó.ò

Hallo erstmal :wink2:

Ich habe zzt. ein Problem, und zwar habe ich absolut KEINE Ahnung, wie ich die Größe bzw. die Auflösung meiner Webseite im Script einstellen kann. Ich möchte die Page so kreiren, dass sie voll und ganz an den Browser der PlayStation Portable angepasst ist, scrollen also nur nach oben und unten, nicht mehr von links nach rechts möglich ist. Die Maßen des PSP-Displays sind folgende: 480x272 Pixel. Wie kann ich nun meine Seite schreiben (also was muss ich in ‚Index.htm‘ einfügen, sodass sie im integrierten Browser der PSP voll, ganz und perfekt angepasst ausgegeben wird?! Ich danke euch schonmal im Vorraus für eure Hilfe :wink3: :hail: :wink:

PS: Im Anhang ist ein Bild einer solchen Webseiten, welche speziell an den PSP-Browser angepasst wurde, damit verständlicher ist, was ich meine :smiley: …und ja der Link zur Seite, von welcher der Screenshot stammt: rockstargames.com/libertycit … index.html

Willst du jetzt selber eine Seite erstellen, oder hast du irgendein CMS?

Ich möchte eine Webseite erstellen, da ich nicht glaube, dass ich ein CMS dann auch so anpassen könnte?! (<= Das wär natürlich noch besser :smiley: ) Nein, meine Vorstellung war eigentlich, eine eigene Seite zu schreiben, jedoch möglichst ein vorgefertigtes Template zu benutzen (sofern möglich).

Kennt sich da nmd aus?! :neutral_face: :neutral_face:

Das ist bei Sprachen wie (X)HTML oder auch SVG eigentlich schon
von vorne herein mit eingeplant.
Bei (X)HTML paßt sich das Layout automatisch so an, daß es von
der Breite her in den jeweiligen Anzeigebereich paßt, so daß
horizontales Rollen gar nicht vorkommt (nur wenn Elemente
breiter als der Anzeigebereich sind, was in deinem Falle erstmal
hieße, dort keine Graphik reinzubasteln, die breiter als 480 Pixel
ist.
Wird CSS verwendet, so sollte man eben keine expliziten
Breitenangaben für den Fließtext machen, dann steht auch
nichts über und das Problem tritt ebenfalls nicht auf.

Insofern treten bei (X)HTML+CSS Probleme mit horizontalem
Rollen eigentlich nur auf, wenn man sich als Autor selbst ein Bein
stellt - was man mit CSS allerdings sehr einfach tun kann - muß
man aber nicht …

Bei SVG - sofern der browser das interpretiert, was bei der
Anwendung ja eigentlich ganz sinnvoll wäre - kann man wiederum
das gesamte Bild mit dem Anzeigebereich skalieren lassen, so
daß es sich auch automatisch dem Anzeigebereich anpaßt
(Höhe und Breite auf 100% setzen und viewBox verwenden).

Das Vorgehen hat jedenfalls den Vorteil, daß der Kram bei einem
normalen browser nicht in einem winzigen Gucklock erscheint,
sondern auch normal lesbar bleibt.
In dem Zusammenhang ist bei dem gegebenen Beispiel übrigens
sehr schlecht, daß da offenbar schriftartiges Zeug in Pixelgraphik
gepackt wurde. Das ist schon bei normaler Auflösung kaum noch
lesbar und hinsichtlich der Zugänglichkeit kompletter geistiger
Dünnschiß ;o)

[quote=“hoffmann”]Das ist bei Sprachen wie (X)HTML oder auch SVG eigentlich schon
von vorne herein mit eingeplant.
Bei (X)HTML paßt sich das Layout automatisch so an, daß es von
der Breite her in den jeweiligen Anzeigebereich paßt, so daß
horizontales Rollen gar nicht vorkommt (nur wenn Elemente
breiter als der Anzeigebereich sind, was in deinem Falle erstmal
hieße, dort keine Graphik reinzubasteln, die breiter als 480 Pixel
ist.
Wird CSS verwendet, so sollte man eben keine expliziten
Breitenangaben für den Fließtext machen, dann steht auch
nichts über und das Problem tritt ebenfalls nicht auf.

Insofern treten bei (X)HTML+CSS Probleme mit horizontalem
Rollen eigentlich nur auf, wenn man sich als Autor selbst ein Bein
stellt - was man mit CSS allerdings sehr einfach tun kann - muß
man aber nicht …

Bei SVG - sofern der browser das interpretiert, was bei der
Anwendung ja eigentlich ganz sinnvoll wäre - kann man wiederum
das gesamte Bild mit dem Anzeigebereich skalieren lassen, so
daß es sich auch automatisch dem Anzeigebereich anpaßt
(Höhe und Breite auf 100% setzen und viewBox verwenden).

Das Vorgehen hat jedenfalls den Vorteil, daß der Kram bei einem
normalen browser nicht in einem winzigen Gucklock erscheint,
sondern auch normal lesbar bleibt.
In dem Zusammenhang ist bei dem gegebenen Beispiel übrigens
sehr schlecht, daß da offenbar schriftartiges Zeug in Pixelgraphik
gepackt wurde. Das ist schon bei normaler Auflösung kaum noch
lesbar und hinsichtlich der Zugänglichkeit kompletter geistiger
Dünnschiß ;o)[/quote]

Hehe im großen und ganzen habe ich deinen Beitrag ja schon verstanden, aber wenn ich eine ganz normale Page + Design auf meinen Webspace lade, ist es ja klar, das man in einem Browser mit niedriger Auflösung scrollen muss, da diese ja an die eines Computers bzw. an den IE, Firefox, Safari… etc. angepasst wurde. Doch wie bekomme ich das so hin, dass die Seite sich wirklich so anpasst, bzw. wo stellt man die Auflösungsangaben ein?! Danke :slight_smile: :wink:

wenn du nirgendwo eine breitenangebe machst, die über den viewport des browsers (der bereich, in dem die seite angezeigt wird) hinausgeht, wir der text ganz normal umgebrochen.

wenn du die breite erzwingen willst, musst du den hier als css nehmen:

body {
width: 480px;
}

Wieso ist das klar?
Ein gutes Design passt sich verschiedenen Auflösungen an…

[quote=“GamerArena”] da diese ja an die eines Computers bzw. an den IE, Firefox, Safari… etc. angepasst wurde. [/quote] Tja - das ist das Problem “Optimiert für…” ist unnötig und unsinnig - jeder Browser, der diese Bezeichnung verdient, kann und soll standardkonform arbeiten.
Daher muss ich nichts “optimieren”, sondern schlicht validen Quelltext schreiben - das war alles.
(Ok, im Idealfall - wenn wie so oft der IE Probleme macht, gibt es aber andere Lösungen.)

[quote=“GamerArena”] Doch wie bekomme ich das so hin, dass die Seite sich wirklich so anpasst, bzw. wo stellt man die Auflösungsangaben ein?! Danke :slight_smile: :wink:[/quote]Gar nicht.
Oder, besser ausgedrückt: durch Weglassen…

Diese Flexibilität ist das Standard-Verhalten von HTML.
Wenn Du eine Seite nur in HTML und ohne CSS (=ohne Layout) im Browser anschaust, wirst Du feststellen können, dass es unerheblich ist, wie groß die Schrift / das Browserfenster / der Monitor ist… der Inhalt passt sich immer “automatisch” den Gegebenheiten an.

Für das Design bedeutet das:
a) Verzicht auf feste Breiten,
b) Verzicht auf “px” (und statt dessen z.B. “em” und/oder “%” nutzen)
c) Verzicht auf pixelgenaues Design.

Ok, danke. Dann versuch ich mich einfach mal, werde ja sehen, was rauskommt. :smiley: