Wakacyjny kurs Responsive Web Design cz. 1

Wakacyjny kurs Responsive Web Design cz. 1

Postanowiłem, korzystając z wakacji, stworzyć mini kurs Responsie Web Design. Dzięki niemu już po 3 częściach(!) będziesz miał działającą stronę zgodną z RWD. I to z galerią zdjęć.

Halo, bileciki do kontroli!

Pełną treść dostaniesz bez grosza,
ale musisz być w naszym newsletterze.

Raz, raz, wpisywać e-mail. Tylko prawdziwy, bo sprawdzę!

partner technologiczny: GetResponse

 c)   Przebudowujemy stronę zgodnie z RWD

Powinienem raczej napisać — tworzymy od nowa stronę zgodnie z RWD. Dlaczego? Bo łatwiej (zaufaj mi teraz, w kolejnej części dowiesz się dlaczego) zbudować stronę od nowa niż próbować ją zmieniać. Być może strona będzie wyglądała nawet tak samo na ekranie komputera. Acz kod HTML i CSS będzie zupełnie inny.

Zalety znamy z poprzedniego artykułu: jesteśmy gotowi na przyszłe urządzenia mobilne (o dowolnych wielkościach i rozdzielczościach).

Największą wadą jest, że strona może nie być tak optymalna i tak szybko się wczytywać na urządzeniach mobilnych jak specjalnie do tego stworzona wersja tylko mobilna. Będziemy musieli często przesyłać zbędne dane.

Jak odpowiedzieć na postawione wyżej pytanie? Sądzę, że każdy musi to zrobić samemu.

Jeśli nasza strona to tylko wizytówka z danymi adresowymi — to raczej nie ma sensu jej zmieniać.

Jeśli dysponujemy dużym serwisem informacyjnym czy portalem społecznościowym — drugie rozwiązanie może być najlepsze dla naszych odbiorców; Otrzymają szybko wczytujące się i zoptymalizowane strony.

Jeśli zaś myślimy o stronie firmowej — dla mnie jednoznaczny jest wybór wersji RWD.

Oczywiście nie zawsze i dla każdego taki podział zadziała. Na przykład sztandarowy przykład zastosowania RWD to strona The Boston Globe. A to  strona informacyjna!

 Na potrzeby naszego kursu zakładam, że wybierzemy jednak Responsive Web Design

  2) Narzędzia ułatwiające pracę

 Zanim rozpoczniemy pracę warto przygotować kilka narzędzi. W kolejnym odcinku z cyklu przydadzą nam się:

 a)   Stary telefon komórkowy sprzed czasu „dotykalskich”

Wbrew pozorom wiele osób jeszcze ma takie telefony (choćby służbowe BlackBerry) i warto sprawić by też mogły nawigować po naszej stronie WWW.

 b)   http://www.studiopress.com/responsive/ — podgląd naszej strony w kilku popularnych wielkościach ekranu

 c)   http://spriteme.org/ — bookmarklet, który ułatwi nam optymalizację przesyłanych danych

 d)   http://developer.yahoo.com/yslow/ — wtyczka, bookmarklet, który pomoże nam sprawdzić jak szybko wczytuje się strona i co jest jej wąskim gardłem.

 e)   Otwarta i chłonna głowa - Acz to oczywiste w przypadku naszych czytelników.

 Jeśli masz pytania, wątpliwości, coś chciałbyś dodać albo uzupełnić dopisz to w komentarzach do artykułu. 

---

kolejne części kursu: druga, trzecia >>>

galeria stron responsywnych >>>

Polecane

Dzięki, link został przesłany

Zamknij

Serdeńko!
Lubisz już nasz fanpage?

Wystarczy kliknąć:

zobacz nasz fanpage >> Zamknij

Niech zapisze się
do newslettera!

Zostaw e-mail
i powolutku strzałeczka na guziczek!

Zamknij