[{"data":1,"prerenderedAt":991},["ShallowReactive",2],{"blog-proces-tworzenia-strony-internetowej":3,"blog-pozostale-proces-tworzenia-strony-internetowej":466},{"id":4,"title":5,"body":6,"date":451,"description":452,"extension":453,"meta":454,"navigation":455,"obrazek":456,"obrazekAlt":457,"path":458,"seo":459,"sitemap":460,"stem":461,"szkic":462,"typ":463,"tytulSeo":464,"zaktualizowano":464,"__hash__":465},"blog/blog/proces-tworzenia-strony-internetowej.md","Proces tworzenia strony internetowej — 4 etapy",{"type":7,"value":8,"toc":432},"minimark",[9,13,16,19,24,53,62,66,71,74,77,85,89,92,95,98,122,125,128,132,135,139,142,145,157,161,164,167,170,173,193,196,200,203,206,213,217,220,223,275,279,282,318,326,330,393,397,403,409,415,421,424],[10,11,12],"p",{},"Strona firmowa powstaje w czterech etapach: rozmowa, projekt, realizacja i wdrożenie. Kolejność nie jest przypadkowa, bo każdy etap opiera się na wyniku poprzedniego — nie da się projektować układu, zanim wiadomo, co ma się w nim znaleźć.",[10,14,15],{},"Nie jest to jedyny możliwy schemat. Każdy wykonawca pracuje trochę inaczej i część kroków bywa łączona albo pomijana. Poniżej opisuję kolejność, którą stosuję sam, razem z informacją, co na którym etapie należy do zamawiającego.",[10,17,18],{},"To ostatnie jest ważniejsze, niż wygląda. Zlecenie w formie „zróbcie tak, żeby było dobrze\" kończy się zwykle stroną, która owszem, działa, ale mówi o firmie rzeczy, których właściciel by nie powiedział. Wykonawca zna się na stronach, Ty znasz się na swoich klientach, i obie te rzeczy są w projekcie potrzebne.",[20,21,23],"h2",{"id":22},"cztery-etapy-w-skrócie","Cztery etapy w skrócie",[25,26,27,35,41,47],"ol",{},[28,29,30,34],"li",{},[31,32,33],"strong",{},"Rozmowa"," — po co ta strona powstaje, co ma się zmienić i co dokładnie budujemy.",[28,36,37,40],{},[31,38,39],{},"Projekt"," — mapa podstron, treść i warstwa graficzna, zatwierdzana przed kodowaniem.",[28,42,43,46],{},[31,44,45],{},"Realizacja"," — budowa strony, podpięcie systemu zarządzania treścią i testy.",[28,48,49,52],{},[31,50,51],{},"Wdrożenie"," — przeniesienie na docelowy adres i pierwsze dni obserwacji.",[10,54,55,56,61],{},"Ten sam podział opisuję w ",[57,58,60],"a",{"href":59},"/#proces","sekcji o tym, jak pracuję",". Poniżej rozwijam każdy etap i piszę, co musi być gotowe, żeby dało się przejść do następnego.",[20,63,65],{"id":64},"_1-rozmowa","1. Rozmowa",[67,68,70],"h3",{"id":69},"po-co-ta-strona-powstaje","Po co ta strona powstaje",[10,72,73],{},"Większość firm odpowiada na to pytanie tak samo: żeby pokazać ofertę i umożliwić kontakt. To prawda, ale zbyt ogólna, żeby cokolwiek z niej wynikało dla projektu. Na tym poziomie każda strona firmowa wygląda tak samo, i właśnie dlatego tyle z nich wygląda tak samo.",[10,75,76],{},"Pytam więc o rzeczy bardziej konkretne. Skąd dziś przychodzą klienci i co ma się w tym zmienić. Czego nie potrafi obecna strona, jeśli już istnieje. Co odróżnia Cię od trzech najbliższych konkurentów, i to nie w kategoriach „jakość i doświadczenie\", tylko czegoś, czego oni nie mogą o sobie napisać. Kto podejmuje decyzję o zakupie i czego potrzebuje, żeby ją podjąć.",[10,78,79,80,84],{},"Odpowiedzi przekładają się potem na każdy kolejny etap: na to, co trafi do pierwszego ekranu, ile będzie podstron ofertowych i czy w ogóle potrzebny jest blog. Bez nich powstaje szablon wypełniony Twoimi tekstami. O tym, jak rozpoznać stronę zrobioną w ten sposób, pisałem w tekście o ",[57,81,83],{"href":82},"/blog/cechy-dobrej-strony-internetowej/","cechach dobrej strony firmowej",".",[67,86,88],{"id":87},"co-dokładnie-budujemy","Co dokładnie budujemy",[10,90,91],{},"Z celów wynika forma. Jeśli ruch ma pochodzić głównie z reklam w Google Ads albo z mediów społecznościowych, a treści ma być mało, sensowniejszy bywa landing page: jedna strona prowadząca do jednego działania, bez rozpraszającego menu.",[10,93,94],{},"Jeśli strona ma sama przyprowadzać klientów z wyszukiwarki, potrzebny jest serwis z osobnymi podstronami. Osobna podstrona pod każdą usługę to podstawa widoczności, bo wyszukiwarka pokazuje konkretne adresy pod konkretne zapytania, a nie stronę główną pod wszystko.",[10,96,97],{},"Na tym etapie ustalamy też typy podstron, czyli powtarzalne schematy do zaprojektowania:",[99,100,101,104,107,110,113,116,119],"ul",{},[28,102,103],{},"strona główna",[28,105,106],{},"zbiorcza podstrona oferty",[28,108,109],{},"podstrona pojedynczej usługi",[28,111,112],{},"o firmie",[28,114,115],{},"kontakt",[28,117,118],{},"wpis bloga i lista wpisów",[28,120,121],{},"przy sklepie dochodzi lista produktów, karta produktu i koszyk",[10,123,124],{},"Każdy taki typ trzeba zaprojektować raz, a potem powiela się go dla wszystkich podstron danego rodzaju. Dlatego liczba typów wpływa na koszt bardziej niż liczba samych podstron.",[10,126,127],{},"Rozmowa kończy się, gdy wiadomo, co powstaje, w jakim zakresie i w jakim budżecie.",[20,129,131],{"id":130},"_2-projekt","2. Projekt",[10,133,134],{},"Ten etap jest najdłuższy i mieści trzy rzeczy, które muszą powstać w tej kolejności: mapa podstron, treść, dopiero potem grafika.",[67,136,138],{"id":137},"mapa-strony","Mapa strony",[10,140,141],{},"Mapa strony to spis wszystkich podstron z ich finalnymi nazwami i adresami, ułożony w strukturę nadrzędnych i podrzędnych pozycji. Wygląda jak zwykła lista i jest jednym z najbardziej niedocenianych dokumentów w całym projekcie.",[10,143,144],{},"Robi trzy rzeczy naraz. Ustala menu, bo widać, co się w nim zmieści, a co trzeba schować głębiej. Ustala adresy, a te po uruchomieniu strony zmienia się już z przekierowaniami i utratą pozycji, więc lepiej przemyśleć je wcześniej. Wreszcie pokazuje skalę: lista, która rozrasta się do sześćdziesięciu pozycji, jest sygnałem, że zakres wymknął się spod kontroli, i lepiej zobaczyć to teraz niż w trakcie pisania tekstów.",[10,146,147,148,152,153,156],{},"Adresy warto od razu ustalać krótkie i czytelne, złożone ze słów, które ktoś realnie wpisuje w wyszukiwarkę. ",[149,150,151],"code",{},"/montaz-okien-elk/"," mówi wszystko, ",[149,154,155],{},"/oferta/podstrona-2/"," nie mówi nic.",[67,158,160],{"id":159},"treść","Treść",[10,162,163],{},"To jest część, która przesądza o terminie całego projektu, i prawie zawsze ta, która go opóźnia.",[10,165,166],{},"Powód jest prosty: treść zwykle należy do zamawiającego, a pisanie o własnej firmie jest trudniejsze, niż się wydaje przed rozpoczęciem. Do tego dochodzą zdjęcia, których nikt nie zrobił, cennik, którego nikt nie spisał, i lista realizacji rozrzucona po trzech telefonach.",[10,168,169],{},"Da się zaprojektować układ na tekstach zastępczych i czasem tak robię, ale ma to granicę. Projekt nagłówka wygląda inaczej przy haśle z trzech słów niż przy zdaniu na dwie linijki. Sekcja z trzema usługami wygląda inaczej niż z jedenastoma. Im później pojawia się prawdziwa treść, tym więcej rzeczy trzeba przerabiać.",[10,171,172],{},"Co jest potrzebne, żeby zamknąć tę część:",[99,174,175,178,181,184,187,190],{},[28,176,177],{},"teksty na wszystkie podstrony z mapy albo decyzja, kto je napisze",[28,179,180],{},"zdjęcia własne — produktów, realizacji, zespołu, warsztatu",[28,182,183],{},"logo w formie wektorowej, jeśli istnieje",[28,185,186],{},"pełne dane firmy: nazwa, adres, NIP, telefony, godziny pracy",[28,188,189],{},"cennik albo widełki, jeśli mają być pokazane",[28,191,192],{},"dokumenty formalne: polityka prywatności, regulamin przy sklepie — wzorce do uzupełnienia dostajesz ode mnie, ale treść musi odpowiadać temu, jak faktycznie działasz",[10,194,195],{},"Jeśli nie masz czasu na pisanie, powiedz to na początku, a nie w połowie projektu. Teksty da się zamówić albo napisać wspólnie na podstawie rozmowy, tylko trzeba to zaplanować, zamiast czekać, aż same się pojawią.",[67,197,199],{"id":198},"warstwa-graficzna","Warstwa graficzna",[10,201,202],{},"Dopiero mając mapę strony i treść, da się sensownie rozmieścić elementy. Powstaje wygląd: układ sekcji, typografia, kolory, zachowanie menu, wygląd przycisków i formularzy.",[10,204,205],{},"Klucz jest w tym, żeby zatwierdzić projekt przed kodowaniem. Zmiana w pliku graficznym to przesunięcie kilku elementów. Ta sama zmiana po zakodowaniu oznacza poprawki w kodzie, w wersji mobilnej i w tabletowej, ponowne testy i zwykle dodatkowy koszt.",[10,207,208,209,84],{},"Sposobów na tę część jest kilka. Można zaprojektować wszystko od zera w programie graficznym, a potem przełożyć na kod. Można oprzeć się na gotowym motywie i dopasować go do treści, co wychodzi taniej i szybciej, ale ogranicza swobodę. Wybór zależy od budżetu i od tego, na ile strona ma się wyróżniać. Więcej o tej decyzji piszę na stronie o ",[57,210,212],{"href":211},"/strony-internetowe-elk/","stronach internetowych",[20,214,216],{"id":215},"_3-realizacja","3. Realizacja",[10,218,219],{},"Tu projekt zamienia się w działającą stronę: kod HTML, CSS i JavaScript, podpięcie systemu zarządzania treścią, jeśli ma być, konfiguracja formularzy i wersje na różne szerokości ekranu.",[10,221,222],{},"Testowanie nie jest jedną czynnością na końcu, tylko kilkoma osobnymi przeglądami:",[99,224,225,231,237,243,249,259,269],{},[28,226,227,230],{},[31,228,229],{},"Język."," Literówki, odmiana, spójność nazw usług między podstronami.",[28,232,233,236],{},[31,234,235],{},"SEO."," Osobny tytuł i opis dla każdej podstrony, jeden nagłówek H1, sensowna hierarchia nagłówków, opisy alternatywne obrazów, linkowanie wewnętrzne, mapa witryny XML, plik robots.",[28,238,239,242],{},[31,240,241],{},"Prędkość."," PageSpeed Insights osobno dla telefonu i komputera, rozmiary zdjęć, liczba doładowywanych skryptów.",[28,244,245,248],{},[31,246,247],{},"Poprawność kodu."," Walidator W3C wyłapuje niedomknięte znaczniki i powtórzone identyfikatory, które potrafią psuć zachowanie na starszych przeglądarkach.",[28,250,251,254,255,84],{},[31,252,253],{},"Dostępność."," Kontrast, obsługa klawiaturą, widoczny fokus, etykiety pól formularza. Przy części podmiotów to dziś obowiązek prawny, o czym pisałem w tekście o ",[57,256,258],{"href":257},"/blog/strony-zgodne-z-wcag/","stronach zgodnych z WCAG",[28,260,261,264,265,84],{},[31,262,263],{},"Użyteczność."," Przejście ścieżki klienta od strony głównej do wysłania zapytania, na telefonie i na komputerze. Lista typowych potknięć jest w tekście o tym, ",[57,266,268],{"href":267},"/blog/co-irytuje-uzytkownikow-stron-internetowych/","co irytuje użytkowników stron",[28,270,271,274],{},[31,272,273],{},"Formularze."," Wysyłka na docelową skrzynkę, kopia dla nadawcy, sprawdzenie, czy wiadomość nie ląduje w spamie.",[20,276,278],{"id":277},"_4-wdrożenie","4. Wdrożenie",[10,280,281],{},"Przeniesienie z adresu roboczego na docelowy bywa najbardziej nerwowym momentem całego procesu, choć trwa najkrócej. Rzeczy, które lubią się tu posypać:",[99,283,284,290,296,306,312],{},[28,285,286,289],{},[31,287,288],{},"Blokada indeksowania zostaje włączona."," Klasyk. Strona działa, wygląda dobrze i przez trzy miesiące nikt nie rozumie, dlaczego nie ma jej w Google.",[28,291,292,295],{},[31,293,294],{},"Stare adresy bez przekierowań."," Przy przebudowie istniejącego serwisu każdy adres, który miał pozycję w wyszukiwarce, musi dostać przekierowanie na odpowiednik. Inaczej pozycje przepadają razem z ruchem.",[28,297,298,301,302,84],{},[31,299,300],{},"Certyfikat SSL."," Po zmianie serwera trzeba go wystawić na nowo i sprawdzić, czy wymusza połączenie szyfrowane. Więcej o tym w tekście o ",[57,303,305],{"href":304},"/blog/domena-hosting-ssl/","domenie, hostingu i SSL",[28,307,308,311],{},[31,309,310],{},"Adresy do zasobów zapisane na sztywno."," Zdjęcia i odnośniki wskazujące na adres testowy potrafią przetrwać migrację i wysypać się dopiero, gdy stary serwer zostanie wyłączony.",[28,313,314,317],{},[31,315,316],{},"Podpięcie narzędzi."," Google Search Console, przesłanie mapy witryny, statystyki, powiadomienia o awariach.",[10,319,320,321,325],{},"Pierwszy tydzień po uruchomieniu warto obserwować raport indeksowania i skrzynkę, na którą idą zapytania z formularza. Potem zaczyna się ",[57,322,324],{"href":323},"/opieka-nad-strona-internetowa/","utrzymanie",", które trwa tak długo, jak strona.",[20,327,329],{"id":328},"kto-za-co-odpowiada","Kto za co odpowiada",[331,332,333,349],"table",{},[334,335,336],"thead",{},[337,338,339,343,346],"tr",{},[340,341,342],"th",{},"Etap",[340,344,345],{},"Twoja rola",[340,347,348],{},"Moja rola",[350,351,352,363,373,383],"tbody",{},[337,353,354,357,360],{},[355,356,33],"td",{},[355,358,359],{},"odpowiadasz na pytania o firmę i klientów, decydujesz o budżecie",[355,361,362],{},"zadaję je, proponuję formę i zakres",[337,364,365,367,370],{},[355,366,39],{},[355,368,369],{},"dostarczasz teksty, zdjęcia i dane, zatwierdzasz wygląd",[355,371,372],{},"przygotowuję mapę, redaguję treść, projektuję układ",[337,374,375,377,380],{},[355,376,45],{},[355,378,379],{},"jesteś dostępny na pytania",[355,381,382],{},"buduję i testuję",[337,384,385,387,390],{},[355,386,51],{},[355,388,389],{},"odbierasz stronę",[355,391,392],{},"przenoszę, konfiguruję, obserwuję",[20,394,396],{"id":395},"częste-pytania","Częste pytania",[10,398,399,402],{},[31,400,401],{},"Czy można pominąć projekt graficzny?","\nMożna, jeśli strona powstaje na gotowym motywie i godzisz się na jego układ. Przy indywidualnym wyglądzie pominięcie tego kroku przenosi wszystkie uwagi na etap realizacji, gdzie poprawki są droższe.",[10,404,405,408],{},[31,406,407],{},"Kto pisze teksty?","\nDomyślnie zamawiający, bo zna swoich klientów i swoją ofertę. Teksty da się też zamówić osobno albo napisać na podstawie nagranej rozmowy. Ważne, żeby ustalić to na początku, bo brak treści zatrzymuje projekt skuteczniej niż cokolwiek innego.",[10,410,411,414],{},[31,412,413],{},"Co się dzieje, gdy w trakcie zmienia się zakres?","\nZależy od momentu. Dołożenie podstrony przy mapie strony jest kwestią jednej linijki w spisie. To samo po zakodowaniu oznacza nowy typ podstrony, projekt, treść i testy. Dlatego pytam o wszystko na początku, nawet o rzeczy, które wydają się odległe.",[10,416,417,420],{},[31,418,419],{},"Ile trwa cały proces?","\nNajbardziej rozstrzyga o tym treść w drugim etapie. Sama praca po mojej stronie jest przewidywalna, a czekanie na teksty i zdjęcia potrafi wydłużyć projekt kilkakrotnie. Termin ustalam więc razem z harmonogramem dostarczenia treści, nie w oderwaniu od niego.",[422,423],"hr",{},[10,425,426,427,431],{},"Jeśli planujesz nową stronę albo przebudowę istniejącej, ",[57,428,430],{"href":429},"/kontakt/","napisz"," — przejdziemy przez pierwszy etap w rozmowie, a potem będzie wiadomo, ile pracy jest po której stronie.",{"title":433,"searchDepth":434,"depth":434,"links":435},"",2,[436,437,442,447,448,449,450],{"id":22,"depth":434,"text":23},{"id":64,"depth":434,"text":65,"children":438},[439,441],{"id":69,"depth":440,"text":70},3,{"id":87,"depth":440,"text":88},{"id":130,"depth":434,"text":131,"children":443},[444,445,446],{"id":137,"depth":440,"text":138},{"id":159,"depth":440,"text":160},{"id":198,"depth":440,"text":199},{"id":215,"depth":434,"text":216},{"id":277,"depth":434,"text":278},{"id":328,"depth":434,"text":329},{"id":395,"depth":434,"text":396},"2025-09-30","Jak powstaje strona firmowa: od rozmowy o celach po uruchomienie. Co na którym etapie należy do Ciebie, a co do wykonawcy.","md",{},true,"/img/blog/proces-tworzenia-strony-internetowej.webp","Szkic układu strony internetowej na kartce obok laptopa","/blog/proces-tworzenia-strony-internetowej",{"title":5,"description":452},{"loc":458},"blog/proces-tworzenia-strony-internetowej",false,"article",null,"AP7QjNMRg3JVrhzQYh57uNI1pnJIklhC9XLYAQ8lEV0",[467,654],{"id":468,"title":469,"body":470,"date":643,"description":644,"extension":453,"meta":645,"navigation":455,"obrazek":646,"obrazekAlt":647,"path":648,"seo":649,"sitemap":650,"stem":651,"szkic":462,"typ":463,"tytulSeo":464,"zaktualizowano":652,"__hash__":653},"blog/blog/cechy-dobrej-strony-internetowej.md","5 cech dobrej strony internetowej",{"type":7,"value":471,"toc":634},[472,475,478,482,485,488,491,497,501,504,507,516,520,523,526,531,535,538,541,544,553,557,560,567,572,576,582,588,594,600,602,613,619,625,627],[10,473,474],{},"Dobra strona firmowa różni się od słabej nie wyglądem, tylko tym, czy ktoś po wejściu wie, co robisz, i czy potrafi się z Tobą skontaktować. Reszta, łącznie z animacjami i ładnym zdjęciem w nagłówku, jest dodatkiem do tych dwóch rzeczy.",[10,476,477],{},"Poniżej pięć cech, które to przesądzają. Przy każdej podaję sposób, żeby sprawdzić własną stronę bez zgadywania i bez płacenia za audyt.",[20,479,481],{"id":480},"_1-w-pierwszym-ekranie-widać-co-oferujesz","1. W pierwszym ekranie widać, co oferujesz",[10,483,484],{},"Osoba, która trafia na Twoją stronę z wyszukiwarki, nie zna Twojej firmy. Ma jedno pytanie: czy tu załatwi swoją sprawę. Jeśli w pierwszym ekranie widzi hasło w rodzaju „kompleksowe rozwiązania dla biznesu\", odpowiedzi nie dostaje i wraca do wyników wyszukiwania.",[10,486,487],{},"Konkret działa lepiej niż ogólnik. „Montaż okien i drzwi, Ełk i okolice\" mówi wszystko. „Tworzymy przestrzenie\" nie mówi nic.",[10,489,490],{},"W pierwszym ekranie powinny znaleźć się trzy rzeczy: co robisz, dla kogo, i jak się z Tobą skontaktować. Numer telefonu w nagłówku jest wart więcej niż karuzela zdjęć.",[10,492,493,496],{},[31,494,495],{},"Jak sprawdzić:"," pokaż stronę główną komuś spoza swojej branży przez pięć sekund, potem zasłoń ekran i zapytaj, czym zajmuje się ta firma. Jeśli nie potrafi odpowiedzieć, przekaz jest za słaby.",[20,498,500],{"id":499},"_2-działa-na-telefonie","2. Działa na telefonie",[10,502,503],{},"Ponad połowa wejść na typową stronę firmową pochodzi z telefonów. Strona, która na małym ekranie wymaga powiększania palcami albo przewija się na boki, traci te osoby, zanim zdążą cokolwiek przeczytać.",[10,505,506],{},"Najczęstsze usterki to za małe przyciski, formularz kontaktowy wychodzący poza ekran, menu zasłaniające treść i zdjęcia w tle, które na telefonie przycinają się w najgorszym możliwym miejscu.",[10,508,509,511,512,84],{},[31,510,495],{}," otwórz własną stronę na swoim telefonie i spróbuj wysłać sobie zapytanie przez formularz. Ta jedna czynność wykrywa większość problemów. Więcej o tym pisałem w tekście o tym, ",[57,513,515],{"href":514},"/blog/dlaczego-twoja-strona-internetowa-powinna-byc-responsywna/","dlaczego responsywność jest konieczna",[20,517,519],{"id":518},"_3-ładuje-się-szybko","3. Ładuje się szybko",[10,521,522],{},"Czas ładowania przekłada się wprost na liczbę osób, które zostaną. Przy stronie, która otwiera się dłużej niż trzy sekundy, część odwiedzających rezygnuje jeszcze przed zobaczeniem treści. Google mierzy to od 2021 roku wskaźnikami Core Web Vitals i bierze pod uwagę przy ustalaniu pozycji.",[10,524,525],{},"Najczęstsza przyczyna wolnej strony firmowej to zdjęcia wgrane prosto z aparatu: plik ma cztery megabajty i 6000 pikseli szerokości, a wyświetla się w okienku o szerokości 400 pikseli. Drugą przyczyną jest nadmiar wtyczek, z których każda dokłada własne skrypty do każdej podstrony.",[10,527,528,530],{},[31,529,495],{}," wpisz adres strony w PageSpeed Insights od Google. Narzędzie jest bezpłatne i pokazuje osobno wynik dla telefonu i dla komputera. Wynik mobilny poniżej 50 punktów oznacza, że jest co poprawiać.",[20,532,534],{"id":533},"_4-da-się-ją-znaleźć","4. Da się ją znaleźć",[10,536,537],{},"Strona, do której trafiają wyłącznie osoby znające adres, pełni funkcję wizytówki. Żeby zaczęła przyprowadzać nowych klientów, musi odpowiadać na to, co ludzie wpisują w wyszukiwarkę.",[10,539,540],{},"Podstawy, które robi się raz i działają latami: osobny tytuł i opis dla każdej podstrony, nagłówki opisujące zawartość zamiast ozdobników, adresy czytelne dla człowieka, mapa strony i konto w Google Search Console.",[10,542,543],{},"Przy działalności lokalnej dochodzi wizytówka Google i nazwa miejscowości w treści. Fraza „okna Ełk\" ma mniejszą konkurencję niż „okna\", a prowadzi klientów, którzy realnie mogą do Ciebie przyjechać.",[10,545,546,548,549,552],{},[31,547,495],{}," wpisz w Google ",[149,550,551],{},"site:twojadomena.pl",". Wynik pokaże, ile Twoich podstron jest w indeksie. Jeśli wyszukiwarka nie znajdzie żadnej, strona jest dla niej niewidoczna i to pierwsza rzecz do naprawy.",[20,554,556],{"id":555},"_5-jest-utrzymywana","5. Jest utrzymywana",[10,558,559],{},"Strona nie jest meblem, który raz się kupuje. To oprogramowanie, które łączy się z internetem, więc wymaga aktualizacji. Porzucona witryna na WordPressie z wtyczkami sprzed trzech lat prędzej czy później zostanie zainfekowana — nie dlatego, że ktoś się na nią uwziął, tylko dlatego, że automaty skanują cały internet w poszukiwaniu znanych dziur.",[10,561,562,563,566],{},"Do tego dochodzą rzeczy, które trzeba mieć niezależnie od włamań: certyfikat SSL, kopie zapasowe odtwarzalne w razie awarii, polityka prywatności i informacja o ciasteczkach. Jeśli nie masz czasu tego pilnować, wchodzi to w ",[57,564,565],{"href":323},"stałą opiekę nad stroną"," i obejmuje też witryny zbudowane przez kogoś innego.",[10,568,569,571],{},[31,570,495],{}," zaloguj się do panelu i zobacz, ile aktualizacji czeka. Sprawdź też, kiedy powstała ostatnia kopia zapasowa i czy wiesz, jak ją odtworzyć. Kopia, której nikt nigdy nie odtwarzał, jest kopią tylko z nazwy.",[20,573,575],{"id":574},"czego-unikać","Czego unikać",[10,577,578,581],{},[31,579,580],{},"Automatycznie odtwarzanej muzyki i wideo."," Odwiedzający zamyka kartę szybciej, niż znajdzie przycisk wyciszenia.",[10,583,584,587],{},[31,585,586],{},"Karuzeli na całą szerokość ekranu."," Badania użyteczności pokazują od lat, że odwiedzający czytają głównie pierwszy slajd, a resztę pomijają. Treść, którą warto pokazać, lepiej wyłożyć wprost.",[10,589,590,593],{},[31,591,592],{},"Kontaktu wyłącznie przez formularz."," Część osób woli zadzwonić. Numer widoczny bez szukania to najprostszy sposób na zwiększenie liczby zapytań.",[10,595,596,599],{},[31,597,598],{},"Efektów, które opóźniają treść."," Animacja pojawiania się wygląda dobrze przy przewijaniu, ale gdy blokuje tekst w pierwszym ekranie, działa przeciwko Tobie.",[20,601,396],{"id":395},[10,603,604,607,608,612],{},[31,605,606],{},"Ile kosztuje dobra strona firmowa?","\nZależy od liczby podstron i tego, czy potrzebny jest ",[57,609,611],{"href":610},"/projektowanie-graficzne-elk/","projekt graficzny od zera",", czy wystarczy dopasowanie gotowego układu. Sensowna strona wizytówkowa to inny rząd wielkości niż serwis z katalogiem produktów i wyszukiwarką.",[10,614,615,618],{},[31,616,617],{},"Czy lepszy jest WordPress, czy strona pisana od zera?","\nDla większości firm WordPress, bo daje możliwość samodzielnej zmiany treści. Strona pisana od zera wygrywa przy nietypowych wymaganiach i wtedy, gdy liczy się każdy punkt w PageSpeed.",[10,620,621,624],{},[31,622,623],{},"Jak długo trwa, zanim strona zacznie przyprowadzać klientów?","\nPierwsze wejścia z wyszukiwarki pojawiają się zwykle po kilku tygodniach od publikacji. Stabilna pozycja na konkurencyjne frazy to kwestia miesięcy i regularnego dokładania treści.",[422,626],{},[10,628,629,630,633],{},"Jeśli po tej lekturze widzisz u siebie dwie albo trzy rzeczy do poprawienia, ",[57,631,632],{"href":429},"odezwij się"," — powiem, które z nich faktycznie wpływają na liczbę zapytań, a które są kosmetyką.",{"title":433,"searchDepth":434,"depth":434,"links":635},[636,637,638,639,640,641,642],{"id":480,"depth":434,"text":481},{"id":499,"depth":434,"text":500},{"id":518,"depth":434,"text":519},{"id":533,"depth":434,"text":534},{"id":555,"depth":434,"text":556},{"id":574,"depth":434,"text":575},{"id":395,"depth":434,"text":396},"2024-03-12","Co odróżnia stronę, która przynosi zapytania, od kosztownej wizytówki. Pięć cech, przy każdej konkretny sposób, żeby sprawdzić własną witrynę.",{},"/img/blog/cechy-dobrej-strony-internetowej.webp","Osoba przeglądająca stronę internetową na laptopie","/blog/cechy-dobrej-strony-internetowej",{"title":469,"description":644},{"loc":648},"blog/cechy-dobrej-strony-internetowej","2026-09-12","maAlHX8jHOl2UfHfshE4llLst46d3BZxSzvHOQsdca0",{"id":655,"title":656,"body":657,"date":981,"description":982,"extension":453,"meta":983,"navigation":455,"obrazek":984,"obrazekAlt":985,"path":986,"seo":987,"sitemap":988,"stem":989,"szkic":462,"typ":463,"tytulSeo":464,"zaktualizowano":464,"__hash__":990},"blog/blog/co-irytuje-uzytkownikow-stron-internetowych.md","Co irytuje użytkowników stron internetowych — 14 błędów",{"type":7,"value":658,"toc":955},[659,662,665,669,672,676,679,682,685,690,694,697,700,704,707,710,713,718,722,725,730,734,737,741,744,747,751,754,759,763,766,769,773,776,779,782,786,789,792,795,800,804,808,811,814,818,821,824,828,831,834,838,841,849,853,857,860,880,883,892,896,899,922,924,934,940,946,948],[10,660,661],{},"Najczęstsze powody, dla których ktoś zamyka stronę firmową, nie mają nic wspólnego z jej wyglądem. To pop-up zasłaniający treść, cena, której nigdzie nie ma, formularz, który po wysłaniu pokazuje pustą stronę, i telefon, do którego trzeba się dokopać przez stopkę.",[10,663,664],{},"Każdy z tych błędów naprawia się w godzinę albo dwie. Zebrałem czternaście, które widuję najczęściej przy przejmowaniu cudzych stron, i przy każdym dopisałem, jak sprawdzić, czy występuje u Ciebie.",[20,666,668],{"id":667},"pierwsze-pięć-sekund","Pierwsze pięć sekund",[10,670,671],{},"Tyle mniej więcej trwa decyzja, czy zostać. Wszystko, co w tym czasie przeszkadza w czytaniu, działa na Twoją niekorzyść.",[67,673,675],{"id":674},"_1-pop-up-zaraz-po-wejściu","1. Pop-up zaraz po wejściu",[10,677,678],{},"Okno z rabatem, zapisem do newslettera albo pytaniem „w czym mogę pomóc?\", które pojawia się, zanim ktokolwiek zdążył cokolwiek przeczytać. Na telefonie zwykle zasłania cały ekran, a krzyżyk zamykający ma kilkanaście pikseli.",[10,680,681],{},"To jest też problem pozycjonowania, nie tylko wygody. Google od 2017 roku traktuje natrętne okna zasłaniające treść na telefonie jako powód do obniżenia strony w wynikach. Wyjątkiem są okna wymagane prawem, jak zgoda na ciasteczka czy potwierdzenie wieku.",[10,683,684],{},"Baner zgody musisz mieć, ale nie musi zajmować pół ekranu i nie może utrudniać odmowy. Jeśli „Akceptuję wszystko\" to jedno kliknięcie, a odrzucenie wymaga wejścia w ustawienia i odznaczenia pięciu suwaków, robisz to źle także z punktu widzenia przepisów.",[10,686,687,689],{},[31,688,495],{}," wejdź na własną stronę na telefonie w trybie prywatnym. Policz, ile rzeczy musisz zamknąć, zanim zobaczysz pierwsze zdanie treści.",[67,691,693],{"id":692},"_2-elementy-które-skaczą-podczas-czytania","2. Elementy, które skaczą podczas czytania",[10,695,696],{},"Zaczynasz czytać akapit, ładuje się zdjęcie nad nim i tekst ucieka w dół. Albo klikasz link i w tym samym momencie coś przesuwa układ, więc trafiasz w co innego. Google mierzy to wskaźnikiem CLS i za dobry wynik uznaje wartość poniżej 0,1.",[10,698,699],{},"Powód jest prawie zawsze ten sam: obrazek bez podanej szerokości i wysokości, baner doklejany skryptem nad treścią albo font, który po doładowaniu zmienia wysokość linii. Rozwiązaniem jest rezerwowanie miejsca z góry, a nie wstawianie elementów w locie.",[67,701,703],{"id":702},"_3-zbyt-długie-ładowanie","3. Zbyt długie ładowanie",[10,705,706],{},"Google za dobry wynik uznaje wyświetlenie największego elementu strony w 2,5 sekundy. Powyżej czterech sekund część odwiedzających wraca do wyników wyszukiwania, zanim zobaczy cokolwiek poza białym tłem.",[10,708,709],{},"Na stronach firmowych przyczyna bywa banalna: zdjęcia wgrane prosto z aparatu. Plik ma pięć megabajtów i 6000 pikseli szerokości, a wyświetla się w kafelku o szerokości 400 pikseli. Druga przyczyna to wtyczki dokładające własne skrypty do każdej podstrony, także tam, gdzie nie są używane.",[10,711,712],{},"Jedno zastrzeżenie: goń realną prędkość, nie punkty. PageSpeed Insights potrafi odjąć punkty za rzeczy, które użytkownikowi nie przeszkadzają, i przemilczeć takie, które przeszkadzają bardzo.",[10,714,715,717],{},[31,716,495],{}," wpisz adres w PageSpeed Insights i spójrz osobno na wynik mobilny. Potem otwórz stronę na telefonie w zasięgu LTE, nie na domowym wi-fi.",[67,719,721],{"id":720},"_4-wersja-mobilna-zrobiona-po-łebkach","4. Wersja mobilna zrobiona po łebkach",[10,723,724],{},"Tekst wychodzący za ekran, poziomy pasek przewijania, przyciski tak małe, że trzeba w nie celować. WCAG w wersji 2.2 podaje konkretną granicę: element klikalny powinien mieć co najmniej 24 na 24 piksele, a w wariancie zalecanym 44 na 44.",[10,726,727,728,84],{},"Po tylu latach od momentu, w którym responsywność stała się standardem, nadal spotykam strony, gdzie menu na telefonie zasłania treść i nie da się go zamknąć. Więcej o samym mechanizmie pisałem w tekście o tym, ",[57,729,515],{"href":514},[20,731,733],{"id":732},"nie-mogę-tego-znaleźć","Nie mogę tego znaleźć",[10,735,736],{},"Druga grupa błędów dotyczy informacji, po które ktoś przyszedł, a których nie ma albo są schowane.",[67,738,740],{"id":739},"_5-ceny-których-nigdzie-nie-ma","5. Ceny, których nigdzie nie ma",[10,742,743],{},"Najczęstszy powód zamknięcia karty na stronie usługowej. Rozumiem argument, że wycena zależy od zakresu, bo w moim fachu też zależy. Nie zmienia to faktu, że „skontaktuj się po wycenę\" wymaga od kogoś zaangażowania, zanim dostanie jakąkolwiek informację.",[10,745,746],{},"Widełki rozwiązują to dwoma zdaniami: od jakiej kwoty zaczyna się najprostszy wariant i w jakim przedziale mieści się typowe zlecenie. To nie wiąże Cię cenowo, a odsiewa zapytania od osób z budżetem kilkakrotnie mniejszym, niż zakładasz. Na tym zyskujecie oboje.",[67,748,750],{"id":749},"_6-kontakt-schowany-w-stopce","6. Kontakt schowany w stopce",[10,752,753],{},"Numer telefonu powinien być widoczny w nagłówku, na każdej podstronie, i musi być klikalny na telefonie. Formularz to za mało — część osób woli zadzwonić i nie będzie szukać alternatywy.",[10,755,756,758],{},[31,757,495],{}," otwórz dowolną podstronę na telefonie i spróbuj zadzwonić, nie przewijając do stopki.",[67,760,762],{"id":761},"_7-brak-danych-firmy","7. Brak danych firmy",[10,764,765],{},"Nazwa, adres, NIP. Brzmi jak formalność, ale to jest pierwsza rzecz, którą sprawdza ktoś, kto rozważa przelew na kilka tysięcy złotych. Strona bez tych danych wygląda jak strona, która może zniknąć w przyszłym tygodniu.",[10,767,768],{},"Przy sprzedaży przez internet to zresztą nie jest kwestia zaufania, tylko obowiązku. Przepisy o świadczeniu usług drogą elektroniczną nakazują podać dane identyfikujące usługodawcę w sposób dostępny dla odbiorcy.",[67,770,772],{"id":771},"_8-wyszukiwarka-zwracająca-przypadkowe-wyniki","8. Wyszukiwarka zwracająca przypadkowe wyniki",[10,774,775],{},"Wpisujesz hasło na blogu i w wynikach lądują podstrony ofertowe, polityka prywatności i wersje robocze. Bez zdjęć, bez dat, bez sensownej kolejności.",[10,777,778],{},"Zwykle to nie jest zamierzone, tylko domyślne. Wyszukiwarka WordPressa bez konfiguracji przeszukuje wszystkie typy treści i sortuje po dacie, nie po trafności. Da się ją ograniczyć do wpisów kilkoma liniami kodu w motywie potomnym.",[10,780,781],{},"Jeśli strona ma dwanaście podstron i żadnego bloga, najlepszym rozwiązaniem bywa usunięcie pola wyszukiwania. Puste wyniki wyglądają gorzej niż brak wyszukiwarki.",[67,783,785],{"id":784},"_9-martwe-linki-i-błędy-404","9. Martwe linki i błędy 404",[10,787,788],{},"Klikam odnośnik, bo spodziewam się, że dokądś prowadzi. Zamiast tego dostaję komunikat o nieistniejącej stronie i zwykle na tym kończę wizytę.",[10,790,791],{},"Najwięcej takich linków powstaje po przebudowie serwisu, gdy zmieniają się adresy podstron, a stare nie dostają przekierowań. Druga kategoria to odnośniki do cudzych stron, które przestały istnieć rok temu i nikt tego nie zauważył.",[10,793,794],{},"Strona 404 też ma znaczenie. Zamiast samego napisu „nie znaleziono\" powinna proponować drogę dalej: wyszukiwarkę, menu, odnośnik do strony głównej i kontakt.",[10,796,797,799],{},[31,798,495],{}," w Google Search Console, w raporcie indeksowania, znajdziesz listę adresów zwracających 404 razem z informacją, skąd Google je zna.",[20,801,803],{"id":802},"treść-której-nikt-nie-przeczyta","Treść, której nikt nie przeczyta",[67,805,807],{"id":806},"_10-ściana-tekstu","10. Ściana tekstu",[10,809,810],{},"Akapit na piętnaście linii, bez śródtytułów, wyjustowany na całą szerokość ekranu. Robotom wyszukiwarek to nie przeszkadza, ludziom bardzo.",[10,812,813],{},"Cztery rzeczy załatwiają większość problemu: wiersz o długości 60–75 znaków, odstęp między liniami około 1,6 wysokości fontu, akapity po trzy, cztery linie i śródtytuł co dwa ekrany. Listy punktowane tam, gdzie treść naprawdę jest wyliczeniem.",[67,815,817],{"id":816},"_11-słownictwo-którego-klient-nie-zna","11. Słownictwo, którego klient nie zna",[10,819,820],{},"Branżowe skróty i nazwy technologii mają sens, gdy piszesz do kogoś z branży. Na stronie firmowej odbiorcą jest zwykle ktoś, kto zna problem, a nie nazwę rozwiązania.",[10,822,823],{},"Prosty test: przeczytaj zdanie na głos i zastanów się, czy powiedziałbyś je tak samo przez telefon klientowi. Jeśli nie, przepisz je tak, jak byś to powiedział.",[67,825,827],{"id":826},"_12-teksty-o-sobie-zamiast-o-kliencie","12. Teksty o sobie zamiast o kliencie",[10,829,830],{},"„Jesteśmy firmą o ugruntowanej pozycji na rynku, stawiającą na jakość i indywidualne podejście.\" Takie zdanie pasuje do każdej firmy w każdej branży, więc nie mówi nic o Twojej.",[10,832,833],{},"Zamień je na coś, czego konkurencja nie może o sobie napisać. „Awarie usuwamy w 48 godzin, także w soboty\" jest sprawdzalne i konkretne. Klient nie kupuje Twojego doświadczenia, tylko to, co z niego dla niego wynika.",[67,835,837],{"id":836},"_13-zdjęcia-ze-stocka","13. Zdjęcia ze stocka",[10,839,840],{},"Uśmiechnięty zespół w garniturach przy szklanym stole, ten sam, który widziałem wczoraj na stronie konkurencji. Sztuczność widać od razu i podważa resztę przekazu.",[10,842,843,844,848],{},"Zdjęcie zrobione telefonem w Twoim warsztacie, na budowie albo w biurze wygląda gorzej technicznie i działa lepiej. Pokazuje, że firma naprawdę istnieje i ma co pokazać. To samo dotyczy realizacji — ",[57,845,847],{"href":846},"/realizacje/","mój katalog wdrożeń"," to zrzuty prawdziwych stron, nie wizualizacje.",[20,850,852],{"id":851},"formularz-czyli-ostatni-metr","Formularz, czyli ostatni metr",[67,854,856],{"id":855},"_14-formularz-który-utrudnia-wysłanie-wiadomości","14. Formularz, który utrudnia wysłanie wiadomości",[10,858,859],{},"To jedyny moment, w którym ktoś sam zgłasza się do Ciebie, i jednocześnie miejsce, w którym najwięcej się psuje. Typowy zestaw usterek:",[99,861,862,865,868,871,874,877],{},[28,863,864],{},"błędy pokazywane dopiero po wysłaniu, hurtem, bez wskazania którego pola dotyczą",[28,866,867],{},"wyczyszczenie wszystkich pól po nieudanej próbie",[28,869,870],{},"wymagany numer telefonu, choć wystarczyłby sam adres e-mail",[28,872,873],{},"brak potwierdzenia po wysłaniu albo przeładowanie na pustą stronę",[28,875,876],{},"brak kopii wiadomości dla nadawcy, więc nie wiadomo, czy cokolwiek doszło",[28,878,879],{},"zaznaczona z góry zgoda marketingowa, czego przepisy nie dopuszczają",[10,881,882],{},"Najgorsza usterka jest jednak niewidoczna: formularz, który wygląda na działający, a wiadomości nie docierają. Zdarza się po zmianie hostingu, po wygaśnięciu hasła do skrzynki albo dlatego, że poczta trafia do spamu przez brak wpisów SPF i DKIM. Nikt tego nie zgłosi, bo nadawca widzi komunikat o wysłaniu.",[10,884,885,887,888,891],{},[31,886,495],{}," raz w miesiącu wyślij zapytanie przez własny formularz z adresu spoza firmy i sprawdź, czy przyszło oraz jak długo szło. Ten ",[57,889,890],{"href":429},"formularz kontaktowy"," wysyła nadawcy kopię właśnie po to, żeby obie strony miały ślad.",[20,893,895],{"id":894},"przegląd-własnej-strony-w-pół-godziny","Przegląd własnej strony w pół godziny",[10,897,898],{},"Sześć czynności, które wyłapują większość z tych czternastu rzeczy:",[25,900,901,904,907,910,913,919],{},[28,902,903],{},"Otwórz stronę główną na telefonie w trybie prywatnym i policz, ile okien musisz zamknąć.",[28,905,906],{},"Spróbuj zadzwonić z podstrony ofertowej, nie przewijając do stopki.",[28,908,909],{},"Znajdź na stronie cenę albo widełki. Jeśli nie ma, zapisz to jako pierwszą rzecz do poprawy.",[28,911,912],{},"Wyślij sobie zapytanie przez formularz z prywatnego adresu.",[28,914,915,916,918],{},"Wpisz w Google ",[149,917,551],{}," i sprawdź, ile podstron jest w indeksie.",[28,920,921],{},"Wklej adres w PageSpeed Insights i spójrz na wynik mobilny.",[20,923,396],{"id":395},[10,925,926,929,930,933],{},[31,927,928],{},"Ile z tych błędów da się poprawić bez przebudowy strony?","\nWiększość. Ceny, dane firmy, numer w nagłówku, ustawienia formularza i kompresja zdjęć to zmiany w treści i konfiguracji — takie drobne poprawki mieszczą się w ",[57,931,932],{"href":323},"stałej opiece nad stroną",". Przebudowy wymagają zwykle tylko problemy z wersją mobilną i skaczący układ, bo siedzą w motywie.",[10,935,936,939],{},[31,937,938],{},"Czy pop-up zawsze szkodzi?","\nNie. Szkodzi ten, który pojawia się od razu i zasłania treść na telefonie. Okno wyzwalane przy próbie opuszczenia strony albo po przewinięciu połowy artykułu nie wywołuje tej reakcji i nie jest traktowane przez Google jako natrętne.",[10,941,942,945],{},[31,943,944],{},"Jak sprawdzić, czy formularz naprawdę działa?","\nWyślij wiadomość z adresu spoza własnej domeny, najlepiej z Gmaila, i sprawdź też folder spam. Jeśli poczta idzie z serwera bez skonfigurowanego SPF i DKIM, część wiadomości ląduje tam po cichu.",[422,947],{},[10,949,950,951,954],{},"Jeśli po tej liście zebrało Ci się kilka rzeczy do naprawienia i nie wiesz, od której zacząć, ",[57,952,953],{"href":429},"napisz do mnie"," — powiem, które z nich faktycznie kosztują Cię zapytania, a które są kosmetyką.",{"title":433,"searchDepth":434,"depth":434,"links":956},[957,963,970,976,979,980],{"id":667,"depth":434,"text":668,"children":958},[959,960,961,962],{"id":674,"depth":440,"text":675},{"id":692,"depth":440,"text":693},{"id":702,"depth":440,"text":703},{"id":720,"depth":440,"text":721},{"id":732,"depth":434,"text":733,"children":964},[965,966,967,968,969],{"id":739,"depth":440,"text":740},{"id":749,"depth":440,"text":750},{"id":761,"depth":440,"text":762},{"id":771,"depth":440,"text":772},{"id":784,"depth":440,"text":785},{"id":802,"depth":434,"text":803,"children":971},[972,973,974,975],{"id":806,"depth":440,"text":807},{"id":816,"depth":440,"text":817},{"id":826,"depth":440,"text":827},{"id":836,"depth":440,"text":837},{"id":851,"depth":434,"text":852,"children":977},[978],{"id":855,"depth":440,"text":856},{"id":894,"depth":434,"text":895},{"id":395,"depth":434,"text":396},"2025-04-23","Czternaście rzeczy, które wyganiają odwiedzających ze strony firmowej. Przy każdym punkcie konkretny sposób, żeby sprawdzić to u siebie.",{},"/img/blog/co-irytuje-uzytkownikow-stron-internetowych.webp","Zirytowana osoba przed ekranem laptopa","/blog/co-irytuje-uzytkownikow-stron-internetowych",{"title":656,"description":982},{"loc":986},"blog/co-irytuje-uzytkownikow-stron-internetowych","lbKlvQTaC7iCzMItNc3Rc2g5Hf7tWVN1DOURW2zlQNM",1789996029070]