Dawno dawno temu … sprawa była bardzo prosta, ponieważ rozdzielczość, która obowiązywała to 800 px szerokości. Praktycznie każdy monitor był ustawiony na taką rozdzielczość co bardzo ułatwiało sprawę projektowania strony internetowej. W obecnych czasach nie jest już tak łatwo, rozwój technologiczny pozwolił na zbudowanie monitorów i kart graficznych, które wyświetlają obraz w dużych rozdzielczościach. Osobiście uznałem maksymalną szerokość wyświetlanej strony www równą 1920px szerokości, a więc standard HD.
Co z osobami, które używają mniejszej rozdzielczości, nie będą w stanie zobaczyć połowy strony internetowej. Rozwiązaniem tego problemu jest zaprojektowanie strony www w ten sposób, że będzie się ona dostosowywać do rozdzielczości internauty i wypełniać całą przestrzeń treścią lub określenie obszaru, który będzie widoczny dla wszystkich rozdzielczości.
Co do pierwszego rozwiązania problemu rozdzielczości przy tworzeniu stron www, moim zdaniem nie jest to najlepsze rozwiązanie i bardzo rzadko je stosuję. Ciężko się czyta tekst przy tak długich liniach. Jeżeli używasz rozdzielczości 1920px szerokości i tekst rozleje się po całym monitorze na którym przeglądamy stronę internetową to aby to przeczytać musimy włożyć w to trochę wysiłku.
Drugie rozwiązanie, którego jestem zwolennikiem, a więc wyznaczenie stałego obszaru strony www na treść jest moim zdaniem lepszym sposobem na przedstawianie treści na witrynie www. Obszar ten powinien zawierać się w 1000px szerokości. Daje nam to pewność, że praktycznie każdy kto ma zainstalowaną kartę graficzną będzie w stanie zapoznać się z całą treścią na naszej stronie internetowej. W polu o 1000px szerokości umieszczamy menu, elementy graficzne oraz całą treść, resztę projektu stanowi tło projektowanej strony www. Dzięki temu zabiegowi po wdrożeniu naszego projektu w życie strona internetowa będzie dobrze wyglądać przy niskich rozdzielczościach 1024px i również przy dużych 1920px. Różnica w przeglądanej stronie będzie taka, że będziemy widzieć więcej lub mniej tła projektowanej strony www.
Dobrze jest “wychodzić” z tych 1000px szerokości elementami graficznymi np. slider ze zdjęciami. Sam moduł może mieć rozdzielczość np. 1200px szerokości ale nawigacja czy tekst w tym module powinna mieścić się w 1000px co da nam pewność, że wszyscy będą mogli zapoznać się z treścią czy nawigować w sliderze. Aby uniknąć dolnego paska nawigacji wprowadzamy prosty kod w CSS:
1 |
body {overflow-x: hidden;} |
pozwoli to na stosowanie większych elementów na stronie internetowej a przy mniejszych rozdzielczościach, które nie wyświetlą całego elementu, pozbawi nas problemów z paskiem przewijania strony internetowej na dole witryny.
Możemy również przypisać dany wygląd modułów dla danej rozdzielczości, ten sam moduł będzie miał szerokość inną dla rozdzielczości np. do 1200px szerokości a inną dla rozdzielczości większych niż 1200px, np.
1 2 3 4 5 6 7 8 9 |
@media only screen and (max-width: 1200px) { #footer{ width:1000px;} } @media only screen and (min-width: 1200px) { #footer{ width:1200px;} } |
Nie możliwe jest umieszczenie tego rozwiązania w projekcie graficznym strony internetowej ale warto zapoznać się z możliwościami tworzenia stron internetowych. Podstawowa wiedza dotycząca budowy stron www pozwoli na stworzenie dobrego projektu graficznego strony www.
Strona internetowa to nie poligrafia i ważną kwestią w projekcie jest lekkość grafiki a więc szybkość otwierania się strony. Przy projektowaniu strony właściwym rozwiązaniem jest stosowanie wartości 72 DPI. Pozwoli to na mniejszą objętość plików graficznych i tym samym prawidłowe funkcjonowanie zaprojektowanej strony internetowej.
Pozostaje nam jeszcze kwestia urządzeń mobilnych, tablety, smartfony. Ten element opiszę bardziej szczegółowo w innym artykule ale ogólna zasadą jest tworzenie trzech projektów graficznych strony internetowej, każdy odpowiedni dla danego urządzenia końcowego.
Nowoczesne strony internetowe powinny być przystosowane do różnych rozdzielczości oraz urządzeń. Zachęcam do zapoznania się z RWD
Przede wszystkim przy projektowaniu strony internetowej musimy poznać potrzeby klienta. Czy ma już stworzony jakiś wizerunek firmy i nie chce go zmieniać czy tworzymy wszystko od zera. Podobne sprawa ma się jeśli tworzymy stronę www dla siebie, również musimy zadać sobie parę pytań tak by nasz projekt był udany. Przede wszystkim zacznijmy od logotypu, czy już jakiś istnieje i musimy się trzymać kolorów, które występują w logotypie. Czy klimat strony …
Polecamy tanie strony internetowe z systemem CMS, zaprojektowane i wykonane przez profesjonalistów. Otrzymujesz nowoczesny design, responsywność oraz intuicyjną nawigację. To wszystko za bardzo konkurencyjną, atrakcyjna cenę. Sprawdź nas!
Profesjonalne strony www Olsztyn, dostosowane do Twoich indywidualnych potrzeb. Wykonujemy responsywne strony www (RWD), zoptymalizowane pod kątem SEO. Tworzymy proste strony (wizytówki), blogi, jak również duże serwisy internetowe. Tworzymy niepowtarzalną kompozycję grafiki połączoną z przyjazną nawigacją.