Jamie Marsland recreează pagina de pornire WordPress.org în 20 de minute folosind editorul de blocuri

Ca răspuns la recenta controversă cu privire la cât de mult ar trebui să dureze implementarea noii designuri a paginii de pornire și a paginilor de descărcare ale WordPress.org, YouTuber-ul Gutenberg, Jamie Marsland, a decis să încerce să o recreeze cu editorul de blocuri.

Matt Mullenweg a comentat despre planurile pentru noile modele care trec în dezvoltare, spunând că ar fi trebuit să dureze „ore, nu săptămâni pentru implementare”. Cele mai incendiare comentarii ale sale, care au declanșat conversații ulterioare despre realitățile de lucru cu editorul de blocuri, au făcut referire la concurenții WordPress.

„Este un aspect atât de simplu, este greu de imaginat că durează o singură persoană mai mult de o zi pe Squarespace, Wix, Webflow sau unul dintre creatorii de pagini WP”, a spus Mullenweg.

Marsland a decis să accepte provocarea folosind Gutenberg. Pentru acest exercițiu a folosit cea mai recentă temă implicită a WordPress, Twenty Twenty-Two. Rezultatele sale nu sunt identice cu noile modele WordPress, dar sunt foarte apropiate și a reușit să creeze pagina de pornire în aproximativ 20 de minute.

În videoclipul (încorporat mai jos), Marsland parcurge crearea fiecărei secțiuni a paginii de pornire. El este ceea ce s-ar putea descrie ca un utilizator puternic cu editorul de blocuri. El poate amesteca rapid rânduri, coloane și grupuri, ajustând umplutura și marginile după cum este necesar și să atribuie fiecărei secțiuni culoarea corespunzătoare pentru design. În acest moment, acesta nu este ceva ce ar putea face majoritatea utilizatorilor medii de WordPress, motiv pentru care videoclipul a avut un răspuns atât de puternic din partea spectatorilor. Canalul YouTube al lui Marsland este axat pe a ajuta utilizatorii să stăpânească construirea de pagini folosind Gutenberg și magazinele cu WooCommerce.

„Concluzia mea a fost că este destul de ușor să realizezi rapid 95% din design, dar sunt ultimele 5% care iau întotdeauna cel mai mult timp din experiența mea”, a spus Marsland. „Bănuiesc că a fost mai mult despre procesul intern care a cauzat întârzierile, dar fără a fi implicat este greu de spus cu siguranță. Am vrut cu adevărat să arăt că nu a fost o problemă Gutenberg cu construirea designului (după cum Matt Mullenweg a menționat Wix și Squarespace și alți creatori de pagini WP.)”

Alex Shiels, un colaborator la proiect sponsorizat de Automattic, a citat câteva elemente care nu au legătură cu editorul de blocuri, care au cauzat întârzierile, inclusiv lucrul către „standarde rezonabile pentru a11y, receptivitate, compatibilitate cu browserul, SEO și performanță”, precum și colaborând cu colaboratori de pe diferite continente.

Ca răspuns la încercarea lui Marsland, dezvoltatorul WordPress Patrick Boehner a comentat cum micile detalii rămân extrem de importante. „Puteți spune cu siguranță ce a fost proiectat mai întâi și a fost proiectat în editor”, a spus Boehner.

La cinci ani de la debutul lui Gutenberg în WordPress, dezvoltatorii de teme sunt încă provocați să aducă la viață modele care nu au fost create cu o abordare bazată pe blocuri.

„Astăzi rămâne fundamental până la imposibil să luați un design de pagină imitat în mod tradițional și să executați acel design folosind blocuri”, a spus dezvoltatorul WordPress Jon Brown. "Aceasta este o problemă.

„Sigur, blocurile sunt bine să „proiecteze o pagină în browser” și să accepte ceea ce obții din blocuri, dar blocurilor continuă să le lipsească flexibilitatea și controalele necesare pentru a produce un aspect receptiv, accesibil, perfect pixelilor, bazat pe o machetă. .

„Ceea ce obișnuia să dureze o zi și o duzină de linii de php și o duzină de linii de css, acum necesită săptămâni de construire a blocurilor personalizate, deoarece blocurile de bază nu pot fi ușor modificate prin cârlige și nu au controalele de bază necesare.”

Colaboratorii Gutenberg fac progrese prin introducerea tipografiei fluide și urmăresc o serie de probleme legate de îmbunătățirea coerenței instrumentelor de proiectare. Între timp, dezvoltatorii de teme se confruntă cu durerile de creștere necesare, pe măsură ce editorul de blocuri se maturizează pentru a se potrivi celor care speră să-și facă designurile instantanee receptive.

„Am construit o temă FSE completă de la zero și am fost surprins de cât de mult din designul meu am reușit să reproduc cu succes cu editorul, theme.json și CSS personalizat minim până la deloc”, a spus veteranul dezvoltator de teme Mike McAlister. . „Sigur, a fost nevoie de multă reparație, dar totuși am fost impresionat.

„Totuși, așa cum menționează Jon, în secunda în care trebuie să ajustezi ceva pentru un ecran mai mic (sau un ecran mai mare dacă îndrăznești să încerci designul pe mobil primul în editor), te lovești de un perete. Este deosebit de evident cu marjă, umplutură și decalaj bloc, care nu au încă controale receptive. Puteți vedea acest lucru ajustat prin CSS în noua temă pe .org.”

Sensibilitatea este una dintre problemele pe care Shiels le-a citat în motivul pentru care implementarea design-urilor a durat mai mult timp decât simpla recreare a designului în editorul de blocuri.

„Cu toate acestea, există indicii de îmbunătățiri care vin pentru receptivitate”, a comentat McAlister. „Tipografia fluidă și clema() au ajutat cu siguranță la controlul tipografiei, dar vor exista întotdeauna circumstanțe în care aveți nevoie de un control și mai fin. Orice alt constructor de site-uri a rezolvat acest lucru, nu există niciun motiv să credem că WordPress nu poate sau nu vrea. (Cu siguranță că da, deoarece ~50-60% din trafic vine de pe dispozitive mobile în zilele noastre!)

„Una dintre cele mai bune modalități de a trece peste aceste dureri de creștere este să aveți cât mai multă mâncare pentru câini posibil – folosind editorul și FSE pentru a crea cât mai multe scenarii din viața reală pentru a descoperi aceste puncte oarbe.”

Scurtul exercițiu al lui Marsland arată cât de aproape puteți ajunge la recrearea designului WordPress.org într-o perioadă scurtă de timp, dacă vă cunoașteți cum să folosiți editorul de blocuri. El a reușit să demonstreze că interfața de utilizare a paginii Gutenberg nu este un obstacol în reproducerea modelelor create în alte aplicații. Mai degrabă, sunt toate celelalte elemente ale listei de verificare pe care dezvoltatorii trebuie să le rezolve, în general, în afara editorului, inclusiv aspecte privind accesibilitatea, capacitatea de răspuns și SEO. Cu cât Gutenberg se poate apropia mai mult de reducerea muncii suplimentare legate de receptivitate și accesibilitate, cu atât va fi mai accesibil pentru utilizatorii obișnuiți care încearcă să producă singuri modelele pe care le visează.