May 17, 2026, 11:40 PM
This commit is contained in:
Paweł Domański
@@ -0,0 +1,143 @@
|
||||
# Wytyczne do Landing Page i Prompty AI
|
||||
|
||||
Dokument ten zawiera zestawienie wytycznych dotyczących optymalizacji stron docelowych (landing pages) oraz gotowe prompty do narzędzi AI, które pomogą w ich wdrożeniu. Opracowano na podstawie `Landing_pagesOpt.md`.
|
||||
|
||||
## Część 1: Wytyczne do budowy i optymalizacji Landing Page
|
||||
|
||||
### 1. Strategia i Wybór Elementów do Testowania
|
||||
Nie wszystko na stronie ma równe znaczenie. Skup się na zmianach, które mogą przynieść największy zwrot.
|
||||
|
||||
* **Zasada 80/20 (Pareto):** Skoncentruj się na 20% elementów, które generują 80% wyników. Naprawienie fundamentalnych problemów daje lepsze efekty niż drobne poprawki kosmetyczne.
|
||||
* **Priorytetyzacja stron:** Nie naprawiaj tylko stron, które działają słabo. Często największy potencjał ukryty jest w stronach, które już generują duży ruch i przychód, ale nie są w pełni zoptymalizowane.
|
||||
* **Analiza "Utraconego Przychodu":** Oblicz potencjalne straty dla każdej strony (Ruch × Przychód na użytkownika × Współczynnik odrzuceń), aby zdecydować, gdzie skierować wysiłki optymalizacyjne.
|
||||
|
||||
### 2. Struktura i Design (Page Structure & Emphasis)
|
||||
Sposób organizacji przestrzeni ma kluczowe znaczenie dla kierowania uwagą użytkownika.
|
||||
|
||||
* **Kluczowe obszary widoczności:** Użytkownicy skanują strony od lewego górnego rogu. Najważniejsze informacje i wezwanie do działania (CTA) powinny znajdować się "above the fold" (w górnej części strony, widocznej bez przewijania).
|
||||
* **Mniej znaczy więcej (Less is More):**
|
||||
* Usuń zbędne elementy (rozpraszacze).
|
||||
* Ogranicz liczbę linków wychodzących (nie związanych z konwersją).
|
||||
* Upraszczaj grafikę i skracaj teksty.
|
||||
* **Nawigacja:** Preferuj menu pionowe, ponieważ lepiej wykorzystują cenną przestrzeń w pionie i poprawiają czytelność na szerokich ekranach.
|
||||
* **Akcentowanie (Emphasis):** Kieruj uwagą poprzez kontrast (np. kolor przycisku CTA kontrastujący z tłem), rozmiar czcionek i "pustą przestrzeń" (whitespace). Nie "podkręcaj głośności" wszystkiego naraz.
|
||||
|
||||
### 3. Spójność (Coherency) i "Zapach Informacji"
|
||||
Strona musi być spójna wizualnie i logicznie z miejscem, z którego przyszedł użytkownik.
|
||||
|
||||
* **Dopasowanie komunikatu:** Nagłówek na landing page'u musi odpowiadać tekstowi w reklamie lub linku, w który kliknął użytkownik. Jeśli użytkownik traci ten "zapach informacji", czuje się oszukany lub zagubiony.
|
||||
* **Spójność wizualna:** Kolorystyka, czcionki i styl graficzny muszą być jednolite. Strony niespójne (np. wyglądające amatorsko lub chaotycznie) drastycznie obniżają zaufanie.
|
||||
* **Unikanie "Frankensteina":** Podczas testów wielowariantowych uważaj, aby losowe łączenie elementów nie stworzyło nielogicznej całości.
|
||||
|
||||
### 4. Architektura Informacji i Przepływ (Flow)
|
||||
Zadbaj o to, aby użytkownik wiedział, gdzie jest i co ma zrobić.
|
||||
|
||||
* **Macierz (The Matrix):** Upewnij się, że na każdym etapie użytkownik otrzymuje odpowiednie wsparcie (informacje, zachęty) potrzebne do przejścia dalej.
|
||||
* **Przepływy wielostronicowe:**
|
||||
* Zaczynaj od małych, nieinwazyjnych próśb.
|
||||
* Dopiero gdy użytkownik zainwestuje czas (np. kliknie dalej), proś o trudniejsze dane (np. numer karty).
|
||||
* **Obsługa "Spadochroniarzy":** Użytkownicy mogą trafić na podstronę bezpośrednio z wyszukiwarki. Zapewnij im kontekst ("jesteś tutaj"), nawigację i jasną ścieżkę do konwersji.
|
||||
|
||||
### 5. Budowanie Zaufania i Oferta
|
||||
Elementy psychologiczne, które pomagają przełamać wahanie.
|
||||
|
||||
* **Uspokajanie nerwów:** Używaj dowodu społecznego (social proof) – recenzje, logotypy znanych klientów, certyfikaty bezpieczeństwa.
|
||||
* **Personalizacja:** Dostosuj treść do lokalizacji użytkownika, jego wcześniejszych zachowań lub źródła ruchu.
|
||||
* **Oferta:** Testuj różne warianty nagłówków, tekstów sprzedażowych i wezwań do działania (CTA).
|
||||
|
||||
### 6. Testowanie Cen (Pricing)
|
||||
Cena jest jedną z najważniejszych zmiennych ciągłych.
|
||||
|
||||
* **Elastyczność cenowa:** Testuj różne punkty cenowe, aby znaleźć szczyt krzywej zysku.
|
||||
* **Upselling:** Testuj oferty dodatkowe (równolegle lub seryjnie).
|
||||
|
||||
### Podsumowanie dla Dewelopera/Designera
|
||||
|
||||
1. **Wyczyść interfejs:** Usuń wszystko, co nie prowadzi do głównego celu (CTA).
|
||||
2. **Wyróżnij CTA:** Przycisk musi kontrastować z resztą strony.
|
||||
3. **Sprawdź nagłówki:** Upewnij się, że H1 na stronie pasuje do słów kluczowych kampanii reklamowej.
|
||||
4. **Zadbaj o "Above the Fold":** Kluczowa wartość i CTA muszą być widoczne bez przewijania.
|
||||
5. **Przygotuj się na testy:** Zbuduj stronę tak, aby łatwo było podmieniać sekcje w narzędziach do testów A/B.
|
||||
|
||||
---
|
||||
|
||||
## Część 2: Prompty do narzędzi AI
|
||||
|
||||
Poniżej znajdują się gotowe polecenia do narzędzi AI (ChatGPT, Claude, Gemini), które pomogą wdrożyć powyższe zasady. W miejscach w nawiasach kwadratowych `[WSTAW TUTAJ...]` wklej odpowiednie treści.
|
||||
|
||||
### 1. Spójność i "Zapach Informacji"
|
||||
*Cel: Upewnienie się, że reklama i strona mówią tym samym językiem.*
|
||||
|
||||
**Prompt:**
|
||||
> "Działaj jako ekspert od optymalizacji konwersji (CRO). Przeanalizuj poniższe dwa teksty pod kątem zasady 'Zapachu Informacji' (Information Scent).
|
||||
>
|
||||
> 1. Treść mojej reklamy/linku: `[WSTAW TREŚĆ REKLAMY]`
|
||||
> 2. Nagłówek i pierwszy akapit mojego Landing Page: `[WSTAW NAGŁÓWEK I TEKST]`
|
||||
>
|
||||
> Czy istnieje dysonans poznawczy? Czy użytkownik po kliknięciu w reklamę od razu wie, że trafił w dobre miejsce? Wypunktuj 3 konkretne zmiany w nagłówku strony, aby idealnie pasował do obietnicy z reklamy."
|
||||
|
||||
### 2. Struktura i "Mniej znaczy więcej"
|
||||
*Cel: Usunięcie rozpraszaczy i poprawa hierarchii wizualnej.*
|
||||
|
||||
**Prompt:**
|
||||
> "Oto lista wszystkich elementów, które znajdują się obecnie na moim Landing Page'u: `[LISTA ELEMENTÓW, NP. MENU GÓRNE, LINKI DO SOCIAL MEDIA, DŁUGI TEKST O HISTORII FIRMY, FORMULARZ, STOPKA Z LINKAMI]`.
|
||||
>
|
||||
> Opierając się na zasadzie 'Mniej znaczy więcej' i regule Pareto (80/20), wskaż mi:
|
||||
> 1. Które elementy są zbędnymi 'rozpraszaczami' i powinny zostać usunięte, aby nie odciągać uwagi od głównego celu (konwersji)?
|
||||
> 2. Które elementy powinny znaleźć się 'Above the Fold' (w widocznej części ekranu), aby użytkownik nie musiał przewijać?
|
||||
> 3. Jak uprościć nawigację, aby prowadziła tylko do celu?"
|
||||
|
||||
### 3. Architektura Informacji i "The Matrix"
|
||||
*Cel: Upewnienie się, że użytkownik otrzymuje odpowiednie wsparcie na każdym etapie.*
|
||||
|
||||
**Prompt:**
|
||||
> "Chcę stworzyć przepływ użytkownika zgodny z koncepcją 'The Matrix' (zapewnienie odpowiedniego wsparcia na każdym etapie). Moim celem jest `[NP. SPRZEDAŻ KURSU / ZAPIS NA NEWSLETTER]`.
|
||||
>
|
||||
> Przeanalizuj moją obecną ofertę: `[OPIS OFERTY]`.
|
||||
>
|
||||
> Zaproponuj strukturę strony, która odpowiada na pytania użytkownika w logicznej kolejności:
|
||||
> 1. Świadomość (Gdzie jestem? Co to jest?)
|
||||
> 2. Zainteresowanie (Dlaczego mnie to obchodzi?)
|
||||
> 3. Pożądanie (Dlaczego to jest lepsze od innych?)
|
||||
> 4. Akcja (Co mam zrobić?)
|
||||
>
|
||||
> Dla każdego etapu zaproponuj jeden element 'uspokajający nerwy' (np. dowód społeczny, gwarancja)."
|
||||
|
||||
### 4. Copywriting i Budowanie Zaufania
|
||||
*Cel: Przełamanie wahania użytkownika.*
|
||||
|
||||
**Prompt:**
|
||||
> "Mój Landing Page ma na celu `[CEL STRONY]`. Użytkownicy często wahają się przed kliknięciem przycisku CTA z powodu `[OBRAWA, NP. CENY, SPAMU, BRAKU CZASU]`.
|
||||
>
|
||||
> Napisz 3 warianty sekcji budującej zaufanie (Trust Elements), która znajdzie się tuż obok przycisku CTA. Wykorzystaj techniki takie jak:
|
||||
> - Dowód społeczny (Social Proof)
|
||||
> - Gwarancja bezpieczeństwa
|
||||
> - Rozwiewanie obiekcji
|
||||
>
|
||||
> Styl ma być profesjonalny, ale bezpośredni."
|
||||
|
||||
### 5. Generowanie pomysłów na testy A/B
|
||||
*Cel: Znalezienie zmian o największym potencjale (High Impact).*
|
||||
|
||||
**Prompt:**
|
||||
> "Chcę przeprowadzić test A/B mojego Landing Page'a. Zamiast testować drobne zmiany (jak kolor przycisku), chcę przetestować radykalnie inną koncepcję (Variable Cluster), aby uzyskać wyraźny wynik.
|
||||
>
|
||||
> Mój obecny nagłówek to: `[OBECNY NAGŁÓWEK]`.
|
||||
> Moja obecna oferta to: `[OBECNA OFERTA]`.
|
||||
>
|
||||
> Zaproponuj 3 radykalnie odmienne warianty podejścia do tej strony (np. zmiana skupienia z cech produktu na korzyści emocjonalne, zmiana modelu cenowego, drastyczne skrócenie treści)."
|
||||
|
||||
### 6. Master Prompt (z plikiem)
|
||||
*Jeśli korzystasz z modelu, który pozwala na wgranie pliku.*
|
||||
|
||||
**Prompt:**
|
||||
> "Wgrywam plik z wytycznymi dotyczącymi optymalizacji Landing Page'y. Działaj jako surowy audytor zgodny z tymi zasadami.
|
||||
>
|
||||
> Poniżej wklejam treść mojego obecnego Landing Page'a (lub przesyłam jego screenshot):
|
||||
> `[WKLEJ TREŚĆ LUB OBRAZ]`
|
||||
>
|
||||
> Przeprowadź audyt w oparciu o wgrany plik. Skup się na:
|
||||
> 1. Czy strona spełnia zasadę 'Zapachu Informacji'?
|
||||
> 2. Czy CTA jest wystarczająco wyizolowane i kontrastowe?
|
||||
> 3. Czy nie ma zbyt wielu linków wychodzących (leaky bucket)?
|
||||
> 4. Wskaż 3 najważniejsze rzeczy do zmiany, które dadzą największy zwrot (zgodnie z zasadą Pareto)."
|
||||
Reference in New Issue
Block a user