Strona kontaktowa: dane, mapa, godziny pracy i formularz w jednym miejscu

Czego klienci szukają na stronie kontaktowej

Klienci szukają na stronie kontaktowej czterech rzeczy: numeru telefonu, adresu z dojazdem, godzin pracy oraz sposobu na wysłanie wiadomości. To obserwacja z naszej praktyki: zakładka kontaktowa należy zwykle do najczęściej odwiedzanych podstron firmowych, a wizyty na niej są krótkie, bo użytkownik przychodzi po jedną konkretną informację.

Na tę podstronę trafiają osoby na bardzo różnym etapie. Ktoś stoi już pod budynkiem i szuka numeru, żeby zapytać o wejście. Ktoś inny porównuje trzy firmy i chce się upewnić, że pod adresem ze stopki faktycznie działa biuro. Księgowa kontrahenta potrzebuje numeru NIP do faktury. Dobra strona kontaktowa obsługuje wszystkie te sytuacje bez zmuszania kogokolwiek do czytania całości.

Kolejność informacji ma znaczenie

Najwyżej powinny znaleźć się dane, po które przychodzi najwięcej osób, czyli telefon, adres i godziny. Formularz, mapa i dane rejestrowe mogą znajdować się niżej. Na telefonie komórkowym układ dwóch kolumn z komputera zamienia się w jedną długą kolumnę. Jeśli na jej początku stoi duże zdjęcie biura i akapit powitalny, numer telefonu ląduje dopiero po kilku przewinięciach. Dlatego przy projektowaniu tej podstrony zaczynamy od wersji mobilnej, a o zależności między wygodą a widocznością piszemy szerzej we wpisie o tym, jak wygoda użytkownika przekłada się na widoczność i sprzedaż.

Hydraulik z Łodzi, który przyjmuje zgłoszenia awarii, powinien mieć na samej górze duży numer telefonu i informację o godzinach przyjmowania zgłoszeń. Kancelaria z Krakowa, do której klienci przychodzą na umówione spotkania, pokaże najpierw adres, piętro, wejście i sposób umawiania terminu. Sklep z Poznania z punktem odbioru zamówień zacznie od godzin wydawania paczek. Zestaw danych jest podobny, ale kolejność wynika z tego, o co klienci pytają najczęściej.

Dane podstawowe: nazwa, adres, telefon i adres e-mail

Podstawą strony kontaktowej jest blok z pełną nazwą firmy, adresem pocztowym, numerem telefonu i adresem e-mail, zapisany zwykłym tekstem. Tekst da się skopiować, przeczytać czytnikiem ekranu i odczytać robotom wyszukiwarek. Dane umieszczone wyłącznie na grafice, na przykład na zdjęciu wizytówki, tych zalet nie mają.

Adres warto podać w takiej postaci, w jakiej wpisuje się go na kopercie: ulica i numer, numer lokalu, kod pocztowy, miejscowość. Jeśli budynek ma kilka wejść albo biuro mieści się na wyższym piętrze, dobrze dopisać jedno zdanie o wejściu, piętrze i domofonie.

Klikalny telefon i klikalny e-mail

Numer telefonu staje się klikalny, gdy link prowadzi do adresu zaczynającego się od tel:, a adres e-mail, gdy link zaczyna się od mailto:. Dokumentacja elementu a w serwisie MDN wyjaśnia, że zachowanie linku tel: zależy od urządzenia: telefon komórkowy wybiera numer, a na komputerze system może otworzyć program do rozmów, zapisać numer w kontaktach lub przesłać go na inne urządzenie. Link mailto: otwiera program pocztowy użytkownika z nową wiadomością.

<p>Telefon: <a href="tel:+48123456789">12 345 67 89</a></p>
<p>E-mail: <a href="mailto:kontakt@przyklad.pl">kontakt@przyklad.pl</a></p>

W atrybucie href numer zapisuje się bez spacji i z prefiksem kraju, natomiast w widocznym tekście warto zostawić odstępy, bo tak łatwiej go przeczytać i przepisać. Widocznym tekstem linku powinien być sam numer lub sam adres, a nie ogólne sformułowanie albo sama ikona. Nie każdy użytkownik komputera ma skonfigurowany program pocztowy, więc adres e-mail musi być widoczny w całości i możliwy do zaznaczenia.

Ten sam blok danych powinien powtarzać się w stopce serwisu w identycznym brzmieniu. Różnice między stopką a stroną kontaktową, na przykład stary numer telefonu w stopce, należą do najczęstszych usterek, jakie znajdujemy przy przeglądach serwisów.

Godziny pracy, mapa i dojazd

Godziny pracy należy podać dla każdego dnia tygodnia, razem z dniami, w których firma jest zamknięta, a mapę uzupełnić opisem dojazdu słowami. Klient, który widzi wyłącznie godziny od poniedziałku do piątku, nie wie, czy w sobotę lokal jest nieczynny, czy tylko zapomniano o tym napisać.

Jeśli różne części firmy pracują w innych godzinach, warto je rozdzielić: osobno biuro obsługi, osobno serwis, osobno infolinia. Firmy przyjmujące wyłącznie po wcześniejszym umówieniu powinny napisać to wprost i od razu wskazać, jak ustalić termin. Przy świętach i przerwach urlopowych wystarcza krótka, widoczna informacja nad stałymi godzinami, którą po powrocie do normalnego trybu trzeba usunąć.

Mapa na stronie kontaktowej

Mapę Google można umieścić na stronie bez programowania. Zgodnie z pomocą Map Google na komputerze należy otworzyć Mapy Google, przejść do właściwego miejsca, otworzyć menu w lewym górnym rogu, przejść do opcji udostępniania lub umieszczania mapy, a następnie w zakładce „Umieszczanie mapy” skopiować gotowy kod HTML. Drugą drogą jest interfejs Maps Embed API. Jego dokumentacja opisuje go jako sposób na umieszczenie interaktywnej mapy za pomocą ramki iframe, bez kodu JavaScript, a żądania kierowane do tego interfejsu są według niej obsługiwane bez opłat i bez limitu.

Przykład w tej dokumentacji zawiera atrybut loading="lazy", czyli odroczone wczytywanie ramki. Mapa umieszczona pod blokiem danych i formularzem jest dobrym kandydatem do takiego ustawienia: osoba, która chce tylko zadzwonić, nie powinna czekać na jej załadowanie.

Opis dojazdu słowami

Mapa nie zastąpi dwóch, trzech zdań opisu. Pinezka pokazuje budynek, ale nie powie, że wejście jest od podwórza, że biuro mieści się na drugim piętrze nad apteką ani że najbliższy parking znajduje się po drugiej stronie ulicy. Warto opisać dojazd samochodem i komunikacją miejską, miejsce do parkowania, wejście dla osób z niepełnosprawnością ruchową oraz punkt orientacyjny widoczny z ulicy. Pod mapą przydaje się też zwykły link tekstowy otwierający trasę w Mapach Google, bo małą mapę w ramce trudno obsługiwać palcem na telefonie.

Dane rejestrowe i informacje wymagane prawem

Na stronie kontaktowej powinny znaleźć się dane pozwalające jednoznacznie zidentyfikować przedsiębiorcę: pełna nazwa, adres siedziby, dane kontaktowe z adresem e-mail, informacja o rejestrze wraz z numerem wpisu oraz numer identyfikacji podatkowej. Taki zakres wynika z unijnej dyrektywy o handlu elektronicznym, której artykuł piąty wymaga, aby usługodawca zapewniał łatwy, bezpośredni i stały dostęp co najmniej do tych informacji.

Ten sam przepis wymienia dodatkowe dane dla działalności wymagającej zezwoleń, czyli wskazanie właściwego organu nadzorczego, oraz dla zawodów regulowanych: organizację zawodową, tytuł zawodowy i odniesienie do zasad wykonywania zawodu. Dyrektywa jest wdrażana przepisami krajowymi, a polskie ustawy nakładają na poszczególne formy prawne, zwłaszcza na spółki, własne, bardziej szczegółowe obowiązki. Opisujemy tu wyłącznie ogólną zasadę. Dokładną listę danych dla Państwa formy działalności i branży warto potwierdzić z prawnikiem lub biurem rachunkowym.

W praktyce dane rejestrowe umieszcza się w osobnym, spokojnym bloku pod danymi kontaktowymi, zatytułowanym na przykład „Dane firmy”. Na górze strony stoi zwykle marka, pod którą znają firmę klienci, a w tym bloku pełne oznaczenie przedsiębiorcy z rejestru. Klienci biznesowi szukają tam często także numeru rachunku bankowego oraz adresu do faktur, jeśli jest inny niż adres biura. Liczby warto zapisać tekstem, tak aby dało się je skopiować bez przepisywania.

Formularz kontaktowy na stronie kontaktowej

Formularz powinien być krótki, czytelnie opisany i umieszczony obok danych kontaktowych, a nie zamiast nich. Część osób woli napisać wieczorem, gdy biuro jest zamknięte, i dla nich formularz jest wygodniejszy niż otwieranie programu pocztowego. Inni nie ufają formularzom, bo nie dostają kopii wysłanej wiadomości, i chcą widzieć zwykły adres e-mail.

Każde pole potrzebuje widocznej etykiety. Wytyczne W3C dotyczące etykiet pól zalecają powiązanie elementu label z polem przez atrybut for, którego wartość musi dokładnie odpowiadać identyfikatorowi pola, i podkreślają, że większość użytkowników woli widoczne etykiety lub ich potrzebuje. Zalecenia web.dev dla formularzy, choć opisane na przykładzie logowania, są w naszej ocenie równie trafne dla formularza kontaktowego: tekst podpowiedzi wewnątrz pola nie powinien zastępować etykiety, etykiety najlepiej umieścić nad polami, pole typu email daje na telefonie odpowiednią klawiaturę i podstawową walidację adresu, pole typu tel wywołuje klawiaturę numeryczną, a napis na przycisku powinien mówić, co się stanie po jego użyciu.

Jakie pola i jakie informacje przy formularzu

W większości firm usługowych wystarczają imię, adres e-mail lub telefon oraz treść wiadomości. Każde kolejne pole warto uzasadnić tym, że bez niego nie da się odpowiedzieć. Przemawia za tym także ogólne rozporządzenie o ochronie danych: jego motywy wskazują, że dane powinny być adekwatne, stosowne i ograniczone do tego, co niezbędne do celów przetwarzania, a osoba, od której się je zbiera, ma zostać poinformowana o przetwarzaniu i jego celach oraz o tym, czy podanie danych jest obowiązkowe. Przy formularzu potrzebna jest więc krótka informacja o administratorze i celu z odesłaniem do polityki prywatności. Jej treść najlepiej przygotować z prawnikiem.

Pod formularzem warto napisać, kiedy klient może spodziewać się odpowiedzi, a po wysłaniu pokazać jednoznaczne potwierdzenie. Liczbę pól, komunikaty błędów i przyczyny porzucania formularzy omawiamy osobno we wpisie o tym, ile pól powinien mieć formularz kontaktowy.

Jeśli chcą Państwo zamówić stronę internetową, zachęcamy do kontaktu: tel. 222 500 844 lub mailowo: biuro@pozycjonowaniestron.pl

Kilka kanałów kontaktu: jak je uporządkować

Kanały kontaktu najlepiej uporządkować według sprawy, z którą przychodzi klient, a nie według struktury firmy. Osoba z zewnątrz nie wie, czy reklamację obsługuje dział handlowy, czy serwis. Wie natomiast, że chce zapytać o ofertę, zgłosić usterkę albo wyjaśnić fakturę.

Z naszych obserwacji wynika, że najwięcej kłopotów sprawia lista ośmiu równorzędnych możliwości: dwa numery, trzy adresy e-mail, komunikator, formularz i profile społecznościowe, wszystkie tej samej wielkości. Klient nie wie, którą drogę wybrać, a firma dostaje tę samą sprawę trzema kanałami naraz. Lepiej wskazać jeden kanał główny dla każdego rodzaju sprawy i wyraźnie go wyróżnić, a pozostałe pokazać jako uzupełnienie.

Osobne numery i skrzynki dla działów

Jeśli firma ma kilka działów, każdy kontakt warto podpisać sprawą, a dopiero potem nazwą działu: „Zapytania o wycenę”, „Zgłoszenia serwisowe”, „Faktury i płatności”, „Kontakt dla mediów”, „Rekrutacja”. Sklep z Poznania zyskuje na tym szczególnie: pytania o zwroty trafiają od razu do właściwej osoby, a nie na ogólną skrzynkę. Bezpieczniejsze od adresów imiennych są adresy funkcyjne, przypisane do sprawy, bo nie wymagają poprawiania strony przy każdej zmianie w zespole.

Profile w mediach społecznościowych warto umieścić na końcu, z jasną informacją, czy firma odpowiada tam na wiadomości. Ikona Facebooka lub Instagrama na stronie kontaktowej jest dla klienta zaproszeniem do napisania. Jeśli nikt nie czyta tamtejszej skrzynki, uczciwiej jest nie wymieniać profilu wśród kanałów kontaktu.

Strona kontaktowa firmy z wieloma lokalizacjami

Firma z wieloma lokalizacjami powinna podać dla każdej placówki osobny, kompletny zestaw danych: adres, telefon do tej placówki, godziny, mapę i opis dojazdu. Jedna wspólna infolinia i lista samych adresów to za mało, bo klient z Bydgoszczy chce wiedzieć, o której zamyka się oddział w Bydgoszczy, a nie centrala w innym mieście.

Sprawdza się układ dwupoziomowy. Strona kontaktowa pełni rolę spisu: na górze dane centrali i kontakt ogólny, niżej lista placówek pogrupowana miastami, każda z adresem, telefonem i godzinami. Z każdej pozycji prowadzi link do osobnej podstrony placówki, na której mieszczą się mapa, zdjęcie wejścia, opis dojazdu i zakres usług dostępnych na miejscu. Przy kilkudziesięciu oddziałach przydaje się wyszukiwarka po mieście lub kodzie pocztowym, a listę tekstową warto mimo to zostawić pod nią, aby każda podstrona placówki miała zwykły link.

Podstrona placówki a Profil Firmy w Google

Osobne podstrony placówek mają też uzasadnienie w zasadach Google. Wskazówki dotyczące informacji o firmie w Google zalecają, aby w profilu podawać stronę reprezentującą daną lokalizację oraz numer telefonu, pod którym można skontaktować się z konkretną placówką, w miarę możliwości lokalny zamiast numeru centrum obsługi. Te same wskazówki mówią, że na jedną lokalizację przypada jeden profil, a wszystkie lokalizacje w tym samym kraju powinny mieć tę samą nazwę, chyba że w rzeczywistości działają pod różnymi nazwami.

Wynika z tego prosty porządek: profil oddziału w Łodzi kieruje na podstronę oddziału w Łodzi, a na tej podstronie widnieją dokładnie te same nazwa, adres, telefon i godziny co w profilu. Treść podstron placówek nie powinna być kopią różniącą się jedynie nazwą miasta. Każda placówka ma inny dojazd, inne wejście i często inny zakres usług, i właśnie to warto opisać. Widocznością oddziałów w wynikach lokalnych zajmujemy się w ramach usługi pozycjonowania lokalnego.

Odrębnym przypadkiem są firmy, które dojeżdżają do klienta i nie przyjmują nikogo pod swoim adresem. Wskazówki Google przewidują dla nich jeden profil z wyznaczonym obszarem działania i ukrytym adresem. Na stronie kontaktowej takiej firmy zamiast mapy z pinezką lepiej sprawdza się lista obsługiwanych miejscowości oraz jasna informacja, że usługi są wykonywane u klienta.

Zgodność danych z Profilem Firmy w Google

Dane na stronie kontaktowej i w Profilu Firmy w Google powinny być identyczne co do nazwy, adresu, telefonu, godzin i adresu strony. Google wyjaśnia w artykule o tym, jak pozyskuje informacje o firmach, że korzysta z publicznie dostępnych treści w sieci, w tym z oficjalnej strony firmy, z danych licencjonowanych od innych podmiotów, z informacji przekazywanych przez użytkowników oraz z własnych interakcji z miejscami. Strona kontaktowa jest więc jednym ze źródeł, z którymi wyszukiwarka zestawia dane profilu.

Znaczenie poprawnych danych potwierdza też strona pomocy o poprawianiu pozycji w lokalnych wynikach wyszukiwania. Według niej wyniki lokalne zależą głównie od trafności, odległości i rozpoznawalności firmy, a profil z nieprawidłowymi informacjami może nie wyświetlać się w pasujących do niego wyszukiwaniach. Google zastrzega tam jednocześnie, że wyższej pozycji w wynikach lokalnych nie można zamówić ani kupić.

Gdzie zmienić dane w profilu

Zgodnie z pomocą dotyczącą edytowania profilu firmy po zalogowaniu na konto Google połączone z profilem należy otworzyć profil, użyć przycisku edycji profilu, wprowadzić zmiany i je zapisać. Adres zmienia się w polu „Adres oraz lokalizacja pinezki”, godziny w sekcji „Godziny”, telefon w polu „Numer telefonu”, a stronę w polu „Witryna”, gdzie adres musi być pełny, razem z protokołem. Oprócz numeru głównego można podać najwyżej dwa kolejne. Zmiany są sprawdzane przed publikacją.

Święta i krótkie przerwy obsługuje opcja „Niestandardowe godziny otwarcia” w sekcji godzin. Pomoc Google wskazuje, że służy ona do zmian tymczasowych oraz zamknięć trwających do sześciu dni z rzędu, a przy przerwie siedmiodniowej lub dłuższej zaleca oznaczenie firmy jako tymczasowo zamkniętej. Tę samą informację warto tego samego dnia podać na stronie kontaktowej.

Porządkowanie najlepiej zacząć od spisania jednego wzorca danych dla każdej placówki, a potem przenieść go kolejno na stronę, do stopki, do profilu w Google i do pozostałych wizytówek w sieci. Opisujemy to dokładniej we wpisie o spójności nazwy, adresu i telefonu firmy w sieci, a prace nad samym profilem prowadzimy w ramach pozycjonowania w Mapach Google.

Dane strukturalne na stronie kontaktowej

Dane strukturalne to zapis tych samych informacji kontaktowych w postaci czytelnej dla programów, umieszczony w kodzie strony. Nie zmieniają wyglądu podstrony, ale pozwalają wyszukiwarce jednoznacznie odczytać, co jest nazwą, co adresem, a co godzinami.

Dla firmy z lokalem Google opisuje typ LocalBusiness, czyli firmę działającą lokalnie. W dokumentacji tego oznaczenia wymagane są dwie właściwości, nazwa i adres, a zalecane między innymi telefon z kodem kraju, adres URL placówki, współrzędne geograficzne oraz godziny otwarcia. Firma czynna całą dobę podaje otwarcie o 00:00 i zamknięcie o 23:59, a dzień zamknięty ma obie wartości ustawione na 00:00. Przy wielu placówkach każdą opisuje się osobnym oznaczeniem, a działy jednej placówki zagnieżdża we właściwości department, podając tylko to, czym różnią się od całości.

<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "Plumber",
  "name": "Przykładowa Firma Hydrauliczna",
  "url": "https://przyklad.pl/kontakt/",
  "telephone": "+48123456789",
  "address": {
    "@type": "PostalAddress",
    "streetAddress": "ul. Przykładowa 10",
    "postalCode": "90-001",
    "addressLocality": "Łódź",
    "addressCountry": "PL"
  },
  "openingHoursSpecification": [{
    "@type": "OpeningHoursSpecification",
    "dayOfWeek": ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday"],
    "opens": "08:00",
    "closes": "16:00"
  }]
}
</script>

Dla firmy bez lokalu przyjmującego klientów właściwszy bywa typ Organization. Jego dokumentacja nie wskazuje właściwości obowiązkowych i zaleca między innymi adres, telefon, e-mail, punkt kontaktowy, nazwę prawną i identyfikator podatkowy. Kilka numerów do różnych spraw można opisać typem ContactPoint ze słownika schema.org, który ma pola na rodzaj kontaktu, telefon, e-mail, języki i godziny dostępności.

Wartości w oznaczeniu muszą być takie same jak w widocznej treści, w przeciwnym razie powstaje kolejna rozbieżność. Google zastrzega też w dokumentacji, że nie gwarantuje wyświetlania funkcji opartych na uporządkowanych danych. O ich roli dla asystentów AI piszemy we wpisie o danych strukturalnych a odpowiedziach AI.

Typowe pomyłki i przegląd strony kontaktowej

Najczęstsze pomyłki to nieaktualne dane, brak godzin, numer telefonu, którego nie da się kliknąć, oraz formularz jako jedyna droga kontaktu. Większość z nich nie wynika z błędu projektanta, lecz z tego, że po uruchomieniu serwisu nikt nie został wyznaczony do pilnowania tej podstrony.

Kancelaria z Krakowa po przeprowadzce zmienia adres w stopce, ale zostawia starą mapę i stary adres w danych strukturalnych. Firma usługowa wyłącza numer stacjonarny, a on przez kolejne miesiące widnieje na stronie. Sklep ustawia w profilu Google krótsze godziny w soboty, a na stronie nadal obiecuje otwarcie do wieczora. W każdym z tych przypadków klient trafia na sprzeczne informacje i musi zgadywać, która jest prawdziwa. Przegląd warto powtarzać co kwartał oraz po każdej zmianie adresu, numeru lub godzin, najlepiej na telefonie komórkowym, bo tam usterki widać najszybciej.

• Pełna nazwa firmy, adres, telefon i adres e-mail są zapisane tekstem, a nie na obrazku.
• Dotknięcie numeru na telefonie rozpoczyna połączenie, a adres e-mail da się zaznaczyć i skopiować.
• Godziny są podane dla każdego dnia tygodnia, a komunikaty o świętach i urlopach są aktualne.
• Pod mapą znajduje się opis dojazdu, wejścia i parkingu oraz link do trasy.
• Dane rejestrowe i numer identyfikacji podatkowej stoją w osobnym, czytelnym bloku.
• Formularz ma widoczne etykiety, informację o przetwarzaniu danych i potwierdzenie wysłania.
• Każda placówka ma własny telefon, godziny i podstronę, do której kieruje jej profil w Google.
• Stopka, strona kontaktowa, dane strukturalne i Profil Firmy w Google podają to samo.

Pomoc z zewnątrz przydaje się wtedy, gdy zmiana wymaga ingerencji w szablon, gdy placówek jest wiele i potrzebny jest spójny wzór podstron albo gdy strona kontaktowa powstaje razem z nowym serwisem. Projektujemy ją w ramach tworzenia stron i projektowania UX.

Jeśli chcą Państwo zamówić stronę internetową, zachęcamy do kontaktu: tel. 222 500 844 lub mailowo: biuro@pozycjonowaniestron.pl