Le intestazioni sono vitali per qualsiasi contenuto della tua pagina web poiché servono non solo ai lettori ma anche ai motori di ricerca. Intestazioni accattivanti e ben scritte hanno il potenziale per attirare i lettori verso il tuo post e aumentare i clic. Le intestazioni possono variare da H1 a H6, a seconda della gerarchia dei contenuti. Il titolo principale della tua pagina o articolo è H1, mentre H2 sono i sottotitoli che compongono le sezioni dei tuoi documenti. Le intestazioni da H3 a H6 forniscono ulteriori sottotitoli nel documento sotto H2. Prima di passare a come il tema Astra può aiutarti a creare intestazioni straordinarie nei tuoi contenuti, consideriamo l'importanza delle intestazioni
Sommario:
Ecco perché devi assicurarti di includere le intestazioni nel tuo testo
Le intestazioni svolgono un ruolo essenziale affinché i motori di ricerca e i lettori scelgano le parole chiave che stanno cercando nell'articolo. L'intestazione principale del testo aiuta a identificare l'argomento del materiale, mentre i sottotitoli indirizzano il lettore verso l'area di interesse.
Le persone oggi utilizzano principalmente gli screen reader per sfogliare qualsiasi contenuto. Le intestazioni di qualsiasi contenuto vengono facilmente rilevate dagli screen reader e sono essenziali per utilizzare in modo efficace gli screen reader. Permettono inoltre ai lettori di saltare da un titolo all'altro per arrivare all'argomento richiesto.
Quando le intestazioni rendono identificabile il tuo argomento, i motori di ricerca classificano la tua pagina per le query di ricerca. Più rendi le tue intestazioni ben redatte e riempite con parole chiave appropriate, più i motori di ricerca aumenteranno il tuo posizionamento.
Ecco una guida sull'utilizzo delle funzionalità gratuite del tema Astra per creare straordinarie intestazioni per le tue pagine. Segui la procedura per creare un'intestazione a tua scelta.
Utilizzando le intestazioni, rendi le pagine il più scansionabili possibile. È risaputo che nessuno legge l’intero articolo, soprattutto riga per riga. Ecco perché è importante che le pagine abbiano intestazioni. Tra tutte le intestazioni, quella più importante è la prima in quanto dà il tono all'intero post o pagina.
Poi c'è il sottotitolo che divide il contenuto in parti più adatte al consumo. Non solo, la struttura dell'articolo è mostrata dalle intestazioni e dai sottotitoli. In breve, il giusto set di intestazioni significa che puoi attirare il pubblico con i tuoi contenuti accattivanti.
Con il tempo, il mobile sta diventando più dominante che mai. Non c’è dubbio che i siti riceveranno più traffico dai dispositivi mobili che mai. Quindi, se inserisci i tuoi contenuti nel modo giusto, otterrai sicuramente spettatori sia da dispositivi mobili che da desktop.
In breve, le intestazioni ottimizzano la pagina web non solo per i lettori ma anche per i motori di ricerca.
Per prima cosa, per accedere ad Astra Header Builder, accedi alla dashboard di WordPress e, dalla barra laterale di sinistra, vai su Aspetto > Opzioni Astra > Header Builder come mostrato nell'immagine seguente:
Fai clic su di esso e ti porterà alla sezione Header Builder nel personalizzatore WordPress. L'interfaccia dovrebbe essere simile a quella che abbiamo qui:
Come puoi vedere, il generatore di intestazioni è diviso in tre sezioni verticali, una impilata sull'altra. Hai l'"intestazione primaria" al centro con un "sopra l'intestazione" in alto e "sotto l'intestazione" in basso.
Ogni intestazione ha il proprio set di "impostazioni dell'intestazione", a cui puoi accedere facendo clic sull'icona a forma di ingranaggio a sinistra dell'intestazione.
Da qui puoi personalizzare l'altezza dell'intestazione, la dimensione del bordo, lo sfondo, il riempimento e il margine.
Inoltre, nota come ciascuna intestazione è divisa in tre sezioni. Puoi aggiungere e rimuovere elementi di intestazione da queste sezioni per renderle più funzionalità. Al momento della stesura di questo tutorial, hai accesso a 12 elementi di intestazione:
Ora, per aggiungere un nuovo elemento di intestazione, passa il mouse su quella sezione e fai clic sul pulsante “+”. Verrà visualizzato un elenco di elementi disponibili. Scegli quello che desideri utilizzare e verrà aggiunto alla sezione dell'intestazione.
Allo stesso modo, basta fare clic sul pulsante “x” accanto all’elemento di intestazione per rimuovere un elemento di intestazione.
Puoi anche spostare gli elementi dell'intestazione tra le sezioni dell'intestazione semplicemente trascinandoli.
Tutti gli elementi dell'intestazione che hai utilizzato verranno visualizzati nel menu a sinistra, proprio sotto la scheda Generale. Qui sotto troverai anche l'opzione per modificare il tipo di intestazione. Gli utenti gratuiti hanno solo l'opzione per "Intestazioni trasparenti". Tuttavia, se utilizzi Astra Pro, puoi abilitare "Intestazioni permanenti".
Da qui è possibile accedere alle impostazioni specifiche dell'elemento di intestazione.
Proprio accanto alla scheda Generale, abbiamo la scheda Progettazione. Da qui, ottieni alcune opzioni di progettazione di base per modificare la larghezza e il margine dell'intestazione. Per gli utenti Astra Pro sono disponibili impostazioni più avanzate.
Astra Header Builder ti consente inoltre di ottimizzare l'aspetto dell'intestazione del sito su schermi di diverse dimensioni come desktop, dispositivo mobile o tablet. Per scegliere una dimensione dello schermo diversa e personalizzarla, utilizza il selettore del dispositivo nell'angolo in basso a sinistra dello schermo.
Come puoi vedere, su uno schermo più piccolo, ottieni un'area aggiuntiva chiamata "Off Canvas". Ciò ti consente di risparmiare spazio sull'intestazione e spostare alcune cose fuori dallo schermo che i visitatori possono attivare se e quando necessario.
E con questo si conclude la nostra guida rapida su come creare un'intestazione utilizzando il tema Astra. Una volta che hai finito di aggiungere tutti gli elementi dell'intestazione e apportare le modifiche di progettazione necessarie, fai clic sul pulsante Pubblica e il gioco è fatto.
La tua intestazione Astra appena creata è ora attiva e funzionante sul tuo sito Web WordPress.
Nel tutorial sopra, abbiamo creato un'intestazione molto semplice utilizzando Astra Header Builder per darti un'idea di come funziona la funzionalità. Tuttavia, ci sono tantissimi strumenti e opzioni all'interno di Astra Header Builder che ti aiutano a creare intestazioni più complesse e sorprendenti.
Ecco una rapida occhiata alle varie opzioni a tua disposizione:
Intestazione primaria
L'intestazione predefinita in Astra è l'intestazione primaria. Mostrerà un logo e anche un menu di navigazione personalizzabile con varie impostazioni dell'intestazione principale in Astra.
Basta installare Astra e andare alla sezione Intestazione per scegliere l'opzione dell'intestazione primaria e accedere alla personalizzazione. Intestazione > Intestazione primaria
È possibile utilizzare le seguenti impostazioni di personalizzazione
Disposizione
Le impostazioni del layout gestiranno la posizione del logo per la tua pagina. In Astra sono disponibili tre diverse posizioni per il logo
Logo sinistro
Il logo in questa impostazione si sposta sul lato sinistro del menu di navigazione. È uno stile tipico di posizionamento di un logo.
Logo destro
Il logo in questa impostazione si sposta sul lato destro del menu di navigazione.
Logo del Centro
Il logo in questa impostazione si sposta al centro sopra il menu di navigazione. È una buona opzione nel caso di un menu lungo.
Larghezza
Le impostazioni di larghezza gestiscono la larghezza dell'intestazione del testo. Puoi personalizzare la larghezza dell'intestazione come
Larghezza intera
Nelle impostazioni a larghezza intera, l'intestazione verrà allungata da entrambe le estremità e si adatterà alle dimensioni della pagina del browser.
Larghezza contenuto
Nelle impostazioni della larghezza del contenuto, l'intestazione si regola in base alla larghezza del contenitore impostata e puoi impostarla selezionando quanto segue
Globale > Contenitore > Larghezza
Confine
Selezionando il bordo, puoi aggiungere un bordo sotto l'intestazione e personalizzarne il colore e la larghezza.
Intestazione mobile
Il menu di navigazione, sui dispositivi responsive, si trasforma in un hamburger. Pertanto, l'intestazione principale di questi dispositivi visualizzerà solo il menu hamburger e il logo. Puoi personalizzare il layout del logo relativo al menu nei widget reattivi.
Pila
Nell'opzione Stack, il logo si sposterà sopra il menu dell'hamburger. Optare per lo stack può rivelarsi utile se hai un logo grande.
In linea
Nell'opzione in linea, il logo e il menu saranno in linea tra loro e possono essere una buona opzione nel caso di un logo piccolo.
Temi di colore
Le intestazioni primarie possono essere presentate in vari colori utilizzando il tema Astra. I colori globali saranno disponibili gratuitamente, ma è necessario utilizzare il plugin aggiuntivo di Astra Pro per funzionalità più avanzate. Per utilizzare i colori globali in Astra, devi andare nella scheda Aspetto, selezionare Personalizza, quindi Globale e infine scegliere l'opzione Colori. Aspetto > Personalizza > Globale > Colori
Tipografia
Le impostazioni tipografiche della pagina o del sito si applicano automaticamente all'intestazione principale con Astra Theme. Puoi selezionare e personalizzare le impostazioni tipografiche accedendo alla scheda Aspetto, in Globale.
Aspetto > Personalizza > Globale > Tipografia
Intestazione trasparente
Le intestazioni trasparenti sono un modo semplice per creare intestazioni belle e accattivanti per la tua pagina. Lo sfondo dell'intestazione principale verrà impostato su trasparente e porterà il contenuto della pagina in alto. Il contenuto della pagina e l'intestazione principale si uniranno, il che significa che la parte superiore del contenuto diventerà lo sfondo dell'intestazione trasparente. Ad esempio, se l'immagine si trova nella parte superiore della pagina, salirà fino a diventare uno sfondo per l'intestazione trasparente.
Come aggiungere un'intestazione trasparente?
L'intestazione trasparente formula due rapidi passaggi per rendere la tua pagina attraente
Passaggio 1
Puoi trovare l'opzione dell'intestazione trasparente sotto il personalizzatore e quindi modificarla
Aspetto > Personalizza > Intestazione > Intestazione trasparente
Passaggio 2
Sotto le opzioni dell'intestazione trasparente, puoi abilitarlo per l'intero sito Web, scegliere il bordo in basso, le combinazioni di colori e il layout del logo
Abilitazione sul sito Web completo
Se desideri impostazioni di intestazione trasparenti per l'intero sito web, puoi abilitare questa opzione selezionando la casella di controllo. Se spunti la casella, ci sono ancora alcune regole di esclusione che puoi abilitare per post o pagine specifiche. Puoi disabilitare l'opzione di intestazione trasparente per le pagine seguenti
Disabilita su Archivi, Ricerca e su 404
L'impostazione dell'intestazione trasparente può essere disabilitata su queste pagine speciali selezionando la casella di controllo.
Disabilita nella pagina Indice del blog
La prima pagina del tuo blog diventa la pagina indice del blog se modifichi le impostazioni dalla tua home page. Per creare una pagina indice del blog, puoi andare alle impostazioni della home page e nella scheda "Visualizzazione della tua home page", scegli "I tuoi ultimi post".
Visualizzazione della tua home page > I tuoi ultimi post
Se desideri disabilitare le impostazioni dell'intestazione trasparente nella pagina dell'indice del blog, puoi selezionare la relativa casella.
Disabilita sulle pagine
Se vuoi disabilitare l'opzione dell'intestazione trasparente su tutte le pagine, seleziona la casella di controllo.
Disabilita sui post
Se vuoi disabilitare l'opzione dell'intestazione trasparente su tutti i post, seleziona la casella di controllo.
Colori e sfondo
Puoi personalizzare lo sfondo e le impostazioni del colore dell'intestazione trasparente con le seguenti opzioni disponibili
Pro
Contro
Astra è uno dei migliori temi in circolazione. E, se lo stai utilizzando, sei sulla strada giusta per mantenere il tuo sito.
Il tema gratuito di Astra ti consente di progettare intestazioni belle e accattivanti per la tua pagina web. Sono inoltre disponibili l'opzione e la personalizzazione di un'intestazione trasparente, che può migliorare l'esperienza dello spettatore. Nel complesso, molte scelte di personalizzazione dell'intestazione nel tema Astra ti consentono di creare un'intestazione straordinaria.
Le intestazioni e i piè di pagina di un sito Web sono elementi essenziali. Nella maggior parte dei casi, l'intestazione fornisce la navigazione...
Due dei temi WordPress più popolari sul mercato sono Astra e OceanWP. Professionale…
Per creare un eccellente sito Web di notizie non è necessario che tu diventi un web designer. Noi…
Il tema Giornale è uno dei temi WordPress più significativi progettati da tagDiv, un...
Quando si tratta di creare un negozio online, WooCommerce è il plugin di riferimento. Esso…
Un'intestazione è generalmente la prima cosa che una persona vede quando visita il tuo sito web,...
Visualizza commenti
Bonjour, j'ai compris comment faire un entête trasparente mais pas comment vous avez fait pour mettre l'arrière plan bleuté-dégradé juste en haut de page dietro il menu... Comment avez-vous fait ?
Questa è solo l'immagine di sfondo che ha questo colore e poiché l'intestazione è trasparente... :)
Buon giorno,
Merci beaucoup pour toutes ces infos. Pourriez-vous svp m'aider ?
J'aimerai cééer l'entête Astra uniquement sur ma page d'accueil. Mais soit elle s'affiche sur toutes les page soit sur aucune... Comment je peux faire ?
Il mio sito è attualmente in modalità manutenzione.
En vous remerciant par avance
Salve, l'assegnazione dell'intestazione Astra deve essere effettuata per pagina, in ciascuna impostazione di pagina. Nell'impostazione Astra è solo un'assegnazione globale.