Etapy projektowania

   Projektując stronę www często zdarza się, że projekt trwa znacznie dłużej niż przewidywano. Da się tego uniknąć dzięki dokładnemu planowaniu. Planowanie serwisu to zbiór czynności, które mają na celu ułatwić i przyspieszyć jego budowę. Im dłuższy i dokładniejszy jest proces planowania, tym łatwiej i szybciej następują po sobie dalsze części projektu. W tym przypadku mało ważna jest skala projektu, nie jest istotne, czy jest nią wysoko budżetowy serwis korporacyjny, czy też prywatna strona malarza domowego.
   Projektowanie strony internetowej powinno przebiegać według następujących punktów:

• definiowanie celów
• definiowanie grupy docelowej
• projekt zawartości strony
• określenie struktury strony
• projektowanie wizualne

Cele
Definiowanie celów strony to nic innego jak próba udzielenia odpowiedzi na pytania: jaka jest misja firmy, jaką częścią misji i strategii firmy jest strona internetowa, dlaczego ludzie będą odwiedzać stronę? Ważnym elementem na tym etapie projektowania jest znalezienie sposobu na późniejsze zmierzenie, czy określone cele zostały osiągnięte i w jakim stopniu. Czy będzie to ilość odwiedzin, czy liczba pobranych plików, czy stopień rozpoznania firmy i jej marki w Internecie, czy coś jeszcze.
            Aviator to średniej klasy restauracja, świadcząca usługi gastronomiczne na terenie lubelskiego miasteczka akademickiego.
Celem projektu strony Aviatora, jest głównie chęć zaistnienia firmy w Internecie, a co za tym idzie promowanie restauracji w celu zwiększenia ilości klientów. Powstała witryna ma być wizytówką firmy zawierającą podstawowe informacje na temat jej działalności, usług, lokalizacji czy też danych kontaktowych. Zaistnienie firmy w Internecie umożliwi jej klientom łatwy dostęp do bieżących informacji. Wygląd strony ma na celu zachęcenie użytkownika do odwiedzenia lokalu.
Grupa docelowa
            Tworzenie strony internetowej bez wiedzy na temat jej przyszłych użytkowników jest procesem niekompletnym i często może prowadzić do niepowodzenia projektu. Nie można wprowadzić na rynek żadnego produktu, jeśli nie wie się, kto ten produkt kupi. Dlatego też chociażby ogólne określenie grupy przyszłych odbiorców jest bardzo istotne.
Klientami Aviatora są głównie studenci oraz aktorzy i muzycy pracujący w pobliskim teatrze. Można więc z powodzeniem uznać, iż użytkownikami odwiedzającymi stronę Aviatora będą głównie osoby młode oraz w średnim wieku.
Zawartość
  Najważniejszym elementem etapu projektowego jest odpowiedź na dwa podstawowe pytania: jakiego rodzaju informacje będzie zawierała strona oraz jaki będzie jej schemat funkcjonalny.
Strona Aviatora ma zawierać informacje na temat działalności, usług, oferty, danych kontaktowych oraz lokalizacji firmy. Przedstawienie powyższych informacji będzie realizowane za pomocą prostych komunikatów tekstowych, fotografii, grafik. Wszystkie elementy stanowiące zawartość strony będą w funkcjonalny i przejrzysty sposób przekazywać informacje. Zdjęcia w zależności od potrzeby będą odpowiednio opisane i scharakteryzowane w celu uniknięcia wprowadzenia w błąd użytkownika.˛
Struktura
Struktura strony to szkielet, na którym oparte są wszystkie pozostałe elementy. Bez niego często jest niezorganizowana, nieczytelna, skomplikowana i nieprzemyślana. Na tym etapie projektowania strony określa się system nawigacyjny. Warto zdefiniować całość systemu nawigacyjnego - tzn. w jaki sposób użytkownik będzie się poruszał po stronie. Jakie dokumenty będą dostępne z poziomu strony głównej, a które po "pierwszym kliknięciu". Projektując nawigację strony, powinno się zacząć od układu globalnego.
   System nawigacyjny strony Aviatora dostępny będzie na stronie głównej witryny. Zawierać będzie dostęp do kilku pod stron takich jak:

• „Restauracja” - zawierającą krótki opis charakterystyki restauracji oraz kilka zdjęć i grafik;
• „Oferta” – zawiera listę usług stanowiących ofertę firmy;
•  „Rezerwacje” – zawiera formularz umożliwiający dokonanie wcześniejszych rezerwacji stolika w lokalu przez Internet;
• „Kontakt” – zawiera informacje na temat lokalizacji (adres, mapka) oraz telefonu adresu email;

Cztery powyższe elementy nawigacji stanowić będą układ globalny strony.
Jednym z głównych  zadań nawigacji jest próba dostarczenia użytkownikowi wiedzy na temat obecnego miejsca przebywania w strukturze strony. Użytkownik zawsze powinien umieć odpowiedzieć na następujące pytania:
- gdzie jestem?
- dokąd mogę się udać ?
- jak mogę się tam dostać?
- w jaki sposób mogę wrócić tam, skąd tutaj przyszedłem ?
   Użytkownik powinien więc po prostu umieć określić, w jakim jest dziale strony, jaki ogląda dokument, gdzie był przed chwilą i jak się dostał w to miejsce, w którym teraz jest.
Pierwszym elementem, który powinien powstać na tym etapie, jest szablon strony. Powinno się w nim znaleźć miejsce na globalny układ nawigacyjny i lokalną nawigację. Teraz trzeba połączyć to wszystko z pozostałymi elementami strony, takimi jak np. logo firmy. Ten etap projektuje się zazwyczaj nie na ekranie monitora, ale posługując się kartką i ołówkiem. Taki sposób projektowania jest dużo efektywniejszy i łatwiej można dokonać poprawek na bieżąco. Gdy już krystalizuje się koncepcja graficzna szablonu, dopiero wtedy przystępuje się do tworzenia cyfrowego projektu graficznego.
               Korzystając z naszkicowania siatki powstałej przy zastosowaniu reguły trójpodziału można rozpocząć układanie elementów strony.

Układ strony Aviator – szkic

   Górny blok projektu stanowi identyfikacja wizualna firmy tzw. logo, jest ona umieszczona centralnie. Zaraz pod spodem umieszczony jest globalny układ nawigacji strony. Następnie w głównym bloku strony umieszczone jest duże zdjęcie przedstawiające wnętrze lokalu, natomiast pod spodem część tekstowa. Prawą przestrzeń głównego bloku zajmuje kilka zdjęć przykładowych potraw oferowanych przez restauracje.