CSS entwickeln für das Smartphone
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
abschalten
bayer
benutzung
bessere verbindung
bestimmen
beziehen
browser
datei
funktionieren
gleiche problem
handheld
interessante frage
mobiles layout
problem
quellcode
regel
tab
tastatur
url
zweck
-
Hallo!
Gerade optimiere ich eine Website zur Benutzung mit mobilen Endgeräten. Dazu habe ich einfach alles auf meinen Webspace hochgeladen. Wenn ich Änderungen am Stylesheet vornehme, dann aktualisiere ich dieses auf dem Server. Der Arbeitsprozess ist recht angenehm, wenn es auch mehr Klicks sind als beim reinen Arbeiten am PC.
Nun habe ich aber ein Problem: Google Chrome benutzt CSS-Dateien aus dem Cache. Auch bei Neuladen der Seite in einem anderen Tab, werden diese nicht aktualisiert. Kennt ihr eine Einstellung, mit der man das verhindert?
Bei Firefox gibt es das gleiche Problem...
Und ein mindest genauso großes Problem: Welche sinnvollen Media-Queries gibt es denn überhaupt um ein Smartphone zu bestimmen? "handheld" funktioniert nirgends und bei max-width muss ich um die 1000px angeben, um die Regel bei meinem Handy geltend zu machen... Dann sieht das aber schon wieder im Browser hässlich aus!
mfg
Jonas
Beitrag zuletzt geändert: 13.8.2015 8:30:52 von jonas-bayer -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Eigentlich müsste mit strg+f5 alles komplett neu geladen werden.
Alternativ könntest du auch zeitweilig den Browser-Cache komplett ausschalten (im FF unter Erweitert>>Netzwerk).
Schließlich könntest du noch das caching per .htaccess deaktivieren.
Welche media-queries sinnvoll sind, hängt stark vom Aufbau deines Design ab. Schau dir mal diese Seite
http://www.liquidapsive.com/
bzw. deren Quellcode incl. der CSS-Datei an.
Beitrag zuletzt geändert: 13.8.2015 11:55:54 von mein-wunschname -
mein-wunschname schrieb:
Eigentlich müsste mit strg+f5 alles komplett neu geladen werden.
Ich zitiere mich selbst:
jonas-bayer schrieb:
Gerade optimiere ich eine Website zur Benutzung mit mobilen Endgeräten.
mobile Endgeräte = Tablet, Smartphone, vllt. auch Smartwatch etc. Ich wüsste nicht, das die eine Strg- bzw. eine F5-Taste haben
Mittlerweile konnte ich allerdings eine Lösung finden, indem ich durch PHP den Namen des Stylesheets ändere, was auch gut funktioniert.
mfg
Jonas
Beitrag zuletzt geändert: 13.8.2015 11:58:02 von jonas-bayer -
Oh je, ja klar. Ich nutze in erster Linie Chromes Entwicklertools am PC für solche Zwecke, weil ich ja eine Webseite nicht nur für mein Smartphone mache.
Ist aber trotzdem eine interessante Frage: Womit ist ein Refresh beim Smartphone (beim FF im Menü; bei Chrome in der Adressleiste) vergleichbar?
Beitrag zuletzt geändert: 13.8.2015 13:44:51 von mein-wunschname -
Wenn man in die Adresszeile tippt und dann auf Enter auf der Tastatur, die erscheint wird die Seite neu geladen.
Das caching habe ich folgendermaßen verhindert:
<link rel="stylesheet" src="style.css?<?php echo date('l jS \of F Y h:i:s A'); ?>" />
Somit ändert sich der Link und die Datei wird neu geladen.
mfg
Jonas
Beitrag zuletzt geändert: 13.8.2015 13:56:36 von jonas-bayer -
Wenn du mit Chrome in die Entwicklertools gehst gibt es oben links auch ein Handysymbol womit du so tust als währe dein Destop ein Handy (z.B. touch events funktionieren). Da kann man das Cachen auch im dropdownmenü abschalten, Latenzen simulieren (aber wenn man möchte ist es durch eine bessere Verbindung auch schneller), verschiedene Geräte simulieren, ... . Das finde ich deutlich sinnvoller als es direkt mit einem (einzigen) Handy zu machen :)
-
hi,
ist das denn eine responsive Website oder hat die website "nur" ein zusätzliches mobiles Layout?
mfg -
w3j schrieb:
Wenn du mit Chrome in die Entwicklertools gehst gibt es oben links auch ein Handysymbol womit du so tust als währe dein Destop ein Handy (z.B. touch events funktionieren). Da kann man das Cachen auch im dropdownmenü abschalten, Latenzen simulieren (aber wenn man möchte ist es durch eine bessere Verbindung auch schneller), verschiedene Geräte simulieren, ... . Das finde ich deutlich sinnvoller als es direkt mit einem (einzigen) Handy zu machen :)
Ehrlich gesagt bin ich mit diesen Tools nicht so zufrieden. Da mein Projekt privat ist, muss es auch nur an meinem Handy funktionieren, also kann ich mir den Ärger sparen.
Ich habe jetzt vor allem via Firefox getestet und das Handy mit dem Computer verbunden dazu...
MFG
Jonas -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage