Projektowanie stron na urządzenia przenośne

Responsive Web Design
  • Sharebar

Liczba użytkowników korzystających z Internetu na urządzeniach innych niż komputer rośnie z miesiąca na miesiąc. A nawet na komputerach oraz laptopach ekrany mają wiele różnych rozdzielczości. Masz stronę i chcesz, żeby u każdego wyświetlała się ona dobrze? Jak to zrobić, jak tu wszystkich pogodzić? Jest na to sposób, a mianowicie Responsive Web Design, czyli wykorzystanie CSS Media Queries do stworzenia wyglądu zależnego od rozdzielczości ekranu użytkownika. Sposób teoretycznie najlepszy jest następujący: trzeba zacząć od stworzenia szablonu, który będzie się dobrze wyświetlać na najmniejszych telefonach komórkowych (240 lub 320 pikseli szerokości). Następnie za pomocą Media Queries można dla coraz szerszych urządzeń poszerzać stronę dodając oraz przesuwając kolejne elementy na boki, aż dojdzie się do największych popularnych szerokości – (1280, 1366, 1440 pikseli). Jest to podręcznikowe podejście, jednak najczęściej nie ma takiej możliwości, kiedy już mamy szablon o standardowej szerokości (ok. 960-1000 pikseli) i nie chcemy kupować lub tworzyć nowego. Wtedy należy wykonać kilka podstawowych zmian – obrazki ustawić na dopasowujące się do rodzica (max-width: 100%), treść główną strony dopasowującą się do rozdzielczości (używając width: 100% oraz określonego max-width). Najwięcej problemów sprawia ustawienie paneli bocznych na stałą szerokość (przy zmiennej szerokości głównej strony), ale na to też są sposoby. Na koniec trzeba użyć Media Queries, żeby na mniejszych urządzeniach pewne elementy (panel boczny, menu itp.) przestawiały się przed lub po głównej treści. A wszystko po to, żeby u żadnego użytkownika nie pojawiał się nieporęczny poziomy pasek przesuwania.

VN:F [1.9.17_1161]
Ocena: 0.0/5 (0 oddanych głosów)

Podobne wpisy:

  1. Projektowanie stron www a jakość
  2. Projektowanie stron www
  3. Projektowanie Stron
  4. Projektowanie stron www
  5. Projektowanie stron Szczecin
Komentarze i pingowanie jest obecnie wyłączone.

Komentarze są wyłączone.