Ce este: WYSIWYG (What You See Is What You Get - Ceea ce vezi este ceea ce primești)

WYSIWYG este un acronim pentru What You See Is What You Get (Ce vezi este ceea ce primești). Este folosit pentru instrumente unde creezi/editezi conținut în timp real și vezi o previzualizare live pe măsură ce lucrezi.

Acești editori sunt incredibil de utili online, mai ales atunci când creați conținut pentru site-uri web. Fie că scrieți o postare de blog, creați un e-mail sau proiectați o pagină web, un editor WYSIWYG face munca mai ușoară și mai eficientă.

Ceea Ce Vezi Este Ceea Ce Primești WYSIWYG

De ce să folosiți un editor WYSIWYG?

Editorii WYSIWYG vin cu multe funcționalități care vă îmbunătățesc procesul de creare a conținutului. Funcționalitatea și aspectul sunt, în general, aceleași, indiferent dacă aveți un site web WordPress sau utilizați un alt sistem de management al conținutului (CMS).

În cea mai mare parte, veți constata că toate au următoarele caracteristici:

Formatare Text: Acești editori vă permit să puneți textul îngroșat, cursiv, subliniat și tăiat, la fel cum ați face într-un procesor de text. De fapt, aceștia sunt adesea numiți editori de text îmbogățit, deoarece vă permit să editați conținutul într-un mod familiar, la fel ca în Microsoft Word.
Linkuri: Puteți adăuga cu ușurință linkuri la conținutul dvs. pur și simplu făcând clic pe un buton dintr-o bară de instrumente și lipind URL-ul. Nu va trebui să adăugați sau să editați cod HTML pentru a crea conținutul dvs.
Imagini: Adăugarea imaginilor este o joacă de copil. Le puteți încărca direct de pe dispozitivul dvs. sau le puteți insera dintr-o sursă online. Mulți editori WYSIWYG vă vor permite chiar să lipiți o imagine direct inline.
Crearea de Tabele: Ai nevoie să prezinți datele într-un mod ordonat? Editorii WYSIWYG îți permit să creezi tabele în conținutul tău fără a apela la alte aplicații web, cum ar fi Google Sheets, sau fără a avea nevoie de integrări speciale.

Dar asta nu e tot. Editorii WYSIWYG oferă, de asemenea, funcționalități precum verificarea ortografiei, vizualizarea codului sursă și multe altele. Toate aceste funcționalități vă permit să vă concentrați mai ușor pe crearea de conținut de calitate, fără să vă faceți griji cu privire la învățarea PHP, CSS sau design web.

Funcționalitate suplimentară a editorilor WYSIWYG

Pe lângă cele de mai sus, editorii WYSIWYG tind să aibă o mulțime de funcții concepute pentru a simplifica și îmbunătăți procesul dvs. de creare a conținutului.

Majoritatea editorilor WYSIWYG au corectură ortografică încorporată. Acest instrument încorporat este destul de util, subliniind automat cuvintele scrise incorect, ajutându-vă să evitați orice greșeli de scriere jenante în conținutul dvs.

O altă parte extrem de vitală a WYSIWYG este vizualizarea codului HTML. Aceasta vă permite să comutați fără probleme între vizualizarea de design și cea de marcare.

Vizualizarea codului HTML este perfectă atunci când trebuie să depanați lucruri.

Acestea pot fi lucruri precum probleme cu imaginile sau formatarea incorectă a textului din cauza copierii/lipirii.

Nici nu mai vorbim de faptul că mulți editori WYSIWYG vin cu un set robust de instrumente de design. De exemplu, editorul Gutenberg pentru WordPress este un instrument de design interactiv, drag-and-drop, care îți permite să scrii conținut și să folosești șabloane pentru a crea orice îți poți imagina chiar în fața ochilor tăi.

Interfața este întotdeauna ușor de utilizat, așa că, chiar dacă nu sunteți un expert în tehnologie, veți putea face ca conținutul dvs. să arate profesional și lustruit cu doar câteva clicuri.

Editorul de blocuri WordPress

Editorul Gutenberg a fost introdus în 2018 și a schimbat interfața utilizatorului pentru crearea de conținut cu WordPress.

În esență, Gutenberg este un editor bazat pe blocuri pe care îl puteți utiliza fie pe frontend, fie pe backend-ul site-ului dvs.

În loc să scrieți și să proiectați într-o singură zonă mare de text, ca într-un editor de text bogat precum TinyMCE, vă creați conținutul folosind blocuri individuale. TinyMCE este un editor WYSIWYG open-source folosit ca bază pentru editorul de conținut WordPress anterior, acum numit editorul clasic.

Acestea pot fi orice, de la paragrafe și titluri la imagini, videoclipuri, citate sau chiar elemente mai complexe, cum ar fi tabele sau marcaje HTML personalizate.

Fiecare bloc Gutenberg poate fi personalizat individual și mutat, oferindu-ți un control fără precedent asupra aspectului și designului conținutului tău. Poți chiar folosi designuri predefinite numite Șabloane (Patterns) pentru a avea un șablon cu care să lucrezi chiar în editorul de blocuri.

Puteți muta blocurile în timp real și puteți vedea exact cum va arăta postarea dvs. de blog sau pagina de destinație înainte de a publica vreodată.

Gutenberg nu este singurul editor WYSIWYG pentru web design, totuși. Constructori de site-uri non-WordPress precum Squarespace oferă editare WYSIWYG, la fel și alte teme și plugin-uri WordPress precum SeedProd și Divi.

Interfața WSYIWYG a SeedProd este simplă și intuitivă, fie că editați text sau întregul dvs. aspect.

Multe dintre aceste instrumente au funcționalități mai avansate și o experiență de utilizare mai bună decât Gutenberg, astfel încât mulți utilizatori profesioniști încep să le folosească pe măsură ce își continuă îmbunătățirea abilităților de dezvoltare web.

Probleme comune în editarea WYSIWYG

Pe măsură ce începeți să folosiți editorii WYSIWYG mai frecvent, este inevitabil să întâmpinați unele probleme sau obstacole. Dar nu vă faceți griji! Majoritatea acestor probleme comune au soluții simple. Să aruncăm o privire la câteva dintre ele.

Probleme de formatare

O problemă comună pe care s-ar putea să o întâmpinați este formatarea. De exemplu, textul dvs. s-ar putea să nu se alinieze corect sau dimensiunea fontului s-ar putea să nu se ajusteze așa cum doriți. Acest lucru se datorează adesea textului copiat care aduce HTML, CSS sau chiar JavaScript suplimentar.

Pentru a remedia acest lucru, încercați să lipiți textul mai întâi într-un editor de text simplu, cum ar fi Notepad++. Apoi, copiați-l de acolo în editorul WYSIWYG. Acest lucru, de obicei, elimină orice cod suplimentar, permițând editorului WYSIWYG să formateze mai bine textul.

Acest lucru va elimina, de asemenea, linkurile și imaginile, deci va trebui să le reintroduceți folosind editorul de text îmbogățit sau vizualizarea codului HTML.

Imaginile nu se afișează

O altă problemă comună este că imaginile nu sunt afișate corect sau deloc. Acest lucru se poate datora faptului că adresa URL a imaginii este incorectă sau fișierul imaginii nu este suportat. Verificați întotdeauna dacă adresa URL este corectă. Dacă încărcați imagini, asigurați-vă că sunt într-un format potrivit pentru web, cum ar fi .jpg, .png sau .gif.

De exemplu, dacă utilizați un format precum .svg, WordPress necesită o ajustare suplimentară pentru a funcționa corect. Pentru mai multe informații, puteți consulta ghidul nostru despre cum să faceți fișierele SVG să funcționeze în siguranță cu WordPress.

Modificări neașteptate ale codului

Uneori, s-ar putea să descoperi că codul se modifică neașteptat după salvare. Editorii WYSIWYG nu sunt perfecți și pot adăuga HTML sau CSS suplimentar pe care nu l-ai intenționat. Acest lucru poate schimba aspectul și senzația conținutului tău.

Pentru a remedia acest lucru, ați putea comuta la vizualizarea codului HTML și să eliminați manual orice cod nedorit. Aveți grijă, totuși, deoarece aveți nevoie de o înțelegere de bază a marcajului HTML pentru a face acest lucru în siguranță.

Probleme de Compatibilitate cu Browserul

În cele din urmă, este posibil să întâmpinați probleme la vizualizarea conținutului pe diferite browsere. Nu toate browserele interpretează HTML și CSS în același mod, iar JavaScript poate acționa diferit în funcție de setările sistemului dvs.

Toate acestea pot duce la inconsecvențe în modul în care este afișat conținutul dvs. Testați întotdeauna site-ul dvs. în mai multe browsere, inclusiv Chrome, Firefox, Safari și Microsoft Edge, pentru a vă asigura că conținutul dvs. arată bine, indiferent unde este vizualizat.

Concluzii finale despre editorii WYSIWYG

Editorii WYSIWYG, precum editorul de blocuri Gutenberg din WordPress sau chiar editorul clasic mai vechi, open-source, TinyMCE, sunt instrumente vitale care vă pot simplifica semnificativ procesul de creare a conținutului.

Cu funcționalități precum editarea în timp real prin drag-and-drop, vizualizarea codului HTML și șabloane, aceste instrumente de web design vă permit să vă concentrați mai mult pe calitatea conținutului dvs. decât pe codare.

Sperăm că acest articol v-a învățat despre editorii WYSIWYG și cum vă pot ajuta să vă îmbunătățiți abilitățile de web design. Puteți, de asemenea, să consultați selecția noastră de experți cu cei mai buni constructori de pagini drag and drop pentru WordPress și ghidul nostru despre cum să alegi cel mai bun software de web design pentru site-ul tău.

Resurse suplimentare

Dacă ți-a plăcut acest articol, te rugăm să te abonezi la canalul nostru de YouTube pentru tutoriale video WordPress. Ne poți găsi, de asemenea, pe Twitter și Facebook.