SEO Playbook · Element

Casetă de notă: Când și cum să o folosești

Folosește o casetă de notă pentru a clarifica conținutul din apropiere fără a modifica acțiunea, rezultatul, riscul sau prioritățile cititorului—și păstrează sfaturile și avertismentele distincte de fiecare dată.

15 min read

O casetă de notă izolează contextul care ajută un cititor să interpreteze conținutul din apropiere, dar nu schimbă ceea ce ar trebui să facă cititorul, ce rezultat să aștepte sau cât de gravă este situația.

Note
Mărcile temporale din rapoarte utilizează Timpul Universal Coordonat (UTC). Intervalul de date, filtrele și calculul rămân aceleași; doar fusul orar afișat diferă de cel local.

Acest exemplu redat clarifică o întrebare probabilă fără a adăuga un pas. Un cititor care o sărită poate folosi raportul corect. Un cititor care observă o diferență de timp primește contextul lipsă și poate continua fără a modifica fluxul de lucru.

De ce contează acest element

Cititorii scanează o pagină după prioritatea vizuală. O notă delimitată spune: „Acest context poate clarifica o întrebare, dar nu este o instrucțiune nouă.” Acest semnal reduce efortul necesar pentru a clasifica o remarcă secundară. Cititorul poate părăsi scurt argumentul principal, absorbi clarificarea și reveni în același punct fără să se întrebe dacă procesul s-a schimbat.

Elementul funcționează doar cât timp această promisiune rămâne de încredere. Dacă pașii obligatorii, mesajele de vânzare, definițiile, avertismentele și faptele de fundal primesc toate aceeași stilizare de notă, eticheta nu mai ajută. Cititorii trebuie să inspecteze fiecare casetă pentru a descoperi ce înseamnă, ceea ce adaugă mai multă sarcină cognitivă—efortul mental implicat în procesarea informațiilor—decât ar fi creat textul obișnuit.

Etichetele de severitate învață și comportamentul prin repetiție. Când un context inofensiv primește culori de avertizare, cititorii întâlnesc în mod repetat un semnal urgent fără nicio consecință semnificativă. Ei învață să treacă cu vederea peste el. Următorul avertisment real concurează apoi cu un istoric de alarme false. Folosirea greșită a stilizării de avertizare pentru note nu face doar o pagină melodramatică; slăbește întregul limbaj de risc al site-ului.

Pentru mașini, o notă tipizată oferă o limită și un scop explicite. Un instrument de migrare a conținutului poate reține blocul ca context suplimentar, în loc să îl îmbine într-un pas procedural. Un sistem de căutare sau un agent AI poate extrage nota împreună cu eticheta și corpul său, apoi o poate menține subordonată afirmației pe care o explică. Această relație este mai greu de recuperat dintr-un paragraf colorat cu albastru printr-o stilizare specifică paginii.

Extractibilitatea depinde totuși de redactare. „Acest lucru poate arăta diferit” nu este util în afara paragrafului său, deoarece subiectul lipsește. „Mărcile temporale din rapoarte utilizează UTC, nu ora locală a vizualizatorului” este autonomă. Regulile de redactare a elementelor au prioritate: clasifică pasajul după scopul său mai întâi, apoi aplică elementul înregistrat. Accentul vizual nu creează niciodată tipul semantic.

Când să îl folosești

Folosește o notă numai când toate cele patru condiții sunt adevărate:

  1. Pasajul clarifică o afirmație, valoare, instrucțiune, exemplu sau secvență din apropiere.
  2. Sărirea peste el nu schimbă acțiunea necesară, rezultatul așteptat, interpretarea corectă a afirmației principale sau nivelul de risc.
  3. Contextul răspunde la o întrebare plauzibilă a cititorului care altfel ar întrerupe înțelegerea.
  4. Pasajul este suficient de autonom pentru a rămâne semnificativ atunci când este extras împreună cu eticheta sa.

Materialul bun pentru o notă include o convenție de fus orar, un alias de denumire, o limită de domeniu deja implicată de textul principal, o diferență inofensivă de interfață între versiuni sau o explicație pentru o stare de afișare așteptată. De exemplu: „Butonul este etichetat Salvare în conturile lunare și Aplicare în conturile anuale; ambele trimit aceleași setări.” Acțiunea și rezultatul cititorului nu se schimbă.

Aproapele de țintă contează, deoarece „informație suplimentară utilă” este o definiție prea largă:

  • Un fapt necesar pentru a înțelege următorul paragraf aparține explicației principale. Ascunderea lui într-o notă face ca înțelegerea esențială să pară opțională.
  • O cerință preliminară aparține înaintea procedurii. Dacă munca nu poate începe fără acces de administrator, accesul nu este un context suplimentar.
  • O tehnică opțională care face munca mai rapidă sau mai bună aparține unei caste de sfat . Un sfat schimbă calitatea sau eficiența rezultatului; o notă nu.
  • O condiție care previne ștergerea, costul, expunerea, vătămarea sau munca invalidă aparține unei caste de avertizare . Scopul său este de a schimba comportamentul înainte de producerea răului.
  • O definiție formală care stabilește ce înseamnă un termen aparține elementului de definiție sau explicației principale, nu unei note.
  • O citare aparține lângă afirmația pe care o susține. Dovezile nu sunt o remarcă secundară atunci când afirmația depinde de ele.
  • O promovare, un îndemn de înscriere sau o recomandare de produs este un îndemn la acțiune, nu o informație.

Folosește testul fără schimbare când clasificarea este incertă: „Dacă cititorul află acest fapt, trebuie să schimbe o acțiune, așteptare, decizie sau răspuns de siguranță?” Dacă da, nu este o notă. Dacă nu, întreabă dacă faptul clarifică o ambiguitate reală. Dacă nu, șterge-l sau păstrează-l ca text obișnuit, în loc să creezi accent artificial.

Unde să îl plasezi

Plasează o notă imediat după blocul de conținut complet pe care îl clarifică. Ținta poate fi un paragraf, element de listă, pas, tabel, eșantion de cod sau secvență scurtă, dar ținta trebuie să aibă sens înainte ca nota să apară. Nota oferă apoi context suplimentar fără a fragmenta ținta.

Când o notă se aplică unei întregi secțiuni, plaseaz-o după paragraful de început care definește domeniul secțiunii. Numește acel domeniu în prima propoziție a notei. Când se aplică unei proceduri, plaseaz-o după paragraful introductiv și înaintea primului pas doar dacă nicio acțiune nu se schimbă; altfel, conținutul este o cerință preliminară sau un avertisment. O notă despre un rezultat aparține după ce rezultatul este introdus, nu la câteva paragrafe mai târziu.

Folosește cel mult trei note pe pagină și una pe secțiune. Trei este un plafon. Dacă mai multe note se adună în jurul unui singur pasaj, probabil textul principal lipsește o explicație sau materialul merită o subsecțiune dedicată.

O notă nu poate fi plasată:

  • Între un titlu și paragraful său de început.
  • Între o afirmație și dovezile care o susțin.
  • Între o instrucțiune și verificarea de succes necesară.
  • Direct lângă un sfat, avertisment, CTA, banner promoțional sau altă notă.
  • În interiorul unei celule de tabel, răspuns de întrebări frecvente, citat, bloc de cod, panou accordion sau alt callout.
  • Într-un hero doar pentru a crea interes vizual, cu excepția cazului în care o specificație de element redă exemplul său live necesar.
  • La sfârșitul unei pagini când ținta sa a apărut mult mai devreme.

Dacă adiacența ar crea un teanc de casete, mută nota în text sau restructurează secțiunea. Nu rezolva coliziunea schimbând o notă la culori de avertizare; prezentarea nu poate repara o relație de conținut neclară.

Anatomie

Nota redată are patru regiuni vizibile sau structurale:

  1. Etichetă de tip: Cuvântul vizibil „Notă,” care identifică blocul fără a se baza pe culoare sau pictogramă.
  2. Titlu opțional: O frază scurtă și factuală care numește contextul, cum ar fi „Fus orar” sau „Etichete de interfață.”
  3. Corp: O clarificare autonomă și, atunci când este util, o propoziție care o conectează la conținutul din apropiere.
  4. Țintă adiacentă: Blocul complet sau secvența denumită care este clarificată. Plasarea poartă această relație chiar dacă nu este un câmp de text autorat.

Marginile, fundalurile, pictogramele, spațierea și stilurile de tipar aparțin motorului de redare. Autorii furnizează sens, nu instrucțiuni de culoare sau simboluri decorative.

Exemple de design

Variantele suportate testează conținutul și comportamentul receptiv. Ele nu creează niveluri diferite de importanță.

Implicit: Motorul de redare furnizează „Notă,” iar corpul conține o clarificare. Folosește această formă cel mai des.

Titlu personalizat: Un titlu factual identifică subiectul. Nu crește severitatea și nu înlocuiește semantica de notă a componentei.

Maximum două paragrafe: Primul paragraf enunță contextul; al doilea clarifică o limită sau o excepție inofensivă. Explicațiile mai lungi devin conținut normal.

Referință inline: O valoare de cod inline sau un link descriptiv poate clarifica ținta. Niciuna nu ar trebui să transforme nota în documentație în cadrul documentației.

Viewport îngust: Eticheta, titlul și corpul își păstrează ordinea de citire, se împachetează normal și rămân ușor de înțeles fără margine sau pictogramă.

Parametri

Modelul de conținut separă tipul semantic fix, denumirea opțională, corpul și relația cu conținutul din apropiere. „Sursă” indică de unde obține autorul sau motorul de redare valoarea.

NumeTipObligatoriuMin/maxImplicitSursă
typeEnumDaExact notenoteNumele directivei sau atributul shortcode
titleȘir simpluNu1–6 cuvinte; maximum 50 de caractereNotăAtribut; implicitul motorului de redare când este omis
bodyMarkdown limitatDa15–90 cuvinte; 1–2 paragrafe scurteNiciunulCorpul directivei sau shortcode-ului
inlineLinkURL plus ancorăNu0–1 linkOmisCorp
inlineCodeSpan de cod inlineNu0–2 valori scurteOmisCorp
targetRelație documentDaExact un bloc din apropiere sau o secvență denumităBlocul de conținut complet anteriorPlasarea în ordinea documentului
labelȘir simplu derivatDaO etichetă semantică vizibilăNotăMotorul de redare din type

Titlul este opțional deoarece „Notă” este de obicei suficient. Primul titlu al directivei portabile se poate mapa la title sub regulile implicite ale corpului, dar forma concisă de atribut este preferată pentru acest element. Orice altceva se mapează la body. Implementarea Hugo actuală acceptă un tip pozițional sau un type denumit, plus un title denumit opțional; nu amesteca niciodată parametrii poziționali și cei denumiți.

Sintaxă și exemple de cod

Aceste forme poartă același tip, titlu și corp. Prezentarea platformei poate diferi, dar clarificarea trebuie să rămână o notă.

Directivă Markdown portabilă

:::note{title="Fus orar"}
Mărcile temporale din rapoarte utilizează UTC. Filtrele și calculele nu se schimbă atunci când fusul orar local al vizualizatorului diferă.
:::

Numele directivei furnizează tipul, atributul furnizează titlul opțional, iar Markdown-ul inclus furnizează corpul.

Shortcode Hugo

{{< callout type="note" title="Fus orar" >}}Mărcile temporale din rapoarte utilizează UTC. Filtrele și calculele nu se schimbă atunci când fusul orar local al vizualizatorului diferă.{{< /callout >}}

Acest exemplu folosește doar parametri denumiți. Fără un titlu personalizat, forma pozițională callout note este validă, iar motorul de redare furnizează eticheta „Notă.”

Bloc WordPress sau shortcode

<!-- wp:amicited/note {"title":"Fus orar"} -->
<p>Mărcile temporale din rapoarte utilizează UTC. Filtrele și calculele nu se schimbă atunci când fusul orar local al vizualizatorului diferă.</p>
<!-- /wp:amicited/note -->
[note title="Fus orar"]Mărcile temporale din rapoarte utilizează UTC. Filtrele și calculele nu se schimbă atunci când fusul orar local al vizualizatorului diferă.[/note]

Blocul înregistrat este implementarea WordPress preferată. Un shortcode este acceptabil acolo unde acea instalare îl suportă în mod explicit; sistemele de import nu trebuie să aplatizeze nota într-un avertisment sau să deducă un alt tip din culorile sale.

Exemple

Bun: variație inofensivă de interfață

Etichete de interfață
Butonul de confirmare este etichetat Salvare în conturile lunare și Aplicare în conturile anuale. Ambele etichete trimit aceleași setări și duc la aceeași stare de confirmare.

Acesta este un exemplu bun deoarece răspunde la o întrebare plauzibilă de interfață, păstrând în același timp aceeași acțiune și același rezultat. Numește ambele etichete, spune unde apare fiecare și confirmă comportamentul lor echivalent. Nota are sens chiar și atunci când este extrasă din procedura înconjurătoare.

Rău: un avertisment deghizat în informație

Notă — Ștergerea spațiului de lucru: Ștergerea spațiului de lucru elimină permanent rapoartele acestuia. Exportă înregistrările necesare înainte de a continua.

Acesta este un exemplu rău deoarece consecința necesită o schimbare comportamentală înaintea unei acțiuni ireversibile. Un limbaj calm și o etichetă neutră nu o fac suplimentară. Trebuie să fie un avertisment plasat înaintea comenzii de ștergere, cu ținta, consecința și acțiunea preventivă declarate explicit.

O altă notă greșită spune: „Exportul trebuie să conțină toate coloanele necesare.” Acesta este un criteriu de acceptare. Pune coloanele necesare în instrucțiune sau în tabelul de specificații. O a treia spune: „Poți economisi timp filtrând exportul mai întâi.” Acesta este un sfat opțional care îmbunătățește rezultatul și, prin urmare, un sfat. Clasificarea corectă contează mai mult decât varietatea vizuală.

Marcare schema și accesibilitate

O casetă de notă nu are un tip sau o proprietate Schema.org dedicată. Rămâne conținut vizibil în cadrul Article, TechArticle, de produs sau al altui tip de schemă veridică la nivel de pagină. Nu crea un obiect JSON-LD independent pentru ea. Când o notă clarifică un pas, păstreaz-o separată de HowToStep.text decât dacă clarificarea este necesară pentru a executa pasul; dacă este necesară, nu a fost conținut opțional de notă de la început.

O notă statică nu are nevoie de role="alert", de o regiune live ARIA sau de anunțare forțată. Aceste mecanisme comunică urgență sau schimbare dinamică, în timp ce o notă este prezentă în ordinea normală a documentului și poartă context non-urgent. Anunțarea agresivă ar denatura importanța sa și ar face ieșirea tehnologiei de asistență mai zgomotoasă.

Randează eticheta vizibilă ca text în Modelul de Obiect al Documentului, nu ca imagine de fundal, tooltip doar cu pictogramă sau decor generat de CSS. Dacă se folosește un rol de regiune, conectează-i numele accesibil la eticheta vizibilă sau la titlul personalizat. Ordinea de citire este eticheta, titlul opțional, apoi corpul. Culoarea și pictogramele pot întări tipul, dar nu pot fi singura distincție față de sfaturi și avertismente.

La o zoom de text de 200% și pe un viewport îngust, corpul trebuie să se împacheteze fără derulare orizontală. Linkurile necesită text de ancoră descriptiv și trebuie să fie accesibile de la tastatură. Codul inline trebuie să rămână lizibil la contrast ridicat. Informațiile esențiale nu pot exista doar în captura de ecran a anatomiei sau în textul alternativ al unei pictograme.

Reguli de redactare

Țintește 15–60 de cuvinte. Maximul strict este 90 de cuvinte în cel mult două paragrafe scurte. Un pasaj mai lung merită de obicei integrarea în explicația principală; o notă extrem de scurtă este adesea o etichetă fără context util.

Scrie o clarificare per casetă, într-un ton calm și factual. Enunță subiectul în prima propoziție, apoi explică diferența sau limita inofensivă. Preferă formularea precisă precum „Mărcile temporale utilizează UTC” în loc de umplutură colocvială precum „Doar ca să știi.” Oferă motivul înaintea oricărei reguli interpretative: „Proiectele arhivate rămân vizibile în rapoartele istorice, deci totalurile lor pot apărea în continuare în intervalele de date trecute.”

O notă poate conține accent simplu, până la două valori scurte de cod inline și cel mult un link descriptiv. Nu trebuie să conțină niciodată:

  • Un pas obligatoriu, cerință preliminară, regulă de validare, criteriu de succes sau instrucțiune de recuperare.
  • Un risc semnificativ, consecință ireversibilă, condiție de siguranță, instrucțiune legală sau dezvăluire de costuri.
  • Sfat opțional al cărui scop este îmbunătățirea vitezei, calității, acurateței sau confortului.
  • O definiție completă, dovezi necesare pentru a susține o afirmație sau o listă de surse.
  • Mai mult de o clarificare independentă.
  • Un tabel, bloc de cod, formular, buton, CTA, testimonial, promovare sau element imbricat.
  • Glume, limbaj alarmist, emoji decorative sau cuvinte precum „critic” și „pericol.”

Nu intitula fiecare notă „Important.” Importanța nu este scopul elementului, iar cuvântul se apropie fals de severitatea unui avertisment. Folosește „Notă” sau un titlu de subiect factual. Nu folosi niciodată o notă pentru a salva un text neclar: repară mai întâi explicația principală, apoi păstrează o notă doar dacă rămâne o ambiguitate cu adevărat suplimentară.

Tipuri de postări care îl folosesc

Frontmatterul postTypes listează formatele în care contextul suplimentar revine. Includerea rămâne opțională; tabelul definește rolul și poziția permise, nu un slot obligatoriu.

Tip de postareUtilizare tipicăPozițieNu pune în notă
Ghid practicDiferențe inofensive de etichetă de interfață, versiune, fus orar sau stare de afișareDupă pasul complet sau rezultatul pe care îl clarificăCerințe preliminare, acțiuni obligatorii, verificări de succes sau recuperare în caz de eșec
Ghid finalLimite de domeniu, aliasuri terminologice sau excepții contextuale care nu alterează argumentulDupă paragraful care stabilește regula generalăDovezi, definiții necesare pentru înțelegere sau excepții majore
Pagina Ce-esteO variație de denumire sau o limită care previne o neînțelegere previzibilăDupă definiția de bază și primul paragraf explicativDefiniția canonică sau o calificare care îi modifică acuratețea
Pagină de produsContext inofensiv de disponibilitate, etichetă, unitate sau afișareLângă secțiunea factuală relevantă și departe de comenzile de cumpărareCondiții de preț, taxe recurente, cerințe de compatibilitate sau riscuri de cumpărare

Alte tipuri de postări pot folosi o notă atunci când același test fără schimbare este trecut. Faptul că sunt listate nu justifică adăugarea uneia pentru ritm vizual, iar omiterea nu transformă un avertisment în notă.

Listă de verificare QA

Înainte de publicare, verifică fiecare element:

  • Blocul clarifică un pasaj din apropiere și nu schimbă acțiunea, rezultatul, prioritatea, interpretarea sau riscul.
  • Contextul răspunde la o întrebare plauzibilă a cititorului, în loc să repete ținta.
  • Informațiile obligatorii rămân în conținutul principal.
  • Nota se află imediat după ținta sa completă sau după paragraful de domeniu pentru o secvență denumită.
  • Nu separă un titlu de introducerea sa, o afirmație de dovezi sau o instrucțiune de verificarea sa de succes.
  • Niciun avertisment, sfat, CTA, banner sau a doua notă nu se află direct lângă ea.
  • Pagina nu are mai mult de trei note, iar secțiunea nu are mai mult de una.
  • Corpul țintește 15–60 de cuvinte, rămâne sub 90 de cuvinte și conține o clarificare.
  • Eticheta text vizibilă supraviețuiește fără culoare, margine, pictogramă sau imagine.
  • Textul rămâne semnificativ atunci când este extras cu eticheta sa, dar fără stilizarea înconjurătoare.
  • Caseta nu folosește niciun rol de alertă sau regiune live atunci când este prezentă la încărcarea paginii.
  • Mapările Markdown, Hugo și WordPress păstrează tipul, titlul, corpul și plasarea.
  • Parametrii Hugo sunt în întregime poziționali sau în întregime denumiți; nu sunt niciodată amestecați.
  • Niciun component imbricat nesuportat, bloc de cod, tabel, formular sau acțiune promoțională nu apare în interior.
  • Marcatorii de capturi de ecran solicită capturi viitoare fără a reda active inexistente.

Întrebări frecvente

Care este diferența dintre o notă, un sfat și un avertisment? O notă clarifică fără a schimba nimic. Un sfat oferă o îmbunătățire opțională. Un avertisment schimbă comportamentul pentru a preveni vătămarea, pierderea, costul, expunerea sau munca invalidă. Clasifică după consecința săririi blocului, nu după culoarea sa.

Poate o casetă de notă să conțină informații obligatorii? Nu. Informațiile obligatorii aparțin conținutului principal, unde fiecare cititor le întâlnește în ordine. O notă poate explica o variație inofensivă, dar sărirea peste ea nu poate face sarcina sau interpretarea incorectă.

Câte casete de notă ar trebui să conțină o pagină? Folosește cel mult trei pe pagină și una pe secțiune. Majoritatea paginilor au nevoie de mai puține. Notele repetate indică faptul că explicația principală trebuie restructurată.

Ar trebui o casetă de notă să folosească culori de avertizare sau un rol de alertă? Nu. Prezentarea de avertizare semnalează o consecință materială, iar role="alert" semnalează informații dinamice urgente. Aplicarea oricăreia la context obișnuit învață oamenii să ignore semnalul real și induce în eroare utilizatorii de tehnologie de asistență.

Poate o casetă de notă să conțină linkuri sau cod? Poate conține un link descriptiv sau până la două valori scurte de cod inline atunci când acestea clarifică direct ținta. Folosește conținutul principal pentru blocuri de cod, tabele, formulare sau documentație în mai mulți pași.

O notă își merită granița prin clarificarea unei ambiguități reale, lăsând în același timp cursul cititorului neschimbat. Păstreaz-o calmă, adiacentă, autonomă și distinctă vizual de sfaturi și riscuri.

← All SEO Playbook guides

Gata să pui în practică?

Verificare gratuită · Perioadă de încercare de 7 zile · fără card de credit