Analizator Hierarchii Wizualnej

Dane wejściowe

Design Description

Landing page: top has a small logo left, nav links right. Hero is a centered headline (~28px), a gray subhead, and a blue 'Sign up' button the same size as a secondary 'Learn more' button beside it. Below are three equal feature cards. The testimonial and pricing are far down, and there's a second identical CTA in the footer.

Design Type

landing

Analysis Focus

conversion

Wynik (fragment)

PROBLEMY HIERARCHII (konwersja): 1) Nagłówek 28 px jest zbyt cichy jak na hero — podnieś do 44–56 px, by wygrać pierwsze 3 sekundy. 2) Główne i drugorzędne CTA mają tę samą wagę — wycisz „Dowiedz się więcej” (styl ghost/tekst), by oko zaangażowało się w „Zarejestruj się”. 3) Cennik i referencje są pod długim przewijaniem — podciągnij jeden dowód blisko hero. 4) Dwa identyczne CTA dzielą uwagę; zróżnicuj sformułowanie. PRIORYTET: powiększ nagłówek + jedno dominujące CTA. Oczekiwany wzrost: jaśniejsza ścieżka skanowania, szybsza decyzja.

Dane wejściowe

Design Description

Newsletter email: full-width hero image with white text baked into it, a light gray body text on white background (~13px), one orange button, and a footer with tiny 10px legal text and low-contrast unsubscribe link.

Design Type

email

Analysis Focus

accessibility

Wynik (fragment)

PROBLEMY HIERARCHII DOSTĘPNOŚCI: 1) Tekst wpieczony w obraz hero jest niewidoczny dla czytników ekranu i znika, gdy obrazy są blokowane — przenieś nagłówek do żywego HTML. 2) 13 px jasnoszary tekst na białym prawdopodobnie nie spełnia kontrastu WCAG AA — przyciemnij do co najmniej #595959 i podnieś do 15–16 px. 3) 10 px tekst prawny jest nieczytelny — min. 12 px. 4) Niskokontrastowy odlink grozi zgodnością i zaufaniem — uczyń go wyraźnie widocznym. PRIORYTET: żywy tekst + kontrast. To poprawia też dostarczalność i skanowalność.

Dane wejściowe

Design Description

Analytics dashboard ported to mobile: a top row of four KPI cards squeezed side by side, a large line chart, then a dense data table with 8 columns. Everything is the same font size and weight, and the most important metric (revenue) sits third from left.

Design Type

dashboard

Analysis Focus

mobile

Wynik (fragment)

PROBLEMY HIERARCHII MOBILNEJ: 1) Cztery karty KPI w jednym rzędzie zgniatają się poniżej ~90 px szerokości — ułóż w siatkę 2x2 i prowadź od Przychodu, nie od trzeciej od lewej. 2) Jednolity rozmiar/waga oznacza, że nic nie prowadzi oka — uczyń metrykę hero ~2x większą i pogrubioną. 3) Tabela 8-kolumnowa jest bezużyteczna na mobile — przełącz na listę kart lub przewijanie poziome z przypiętą pierwszą kolumną. 4) Wykres potrzebuje przestrzeni nad tabelą. PRIORYTET: przearanżuj wg ważności + responsywna siatka KPI.