구텐베르그로 워드프레스 웹사이트 구축하기: 초기 관찰

새로운 WordPress 편집기인 Gutenberg에 대한 모든 소란을 따라왔다면 많은 사용자가 이에 대해 매우 강한 의견을 형성했다는 것을 알 것입니다. 그러나 모든 드라마를 제외하고 실제로 웹 사이트를 구축하는 것은 어떻습니까?

워드프레스 5.0이 점점 다가오면서 구텐베르크가 무엇을 할 수 있는지 마침내 확인해야 할 때라고 결정했습니다. 테스트를 꽤 많이 했지만(놀고 있는 것으로 더 잘 설명될 수 있음), 아직 표준 워크플로에 플러그인 버전의 편집기를 포함하지 않았습니다.

아주 작게 시작해야겠다고 생각했습니다. 그래서 새롭게 디자인하고 있는 브로셔 스타일의 사이트에 Gutenberg를 설치했습니다. 다음은 제 경험에 대한 몇 가지 생각입니다. 아직 해결해야 할 몇 가지 버그가 남아 있는 베타 소프트웨어라는 점을 염두에 두십시오.

새로운 업무 방식

이전에 구텐베르그 UI를 본 후에 내가 달성할 수 있는 것에 대한 몇 가지 기본적인 기대가 있었습니다. 클래식 편집기로는 쉽게 할 수 없는 것입니다.

• 콘텐츠를 쉽게 재정렬
• 간단한 다중 열 레이아웃 만들기
• 여러 위치에서 맞춤형 콘텐츠 블록 재사용

완전한 페이지 빌더 유형의 편집 경험을 기대하지도(원하지도) 않았다고 말하는 것으로 충분합니다. 고맙게도 Gutenberg는 이것을 하려고 하지 않으며 실제로 그런 유형의 작업을 위한 것이 아닙니다.

전반적으로 다음 영역에서 상황이 상당히 잘 진행되었다고 말할 수 있습니다.

콘텐츠 재정렬
페이지에서 콘텐츠를 전환하는 것은 블록 위로 마우스를 가져갈 때 나타나는 작은 화살표를 사용하여 충분히 간단했습니다. 단, 열로 정렬된 내용을 가로로 전환할 수 없었습니다. 적어도 그 기능을 사용할 수 있다면 나는 그것을 알아낼 수 없었습니다.

여러 열 레이아웃
이 기능은 아직 베타 버전이지만 작동했습니다. 내가 겪었던 유일한 문제는 다양한 블록을 열에 추가한 다음 커서로 특정 열을 선택하는 것과 관련되었습니다. 열 위로 마우스를 가져갈 때 나타나는 엄청난 양의 그리드 선은 때때로 약간 혼란스러워졌습니다(플러그인 버전 3.6이 이 문제를 조금 진정시키는 것 같았음).

프론트 엔드에서 모바일 화면에서 Flexbox 기반 열이 서로 겹쳐지도록 하기 위해 일부 CSS를 조정해야 했습니다. 테마 개발자가 이러한 유형의 디자인 결정을 완전히 제어하기를 원하기 때문에 반드시 나쁜 것은 아닙니다.

블록 재사용
Gutenberg의 깔끔한 기능 중 하나는 반복 사용을 위해 만든 콘텐츠 블록을 저장하는 기능입니다. 내가 설정한 소셜 미디어 아이콘 세트로 이 작업을 수행할 수 있다는 것을 알게 되었습니다. 블록을 만들고 저장하고 문제 없이 여러 페이지에 추가했습니다.

정말 인상적이었던 점은 재사용 가능한 블록을 편집하고 저장할 수 있고 편집된 버전이 내가 사용한 각 페이지에 자동으로 표시된다는 것입니다. 이것은 실제 시간을 절약해주었습니다.

기존 콘텐츠는 어떻습니까?
또한 WordPress를 새로 설치할 때 가져온 사이트의 기존 콘텐츠가 어떻게 되는지 알고 싶었습니다. 기본적으로 Gutenberg는 이 콘텐츠를 WordPress Classic 편집기와 매우 유사한 "Classic" 블록에 배치했습니다. 프론트 엔드에서 모든 것이 예상대로 보였습니다.

이 콘텐츠를 추가 편집을 위해 일련의 적절한 블록으로 변환할 수 있는 옵션이 제공되었습니다. 내 경험에 따르면 편집자는 이것을 아주 잘 처리했습니다. 예를 들어, 이미지는 "이미지" 블록에 배치되고 정렬되지 않은 목록은 "목록" 블록에 배치되는 식입니다. 이 프로세스에 문제가 없는 것 같다는 사실을 알려드리게 되어 기쁩니다.

학습 곡선

"작동하지 않는 것"에 대한 두려움 외에도 가장 큰 걱정은 새 편집기를 사용하는 데 익숙해지는 데 시간이 얼마나 걸릴지였습니다. 결국, 테스트 사이트를 어지럽히는 것은 클라이언트를 위해 무언가를 구축하는 것과는 많이 다릅니다.

Gutenberg를 사용한 처음 몇 시간은 약간 실망스러웠습니다. Gutenberg의 단점과 프로세스를 빠르게 발견했기 때문입니다. 나는 그 일부가 내가 익숙하지 않은 방식으로 일해야 했기 때문이라고 생각합니다. 수년 동안 저는 많은 레이아웃 관련 작업에 사용자 정의 필드를 사용하는 경향이 있었습니다. 저는 기본적으로 조금이라도 복잡한 작업을 위해 Classic 편집기를 사용하는 것을 포기했습니다. 그래서 에디터 자체에 조금 더 의존하는 것은 익숙해지는 데 시간이 걸렸습니다.

그래도 약간의 연습 후에, 나는 일반적으로 내가 필요로 하는 것들을 성취할 수 있었습니다. UI는 페이지 구축을 위한 공격 계획을 세울 수 있을 정도로 직관적입니다. 일단 계획이 있으면 모든 것을 하나로 모으는 작업에 착수할 수 있습니다.

계속해서 좌절감을 안겨준 한 가지 항목은 사용자 지정 메타 상자의 배치와 (경우에 따라) 사라지는 것이었습니다. 초보자를 위해 테마 및 플러그인별로 편집 화면에 배치되는 상자입니다. 예를 들어, SEO 플러그인은 페이지 최적화를 조정할 수 있는 메타 상자를 추가할 수 있습니다.

사용자 정의 필드와 같은 일부 항목은 화면 하단에 고정되었습니다(이런 유형의 배치는 지금까지는 클래식 편집기에서 더 쉽게 제어할 수 있지만 충분히 공정합니다). 다른 상자는 오른쪽 하단에 아코디언으로 접혀 있습니다. 그러나 메타 상자가 전혀 표시되지 않는 플러그인을 몇 개 찾았습니다.

현재로서는 누락된 메타 상자에 대한 유일한 수정 사항은 일시적으로 클래식 편집기로 다시 전환하는 것이었습니다. 거기에서 구텐베르크로 다시 전환하기 전에 필요한 설정을 조정할 수 있었습니다. 그 과정에서 아무 이상이 없었지만 여전히 불편했습니다.

메타 박스는 개발자가 WordPress를 사용자 지정하는 방법의 중요한 부분이므로 여기에서 구현하는 방법에 더 많은 주의를 기울여야 하는 것 같습니다. 개발 팀의 의사 결정 뒤에 있는 기술적인 이유를 반드시 이해하지는 못하지만 더 나은 통합이 사용자의 많은 문제와 불만을 줄일 수 있다고 생각합니다.

무엇이 빠졌습니까?

콘텐츠를 구축하기 위해 구텐베르크를 사용하면서 나는 계속해서 그 큰 잠재력을 되찾았습니다. 그러나 편집자는 아직 거기에 있지 않습니다.

그 중 일부는 해결해야 할 수많은 버그와 사용성 문제입니다. 그러나 이 플러그인이 더 많이 채택되고 많은 피드백을 얻었기 때문에 편집기가 코어에 병합되기 전에 이 중 많은 부분이 처리될 것으로 예상합니다.

나머지 절반은 WordPress 커뮤니티가 전반적인 경험을 더욱 향상시키기 위해 수행하는 창의적인 작업을 보는 것입니다. 사용자 정의 블록을 만들 수 있기 때문에 믹스에 추가된 정말 유용한 몇 가지를 보게 될 것입니다.

현재 스톡 형식으로 Gutenberg를 사용하면 Classic 편집기에서는 불가능한 방식으로 콘텐츠를 사용자 정의할 수 있습니다. 그러나 다음 단계로 나아가는 것은 커뮤니티에서 오는 추가 요소일 것입니다.

요컨대, 구텐베르크는 일부 사람들이 선언하는 거의 열차 사고가 아니라고 말하고 싶습니다. 그러나 잠재력을 최대한 발휘하려면 더 많은 미세 조정과 커뮤니티 참여가 필요합니다.