Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [XHTML] Strony dla urządzeń mobilnych
Czy korzystasz z internetu używając telefonu komórkowego?
Czy korzystasz z internetu używając telefonu komórkowego?
Tak, często [ 2 ] ** [28.57%]
Tak, czasami [ 3 ] ** [42.86%]
Tak, rzadko [ 1 ] ** [14.29%]
Nie [ 1 ] ** [14.29%]
Suma głosów: 7
Goście nie mogą głosować 
wewior
post
Post #1





Grupa: Zarejestrowani
Postów: 200
Pomógł: 8
Dołączył: 24.09.2003

Ostrzeżenie: (10%)
X----


Pytanie o standardy - jak poprawnie konkstruować wersję strony dla urządzeń mobilnych?
Czy dodajecie jakieś dodatkowe nagłówki?
Jak bardzo inwestujecie w style i wygląd - czy najprościej jak się da czy coś lepszego?
Jakie standardy tutaj mają zastosowanie?
Go to the top of the page
+Quote Post
konole
post
Post #2





Grupa: Zarejestrowani
Postów: 275
Pomógł: 32
Dołączył: 21.03.2006
Skąd: Warszawa

Ostrzeżenie: (20%)
X----


Według mnie najlepszym rozwiązaniem dla normalnych stron jest przystosowanie i napisanie jej w taki sposób, aby zmiana wyglądu odbywała się jedynie w CSS. Przykład możesz zobaczyć w moim projekcie - http://kangaru.pl/ - pobaw się zmianą szerokości okna.
Go to the top of the page
+Quote Post
wewior
post
Post #3





Grupa: Zarejestrowani
Postów: 200
Pomógł: 8
Dołączył: 24.09.2003

Ostrzeżenie: (10%)
X----


Cytat(konole @ 24.08.2011, 10:03:17 ) *
Według mnie najlepszym rozwiązaniem dla normalnych stron jest przystosowanie i napisanie jej w taki sposób, aby zmiana wyglądu odbywała się jedynie w CSS. Przykład możesz zobaczyć w moim projekcie - http://kangaru.pl/ - pobaw się zmianą szerokości okna.


Ok, tak też zwykle robię, ale bardziej chodzi mi o to jakie elementy dodatkowe powinna zawierać strona dla mobilnych urządzeń.
Twoja strona coś się psuje jak zmieniam szerokość okna, nie wiem czy tak specjalnie ale nie bardzo się dostosowuje (sprawdzałem w Operze i FF).
Go to the top of the page
+Quote Post
!*!
post
Post #4





Grupa: Zarejestrowani
Postów: 4 298
Pomógł: 447
Dołączył: 16.11.2006

Ostrzeżenie: (0%)
-----


Zmniejsz jego stronę do ok 40px szerokości to zadziała, też myślałem że ma coś z tym nie tak (IMG:style_emoticons/default/wink.gif)

Oczywiście wersje mobilne rób tylko i wyłącznie za pomocą CSS, są do tego odpowiednie narzędzia wczytujące odpowiedni styl przy danej rozdzielczości "media". Nigdy nie stosuj osobnej witryny pod inną subdomeną, ostatnio tak popularną "m". To zły nawyk, podobny do prefixu 'www" w adresie.

Elementy dodatkowe? Wywal wszytko co zbędne, pozostaw tylko treść i nawigacje (IMG:style_emoticons/default/wink.gif)

Ten post edytował !*! 24.08.2011, 09:28:27
Go to the top of the page
+Quote Post
wewior
post
Post #5





Grupa: Zarejestrowani
Postów: 200
Pomógł: 8
Dołączył: 24.09.2003

Ostrzeżenie: (10%)
X----


Cytat(!*! @ 24.08.2011, 10:27:51 ) *
Zmniejsz jego stronę do ok 40px szerokości to zadziała, też myślałem że ma coś z tym nie tak ;)


Nie działa to w FF, dopiero jak włączyłem inna przeglądarkę to zadziałało jak napisałeś.

Cytat(!*! @ 24.08.2011, 10:27:51 ) *
Oczywiście wersje mobilne rób tylko i wyłącznie za pomocą CSS, są do tego odpowiednie narzędzia wczytujące odpowiedni styl przy danej rozdzielczości "media". Nigdy nie stosuj osobnej witryny pod inną subdomeną, ostatnio tak popularną "m". To zły nawyk, podobny do prefixu 'www" w adresie.


Podaj proszę przykład takiej poprawnej definicji styli za pomocą "media" dla telefonów komórkowych. Rzadko spotyka się handheld cyz tty które chyba są przewidziane tutaj.
Go to the top of the page
+Quote Post
!*!
post
Post #6





Grupa: Zarejestrowani
Postów: 4 298
Pomógł: 447
Dołączył: 16.11.2006

Ostrzeżenie: (0%)
-----


http://www.w3.org/TR/css3-mediaqueries/
http://www.alistapart.com/articles/return-...bile-stylesheet

Nie ma sztywnej ramy "wyświetl to bo czytam teraz z urządzenia przenośnego". dlatego robisz to 'ręcznie'

  1. <link rel="stylesheet" media="screen and (max-width: 768px)" href="mobile.css" type="text/css" />
  2. <link rel="stylesheet" media="screen and (max-width: 128px)" href="mobile_phone_old.css" type="text/css" />


W zależności jaka jest szerokość ekranu w danym urządzeniu, taki styl zostanie wczytany.

edit: powyższa strona działa na FX 6.0, dokładnie tak samo jak opera czy chrome.

A pod tą stroną http://quirktools.com/screenfly/ możesz przetestować różne konfiguracje. Oczywiście to tylko taka namiastka, ale pixel to pixel (IMG:style_emoticons/default/wink.gif)

Ten post edytował !*! 24.08.2011, 11:42:49
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 22.08.2025 - 14:50