zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Responsive Design bei iPhone 6 nicht möglich

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 15.01.2015, 21:38
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.05.2010
Beiträge: 43
Overtone befindet sich auf einem aufstrebenden Ast
Standard Responsive Design bei iPhone 6 nicht möglich

Die Internetseite Freelance-Market.de: Kostenlos Freelancer/Freiberufler finden. wurde so aufgebaut, dass sie sich optimal an dar entsprechende Endgerät und anpasst. So passen sich Fontgrößen und Spaltenanzahl in Abhängigkeit der Bildschirmbreite des Endgerätes an um eine optimale Lesbarkeit zu erzielen.
Mit der Einführung des iPhone 6 / iPhone 6plus ist dies nicht mehr möglich, da ALLE nur die Useragents “Iphone” ohne Version übermitteln. Lediglich das Betriebs-System, beispielsweise “iOS 8…” wird mitgeteilt. Somit lässt sich anhand des Useragents nur erkennen, ob es sich um ein Iphone oder um ein iPad oder Ipod handelt, jedoch nicht, welche Iphone-Version oder Ipad-Version vorliegt. Die Übermittlung des iOS bringt hier auch nicht allzu viel, da auch ein Iphone 4S sowie auch ein Ipad das aktuelle iOS 8.x verwenden kann. Natürlich ist eine auf iPhone 6 optimierte Darstellung für ein Ipad völlig ungeeignet (zu große Buchstaben auf dem Ipad sind das Resultat).
Weiß hierzu jemand eine Lösung? Gerne spendiere ich eine Flasche guten Wein aus meiner Heimat, wenn ich hier weiterkomme.
Hier noch die genauen technischen Details: Die Seite Freelance-Market.de: Kostenlos Freelancer/Freiberufler finden. basiert auf einem YAML-Template-Framework, das nach besten Möglichkeiten in Sachen Responsitivität umgesetzt wurde. Im Hintergrund agiert hier übrigens eine Applikation, welche auf dem Zend-Framework basiert. Da es sich bei Zend bekanntermaßen um ein System handelt, welches nicht durch freie oder kostenpflichtige Templates zu gestalten ist (wie die meisten bekannten CM-Systeme), sondern auf einzelne View-Dateien setzt, muss für jede Unterseite eine eigene View-Datei bereit gestellt werden.Trotzdem ist das Layout für die Startseite mit „Header“, „Top-Navi“ und einem darunter folgenden 3-spaltigen Layout, sowie bei allen Unterseiten mit einem 2-spaltigen Layout und einem vertikal verkürzten Headerbild relativ überschaubar. Generell werden ausschließlich DIV-Container (keine Tabellen-Tags) zur Strukturierung des Templates eingesetzt! Ein Problem stellen die mobilen Endgeräte der Apple-Reihe dar. Während die Webseite bis zum Iphone 4S noch optimal dargestellt wird, erscheint ab dem Model Iphone 5 bis hin zu Iphone 6 Plus ein immer mehr zunehmender weißer Freiraum auf der rechten Seite. Aktuell setzen wir neben dem Einsatz von Media-Queries insbesondere für die Gesamt-Breite der Webseite vier Useragent-Sammlungen ein, welche dann jeweils eine unterschiedliche CSS-Datei für den vertikalen und horizontalen Viewport laden. Somit kann ein Iphone der Versionen 5 – 6 Plus entweder in die Klasse mit den zu kleinen Smartphone-Displays (anhand der Useragent-Kennung „Iphone“) oder in die Klasse mit den zu großen Tablet-Displays (beispielsweise anhand der Useragent-Kennung „iOS 8“) eingeordnet werden. Wollte man dieses System weiter spezialisieren, müsste man mit weiteren Useragent-Sammlungen und jeweils 2 CSS-Dateien arbeiten. Das wären dann alleine für das Iphone 5, Iphone 6 und Iphone 6 Plus 3 weitere Useragent-Sammlungen und insgesamt 6 weitere CSS-Dateien. Das ist sicherlich nicht sehr zweckmäßig, zumal es ja noch zig weitere Endgeräte mit unterschiedlichen Viewports gibt. Somit entsteht bei den drei neueren Iphones entweder weißer Freiraum auf der rechten Seite oder aber die Webseite fließt deutlich über den Displayrand hinaus! Seht ihr eine andere Möglichkeit zumindest die Geräte der Versionen 5 – 6 / 6 Plus separat zu erfassen?
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 15.01.2015, 21:52
Benutzerbild von Thielo
Web Ninja
XHTMLforum-Kenner
 
Registriert seit: 17.09.2009
Ort: Stuttgart oder so
Beiträge: 3.378
Thielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein LichtblickThielo ist ein Lichtblick
Standard

Ganz simpel
a) man strukturiert seinen Text ein wenig besser (hab mir nicht wirklich durchlegesen, was du geschrieben hast, wenn es so Kraut und Rüben ist)
b) Media Queries sind die Lösung, keine für Geräte speziellen Seiten ausliefern, das ist Stuss.
__________________
Hier ein immer gültiges Statement: Überarbeite deine Code, lerne die Grundlagen, widersprich mir nicht, wehre dich nicht, ich habe Recht, wir sind Lolgion, wir sind viele.. potato...
All meine Angaben sind ohne Gewähr, es könnte also trotz meiner Unfehlbarkeit dazu kommen dass ich falsch liege

www.richard-thiel.de | Müssen Websiten überall gleich ausschauen?
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 16.01.2015, 08:05
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.039
cloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekanntcloned ist jedem bekannt
Standard

Ja, ein strukturierter Text wäre hilfreich. Was ich aus dem Text herauslese beim überfliegen (Lesen ist ja nicht möglich): iphone iphone iphone es gibt nichts anderes als iphone iphone iphone
Also auch ja zu Thielos Punkt b), dafür sind mediaqueries da. Da braucht es keine Unterscheidung zwischen iphone 4,5,6,7,8,9
Mit Zitat antworten
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
Probleme mit responsive Design nicolafw CSS 4 28.11.2014 10:04
Responsive Design - Grafik Performance hakura Grafik, Design, Typografie 2 23.11.2014 10:27
Probleme mit responsive Design & Dropdownnavi andi.ebar CSS 12 19.09.2014 12:04
Kachelmuster via html - Responsive Design freundlich SamuelS (X)HTML 10 31.01.2014 08:00
Iphone Responsive Design Horizontal Breite Problem Dav-88 CSS 1 31.07.2012 16:30


Alle Zeitangaben in WEZ +2. Es ist jetzt 16:23 Uhr.