strony na PC i na PocketPC (mobinle), odróżnianie sprzętu Opcje

[mwm]

witam
mam taki mały problem.. chce zrobić strone dostępną dla zwykłyk komputerów typu PC i dla mobilnych typu PocketPC..

Wiadomo że moją one standardowo wyświetlacze o rozdzielczości 320:240 uciążliwe było by przeglądanie na takim ekranie strony przygotowanej na rozdzielczość chociażby 800:600 z drugiej strony niema sensu projektować strony na PC z rozdzielczością 320:240.

Chciałbym połączyć te strony aby na każdym sprzęcie łatwo można było się poruszać. Niestety niewiem jak się do tego zabrać, a dokładniej niewiem jak zrobić aby odróżniało sprzęt na którym jest otwierana.

1 - Pierwsza myśl to aby sprawdzał przeglądarke co było by gorszym rozwiązaniem (niestety na mobilnym sprzęcia zainstaluje przeglądarke Opere i może zgłupieć gdyż opera też jest na PC)

2 - Drugie rozwiązanie to aby sprawdzał jaki jest system i od niego uzależniał ale niewiem jak się do tego zabrać

Może wy macie jakieś pomysły albo wiecie jak wykonać warunek sprawdzania tak aby zawsze dobrze działało Przy okazji możecie podać jakiś uproszczony przykładowy skrypt

[hwao]

Rozpoznawac uzytkownika po "user agent" $_SERVER['http_user_agent']

Kod

* Microsoft Pocket Internet Explorer/0.6 - PIE 1.0, seems that they forgot to change it to 1.0.
    * Mozilla/1.1 (compatible; MSPIE 2.0; Windows CE) - PIE 2.0
    * On Windows Mobile 2003 — Mozilla/4.0 (compatible; MSIE 4.01; Windows CE; PPC; 240x320)
    * On Windows Mobile 2003 Second Edition, running on a Motorola MPx220 Smartphone — MOT-MPx220/1.400 Mozilla/4.0 (compatible; MSIE 4.01; Windows CE; Smartphone; 176x220)

Wiec mozna znalesc, jak sie chce - inaczej sie nie da - chyba ze chcesz zauwac javascript'owi

[mwm]

zawsze już coś... będę musiał się pobawić z tym

a w php można sprawdzić rozdzielczość ekranu ? wiem że w JS można ale to nie moja dziedzina :/ chyba że ktoś mi pomoże przenieść zmienne z JS do php

[hwao]

w php nie da rady php jest po stronie serwera (co najzywej moglbys pobrac rozdzialke jaka jest na serwerze ).

W js się da, robisz przekazanie zminnej z js przez GET (mozna by uzyc ajaxa, ciekawe by byly efekty )

najlepiej jest sprawdzac user agent'a, przynajmniej mi sie tak wydaje a dopiero potem mozna probwac js

[Seth]

Mozesz tez wykorzystac do tego celu CSSa.
Wystarczy przygotowac wersje styli pod mobilne przegladarki.
A dzieki wlasciwosci media przegladarka sama wybierze CSSa:

[HTML] pobierz, plaintext 
<link rel="stylesheet" type="text/css" media="handheld" href="mobile.css" />
[HTML] pobierz, plaintext 

[Wykrywacz]

A nie dało by się zrobić tak żeby sprawdzało rozdzielczość użytkownika i dopasowywało wielkość strony pod to?
Skoro da się zrobić z auto-dopasowaniem języka, to czemu w podobny sposób nie dało by się z tym?

[NoiseMc]

Możesz zrobić coś takiego:
1. index.php sprawdza czy na komputerze klienta jest Cookie z zapisaną rozdzielczością.
2. Jeżeli nie ma to wysyłasz do klienta stronę ze skryptem JS który sprawdza jaka jest rozdzielczość u klienta (screen.width, screen.height), zapisuje te dane w Cookie albo przypina do Query Stringa i robi redirect do strony właściwej (index.php).
3. Jeszcze raz index.php odczytuje Cookie lub QS i na tej podstawie wybiera odpowiednie szablony.

Skoro da się zrobić z auto-dopasowaniem języka, to czemu w podobny sposób nie dało by się z tym?

Przeglądarka wysyła do serwera nagłówek żądania zawierający Accept-Language ale niestety rozdzielczości ekranu nie wysyła.

Chociaż najlepszym wyjściem byłoby wydaje mi się użyć rozwiązania zaproponowanego przez Seth. Wystarzy wtedy, że zrobisz dwa CSS - y, nie musisz robić dodatkowego zestawu html - i dla Handhelda.

Ten post edytował NoiseMc 24.03.2006, 12:14:04

[Fipaj]

No bez jaj, Seth napisał najlepsze rozwiązanie... ja to troszkę rozwinę.

masz stronę załadowaną w div o id #Container. W mobile.css robisz mu width: 300px;, w screen.css: width: 800px; i po kłopocie.

Nie ważcie się używać JS ;-) Wiele osób wyłącza JS albo nie może z niego korzystać. To najgorsze rozwiązanie... Sorry, to w ogóle nie jest rozwiązanie.

[Seth]

Dokladnie. JS jest mocno zawodony, a trzeba dodac, ze Pocket IE nie obsluguje go - wiec niby jak pobrac rozdzielczosc ekranu ?

Poza 320x240 sa tez inne rozdzielczosci, w tym 480x640, dlatego najlepiej bylo by ustawic wielkosc div #container'a na % dla pocketow.

Strona pdaclub.pl zostala fajnie przygotrowana. Co prawda nie na CSSie ale po pobraniu User-Agenta:

http://pdaclub.pl/ <----- zwykla
http://pdaclub.pl/mobile/ <----- mobilna wersja

I to tez jest jakies rozwiazanie

Ten post edytował Seth 24.03.2006, 14:16:07

[mwm]

no dobra tylko teraz tak:

mam algorytm który buduje całą zawartość strony do zmiennych w katalogu \_php i 2 szablony w katalogach \_szablony\mobile i \_szablony\pc

ponieważ na urządzeniach mobilnych i tak najczęściej z internetu korzysta się przez GPRS więc grafika wykorzystana jest tam minimalnie

potrzebuje aby podczas ładowania strony do jednej zmiennej została przypisana informacja z którego katalogu ma ładować szablon

niejestem jeszcze taki zaawansowany w php.. niebardzo wiem jak wykorzystać do tego celu user agenta...

co do CSSa to jeszcze mniej się na nim znam ale chyba w tej sytuacji mi niepomoże...