zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Media Queries vs. Extraseite

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 06.11.2011, 05:13
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.01.2007
Beiträge: 23
Mr.T befindet sich auf einem aufstrebenden Ast
Standard Media Queries vs. Extraseite

Hallo liebe Forengemeinde!

Die nächste Webseite die ich erstellen möchte, soll auch für mobile Geräte (Smartphones und Tablet-PCs) optimiert sein.

Dazu soll sich das Grundlayout an das verwendete Gerät anpassen und die Spaltenanzahl je nach Browserbreite reduziert werden, sodass das Layout auf einem Iphone beispielsweise nur 1-spaltig ist.

Ich habe schon ein wenig recherchiert und weiß nun, dass es dafür im wesentlichen 2 verschiedene Techniken gibt:

1. Media Queries
2. Browserweiche mit PHP oder Javascript und Umleitung auf eine extra Seite

Die Media Queries gehören ja schon zu CSS3 und sind noch sehr neu, aber wohl relativ einfach einzusetzen. Mir gefällt diese Möglichkeit sehr gut, aber leider lässt sich damit nicht verhindern, das nicht verwendete Bilder trotzdem heruntergeladen werden oder? Wobei background-images, die nicht benötigt werden (und nur in der standard-css eingebettet sind), dann doch eigentlich nicht mitgeladen werden dürften oder?

Mit der PHP-Methode könnte man dieses Problem ja durch die extra nur für die Smartphones/Tablets erstellte Seite gut lösen. Jedoch gibt es hier den Nachteil des doppelten Pflegeaufwands.

Und wenn man schon umleitet, würde ich dem Anwender trotzdem gerne die Wahl lassen, ob er nicht doch die Desktop-Variante mit seinem Smartphone/Tablet sehen möchte. Aber wie lässt sich das am besten umsetzen? Ein einfacher Link von der mobilen Seite zurück auf die normale würde ja ein erneutes Auslösen der Browserweiche bewirken.
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 06.11.2011, 10:03
body.ie {display: grotte}
XHTMLforum-Mitglied
 
Registriert seit: 09.01.2011
Beiträge: 841
take_a_7 sorgt für eine eindrucksvolle Atmosphäretake_a_7 sorgt für eine eindrucksvolle Atmosphäre
Standard

Moin,

Zitat:
Zitat von Mr.T Beitrag anzeigen
Die Media Queries gehören ja schon zu CSS3 und sind noch sehr neu, aber wohl relativ einfach einzusetzen.
Die mobilen Browser (Android, iPhone, etc.) können die aber schon ganz gut und darauf kommts ja an
Zitat:
Zitat von Mr.T Beitrag anzeigen
Mir gefällt diese Möglichkeit sehr gut, aber leider lässt sich damit nicht verhindern, das nicht verwendete Bilder trotzdem heruntergeladen werden oder? Wobei background-images, die nicht benötigt werden (und nur in der standard-css eingebettet sind), dann doch eigentlich nicht mitgeladen werden dürften oder?
Da hast du natürlich recht. Man müsste für die jeweiligen Browser halt testen, inwieweit mit display:none ausgeblendete Sachen trotzdem geladen werden.
Zitat:
Zitat von Mr.T Beitrag anzeigen
Mit der PHP-Methode könnte man dieses Problem ja durch die extra nur für die Smartphones/Tablets erstellte Seite gut lösen. Jedoch gibt es hier den Nachteil des doppelten Pflegeaufwands.

Und wenn man schon umleitet, würde ich dem Anwender trotzdem gerne die Wahl lassen, ob er nicht doch die Desktop-Variante mit seinem Smartphone/Tablet sehen möchte. Aber wie lässt sich das am besten umsetzen? Ein einfacher Link von der mobilen Seite zurück auf die normale würde ja ein erneutes Auslösen der Browserweiche bewirken.
Dann setzt du halt in der Session ein Flag und leitest nur dann um, wenn es nicht gesetzt ist

gruß,
take
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 06.11.2011, 15:58
Held des Scrum
neuer user
 
Registriert seit: 07.04.2009
Ort: Nähe Bonn
Beiträge: 37
OscarWilde1024 befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von Mr.T Beitrag anzeigen
Ich habe schon ein wenig recherchiert und weiß nun, dass es dafür im wesentlichen 2 verschiedene Techniken gibt:

1. Media Queries
2. Browserweiche mit PHP oder Javascript und Umleitung auf eine extra Seite
Also ich habe mit beidem bereits experimentiert und es kommt auch die Inhalte der Webseite an. Da mobile Endgeräte oft über UMTS mit dem Netz verbunden sind, würde ich hier auch ein Augenmerk auf die Datenmenge legen. Zum einen sind fast alle Flatrates volumenbegrenzt und die Verbindung ist auch nicht immer so schnell.

Somit hängt es stark von der Größe und der Menge der Bilder ab. Hier muss man dann natürlich den Pflegeaufwand berücksichtigen. Ich tendiere aber eher zur Browserweiche.

Frank
Mit Zitat antworten
  #4 (permalink)  
Alt 07.11.2011, 21:24
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.01.2007
Beiträge: 23
Mr.T befindet sich auf einem aufstrebenden Ast
Standard

Danke schonmal für eure Meinungen.

Ich habe jetzt testweise ersteinmal die Media Queries auf dieser Webseite eingesetzt:
Ihre flexible Webseite - Home

Klappt dort auch ganz wunderbar, wie ich im Firefox oder auf meinem Smartphone sehe.

Dort benutze ich auch das CMS Joomla, welches ich beim nächsten Projekt auch gerne wieder einsetzen möchte.

Jetzt frage ich mich aber, wie ich die Technik mit der PHP-Browserweiche umsetzen könnte, wenn ich mit einem CMS arbeite. Denn dann gibt es ja nur eine index.php Datei, die sich die Inhalte je nach Unterlink selber aus der Datenbank besorgt. Wenn ich nun eine extra Subdomain à la mobile.webseite.de erstellen würde, würde ich diese extra Seite die Inhalte ja auch aus der Datenbank holen lassen. Aber wie soll ich dann z.B. verhindern, dass die Bilder mitgeladen werden usw.?

@take

Diese Flag-Technik habe ich leider noch nie benutzt und verstehe von PHP nicht sonderlich viel. Wie kann ich mir deren Funktionsweise vorstellen?
Mit Zitat antworten
  #5 (permalink)  
Alt 07.11.2011, 22:20
body.ie {display: grotte}
XHTMLforum-Mitglied
 
Registriert seit: 09.01.2011
Beiträge: 841
take_a_7 sorgt für eine eindrucksvolle Atmosphäretake_a_7 sorgt für eine eindrucksvolle Atmosphäre
Standard

Moin,

Zitat:
Zitat von Mr.T Beitrag anzeigen
@take

Diese Flag-Technik habe ich leider noch nie benutzt und verstehe von PHP nicht sonderlich viel. Wie kann ich mir deren Funktionsweise vorstellen?
Was eine Session ist, weißt du aber? Wenn du jetzt von der Mobilseite zurückleitest, verlinkst du nicht auf "index.php" sondern auf "index.php?nomobile=true", o.ä. In der index.php setzt du bei diesem URL-Parameter dann $_SESSION['nomobile'] = true;. Am Anfang von der index.php kannst du dann jedesmal überprüfen, ob $_SESSION['nomobile'] == true ist und dann eben nicht auf die Mobilseite umleiten, hoffe das war verständlich

gruß,
take
Mit Zitat antworten
  #6 (permalink)  
Alt 07.11.2011, 22:58
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 01.01.2007
Beiträge: 23
Mr.T befindet sich auf einem aufstrebenden Ast
Standard

Ah ja das war verständlich genug um den Mechanismus zu verstehen, für alles weitere wird mir diesbezüglich hoffentlich google helfen können.
Danke!

Jetzt bleibt noch die Frage, wie ich das mit der Browserweiche in Zusammenhang mit einem CMS machen kann.
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
Helios Media GmbH sucht Frontend-Entwickler (m/w) in Berlin 1000jobboersen Offtopic 0 19.05.2011 11:00
Grafik / Media Tablet... die Qual der Wahl... Rupper Ressourcen 6 18.10.2008 12:20
Queries für verschiedene DBs generieren lassen Schelm.isch Serveradministration und serverseitige Scripte 5 23.06.2008 18:26
Hyperlink zum Windows Media Player ivonne (X)HTML 3 18.04.2008 12:24
media player valide einfügen!? newbie_2004 (X)HTML 5 25.11.2006 18:52


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