%402x.svg){kind=icon}
.jpeg)
Webflow에서 Span 태그를 어떻게 사용해야 할까요? 문장의 일부분만 스타일을 변경하려면 어떻게 해야 할까요? Rich text에서 일부분만 스타일을 변경할 수 있을까요?이번 글에서는 이러한 의문점에 대한 답변을 제공합니다.✓ 이 글의 내용
- Webflow에서 Span 태그의 사용 방법
- Webflow의 Rich text에서는 Span 태그를 사용할 수 없음
- Rich text에서 일부분만 스타일을 변경하는 방법
본 글을 작성한 저는 Webflow를 사용하여 웹사이트 제작을 하고 있으며 월 30만엔 정도의 수익을 올리고 있습니다. 또한 이 블로그도 Webflow를 사용하여 제작 및 관리되며 Rich text를 사용하여 블로그를 업데이트하고 있습니다.이러한 경험을 바탕으로, 이번에는 Rich text의 사용 방법에 대해 설명하겠습니다.
Webflow에서 Span 태그 사용 방법
.jpg)
Span이란 무엇인가요?
Span은 HTML에서 사용되는 태그 이름입니다.문장에서 일부분만 스타일을 변경하고자 할 때 사용됩니다.Webflow에서는 대부분 paragraph 태그와 Text 태그를 사용하는 문장에서 사용 가능합니다.
브러시 펜 아이콘을 클릭하면 Span 태그를 추가할 수 있으며, 삭제하려면 오른쪽 끝에 있는 ✗A를 클릭하십시오.
Webflow의 "Rich text"에서는 span을 사용할 수 없습니다. (2022년 1월 기준) Paragraph 등에서 생성한 문장과 span을 함께 복사하여 붙여넣기하여 Rich text에 넣으면 일시적으로 Rich text에 span을 추가할 수 있지만, 편집이 불가능해집니다. Rich text는 유용한 기능이지만 남발하는 것은 피하는 것이 좋을 수도 있습니다.
Rich textで一部分のみスタイル変更をする方法
.jpg)
Rich text에서는 Bold, Italicize를 사용하여 스타일을 변경할 수 있습니다.조금 강제적인 방법처럼 느껴질 수도 있지만, SEO적으로는 특별한 문제가 없다고 생각됩니다.왜냐하면 이러한 태그들은 HTML에서 다음과 같이 태그가 할당되어 있기 때문입니다.
- Bold=Strong 태그
- Italicize=em 태그실제로 Webflow로 만든 내 블로그의 HTML 코드를 확인해 보겠습니다.
굵은체(Bold)에는 strong, 노란색 밑줄(italic)에는 em이 붙어있는 것을 알 수 있습니다. 각각에 스타일을 추가하여, Rich text 내에서 스타일 변경을 하고 있습니다.
strong 태그와 em 태그의 차이는 SEO 랩에서 간단하게 설명되어 있습니다.두 태그의 의미를 이해하면 SEO 적으로도 문제없이 스타일을 변경할 수 있습니다.태그를 올바르게 사용하는 것을 의식합시다.
요약하자면, Rich text는 편리한 기능이지만, 클래스명이나 ID를 지정할 수 없어 여러 가지 시행 착오가 있을 수 있습니다. 저자의 트위터에서는 그러한 시행 착오를 소개하고 있으므로 관심이 있다면 팔로우해보세요. 아직 Webflow에 가입하지 않은 분들은 한 번 가입해보고 만져보는 것이 좋습니다. 조금 만져보고 자신에게 맞는 No Code를 선택합시다.
情報追加はツイッターで告知します。
정보 추가는 트위터로 공지할 예정입니다. Webflow의 최신 정보와 사용 방법은 업데이트될 때마다 업데이트할 예정입니다. 정보 업데이트 및 유용한 사용 방법은 트위터에서 트윗됩니다! 팔로우 부탁드립니다!
%20(1).jpg)