Niezależnie od tego czy planujesz zlecić wykonanie strony, czy próbujesz własnych sił na polu webdesignu potrzebujesz konkretnej listy zadań, która pomoże uporządkować rzeczy do zrobienia. Jeżeli jest to Twoja pierwsza witryna musisz zadać sobie wiele pytań i sprecyzować swoje potrzeby i wymagania. A więc od czego zacząć? Najlepiej od tego co ma reprezentować dana strona. Czy ma być to prosta strona firmowa, sklep internetowy, portal ogłoszeniowy czy może strona afiliacyjna? Na początku skupimy się na prostej stronie firmowej. Będziemy opierać się na przykładzie fryzjera z Poznania.
Co potrzeba do zbudowania strony internetowej?
Pierwsze i najważniejsze rzeczy, których potrzebujesz do postawienia strony to domena i hosting. Domena to adres URL naszej strony, czyli nazwa, pod którą będzie widniała Twoja witryna. Możesz ją wykupić na kilku stronach takich jak https://www.nazwa.pl/ czy https://pl.godaddy.com/. Hosting to z kolei miejsce na serwerze, czyli na dostosowanym, sprawie chodzącym przez całą dobę komputerze. Dzięki dobrze skonfigurowanemu serwerowi, strona działa szybko i poprawnie na wszelkich urządzeniach od komputerów przez smartfony. Hosting również możemy wykupić na różnego rodzaju serwisach. Znajdziecie również szeroki przekrój serwerów w naszym sklepie internetowym. W kolejnych artykułach opiszę dokładnie jaki hosting wybrać pod dany rodzaj strony.
Wielojęzykowa strona www
Jeżeli planujemy stworzenie strony w wielu językach najlepiej ustalić to na samym początku. W zależności od technologii w jakiej tworzymy stronę mamy różne możliwości tworzenia wersji językowych. W przypadku WordPress Divi mamy dwie opcje. Opcja pierwsza tworzymy kopię strony na osobnej domenie z odpowiednią końcówką (wersja angielska www.nazwastrony.com itd.). Wiąże się to z pewnymi kosztami rocznymi takimi jak kolejny hosting i dzierżawa domeny, ale jest to stosunkowo prosta droga.
Drugą opcją jest wtyczka. WordPress ma to do siebie, że szybko się rozwija. Powstaje coraz to więcej wtyczek, które ułatwiają tłumaczenie. Tutaj opis jednej z wtyczek działających bardzo dobrze z Divi https://wpml.org/documentation/theme-compatibility/divi-builder/ Są to oczywiście dodatkowe koszty, ale ta opcja ogranicza dodatkowe koszty hostingu i jakiś ewentualnych aktualizacji. Mamy wszystkie wersje na subdomenach, logujemy się do jednego panelu i z niego zarządzamy całością. W przypadku chęci stworzenia wersji językowych trzeba zwrócić uwagę na poprawność językową. Teksty nie powinny być przetłumaczone w Google Translate. Warto się do tego przyłożyć, gdyż będzie to później owocowało.
Logo na stronę internetową
Technologia WordPress Divi, w której tworzę podaję, że rozmiar powinien wynosić 93×43 px lub być w podobnych proporcjach. Jeżeli nie posiadasz jeszcze logo to dobrze. Stworzenie logo możesz zlecić lub podjąć się tego samodzielnie. Ważne aby było PROSTE i czytelne. Pamiętaj, że będzie się ono wyświetlać na urządzeniach mobilnych i musi być naprawdę przemyślane, aby nie ginęło w tle. Zwróć również uwagę na kolorystykę. Kolory z logo powinny być wykorzystane na całej stronie. Zdecyduj się na max, dwa kolory. Staraj się nie wybierać ikon i piktogramów. Tekst z elementem graficznym sprawdza się najlepiej w internecie. Przykład logo:
Nie jest to logo fryzjera, ale blisko salonu piękności. Stawiamy na czerń i złoto. Wygląda to bardzo elegancko i jest czysto.
Kolorystyka strony internetowej
Tak jak już wspomniałam kolorystyka powinna być zaciągnięta z logo. Daje to efekt spójności firmy i wygląda po prostu profesjonalnie. Jeżeli tak jak powyżej w logo mamy czerń i złoto możemy dobrać jeszcze jeden w tym przypadku była to biel. Kolory ładnie się dopełniają. Mamy biały na tło, Czarny do przyciemnień zdjęć w tle i złoto do akcentów. Prosto, przejrzyście i czytelnie. To jest bardzo ważne. Pamiętaj, że większość użytkowników online korzysta z telefonów i tabletów. Litery są tam mniejsze i wszystko jest zwężone. Bierz to pod uwagę dobierając kolorystykę pod teksty.
Jakie elementy musi mieć strona internetowa?
Jeżeli jest to strona firmowa musimy pamiętać o niezbędnych elementach takich jak: kontakt ( adres,mapka, telefon, email, formularz kontaktowy itp.), podstrona “o nas” (informacje na temat działalności, wynikach, kadrze itp.), polityka prywatności i cookies (czyli dostosowanie się do wymagań RODO), oferta – czyli opisanie poszczególnych produktów czy usług. Ważne, aby dokładnie przemyśleć jak chcemy podzielić ofertę. Następnie tworzymy unikalną treść, która odpowie na wszelkie pytania użytkownika dotyczące Twoich produktów. Dalej sprecyzuję jak powinna wyglądać dobrze przygotowana treść na stronę.
To teraz na przykładzie wymienionego wyżej fryzjera. Prowadzimy zakład w centrum Poznania, planujemy stworzyć stronę internetową, która będzie wyglądać estetycznie, ale zarazem przyciągnie dużą ilość Klientów z okolicy. Opiszę po kolei jakie materiały zebrać
Co zamieścić na stronie głównej?
Strona główna powinna być zwięzła i przedstawiać wyłącznie najważniejsze i najpopularniejsze usługi z oferty. Powiedzmy, że najbardziej rozchwytywanymi zabiegami są : koloryzacja, strzyżenie oraz zabieg keratynowy. Stawiamy na to, aby nasi potencjalni klienci nie mieli problemu ze znalezieniem informacji do zabiegów, które ich najbardziej interesują.
Na samym początku najprościej postawić na jakiś estetyczny i przejrzysty baner z chwytliwym hasłem. Jest to powszechnie stosowany motyw na stronach i sprawdza się w stu procentach.
Jak wybrać zdjęcie na baner strony internetowej?
Zdjęcie, które będzie wyświetlać się jako pierwsze musi przyciągać uwagę, ale nie może być pstrokate. Najlepiej gdby było to zdjęcie o białym lub ciemnym tle (ważne, żeby było w miarę jednolite). Jeżeli zlecamy stronę często agencję muszą edytować daną grafikę, tak aby był na niej widoczny slogan lub po to, aby nie raziła w oczy. Niestety takie poprawki kosztują, więc lepiej samodzielnie przygotować odpowiednie zdjęcia. Wybierz kilka, około trzech. Mogą zostać one użyte wszystkie do ruchomego slidera lub jedna, która najlepiej sprawdzi się w roli banera.
Jakie wymiary powinna mieć grafika na banerze strony?
Wszystko zależy od tego jak wysoki ma być baner. Moim zdaniem najlepiej kiedy wysokość wynosi około 500-900px. Co do szerokości najlepiej przygotować zdjęcie na 1800px (średnia szerokość monitora laptopa) Takie zdjęcie można odpowiednio dostosować do urządzeń mobilnych.
Jakie hasło dać na slider strony www?
Co do haseł nie ma ograniczeń. Może ponieść nas fantazja. Jednak jeżeli planujemy działać marketingowo to warto przemyśleć tytuł naszej strony. W przypadku naszego przykładu postawiłabym na slider z dwoma banerami. Jeden prezentujący salon (ładne zdjęcie salonu, z Klientami w tle) z hasłem: Salon fryzjerski Poznań (co wpłynie na to, że pod tym hasłem Google łatwiej nas wyszukaj) Na drugim banerze zdjęcie Klientki i jej włosów z tekstem Wyjątkowa koloryzacja włosów. I w tym przypadku tytuł ma podobne zadanie jak w pierwszym.
Co dalej? Dalej można zdecydować się na dwie opcje. Oferta lub krótki wstęp do podstrony o nas. Jeżeli decydujemy się na Landing Page (czyli wszystkie informacje na jednej podstronie) najpierw lepiej przedstawić nasze usługi. Opisujemy naszą koloryzację, strzyżenie i zabiegi pielęgnacyjne za włosy. Następnie informacje o firmie. Krótki tekst, działalność, można postawić na jakiś licznik. Np. 890 obsłużonych Klientów, 1600 wykonanych zabiegów, 6 lat doświadczenia. Wygląda to naprawdę fajnie, jest dynamiczne i robi dodatkowe “wow”. Częstym motywem w tym miejscu jest również “Kadra” czyli przedstawienie swoich pracowników lub samego siebie. Bardzo ważne w tych czasach jest budowanie zaufania. Pozytywne przedstawienie swojego wizerunku zmienia postrzeganie firmy.
Pamiętajcie, że opisuje stworzenie naprawdę najprostszej strony firmowej. W bardziej rozbudowanych stronach możemy puścić wodze fantazji, ale do tego trzeba mieć spore doświadczenie lub budżet.
Galeria zdjęć na stronie głównej
Osobiście jestem przeciwniczką. Jeżeli stawiamy stronę sami to tym bardziej odradzam. Niezoptymalizowane i nieskompresowane zdjęcia zamulają otwieranie witryny, a co za tym idzie tracimy klienta. W internecie znajdziesz wiele narzędzi, które ułatwią to zadanie.Takie jak:
Jeśli jednak posiadasz większość ilość zdjęć proponuję utworzyć osobną podstronę. Zdjęcia i tak trzeba odpowiednio obrobić, ale nie będą nam spowalniać naszej strony startowej.
Poszczególne moduły powinny być przemyślane. Możemy stosować wiele opcji takich jak liczniki, zdjęcia, cytaty, video, ikony, przyciski, opinie, cenniki i wiele, wiele innych. Warto przejrzeć strony konkurencji i zobaczyć jak wyglądają ich strony, na co stawiają. Zastanów się co ma reprezentować strona startowa. Jakiego efektu się spodziewasz i co chcesz przekazać użytkownikowi
Jakie podstrony powinna mieć strona firmowa?
Tak jak już wspomniałam koniecznie strona o nas, kontakt, najlepiej dedykowane podstrony opisujące poszczególne zabiegi. Czyli wspominamy na stronie głównej o koloryzacji włosów i przenosimy użytkownika do podstrony, która opisuje dokładnie jak wygląda zabieg, ile kosztuje, jak długo trwa itd. Dobrze sprawdzają się podstrony z realizacjami opiniami. Od maja 2018 obowiązkowa jest Polityka prywatności i cookies. Są to wymagania RODO, także warto się z tym zapoznać. Jeżeli planujemy działać online to załóżmy również bloga. Tutaj można tworzyć teksty eksperckie, budujące wiarygodność i zaufanie. W przypadku takiej podstawowej strony nie potrzebujemy nic więcej.
Co na podstronie o nas?
Baner przedstawiający firmę, budynek czy pracowników. Tworzymy przyjazny tekst opisujący naszą filozofię, działania, osiągnięcia i historię. Możemy tu zamieścić wiele elementów między innymi licznik, o którym wspominałam wyżej, wszelkie certyfikaty, nagrody czy medale. Następnie budowanie wizerunku i wiarygodności. Można zdecydować się na zdjęcia pracowników, opisując ich doświadczenie czy stanowiska i zadania. Warto opisać też coś co wyróżnia Twoją firmę. Np. ekologiczne podejście, innowacyjne produkty, zdalny model pracy. Jeżeli udzielasz się na jakiś targach lub innych imprezach również warto o tym wspomnieć i zamieścić zdjęcia lub przekierowanie do social mediów.
Co zamieścić na podstronie oferty?
Jestem za tym, aby tworzyć dedykowane podstrony pod daną usługę lub produkt. Jeżeli jednak masz ograniczony budżet wybierz jedną lub dwie najważniejsze i najbardziej rentowne usługi. Taka dedykowana podstrona powinna odpowiadać na wszystkie pytania potencjalnego Klienta. W dzisiejszych czasach nikt nie chce dzwonić i się dowiadywać co? po ile? gdzie? i jak?. Chcemy dostawać wszystko na talerzu. Dlatego dokładniej na przykładzie. Mamy usługę w postaci koloryzacji włosów. Na baner dajemy zdjęcie tematyczne z naszym tytułem. Następnie zastanawiamy się nad nagłówkami. Jakie hasło ma ściągać Klienta – Profesjonalne koloryzacje włosów. Opisujemy pokrótce na jakich produktach pracujemy, dlaczego ta forma jest lepsza od innych, jakie mamy doświadczenie, gdzie się szkolimy itp. Następnie warto dać zdjęcia realizacji z opisem. Taki study case, w którym pokazujemy, że jesteśmy ekspertami w danej dziedzinie i wiemy co robimy. Tym samym znowu budujemy to zaufanie. Bardzo popularnym elementem jest FAQ, czyli najczęstsze pytania klientów. Na naszym przykładzie mogą to być pytania takie jak:
- Jaki szampon używać po koloryzacji?
- Jak pielęgnować włosy po koloryzacji?
- Czy koloryzacja niszczy włosy?
Takich pytań możemy wymyślić naprawdę mnóstwo. Na końcu podajemy zakres cenowy lub przekierowanie do sklepu czy formularza wyceny.
Podstrona kontaktu
Podstrona kontaktu to najprostsza do przygotowania strona. Co do materiałów to potrzebujemy danych takich jak adres siedziby (informacji czy znajduje się tam biuro czy jest to adres tylko na stronę), email najlepiej z domeny tj. biuro@nazwastrony.pl , numery telfonu do poszczególnych osób czy działów oraz opcjonalnie NIP czy REGON. Cżęsto stosuje się formularz kontaktowy. Taki formularz musi zawierać pola: Imię i Nazwisko, Adres email, treść wiadomości oraz odpowiednie zgody (o czym jeszcze poniżej). Warto również zamieścić mapkę. Polecam założenie konta Google Biznes, jest to ważny element przy zdobywaniu klientów z okolicy.
Polityka prywatności i cookies na stronie
Od kiedy weszło RODO nasze strony muszę spełniać kilka warunków. Mianowicie, aby strona była bezpieczna – odpowiednio chroniła dane użytkowników, musi posiadać certyfikat SSL. Co to jest? Jest to sposób szyfrowania niewidoczny dla użytkownika. Skąd możemy wiedzieć czy mamy certyfikat SSL? W okienku URL przeglądarki po lewej stronie widać zamkniętą kłódkę to właśnie oznacza, że strona jest Bezpieczna, czyli posiada certyfikat. Niektóre przeglądarki pokazują komunikat, że strona jest niebezpieczna to wskazuje na brak SSL. A więc co dalej z tym RODO na stronie? Każda strona powinna posiadać informacje o ciasteczkach, najlepiej z przekierowaniem do podstrony polityki prywatności. Taka podstrona powinna mieć odpowiednio przygotowany tekst z informacjami o Administarze danych i kontakcie do niego oraz dane firmy. Jeżeli stosujemy formularz kontaktowy czy newsletter powinniśmy posiadać odpowiednie zgody pod nimi. Są to tak zwane checkboxy, które zaznaczamy ptaszkiem. Co do serwisów i sklepów internetowych wprowadza się jeszcze więcej dostosowań, takich jak możliwości usunięcia danych itp. Nie musicie się o to martwić wiele agencji oferuje wdrożenie RODO na stronie internetowej.
W jakiej formie przygotować materiały do strony?
Wszelkie loga i grafiki bez tła, na tak zwanej przezroczystości w wersji PNG.
Zdjęcia na banery w dobrej jakości i rozmiarze (do 1 MB) w wersji JPEG.
Wszystkie zdjęcia z odpowiednią nazwą, aby było wiadomo gdzie mają się znajdować.
Tabelki, cenniki w osobnych plikach exel.
Teksty w pliku doc z odpowiednimi podpisami co na jaką podstronę.
