이모지

Emoji

제목 앞, 목록 앞, 버튼 안 어디에도 이모지를 쓰지 않아요. 아이콘은 팩이 가진 아이콘 세트에서만 가져와요.

···
html
<main class="dont-wrap"><section class="dont-col"><p class="dsx-label"><b>하지 않는 것</b>설명용으로 그린 예</p><div class="dont-bad"><div class="dont-emo-row"><i class="dont-emo-slot"></i><span class="dont-emo-title">이유식, 이렇게 시작해요</span></div><div class="dont-emo-row"><i class="dont-emo-slot"></i><span>생후 6개월 무렵에 시작해요</span></div><div class="dont-emo-row"><i class="dont-emo-slot"></i><span>한 번에 한 가지씩 더해요</span></div><div class="dont-emo-row"><i class="dont-emo-slot"></i><span>꿀과 간은 돌 전에는 피해요</span></div><div class="dont-note">회색 동그라미 = 이모지가 들어갈 자리예요. 이 사이트에는 이모지를 실제로 쓰지 않아요.</div></div></section><section class="dont-col"><p class="dsx-label"><b>대신</b>실제 렌더: Primer Summary check — 팩 아이콘 세트(Octicons)의 체크</p><div class="dont-real"><div class="container gx-measure"><aside class="sm sm--check" aria-labelledby="summary-title" data-astro-cid-6gtfpa46> <h2 id="summary-title" class="sm__title" data-astro-cid-6gtfpa46>핵심만 먼저</h2> <ol class="sm__list" data-astro-cid-6gtfpa46> <li data-astro-cid-6gtfpa46> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" aria-hidden="true" focusable="false"><g fill="currentColor"><path d="M21.03 5.72a.75.75 0 0 1 0 1.06l-11.5 11.5a.747.747 0 0 1-1.072-.012l-5.5-5.75a.75.75 0 1 1 1.084-1.036l4.97 5.195L19.97 5.72a.75.75 0 0 1 1.06 0Z"></path></g></svg> <span data-astro-cid-6gtfpa46>이유식은 보통 생후 약 6개월, 아기가 앉아서 고개를 가누고 음식을 삼킬 수 있을 때 시작해요.</span> </li><li data-astro-cid-6gtfpa46> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" aria-hidden="true" focusable="false"><g fill="currentColor"><path d="M21.03 5.72a.75.75 0 0 1 0 1.06l-11.5 11.5a.747.747 0 0 1-1.072-.012l-5.5-5.75a.75.75 0 1 1 1.084-1.036l4.97 5.195L19.97 5.72a.75.75 0 0 1 1.06 0Z"></path></g></svg> <span data-astro-cid-6gtfpa46>처음엔 하루 1회 한두 숟가락으로 시작해 12개월 무렵 하루 3끼와 간식 1~2회로 늘려요.</span> </li><li data-astro-cid-6gtfpa46> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" aria-hidden="true" focusable="false"><g fill="currentColor"><path d="M21.03 5.72a.75.75 0 0 1 0 1.06l-11.5 11.5a.747.747 0 0 1-1.072-.012l-5.5-5.75a.75.75 0 1 1 1.084-1.036l4.97 5.195L19.97 5.72a.75.75 0 0 1 1.06 0Z"></path></g></svg> <span data-astro-cid-6gtfpa46>질감은 곱고 부드러운 형태에서 무른 음식, 부드러운 고형식, 가족 음식 순으로 단단해져요.</span> </li><li data-astro-cid-6gtfpa46> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" aria-hidden="true" focusable="false"><g fill="currentColor"><path d="M21.03 5.72a.75.75 0 0 1 0 1.06l-11.5 11.5a.747.747 0 0 1-1.072-.012l-5.5-5.75a.75.75 0 1 1 1.084-1.036l4.97 5.195L19.97 5.72a.75.75 0 0 1 1.06 0Z"></path></g></svg> <span data-astro-cid-6gtfpa46>새 재료는 한 번에 한 가지씩 며칠 지켜보며 더하고, 철분이 많은 고기는 초기부터 챙겨요.</span> </li><li data-astro-cid-6gtfpa46> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" aria-hidden="true" focusable="false"><g fill="currentColor"><path d="M21.03 5.72a.75.75 0 0 1 0 1.06l-11.5 11.5a.747.747 0 0 1-1.072-.012l-5.5-5.75a.75.75 0 1 1 1.084-1.036l4.97 5.195L19.97 5.72a.75.75 0 0 1 1.06 0Z"></path></g></svg> <span data-astro-cid-6gtfpa46>돌 전에는 간을 하지 않고 꿀은 주지 않아요. 생우유는 주된 음료로 쓰지 않아요.</span> </li> </ol> </aside> </div></div></section></main>
css
.dont-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
.dont-col{min-width:0}
.dont-col+.dont-col{border-left:1px dashed #a8a29e}
@media (max-width:599px){.dont-wrap{grid-template-columns:minmax(0,1fr)}.dont-col+.dont-col{border-left:0;border-top:1px dashed #a8a29e}}
@media (max-width:340px){.dont-wrap .dsx-label{display:flex}}
.dont-bad{padding:8px 16px 22px;font:15px/1.6 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;color:var(--c-text,#1c1917)}
.dont-bad *{box-sizing:border-box}
.dont-real{padding-bottom:12px}
.dont-note{margin-top:12px;font:12px/1.5 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;color:#6b645c}
:root.dark .dont-note{color:#a59c91}
.dont-card{background:#fff;color:#1f2937;border-radius:8px;padding:14px 16px;margin-bottom:12px;font:15px/1.6 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif}
.dont-card b{display:block;margin-bottom:4px}

.dont-emo-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--c-border,#e7e2da)}
.dont-emo-slot{flex:none;width:26px;height:26px;border-radius:50%;background:#c4c0b8;border:2px dashed #78716c}
.dont-emo-title{font-size:18px;font-weight:700}

이모지를 제목과 목록 앞에 붙이는 건 AI 가 쓴 글의 대표적인 습관이에요. 기기마다 그림이 다르게 나오고, 글의 무게도 가벼워 보여요. 건강 정보처럼 신뢰가 중요한 글에는 맞지 않아요. 알록달록한 색을 없애자는 결정과 함께 이모지도 사이트 전체에서 없앴어요.

기계가 두 가지로 세요. seo:audit 이 빌드된 모든 페이지에서 이모지 글자와 인라인 그림 이모지를 찾아 하나라도 있으면 그 페이지를 오류로 보고해요. count-emoji 는 사이트별로 개수를 표로 세고 0 이 아니면 실패해요. 파비콘, 앱 아이콘, 공유 이미지, 머리 표식도 이모지 대신 팩의 강조색 네모 안에 사이트를 나타내는 두 글자를 그린 모노그램이에요.

쓸 수 있는 건 팩의 아이콘 세트뿐이에요. Primer 는 Octicons, shadcn 은 Lucide 같은 식이에요. 세트에 없는 아이콘은 억지로 다른 세트를 섞지 않고 그리지 않아요. 그리고 아이콘만으로 뜻을 전하지 않고 글자 옆의 보조로만 써요.

언제 쓰나

목록이나 제목을 「좀 더 친근하게」 만들고 싶을 때, 또는 외부 글을 옮겨 올 때 떠올려요. 옮긴 글에 이모지가 들어 있으면 지우고 글자로 풀어요.

페이지로 열기 ↗

항목 추가 요청

빠진 컴포넌트·변형이나 팩에서 고칠 점을 알려 주세요. 하나씩 보고 원본 팩에 반영합니다.