Blog

Kategoria wpisu: #TO_CIEKAWE!#WWW
Etapy tworzenia strony WWW

Etapy tworzenia strony WWW

Mówi się, że współczesny biznes nie może obejść się bez strony internetowej. Jednak przy tak ogromnej konkurencji w sieci nie wystarczy już tylko pospolity projekt. Potrzebne są rozwiązania szyte na miarę. To trochę tak jak z dobrym garniturem u krawca. W pierwszej kolejności opisujemy nasze potrzeby, zastanawiamy się, na jakie okazje będziemy wkładać garnitur. Potem następuje wybór materiałów i ściągnięcie naszych wymiarów. Musimy więc odpowiednio przygotować się do realizacji tego zlecenia. Jest w tym wiele analogii do tworzenia stron WWW. Jak przygotować się do realizacji projektu z agencją interaktywną? Odpowiedź na to pytanie znajdziesz w niniejszym artykule.

Spis treści

  • Określenie potrzeb strony WWW
  • Brief
  • Formalności (umowa i zaliczka)
  • Pozostałe materiały do stworzenia strony
  • Projektowanie strony oraz poprawki
  • Kodowanie strony www
  • Testy i poprawki strony
  • Instalacja strony www
  • Szkolenia i pomoc techniczna

Etap 1. Określenie potrzeb strony WWW

etapy-projektowania-strony

Każda strona internetowa tworzona jest w jakimś celu. Może to być sprzedaż, zwiększenie świadomości marki, pozyskanie tzw. "leadów" lub po prostu przedstawienie pełnej oferty usług. Określenie konkretnego celu jest priorytetem i absolutnym punktem wyjścia przy każdej realizacji strony www. To pierwszy etap realizacji strony www.

Nawet najładniejsza strona internetowa będzie bezużyteczna, jeśli zapomnisz o użytkownikach i ich potrzebach. Wyobraź sobie, że witryna jest drogą, na której końcu czeka na Ciebie imponująca nagroda w postaci większej ilości zapytań ofertowych do Twojej firmy. Co należy zrobić, aby osiągnąć ten cel? Wystarczy odpowiedni dobór elementów na stronie, które wyzwolą w użytkowniku chęć podjęcia określonego przez nas działania.

W pierwszej kolejności określ cele, jakie powinny przyświecać stronie internetowej. Czy chcesz pozyskiwać kontakty do potencjalnych Klientów? Może pozyskujesz Klientów z innych źródeł i wystarczy, że odpowiednio zakomunikujesz wartości swojej marki? Rozpisz wszystkie potrzeby na kartce i wybierz ten najważniejsze dla Twojego projektu. Może się okazać, że wcale nie potrzebujesz rozbudowanej strony i wystarczy strona typu wizytówka. Na papierze dostrzeżesz więcej niż może się wydawać.

Etap 2. Brief

Brief to podstawowy dokument do komunikacji pomiędzy firmą, a agencją interaktywną. Dobrze przygotowany brief będzie pomocnym narzędziem dla Ciebie jak i projektanta. Tak wiemy, nikt nie lubi wypełniać dokumentów, a już na pewno nie przedsiębiorca. Być może, wielokrotnie rozmawiałeś już z wybranym wykonawcą, ale coś mogło umknąć lub zostać niedostatecznie jasno wyartykułowane. Wszyscy jesteśmy ludźmi i pomimo wspólnego języka, inaczej się komunikujemy. Dlatego też wymyślono brief.

Brief to zwykła ankieta. Może być w formie online lub w formie dokumentu tekstowego do wypełnienia. Opiszesz w nim oczekiwane narzędzia strony, nakreślisz spis zakładek menu i ich zawartość. W briefie podasz przykłady stron, które Ci się podobają oraz to czego Twoim zdaniem wykonawca powinien unikać. Każdy biznes ma swoje niuanse, które projektantowi strony nie muszą być znane.

Pomyśl o briefie jako o mapie, którą tworzysz. Mapie, której skarbem jest Twoja satysfakcja z wykonanego zlecenia. Zarówno Tobie, jak i wykonawcy zależy, aby do niego dotrzeć. Im więcej klarownych informacji się w nim znajdzie, tym lepszy będzie efekt.

Etap 3. Formalności (umowa i zaliczka)

Zakładamy, że wiemy, jakie są nasze oczekiwania. Otrzymaliśmy ofertę i wybraliśmy wykonawcę, któremu chcemy powierzyć nasz projekt. Mamy również treściwie wypełniony brief. Przypieczętowaniem współpracy będzie umowa, która zabezpieczy interesy obu stron. Umowa jest podstawą każdej dobrej współpracy. Pomimo tego, że potrzebna jest na czas wojny, również w czasie pokoju będzie niezastąpiona.

Dobra umowa na wykonanie strony internetowej powinna określać szczegółowo funkcjonalność strony. Opisze zakres prac wykonawcy, harmonogram realizacji zlecenia czy długość i zakres gwarancji. Znajdą się w niej również zapisy dotyczące obowiązków zamawiającego i harmonogram płatności. Nie ma uniwersalnego wzoru umowy na wykonanie strony internetowej. Każda agencja interaktywna posiada swój szablon.

Należy wspomnieć również o zaliczce. Może ona być także w formie zadatku. Rzadko która agencja interaktywna pobiera 100% wartości wynagrodzenia przed rozpoczęciem prac. Mało który Zamawiający zgodziłby się też na pełną płatność. Dobrą praktyką są zaliczki w wysokości 25%-50% wartości zlecenia. Zaliczka pozwoli wykonawcy opłacić podstawowe koszty realizacji strony WWW. Zamawiający pokaże w ten sposób swoją wypłacalność i potwierdzi chęć złożenia zlecenia. Jest jeszcze jedna zaleta zaliczek. W ten sposób łatwiej będzie klientowi przełknąć fakturę końcową. Zostanie ona pomniejszona o wpłaty początkowe :-)

Etap 4. Pozostałe materiały do stworzenia strony

Do realizacji strony WWW będą potrzebne także inne materiały, które dostarczyć może tylko Klient. Zaczniemy od fotografii. Podstawowym narzędziem pracy grafików są banki zdjęć. Można tam zakupić fotografie tematyczne, które zostaną wykorzystane do zaprojektowania szaty graficznej. Nic nie zastąpi autentycznych fotografii. Mogą to być zdjęcia siedziby, zespołu, linii produkcyjnej czy samych produktów. Dlatego warto zawczasu wytypować i zakontraktować lokalnego fotografa.

Kolejna kwestia to treści na stronę internetową. W dobie systemów CMS, bardzo często ten aspekt jest bagatelizowany. Wykonawcy słyszą "to się uzupełni". Szata graficzna strony musi korespondować z tekstami. Jest to szczególnie istotne przy stronach typu "landing page". Jeżeli projektant ma mieć materiał do zaprojektowania grafiki, musi posiadać pełne treści już na samym początku. Nie muszą to być teksty na całą witrynę. Wystarczą treści na stronę główną. Niech grafik nie zastanawia się co wstawić w danym miejscu, tylko jak to zaprezentować.

Na ostatnią cześć materiałów składają się dane dostępowe do hostingu. Klient, posiadając stronę internetową, często opłaca faktury w terminie i wszystko działa nieprzerwanie. Gdy przychodzi do etapu instalacji gotowej strony, nikt nie wie jak dostać się do usług hostingowych. Zaczyna się gorączkowe tropienie osób, które rejestrowały domenę czy odpowiadają za serwer. Gorzej, gdy okazuje się, że są to byli pracownicy firmy i nie ma z nimi kontaktu. Warto więc zawczasu zgromadzić wszystkie dane. Domena internetowa to przecież jeden z najważniejszych zasobów niematerialnych firmy.

Etap 5. Projektowanie strony oraz poprawki

jak-przebiega-tworzenie-strony

Teraz czas na szycie naszego garnituru, czyli tworzenie projektu graficznego. Proces twórczy zazwyczaj rozpoczyna się od szkiców i burzy mózgów w zespole. W ten sposób powstaje makieta funkcjonalna każdej zakładki. Tak przygotowany schemat może być skonsultowany z Klientem lub tylko wewnątrz zespołu.

Następnie przychodzi czas na zmaterializowanie pomysłów. Na tym etapie pole do popisu ma grafik, który pracuje nad warstwą wizualną strony. Najważniejszym miejscem każdej strony WWW jest strona główna i to ona jest projektowana w pierwszej kolejności. Po wykonaniu projektu graficznego strony głównej następuje jego prezentacja Klientowi.

Klient opiniuje projekt i przekazuje ewentualne uwagi dotyczące sugerowanych zmian do wdrożenia. Wskazuje, nad którymi elementami należy jeszcze popracować. Zmiany wdrażane są na zasadzie "projekt - poprawki - prezentacja". Taką formę nazywamy sesją lub turą poprawek. W ten sposób szlifujemy projekt do uzyskania satysfakcjonującego efektu. Po akceptacji strony głównej grafik projektuje i szlifuje układy pozostałych podstron, aż do zamknięcia całej warstwy wizualnej projektu.

Etap 6. Kodowanie strony www

Im większa budowla, tym trwalsze powinny być fundamenty. W przypadku budowania stron za fasadę odpowiedzialny jest grafik, ale to programista "wylewa" fundamenty. Kod, to coś, czego nie widać na pierwszy rzut oka. Odpowiednio napisany kod sprawi, że strona internetowa będzie szybka w obsłudze i poprawnie interpretowana przez przeglądarki internetowe.

Programowanie strony to etap często dużo bardziej czasochłonny niż jej projektowanie. Nie ma co się dziwić. Każdy kolor, krój czcionki czy animacja, składają się z linijek kodu, które należy napisać. Jak wiele kodu posiada pojedyncza strona WWW, można się przekonać klikając w przeglądarce CTRL+U. Podejrzymy wtedy kod danej podstrony, którą aktualnie przeglądamy. 

Etap 7. Testy i poprawki strony

Błędy zawsze się zdarzają. Jest to w końcu oprogramowanie szyte na miarę. Wystarczy literówka w kodzie, aby funkcja nie działała zgodnie z założeniem. Każda strona internetowa przed wdrożeniem zostaje odpowiednio przetestowana. Odpowiada za to cały zespół. Grafik zauważy błędy w wyrównaniu, programista błędy w walidacji kodu, a menadżer projektu wyłapie błędy ortograficzne w tekście. Im więcej osób przetestuje stronę internetową, tym większa szansa na wyłapanie błędów różnego rodzaju.

Etap 8. Instalacja strony www

proces-tworzenia-strony-www

Nasz garnitur jest już gotowy. Ostatnim krokiem do tego, aby nasz projekt zobaczył cały świat, jest instalacja. Na tym etapie witryna umieszczana jest na docelowym serwerze. Po opublikowaniu jest ona także zgłaszana do wyszukiwarki internetowej. Często również do pracy zabierają się pozycjonerzy, których zadaniem jest skuteczne i trwałe wypromowanie strony WWW. Uruchamiane są kampanie linków sponsorowanych Google Ads. Wszystko po to, aby nasz projekt trafił do jak największej liczby odbiorców.

Bardzo ważna jest też skonfigurowanie strony z takimi narzędziami jak Google Tag Manager czy Google Analytics, które pozwala monitorować ruch na stronie. Dzięki temu będziemy również w stanie określić efektowność poszczególnych działań marketingowych.

Etap 9. Szkolenia i pomoc techniczna

Są to opcjonalne usługi. Wiele agencji interaktywnych, po zakończeniu projektu, obejmuje swoich Klientów wsparciem technicznym i ochroną gwarancyjną. Jeżeli coś zacznie działać inaczej niż to było założone, należy zdiagnozować przyczynę i ją wyeliminować.

Długość gwarancji i pomocy technicznej jest różny. Agencja interaktywna Avangardo udziela aż 2 lat wsparcia w cenie każdego projektu. Jest to wystarczający okres do tego, aby w toku eksploatacji strony, znaleźć wszystkie jej mankamenty. W końcu dobry garnitur świadczy nie tylko o osobie, która go nosi, ale też o osobie, która go uszyła...