Witam,

Tworzę stronę w html5 i chcę żeby działała ona prawidłowo na kompach, tabletach i komórkach. Kożystam z jednego kodu HTML i 2 CSS(screen i mobile), niektóre zdjęcia (img src) w HTML są uprzedzone klasą która w screen nic nieznaczy, a w mobile wygląda tak:

.mobile{
visibility: hidden;
display: none;
}

zrobiłem tak żeby zmiejszyć ilość grafiki do wczytywania przez "powolne" komórki, ale zastanawiam się czy wogóle to co zrobiłem ma sens? czy czasem tel. nie wczyta tej całej grafiki a następnie jej nie ukryje??

Czy wytłumaczy mi ktoś w jaki sposób i w jakiej kolejności są elementy wczytywane i odczytywane z serwera do przeglądarki?

Jeżeli masz zainstalowaną Operę lub FF za pomocą narzędzi programistycznych, możesz w łatwy sposób sprawdzić jakie elementy zostały pobrane z serwera. Twoje obawy są słuszne - przeglądarka pobierze grafikę a następnie za pomocą CSS ją schowa.

W tym wypadku najlepszy rozwiązaniem wydaje się tworzenie obrazów za pomocą JS (nawet zwykłe .inneHTML='<img src="">' powinno pomóc) lub utworzenie innego szablonu specjalnie no mobilki

Witam.

Zainteresuj się Media queries.

[CSS] pobierz, plaintext 
@media (max-width: 767px) {
  .mobile {
    display: none !important;
  }
}
[CSS] pobierz, plaintext 

Dzięki za odpowiedzi:)

CuteOn, kombinowałem w podobny sposób żeby za pomocą Javascript wykonać poprostu warunki i tyle... ale znowu narzuca się pytanie czy wszystkie tel. komórkowe zrozumieją skrypt Javy? wydaje mi się (chyba) że java wykonuje skrypty już na stronie a nie na serwerze czyli urządzenie odczytujące musi sobie z tym poradzić... co sprowadza mnie do punktu wyjścia... No chyba że się mylę i javascript w HTML5 działa już na innych zasadach.

rocktech.pl

Wiem że MediaQueries są ważne i w wolnej chwili zacznę lektóre książki którą kupiłem HTML5 i CSS3 standardy przyszłości. Przeglądając ją widziałem że jest tam o tym sporo, ale w mojej stronce wykonałem kilka warunków za pomocą @media..... i moja stronka naprawde ładnie składa się przy każdej szerokości przeglądarki internetowej ale niezabardzo na chwilę obecną rozumiej co da mi użycie !impotant na mój problem z wersją mobilną czy zapobiegnie to pobraniu grafiki z serwera przez komórkę?

Więc zrób dodatkowy szablon dla urządzeń mobilnych i problem z głowy

Może zacznij od tego typu artykułów: http://www.cms.rk.edu.pl/w/p/tworzenie-str...dzenia-mobilne/