+48 604 071 990 |  Łódź, ul. Sitowie 12 |  biuro@istronywww.pl | 

Wielu klientów zastanawia się czy potrzebują responsywnej strony internetowej, która będzie dostosowywała się do urządzeń mobilnych. Klienci, którzy już założyli stronę internetową zastanawiają się z kolei nad inwestowaniem w takie rozwiązania, a Ci którzy chcą dopiero mieć swoją witrynę mają wątpliwości czy inwestować dodatkowe fundusze w stronę responsywną ?
Otóż warto! Jak najbardziej! Oto kilka powodów:

  1. Strony RWD są bardziej przyjazne w użytkowaniu takie strony - wypełniają cały ekran i jest mniejsza przestrzeń po bokach, szczególnie widoczna na dużych ekranach z rozdzielczościami Full HD.
  2. Będziemy mieli więcej użytkowników odwiedzających nasze witryny ze względu na wygodę.
  3. Google wprowadza nowy algorytm promujący strony responsywne. Czyli witryny, które mają układ dostosowujący się do smartfonów będą dodatkowo premiowane w wynikach wyszukiwania (SERP).

Trzeci powód jest oczywiście najważniejszy i najbardziej przemawia za koniecznością budowy strony dla urządzeń mobilnych. W prosty sposób można wyprzedzić konkurencję. Google już oficjalnie potwierdziło tutaj, że od 21 kwietnia 2015 roku że planowany update algorytmu ma mieć decydujący wpływ na wzrost w wynikach wyszukiwań. Będzie to również istotny wpływ na ranking stron o którym pisałem tutaj.

responsywne strony www

Przy okazji możesz sprawdzić czy Twoja witryna jest przyjazna urządzeniom mobilnym tutaj: 

https://www.google.com/webmasters/tools/mobile-friendly/

Mało tego. Jak tworzę stronę www to w narzędziach dla webmasterów dostaję czasami alert o tym, że trzeba kilka rzeczy poprawić. Do tej pory było tak gdy robiłem stronę responsywną i trzeba było dopracować niektóre elementy. Ale ostatnio dostałem taki komunikat dotyczący strony rolety bielsko, którą tworzyłem już dawno temu kiedy nie było technologii RWD. To dobitnie pokazuje jaki nacisk Google kładzie na wyszukiwarki.

Klienci istronywww.pl nie muszą się martwić o dopłatę za stronę responsywną. Wszystkie strony tworzone na istronywww.pl są budowane na urządzenia mobilne bez dodatkowych opłat.

Zapraszam jak zwykle do zadawania pytań w komentarzach.

Dział: Blog
środa, 14 styczeń 2015 05:30

Strony responsywne Łódź

Responsive Web Design (ang. responsive = czuły) to technika polegająca na projektowaniu interfejsu strony, który jest czuły na rozdzielczość ekranu. Pytanie po co? Dlatego, że świat ekranów w ostatnich latach bardzo się zmienił. Jeszcze w 2009 roku 70% użytkowników miało jeden rozmiar monitora – 1024x768 px. I wtedy wystarczyło projektować strony według stałego rozmiaru (aczkolwiek istniała już mało przyjazna technika budowania płynnych witryn). Od tego czasu wiele się jednak zmieniło - nie ma jednej rozdzielczości, która by aż tak dominowała. Powstały ekrany Full Hd z jednej strony (rozdzielczość 1920x1024px) jak i również świat smartfonów wkroczył do sieci gdzie rozdzielczości zaczynają się już od 480px640px (telefon w orientacji pionowej). Przed techniką RWD niektóre duże serwisy pozwalały sobie na tworzenie dwóch witryn gdzie jedna była na normalnej domenie a druga na subdomenie (np. onet.pl i m.onet.pl) i na tej subdomenie zamieszczano kopię strony w wersji dla telefonów.

responsywne strony www

Strony responsywne Łódź

Okazuję się jednak że to rozwiązanie jest po pierwsze mało elastyczne, a po drugie złe ze względu na pozycjonowanie, ponieważ powodowało to duplikowanie się treści, a jak wiadomo roboty wyszukiwarek lubią tylko unikalne, niepowtarzalne treści. A w ten sposób właśnie serwisy strzelały sobie pozycjonerską kulkę w stopę :)
Dlatego powstała technika RWD (responsive web design), która działa w ten oto sposób, że przeglądarka wykrywa rozdzielczość ekranu i dostosowuje się układ strony do wielkości ekranu. Odbywa się to za pomocą media queries, które pozwolą rozpoznać wielkość przeglądarki i wstawić odpowiedni arkusz stylu, lub jego fragment.
W praktyce w pliku css wygląda to np. tak, że wpisujemy kod:

@media (max-width: 768px) { }

I pomiędzy znakami wstawiamy style dla ekranów o maksymalnej szerokości ekranu 768px.
Jak najłatwiej rozpoznać czy strona jest responsywna? Bardzo łatwo. Uruchamiamy stronę w przeglądarce i skalujemy jej okno. Jeżeli pojawia się na dole okna belka do przesuwania poziomego strony – to znaczy że witryna nie jest responsywna. Układy RWD powodują że przy zmianie okna elementy strony będą się podsuwały jeden pod drugi. Po przeczytaniu tej części potrafisz już powiedzieć co to jest strona responsywna.

Czym jest Framework Bootstrap?

Oznacza to jednak, że trzeba pisać style dla kilku różnych rozdzielczości. Tutaj z pomocą przyszedł nam Tweeter. A dokładnie opracowany przez zespół programistów tweeter`a framework Bootstrap. Dzięki temu frameworkowi mamy już przygotowane style pod rożne rozdzielczości. Mamy do dyspozycji nawet zestawy ikon, wygląd tabelek, przycisków, formularzy, komunikatów i innych rzeczy o które nie musimy się już martwić. Jedyne co trzeba zrobić to przygotować poprawny szkielet ze znacznikami HTML5 i nadać im odpowiednie klasy. Sam kod html jest podzielony na 12 kolumn które trzeba wypełnić. Mogą to być 2 kolumny po 6 części lub 3 po 4. Ważne aby suma dawała 12 kolumn.
Więcej o frameworku bootstrap tutaj. Istnieje jeszcze kilka innych frameworków tego typu jak np. skeleton, ale ten od tweetera jest najpopularniejszy.

Dział: Blog