Modulul 4 · 4.3
Meniuri și navigare
Modulul 4: Crearea de conținut · Timp de citire: 7 minute
Obiectiv de învățare: După această lecție veți putea crea un meniu clar, atât într-o temă cu blocuri, cât și într-o temă clasică, și veți ști ce înseamnă un meniu bun.
Concepte-cheie: bloc de navigare, Editor de site-uri, Aspect > Meniuri, locație de meniu, sub-meniu, link personalizat, meniu mobil, meniu de subsol, text de link, accesibilitate
Două moduri, în funcție de temă
Locul unde creați meniul depinde de tema dumneavoastră (lecția 5.1):
- Temă cu blocuri: meniul este un bloc de navigare în antetul site-ului. Îl editați în Editorul de site-uri (Aspect > Editor > Navigare, sau în partea de șablon Antet).
- Temă clasică: creați meniul la Aspect > Meniuri și alegeți acolo o locație de meniu oferită de temă, cum ar fi „Meniu principal” sau „Subsol”.
Nu vedeți Meniuri la Aspect, ci doar Editor? Atunci folosiți o temă cu blocuri. Aceasta este o confuzie frecventă după schimbarea temei: „meniul meu a dispărut”. Meniul vechi încă există (se află în baza de date ca o listă de elemente de meniu), dar noua temă caută în altă parte. În Editorul de site-uri puteți importa un meniu clasic existent la blocul de navigare.
Ce poate conține
Un element de meniu poate fi:
- o pagină sau un articol de pe site-ul dumneavoastră;
- o categorie (atunci face trimitere la arhiva acelei categorii);
- un link personalizat: orice adresă, inclusiv către un alt site, sau o ancoră în cadrul unei pagini (
/diensten/#prijzen); - într-o temă cu blocuri, și alte blocuri în navigare, cum ar fi un câmp de căutare, pictograme de rețele sociale sau un buton „Programează o întâlnire”.
Elementele de meniu pot fi plasate unele sub altele ca sub-meniu: într-o temă clasică trăgându-le ușor spre dreapta, în blocul de navigare cu „Adaugă sub-meniu” sau trăgând un element peste altul.
Un element de meniu face trimitere către o pagină, dar are o etichetă proprie. Dacă modificați ulterior titlul paginii, eticheta din meniu nu se modifică automat (într-un meniu clasic niciodată, în blocul de navigare depinde de modul în care ați adăugat elementul). Așadar, verificați și meniul după o modificare de titlu.
Un meniu bun
Un meniu nu este un cuprins al întregului dumneavoastră site. Este un indicator către cele câteva locuri unde doresc să ajungă majoritatea vizitatorilor. Câteva recomandări:
- Puține elemente principale: aproximativ cinci până la șapte. Mai mult oricum nu încape pe un telefon, iar vizitatorii nu le citesc.
- Cel mult un singur nivel de sub-meniu. Un sub-meniu în interiorul altui sub-meniu este greu de folosit pe telefon și derutant pentru cititoarele de ecran.
- Titlul unui sub-meniu este și el un link. În multe teme, un clic pe „Servicii” deschide sub-meniul, dar „Servicii” este și ea o pagină. Asigurați-vă că acea pagină există și afișează ceva relevant, sau că elementul este clar doar un titlu.
- Cuvinte obișnuite pe care le-ar folosi vizitatorii: „Prețuri”, nu „Oportunitățile noastre de investiții”.
- Contactul și acțiunea principală (programare, comandă) trebuie să fie întotdeauna accesibile, adesea în partea dreaptă a meniului sau sub formă de buton.
- Linkurile juridice (politica de confidențialitate, termeni și condiții, setări cookie-uri) aparțin unui meniu de subsol, nu meniului principal. Totuși, trebuie să fie întotdeauna ușor de găsit, pe fiecare pagină (lecția 9.3).
Mobil și accesibil
Pe un telefon, meniul se restrânge de obicei la un buton cu trei linii (meniul „hamburger”). La blocul de navigare stabiliți când se întâmplă acest lucru (întotdeauna sau doar pe ecrane mici). Testați-l întotdeauna pe un telefon real:
- Puteți atinge fiecare element cu degetul mare, fără a atinge din greșeală elementul de alături?
- Se deschid sub-meniurile la o atingere și se închid din nou?
- Se închide meniul atunci când alegeți un element?
Pentru accesibilitate (vizitatori care folosesc un cititor de ecran sau doar tastatura) aveți grijă la:
- Texte de link clare. „Citește mai mult” sau „Clic aici” nu spun nimic dacă un cititor de ecran citește toate linkurile unul după altul. „Citiți mai multe despre orele noastre de deschidere” spune ceva.
- Utilizare cu tastatura: cu Tab se parcurge meniul, cu Enter se deschide un element. Majoritatea temelor și blocul de navigare fac asta corect; meniurile personalizate cu scripturi adesea nu.
- Un link către un alt site este de preferat să se deschidă în aceeași fereastră. Dacă trebuie să se deschidă într-o fereastră nouă, menționați acest lucru.
Alte elemente de navigare
Pe lângă meniul principal, aceste elemente ajută vizitatorii să își găsească drumul:
- un câmp de căutare (blocul de căutare), mai ales pentru un site cu multe articole;
- breadcrumbs (fire de ariadnă) („Acasă > Servicii > Design web”), adesea oferite de un modul (plugin) SEO sau de temă;
- linkuri interne în textele dumneavoastră către alte pagini (bune și pentru vizibilitatea în căutare, lecția 9.2);
- o pagină 404 care ajută: cu un câmp de căutare și linkuri către paginile principale în loc de doar „nu a fost găsit”. Într-o temă cu blocuri, o editați ca șablon „404” în Editorul de site-uri.
În practică: cum arată într-un panou
În panoul de control al WordPress:
- Temă cu blocuri: Aspect > Editor > Navigare. Alegeți meniul, adăugați elemente cu semnul plus, trageți-le în ordinea dorită și alegeți la setările blocului de navigare când apare meniul mobil.
- Temă clasică: Aspect > Meniuri. Creați un meniu, bifați paginile în partea stângă și faceți clic pe Adaugă la meniu, trageți pentru a stabili ordinea, iar în partea de jos bifați locația de meniu. Salvați.
Rezumat
- Într-o temă cu blocuri, creați meniul cu blocul de navigare în Editorul de site-uri; într-o temă clasică, la Aspect > Meniuri cu o locație de meniu.
- Un meniu indică drumul către câteva locuri importante: puține elemente, cel mult un singur nivel de sub-meniu.
- Linkurile juridice aparțin unui meniu de subsol, întotdeauna ușor de găsit.
- Testați meniul mobil pe un telefon real și folosiți texte de link care spun ceva prin ele însele.
- Un câmp de căutare, linkuri interne și o pagină 404 utilă completează meniul.
Test (quiz)
Exercițiu
Exercițiu D4.3: Un meniu care funcționează. Creați (sau îmbunătățiți) meniul principal al site-ului dumneavoastră cu cel mult șapte elemente principale, un sub-meniu și un link personalizat, și un meniu de subsol cu politica dumneavoastră de confidențialitate. Testați meniul mobil pe telefon și doar cu tastatura (Tab și Enter). Bifați ce funcționează și notați: ce tip de temă aveți (cu blocuri sau clasică), unde ați creat meniul, și ce text de link ați îmbunătățit și cum?
Exercițiul D4.3: Un meniu care funcționează
Acest exercițiu îl faceți singur; nimeni nu îl verifică. Bifați ce ați făcut și marcați exercițiul ca finalizat.
La o temă cu blocuri, creați meniul în editorul de site (Navigare), la o temă clasică sub Aspect > Meniuri. Un text de link bun spune unde ajungeți: "Program de deschidere" în loc de "Faceți clic aici".
Bifele și notițele dumneavoastră rămân doar în acest browser; nu le trimitem nicăieri. Dacă sunteți autentificat, păstrăm în Cursurile mele doar faptul că ați finalizat exercițiul.
Lecturi suplimentare
Pentru lucrul în WordPress propriu-zis nu avem încă articole proprii; documentația oficială a WordPress este amplă.
- Blocul de navigare (wordpress.org, în engleză): https://wordpress.org/documentation/article/navigation-block/
- Meniuri în teme clasice (wordpress.org, în engleză): https://wordpress.org/documentation/article/appearance-menus-screen/
- Editorul de site-uri (wordpress.org, în engleză): https://wordpress.org/documentation/article/site-editor/
