Jamie Marsland odtwarza stronę główną WordPress.org w 20 minut za pomocą edytora bloków

W odpowiedzi na niedawne kontrowersje dotyczące czasu wdrożenia nowej strony głównej WordPress.org i projektów stron pobierania, Gutenberg YouTuber Jamie Marsland postanowił spróbować swoich sił w odtworzeniu ich za pomocą edytora bloków.

Matt Mullenweg skomentował plany dotyczące nowych projektów w fazie rozwoju, mówiąc, że wdrożenie powinno zająć „godziny, a nie tygodnie”. Jego najbardziej podżegające komentarze, które wywołały kolejne rozmowy na temat realiów pracy z edytorem bloków, dotyczyły konkurentów WordPressa.

„Jest to tak podstawowy układ, że trudno sobie wyobrazić, że zajmuje jednej osobie więcej niż jeden dzień w Squarespace, Wix, Webflow lub jednym z kreatorów stron WP” – powiedział Mullenweg.

Marsland postanowił podjąć wyzwanie, korzystając z Gutenberga. W tym ćwiczeniu użył najnowszego domyślnego motywu WordPressa, Twenty Twenty-Two. Jego wyniki nie są identyczne z nowymi projektami WordPressa, ale są bardzo zbliżone, a on był w stanie podnieść stronę główną w około 20 minut.

W filmie (umieszczonym poniżej) Marsland przedstawia tworzenie każdej sekcji strony głównej. Jest kimś, kogo można by opisać jako zaawansowany użytkownik z edytorem bloków. Potrafi szybko przetasować rzędy, kolumny i grupy, dostosowując odpowiednio dopełnienie i marginesy, a także przypisać każdej sekcji odpowiedni kolor do projektu. W tym momencie nie jest to coś, co mogłaby zrobić większość przeciętnych użytkowników WordPressa, dlatego wideo spotkało się z tak silną reakcją widzów. Kanał YouTube Marsland koncentruje się na pomaganiu użytkownikom w opanowaniu tworzenia stron przy użyciu Gutenberga i sklepów z WooCommerce.

„Doszedłem do wniosku, że dość łatwo jest szybko wykonać 95% projektu, ale to ostatnie 5% zawsze zajmuje najwięcej czasu z mojego doświadczenia” – powiedział Marsland. „Domyślam się, że to bardziej wewnętrzny proces spowodował opóźnienia, ale bez zaangażowania trudno powiedzieć na pewno. Naprawdę chciałem pokazać, że nie był to problem Gutenberga z budowaniem projektu (ponieważ Matt Mullenweg wspomniał o Wix i Squarespace i innych programach do tworzenia stron WP).”

Alex Shiels, współtwórca projektu sponsorowany przez Automattic, przytoczył kilka elementów niezwiązanych z edytorem bloków, które powodowały opóźnienia, w tym dążenie do „rozsądnych standardów dotyczących a11y, responsywności, zgodności z przeglądarkami, SEO i wydajności”, a także współpracując z autorami z różnych kontynentów.

W odpowiedzi na próbę Marslanda, programista WordPress Patrick Boehner skomentował, że drobne szczegóły pozostają niezwykle ważne. „Zdecydowanie można powiedzieć, co było najpierw projektowane, a co projektowane w edytorze” – powiedział Boehner.

Pięć lat po debiucie Gutenberga w WordPressie, twórcy motywów wciąż stoją przed wyzwaniem ożywienia projektów, które nie zostały stworzone z myślą o blokowaniu.

„Dzisiaj jest fundamentalnie trudne lub niemożliwe, aby wziąć tradycyjny projekt strony i wykonać go za pomocą bloków” – powiedział programista WordPress Jon Brown. "To jest problem.

„Oczywiście, bloki są w porządku, aby„ zaprojektować stronę w przeglądarce ”i akceptować to, co otrzymujesz z bloków, ale blokom nadal brakuje elastyczności i kontroli potrzebnych do stworzenia responsywnego, dostępnego, idealnego układu pikseli na podstawie makiety .

„To, co kiedyś zajmowało jeden dzień i kilkanaście linii php i kilkanaście linii CSS, teraz zajmuje tygodnie budowania niestandardowych bloków, ponieważ podstawowych bloków nie można łatwo modyfikować za pomocą haków i brakuje niezbędnych podstawowych elementów sterujących”.

Współtwórcy Gutenberga robią postępy, wprowadzając płynną typografię i śledzą wiele problemów związanych z poprawą spójności narzędzi projektowych. W międzyczasie twórcy motywów znoszą niezbędne problemy związane z rozwojem, gdy edytor bloków dojrzewa, aby dostosować się do tych, którzy mają nadzieję, że ich projekty będą natychmiast responsywne.

„Tworzyłem pełny motyw FSE od podstaw i byłem zaskoczony, jak dużą część mojego projektu udało mi się z powodzeniem skopiować za pomocą edytora, theme.json i niestandardowego CSS od minimalnego do zerowego”, powiedział weteran twórca motywów, Mike McAlister. . „Oczywiście, wymagało to dużo majsterkowania, ale mimo to byłem pod wrażeniem.

„Jednak, jak wspomina Jon, w momencie, gdy musisz dostosować coś do mniejszego ekranu (lub większego ekranu, jeśli odważysz się wypróbować projekt z myślą o urządzeniach mobilnych w edytorze), uderzasz o ścianę. Jest to szczególnie widoczne w przypadku marginesów, dopełnień i przerw między blokami, które nie mają jeszcze responsywnych elementów sterujących. Możesz zobaczyć to skorygowane za pomocą CSS w nowym motywie na .org.”

Responsywność jest jednym z problemów, które Shiels wymienił, wyjaśniając, dlaczego implementacja projektów zajęła więcej czasu niż zwykłe odtworzenie projektu w edytorze bloków.

„Istnieją jednak wskazówki dotyczące ulepszeń dotyczących responsywności” – skomentował McAlister. „Typografia płynów i clamp() z pewnością pomogły w kontrolowaniu typografii, ale zawsze będą okoliczności, w których będziesz potrzebować jeszcze dokładniejszej kontroli. Każdy inny kreator stron rozwiązał ten problem, nie ma powodu sądzić, że WordPress nie może lub nie chce. (Mam nadzieję, że w dzisiejszych czasach ~50-60% ruchu pochodzi z urządzeń mobilnych!)

„Jednym z najlepszych sposobów na pokonanie tych rosnących bólów jest zapewnienie jak największej ilości psiego jedzenia – używając edytora i FSE do tworzenia jak największej liczby rzeczywistych scenariuszy, aby odkryć te ślepe plamy”.

Krótkie ćwiczenie Marslanda pokazuje, jak blisko można w krótkim czasie zbliżyć się do odtworzenia projektu WordPress.org, jeśli znasz się na edytorze bloków. Udało mu się udowodnić, że interfejs budowania stron Gutenberga nie przeszkadza w odtwarzaniu projektów stworzonych w innych aplikacjach. Są to raczej wszystkie inne powiązane elementy listy kontrolnej, które programiści zazwyczaj muszą rozwiązać poza edytorem – w tym dostępność, responsywność i kwestie SEO. Im bliżej Gutenberga może się zbliżyć do zmniejszenia dodatkowej pracy związanej z responsywnością i dostępnością, tym bardziej przystępna będzie dla zwykłych użytkowników próbujących samodzielnie tworzyć projekty, które wymyślą.