Budowa stron www. Jak zarządzić projektowaniem witryny?

Projektowanie stron www ma zasadniczo trzy kluczowe etapy, których nie można pominąć. To kolejno: zbudowanie układu treści, design graficzny, kodowanie. Zmiana kolejności tych działań lub pominięcie któregokolwiek z nich zwykle kończy się stratą – czasu, nerwów i pieniędzy. Zrozumienie procesu powstawania strony przez wszystkie strony projektu po prostu ułatwia jej powstanie i do tego ma przyczynić się ten artykuł.

Budowa stron www I: Układ treści

To niedoceniany, ale najważniejszy moment procesu – i to zarówno z perspektywy kupującego, jak i realizującego zlecenie. Zanim strona zacznie się w jakikolwiek sposób materializować w formie projektu graficznego, najpierw powinna zostać rozpisana na bloki w formie mapy myśli.

Może to nie jest najlepsza wiadomość, ale nawet do zrobienia wyłącznie rzetelnej wyceny, powinieneś wiedzieć o nowej stronie całkiem sporo.

Jakie decyzje musisz podjąć na tym etapie?

• jakie funkcjonalności będzie miała strona (np. wyszukiwarki, formularze, przypisy w artykułach, Google Maps),
• ile layoutów (podston) będziesz potrzebować – pamiętaj o tych marginalizowanych typu błąd 404, polityka prywatności czy widok zgody cookies na stronie głównej,
• jakie dodatkowe materiały musisz zorganizować (np. sesja zdjęciowa pracowników, referencje, wpisy na bloga); zwykle stanowią one dodatkowy koszt do zabudżetowania poza wdrożeniem strony.

Kiedy jest dużo łatwiej zrobić ten pierwszy krok? Gdy masz już gotową strategię komunikacji oraz identyfikację wizualną. Znacząco przyspiesza to uruchomienie strony, bo nie zastanawiasz się, jak i komu marka ma się zaprezentować (to już wiesz). Skupiasz się na optymalnym wykorzystaniu witryny jako kolejnego narzędzia realizującego cele.

Do zamapowanej witryny przygotowujesz copywriting, który razem z inspiracjami i pomysłami na prezentację treści stanowi podstawę pracy grafika.

Budowa stron www II: Grafika

W zakresie wyglądu (a po części też funkcjonalności) strony masz dwa rozwiązania: możesz wykorzystać gotowy motyw graficzny (np. dla systemu do zarządzania treścią Wordpress) lub zdecydować się na dedykowany dla Twojej marki design. Różnicę poza względami wizualnymi oczywiście, zobaczysz w cenie i czasie wdrożenia – projekt spersonalizowany jest dłuższy i droższy. Dlaczego mimo wszystko warto się na niego zdecydować?

• Możesz zbudować stronę wywołującą efekt zaskoczenia i emocje już po załadowaniu strony głównej.
• Masz szansę osadzić projekt w najnowszych trendach w designie www.
• Możesz wprowadzić niestandardowe funkcjonalności niedostępne w bezpłatnych motywach.
• I przede wszystkim – w całości projekt odpowiada Twojej identyfikacji wizualnej oraz estetycznie jest spójny z pozostałymi materiałami marketingowymi.

Nie oznacza to, że gotowce nie znajdują zastosowania w praktyce! Jeśli chcesz wystartować z blogowaniem dla wzmocnienia marki osobistej, nie mając pewności, czy to w ogóle zajęcie dla Ciebie, szukasz szybkiego i niskobudżetowego rozwiązania – oto właśnie ono. Gotowe motywy świetnie nadają się do testowania pomysłów.

Wybierając gotowca, warto jednak zwrócić uwagę na dwie sprawy: uzupełnienie zakładek o dodatkowe elementy wizualne (np. ikony, infografiki), które można łatwo dodać jako obrazek oraz na techniczną optymalizację strony (np. usunięciu niepotrzebnych bloków), aby przyspieszyć czas ładowania.

Budowa stron www III: Kodowanie

Wydawałoby się, że jest już z górki: programista odwzorowuje projekt graficzny (w przypadku dedykowanego desingu) i sprawa załatwiona! W praktyce pojawiają się teraz dwa zupełnie nowe elementy, nad którymi trzeba zapanować.  

Po pierwsze projekty od grafika mają charaktery statyczny – nie widać na nich animacji, sposobu pojawiania się poszczególnych bloków czy ruchu elementów specjalnych (na przykład spersonalizowanego kursora). To wszystko zobaczysz pierwszy raz dopiero po zakodowaniu.

Po drugie grafik nie przygotowuje strony www we wszystkich rozdzielczościach ekranów stacjonarnych i mobilnych. Zwykle dostarcza się jeden podstawowy projekt (np. w szerokości 1920px), który programista skaluje do mniejszych widoków, czyli czyni stronę responsywną. Wiele się tu zmienia: wielkość fontów, logo w menu, ikon, szerokość marginesów, itd.

Jeśli zależy Ci nie tylko na funkcjonalności, ale także na wyglądzie, musisz w tym momencie dopilnować szczegółów.

To, że na Twoim monitorze zakładka wygląda świetnie, nie oznacza, że na innych wyświetla się tak samo dobrze – w praktyce te różnice mogą Cię zaskoczyć!

Podsumowanie

Projektowanie stron www to naprawdę rozbudowany i czasochłonny projekt. W zakresie kosztów warto założyć, że końcowa faktura będzie wyższa niż ta z wyceny. Często już w trakcie prac pojawiają się dodatkowe pomysły, usprawnienia techniczne czy nowe treści. Szkoda z nich po prostu rezygnować. Zwykle strona jest jednym z większych wydatków marketingowych, dlatego warto wygospodarować na jej stworzenie obszerną przestrzeń w swoim kalendarzu – na planowanie, design i kodowanie.