# Hero blokk

> Választható modulblokk adminban kezelhető változatokkal.

- **Eredeti HTML oldal:** [https://weboldal-berles.hu/tudasbazis/oldalepito/hero-blokk](https://weboldal-berles.hu/tudasbazis/oldalepito/hero-blokk)

### Mire érdemes használni?

Az oldal nyitó, elsőként látható szakasza. Akkor használd, amikor néhány másodperc alatt szeretnéd elmondani, mivel foglalkozol, kinek segítesz és merre lépjen tovább a látogató.

A Hero blokk főcímet, rövid magyarázatot, képet vagy videót és fontos CTA-gombokat kapcsol össze. A változatok között osztott képes, carousel, teljes háttérképes, háttérvideós és videó + tartalom megjelenés is található hang/néma móddal, Modern/Elegáns/Technikai laptop- vagy mobilkerettel, opcionális keretszínnel, kikapcsolható videós meta kártyával, valamint külön desktop és mobil videóággal.

### Fő lehetőségek

- Fő üzenet, rövid leírás és legfontosabb cselekvési gombok megjelenítése.
- Kapcsolható, szerkeszthető bizalmi sor a CTA-k alatt.
- Kép, képsorozat, teljes szélességű háttérkép vagy háttérvideó használata.
- Kép-ALT, igazítás, parallax, magasság és videóviselkedés kezelése a választott változattól függően.
- FFmpeg elérhetőség esetén a feltöltött Hero videókból – külön desktop és mobil videóág esetén mindkét videóból – automatikusan 360p/480p/720p/1080p MP4 és WebM lépcsők, hangos/némított kimenetek és poster kép készülnek; az admin mutatja az eredeti és generált fájlok méretét, a csere/törlés után pedig a nem használt videógenerátumok is takaríthatók.

### Használati javaslatok

- A főcím legyen konkrét, a leírás pedig legfeljebb néhány rövid mondat.
- A nyitóképet optimalizáld webre, mert ez gyakran az oldal LCP-eleme.
- Az elsődleges gomb a legfontosabb üzleti célra vezessen.

### Elérhető változatok

Megjelenési változat

#### Kép és tartalom

Klasszikus nyitó szakaszhoz, amikor a fő üzenet és egy bemutatkozó kép azonos súllyal fontos.

Megjelenési változat

#### Videó és tartalom

Videós bemutatkozáshoz, amikor a fő üzenet mellé saját videó, laptopos desktop bemutató vagy mobilkeretes álló videó kerül.

Megjelenési változat

#### Kép és tartalom carousel

Akkor ajánlott, ha a nyitó üzenet mellett több kép segítségével szeretnéd bemutatni a szolgáltatást, terméket vagy referenciákat.

Megjelenési változat

#### Teljes szélességű háttérkép

Erős, teljes szélességű vizuális nyitáshoz, amikor egyetlen karakteres háttérkép adja az oldal hangulatát.

Megjelenési változat

#### Teljes szélességű háttérvideó

Mozgó, látványos nyitófelülethez, például helyszín, gyártási folyamat, rendezvény vagy szolgáltatási élmény bemutatására.

Megjelenési változat

#### Teljes szélességű kép carousel

Több teljes szélességű, külön címmel és leírással rendelkező kiemelt üzenet bemutatására.

Megjelenési változat

#### Illusztratív referencia carousel

Ügyfélspecifikus referencia herohoz, amikor a nyitó szakaszban weboldal-preview keretben szeretnénk bemutatni valós referenciákat.

Megjelenési változat

#### Teljes szélességű illusztratív referencia carousel

Ügyfélspecifikus, teljes szélességű referencia herohoz, amikor a nyitó szakasz hátterét valós referencia-képek adják.

A blokk az oldal egy önálló szerkezeti egysége. A hozzá tartozó változatok eltérő elrendezést adnak ugyanahhoz a célhoz.

## Gyakorlati tudnivalók

- Elérhető változatok: Kép és tartalom, Videó és tartalom, Kép és tartalom carousel, Teljes szélességű háttérkép, Teljes szélességű háttérvideó, Teljes szélességű kép carousel, Illusztratív referencia carousel, Teljes szélességű illusztratív referencia carousel.

## Kulcsszavak

- Hero blokk
- hero-blokk
- blokk
- mire használható
- változatok