zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden meta viewport vs kleine Displays

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 19.02.2013, 17:41
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 16.10.2009
Beiträge: 176
1chris befindet sich auf einem aufstrebenden Ast
Standard meta viewport vs kleine Displays

Hey ho

mal eine kleine Verständnisfrage zwischendurch, mit der Hoffnung das ich nur auf dem Schlauch stehe.

<meta content="width=device-width, initial-scale=1.0" name="viewport">
Eigentlich sollte ein Handy die Seite auf 100% der Breite anzeigen. (richtig?) Mein Problem ist nun, dass die Seite z.B. 360px breit ist und auf einem 320px Display (z.B. älteres iPhone) rechts am Rand abgehackt ist.

Das dürfte doch eigentlich nicht sein oder? Wenn ich aus Spaß den scale Faktor auf 0.888 ändere funktioniert es... aber halte ich für ziemliche Grütze

Danke für Hilfe
Chris
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 19.02.2013, 17:54
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Eigentlich sollte ein Handy die Seite auf 100% der Breite anzeigen. (richtig?)
Nein, nicht richtig.
Du sagst explizit, dass nicht gezoomt werden soll, sondern "1 zu 1" angezeigt werden soll. Genau das passiert. 360px sind 360px breit -- und das ist eben zu viel, wenn nur 320px zur Verfügung stehen.

Diese Viewport-Meta-Angabe ergibt nur Sinn, wenn du keine feste Breite fürs Layout verwendest. Stichwort: Responsive Design.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 19.02.2013, 18:27
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 16.10.2009
Beiträge: 176
1chris befindet sich auf einem aufstrebenden Ast
Standard

Merci

Was wäre denn in dem Fall die beste Lösung deiner Meinung nach?

Ich habe heute recht viel rumprobiert aber leider war es nie auf allen Testphones einheitlich. (iphone3-5, paar Androids, Windoof 8 und noch ein etwas älteres Nokia n97 oder so)

Mein Ziel ist:
- auf 320px Display kein abgehackter Rand
- auf großen Display / Pixel Ratio 2 etc soll das ganze Display eingenommen werden (war bisher nie ein Problem)
- auch im Querformat soll es gut aussehen (war meistens auch Ok, Weißraum rechts bei stark unterschiedlicher Breite / Höhe ist Ok (z.B. iphone5))
Mit Zitat antworten
  #4 (permalink)  
Alt 19.02.2013, 18:33
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von 1chris Beitrag anzeigen
Was wäre denn in dem Fall die beste Lösung deiner Meinung nach?
Responsive Design.
Sich angesichts der unendlich vielen möglichen "passenden" Breiten auf feste Werte festlegen zu wollen kann nicht funktionieren.

Ohne konkretes Anschauungsmaterial ist ohnehin alles nur Spekulation. So kann dir niemand weiterhelfen.
Mit Zitat antworten
  #5 (permalink)  
Alt 19.02.2013, 18:36
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 16.10.2009
Beiträge: 176
1chris befindet sich auf einem aufstrebenden Ast
Standard

Responsiv ist leider nicht, da es bereits eine Mobile Site ist und diese an vielen Stelle fest auf 360 Pixel getackert ist.

Aber auch ohne Anschauungsmaterial ist die Frage "Wie bekomme ich 360px auf ein 320px Display" doch bestimmt zu beantworten
Mit Zitat antworten
  #6 (permalink)  
Alt 19.02.2013, 18:38
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Überleg doch mal selbst, was du nicht angeben darfst, um das zoomen nicht zu verhindern.
Mit Zitat antworten
  #7 (permalink)  
Alt 19.02.2013, 18:54
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 16.10.2009
Beiträge: 176
1chris befindet sich auf einem aufstrebenden Ast
Standard

Keine Sorge habe schon jede Menge überlegt aber Mobile ist noch nicht so meine Welt und drum frage ich nun nach...
Fehlt in deinem Satz irgendwo 1 Wort, bin mir so nicht ganz sicher was du meinst?
(nicht fies gemeint aber bei solchen Formulieren fühlt sich mein Schlips immer gleich getreten )

Mögliche Lösungsansätze sind aus meiner Sicht eben
a) Scale 0.888 (finde ich aber irgendwie falsch)
b) width:360px, hat aber Nebenwirkungen, dass auf einigen Geräten etwas Platz unausgenutzt bleibt (z.B. Nexus 360*2 = 720px genutzt von 76

Hatte schon überlegt ob ich nicht mit einem JS nachgreife, aber ob das auch überall klappt...
Mit Zitat antworten
  #8 (permalink)  
Alt 19.02.2013, 18:59
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.779
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Nein, es fehlt nichts in meinem Satz.
Wenn du nicht willst, dass die Geräte initial "nicht" zoomen, dann darfst du nicht initial-scale=1 hinschreiben.
Mit Zitat antworten
  #9 (permalink)  
Alt 19.02.2013, 20:13
Erfahrener Benutzer
XHTMLforum-Mitglied
Thread-Ersteller
 
Registriert seit: 16.10.2009
Beiträge: 176
1chris befindet sich auf einem aufstrebenden Ast
Standard

Nagut, mit mehr Wörtern finde ich dein Satz aber doch gemütlicher zu lesen.

Kleiner Edit für alten Post der coolen Sonnenbrillen Smilie war eine 768 mit schleißender Klammer

Hast du noch einen Tipp bezüglich meiner beiden Lösungsansäze? Hatte das Thema bisher recht mathematisch betrachtet und kann auch gut n Fehler gewesen sein.

Geändert von 1chris (19.02.2013 um 20:25 Uhr)
Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
HTML5 viewport wird ignoriert vibid (X)HTML 1 18.09.2012 17:15
Website Rand Viewport BertaBiene CSS 3 22.06.2010 21:28
Meta Angaben "normal" und "DC" gleichzeitig ? rg69 (X)HTML 10 25.02.2008 14:06
Extra Stylesheet für kleine Bildschirme (ohne Javascript) beginners CSS 9 03.01.2006 14:34
Kleine ungereimheiten im IE Deedoo CSS 8 20.12.2005 22:52


Alle Zeitangaben in WEZ +2. Es ist jetzt 04:06 Uhr.