Strona www bez tajemnic

1. Strona www bez tajemnic

2. SERWIS WWW • Serwis internetowy jest to: „... informacja zapisana na elektronicznych stronach. Składa się z tekstu, obrazów i grafiki. Jest interaktywny.” „... wirtualne miejsce w Internecie, dostępne za pomocą niepowtarzalnego adresu. Oferuje informacje w postaci tekstowej i graficznej. Daje się przenieść praktycznie na wszystkie dziedziny życia.” „...najlepszy sposób na szybką i efektywną komunikację z klientem” „... miejsce na światowej pajęczynie.” „... najszybszy sposób na dotarcie do potrzebnych informacji”

3. FUNKCJE WITRYNY INTERNETOWEJ • FUNKCJE INFORMACYJNE • FUNKCJE WYSZUKIWAWCZE • FUNKCJE TRANSAKCYJNE • FUNKCJE KOMUNIKACYJNE • FUNKCJE DODATKOWE·        • Dostarczanie informacji o firmie • Opisywanie produktu lub usługi • Publikowanie najnowszych wiadomości • Przeszukiwanie bazy danych • Udostępnianie przetworzonych informacji • Składanie zamówień • Prowadzenie sprzedaży • Wspieranie sprzedaży tradycyjnej • Wspieranie działu obsługi klienta • Utrzymywanie stałego kontaktu z dostawcamii dystrybutorami • Przekazywanie informacji i wiedzy • Udostępnianie atrakcyjnych dodatków zwiększających świadomość marki

4. DLACZEGO PROJEKTUJEMY NIEPRAWIDŁOWO? • Model biznesowy, • Architektura informacji – odzwierciedlenie struktury firmy, • Projekt strony, • Tworzenie treści • Strategia odwołań – nie jesteśmy wyspą • Brak umiejętności

5. ETAPY PROJEKTOWANIA Faza analityczno-projektowa Analiza wymagań Ustalenie wymagań Ustalenie zasad pracy Projekt nawigacji Projekt funkcjonalny Plan realizacji Wdrożenie i testy Utrzymanie Realizacja Aktualizacja Promocja

6. ANALIZA WYMAGAŃ • Co chcemy wykonać i dlaczego? • Jaki jest cel pracy? • Kto będzie tego używał? • Czego klient nie lubi, a co lubi na stronach WWW? • Jak będziemy mierzyć sukces? • O czym chcemy poinformować naszego gościa, • Jak chcemy aby nasz gość zachowywał się podczas pobytu na stronie, • W jaki sposób zachęcimy gościa do dłuższych i częstszych wizyt na naszych stronach, • Gdzie chcemy dalej skierować naszego gościa.

7. REALIZACJA/TESTOWANIE/WDROŻENIE REALIZACJA • Integracja systemu z zakładanymi platformami programowymi i sprzętowymi • Zarządzanie zasobami ludzkimi i kontrolowanie procesu implementacji • Budowanie i testowanie komponentów/modułów TESTOWANIE/WDROŻENIE • Testowanie końcowe aplikacji jako spójnej całości w rzeczywistym środowisku pracy • Poprawianie błędów wykrytych podczas wewnętrznych testów i na podstawie uwag zwrotnych odbiorców

8. TECHNOLOGIE • Statyczne: HTML • Dynamiczne: PHP, ASP, ASP.NET, CGI • Dodatkowe: DHTML, Javascript, Ajax, Java, Flash

9. NIEZBĘDNE NARZĘDZIA SERWERY WWW • Apache Web Server(65% wszystkich stron internetowych na świecie) • Internet Information Server(15%) • ngix • lighttpd • Xitami Web Server

10. NIEZBĘDNE NARZĘDZIA EDYTORY HTML WYSIWYG, tekstowe AdobeDreamweaver Microsoft Office SharePoint Designer Microsoft Expression Web CoreEditor Pajączek NxG

11. NIEZBĘDNE NARZĘDZIA PROGRAMY GRAFICZNE/NARZĘDZIOWE • Adobe Photoshop • Adobe Flash • Adobe Fireworks • PaintShopPro • Adobe Illustrator • Corel Photo-Paint • GIMP

14. STRUKTURA STRONYSEKWENCYJNA

15. STRUKTURA STRONYHIERARCHICZNA

16. STRUKTURA STRONYSIECIOWA

17. UWAGA! ZŁA STRONA ZOBACZ

18. ROZWÓJ W CZASIE, AKTUALIZACJA

19. ROZWÓJ W CZASIE, AKTUALIZACJA

20. TYPY STRONPORTAL • Bardzo rozbudowana sieć połączeń • Użytkownicy o zróżnicowanych zainteresowaniach

21. TYPY STRONSZKOLENIOWA • Typowy przykład struktury liniowej • Uproszczona do minimum nawigacja

22. TYPY STRONINFORMACJE/WIADOMOŚCI • Odbiorcy o mniej sprecyzowanych zainteresowaniach • Przewaga form graficznych

23. TYPY STRONECOMMERCE • Dopracowana do perfekcji nawigacja • Elementy graficzne używane raczej oszczędnie • Sprawna wyszukiwarka

24. PERFEKCYJNA WYSZUKIWARKA ?

25. PERFEKCYJNA WYSZUKIWARKA ?

26. ELEMENTY STRONYWSTĘP - SPLASH SCREEN • Czasami przed stroną główną pojawia się dodatkowa podstrona z animowanym wprowadzeniem (z reguły zaprojektowanym we Flashu), tzw. intro. • Powinna zachęcić (?) internautę do odwiedzenia strony, wprowadzić do jej treści lub zbudować odpowiedni klimat. • Potrzebne np. przy niektórych witrynach wielkich korporacji, gdzie konieczny jest wybór kraju czy oddziału. • Jeżeli nasza wejściówka jest zwykłą animacją, pamiętajmy o dodaniu przycisku pozwalającego na jej pominięcie. PRZYKŁAD

27. ELEMENTY STRONYHOMEPAGE – STRONA GŁÓWNA • wyjaśnianie, czym zajmuje się serwis WWW i dlaczego warto właśnie jemu poświęcić czas, • dawanie łatwego dostępu do wszystkich części serwisu i podkreślanie tych, które są najważniejsze, • zachęcanie do głębszego zainteresowania się treścią witryny. PRZYKŁAD

28. ELEMENTY STRONYNAWIGACJA • Bardzo ważny element serwisu Gdzie jestem ? Gdzie byłem ? Dokąd mogę pójść ? PRZYKŁAD (zły)

30. ELEMENTY STRONYO NAS • Nie jest to konieczność (choć są wyjątki, np. sklepy internetowe), • Informacje o firmie • wyjaśnienie, iż nie jesteśmy kolejnym bezdusznym sieciowym interesem, • podkreślenie mocnych stron, • wzbudzenie zaufania klientów.

31. ELEMENTY STRONYWYSZUKIWARKA • Indeksowanie zasobów witryny • Dobra wyszukiwarka powinna zrzucać z barków odwiedzającego wszystkie niepotrzebne obowiązki: • poprawiać błędy ortograficzne i gramatyczne w szukanych ciągach znaków, • nie gubić się bez polskich literek (lub – co gorsza – w ich obecności), • nie narzucać obowiązku wybierania dziesiątków niejasnych opcji, • zawsze zwracać te najbardziej odpowiednie rezultaty. Zadaniem użytkownika ma być tylko wpisanie w dobrze widoczne pole paru słów i wciśnięcie jedynego przycisku.

32. ELEMENTY STRONYKONTAKT • Nie uciekajmy przed umieszczaniem na naszych stronach informacji o tym, jak się z nami skontaktować. Uwagi odwiedzających mogą się okazać bezcenne, a i oni będą się czuli docenieni, kiedy ktoś przeczyta i odpowie na nie (w końcu internauci bardzo rzadko piszą bezinteresownie do twórców stron). • Adres email + formularz wysyłkowy

34. ELEMENTY STRONYCO NOWEGO? • W porównaniu do mediów tradycyjnych sieć WWW jest medium bardzo zmiennym • Odwiedzając daną witrynę po raz kolejny internauta może się spodziewać wszystkiego – całkiem zmienionego wyglądu, nowych artykułów, drobnych ulepszeń lub... dokładnie tej samej zawartości, co poprzednio. • Mając to na uwadze, postarajmy się, aby na stronie umieszczać: • czas jej ostatniego uaktualnienia (wystarczy sama data; chyba, że zmieniamy treść kilka razy dziennie); idealnie byłoby, gdyby tego typu informacje pojawiały się także na każdej podstronie, • dokładną listę naniesionych zmian. • nie piszmy jedynie co się zmieniło, umieszczajmy od razu odnośniki do zmienionych podstron! Jakże irytująca jest informacja „na naszej stronie pojawił się nowy konkurs”, jeżeli nie wiadomo, gdzie tego konkursu szukać...

35. ELEMENTY STRONYANKIETA • Bardziej doceniony użytkownik będzie częściej wracał na nasze strony • Łatwo można przemycić informacje dotyczące naszej firmy • Wyniki (nawet niepełne) powinny być ogólnodostępne

36. ELEMENTY STRONYANKIETA

37. ELEMENTY STRONYSTRONA BŁĘDU Poprawia wizerunek firmy Umożliwia pokierowanie użytkownikiem w momencie kiedy serwis zadziałał nieprawidłowo, bądź użytkownik popełnił błąd

38. ELEMENTY STRONYSTRONA BŁĘDU

39. ELEMENTY STRONYMAPA SERWISU • Czy książka bez spisu treści ma prawo bytu? • Lista wszystkich (lub najważniejszych) podstron • pozwala na łatwe rozpoznanie jakie ogólnie treści zawiera serwis oraz w razie potrzeby skieruje odwiedzającego w konkretne miejsce • może ona pomóc internautom chcącym szybko znaleźć pożądaną informację • będzie nieocenioną pomocą dla osób, które na naszej witrynie po prostu się... zgubiły

40. ELEMENTY STRONYMAPA SERWISU

41. ELEMENTY STRONYMAPA SERWISU

42. UWAGA! ZŁA STRONA

43. PROJEKTOWANIE SERWISUHIERARCHIA Wizualne skanowanie struktury strony Wstępne Dokładniejsze Rozpoczęcie czytania

44. PROJEKTOWANIE SERWISUHIERARCHIA Prosta, bez przykuwających uwagę punktów, bez struktury graficznej Lepsza struktura wizualna, kontrast, punkty przykuwające uwagę.

46. PROJEKTOWANIE SERWISUZAWARTOŚĆ • Szablonowa budowa serwisu • Używanie tych samych elementów na każdej z podstron serwisu

47. PROJEKTOWANIE SERWISUROZMIAR STRONY Źródło: gemiusRanking, styczeń 2012

48. PROJEKTOWANIE SERWISUROZMIAR STRONY 800x600