Blog design
2026-06-27 ( Updated on 2026-08-11 )
블로그 디자인 변경 시 사용하는 페이지입니다. 블로그에 사용되는 모든 요소 및 컴포넌트가 나열되고 디자인 시 유의하여야 하는 내용이나 취향이 적혀있습니다.
Principles
:PROPERTIES: :CUSTOM_ID: principles :END: 블로그 디자인의 원칙 1. 책을 보는 것처럼 느껴질 것 2. HTML과 CSS 만 사용할 것 3. 접근성을 고려할 것 4. Semantic HTML을 사용할 것 5. 출력이 가능할 것 최우선으로 생각하는 요소는 가독성입니다. 블로그는 문서 중심의 사이트이기 때문에 많은 글로 구성되며 따라서 블로그 경험의 핵심 요소는 가독성입니다. 가독성을 높이기 위해 디자인에 적용된 요소는 다음과 같습니다 :
- 배경색과 전경색, 강조색의 대비가 4.5:1 이상
- 문단의 너비가 45ch-75ch 사이, 가능하다면 65ch, 이 부분은 로마자를
기준으로함, 한글은 30-50자 장식적 요소를 배제한 현재 디자인의 특성 상 타이포와 색상 만으로 브랜드를 표현해야하며, 따라서 색상과 폰트를 선택하는 것이 가장 중요하다고 할 수 있다. 세가지 폰트 사용 :
- 제목, 브랜드를 표현하는 핵심
- 본문, 산세리프, suit, ibm plex sans, pretendard 고려
- 코드, 고정폭, Myna nerd font, D2Coding(한글 표현) 고려
색상 선택 :
첫번째 장, 문단
:PROPERTIES: :CUSTOM_ID: test-id-heading-1 :END: 문단의 간격이 적절할까요. 날에 모습 이 고이 생명이 싶은 편지도 저편으로 토끼, 먹이고 빛은 그 생을 바다는 그리고 자신을 가는 불러 고독은 봅니다. 아직 된 가실 있든 죽고 있었다. 각 헤딩은 섹션의 이름을 나타냅니다. 섹션 디자인의 경우 org-mode 작성 시와 같이 들여쓰기를 통해 위계를 드러내는 것을 고려했으나 이쁘게 풀어내는 것이 힘들고 글의 흐름을 방해한다고 판단하여 기각 섹션 간의 위계는 TOC를 통해 드러내는 것이 합리적 필자는 여러 위계를 선형적으로 써내려가지 않기 때문에 위계 표시가 의미가 있으나, 독자의 경우 선형적으로 읽는 것을 전제로 하며, 그렇지 않는 경우에도 ToC 혹은 LLM 요약을 통해 원하는 내용 만을 취사선택하여 읽기 때문에 중요하지 않다. 따라서 구현 가치가 적으므로 기각한다. 인라인 스타일의 디자인은 적절한가요. 두꺼운 삶은 소멸시키는 나를 대지에 있든 타올랐다네 부드럽게, 향할 벌써 하나에 위에 이름을 바위틈에 말없이 강뚝에 드리우리다. 밑줄을 그은 문장이 향해 쌓이고 함께 흐른다 이렇게 이웃 파란 하염없이 실망하고 집에 좋을까 듯합니다. 가실 즈려 내 까닭입니다. 차츰 시각에 사뿐히 날에 까닭입니다. 기울여 타올랐다네 편지도 풀이 그 이제 없는 누워 헤는 모래 때 하나에 아스라이 변할 아무 갈라놓는 아니 백 사랑했지 말 그 하늘을 함께 거외다. 연인들의 올라간다. 삭제선 대지에 풀어놓은 때. 동경과 향할 떨어진다. 추억과 적실 빛은 가을로 좋은 있다. 생명이 다 사막을 모두가 왔을까? =노래=였네 =시새우=는 없든 말했다.
두번째 장, 목록
- 한글 맞춤법은 표준어를 소리대로 적되, 어법에 맞도록 함을 원칙으로 한다.
- 문장의 각 단어는 띄어 씀을 원칙으로 한다.
- 외래어는 ‘외래어 표기법'에 따라 적는다.
한글 맞춤법 제 1장 총칙
제1항 한글 맞춤법은 표준어를 소리대로 적되, 어법에 맞도록함을 원칙으로 한다. 이 조항은 한글 맞춤법의 대원칙을 밝히고 있다. “표준어를 소리대로 적되”가 기본 원칙이라면, “어법에 맞도록 함”은 또 다른 원칙이라고 할 수 있다.
- 표준어를 소리대로 적는다.
- 어법에 맞도록 적는다.
한글 맞춤법은 이 두 가지 원칙에 따라 음성 언어인 표준어를 표음 문자인 한글로 올바르게 적는 방법이다. 먼저 ‘표준어를 소리대로 적는다'는 말에는 한글 맞춤법이 표준어를 대상으로 한다는 뜻이 담겨 있다. 그리고 ‘소리대로' 적는다는 것은 그 표준어를 적을 때 발음에 따라 적는다는 뜻이다. 이를테면 [나무]라고 소리 나는 표준어는 ‘나무'로 적고, [달리다]라고 소리 나는 표준어는 ‘달리다'로 적는다. 그런데 표준어를 소리대로 적는다는 원칙만으로 충분하지 않은 경우가 있다. 예를 들어 ‘꽃[花]'이란 단어는 쓰이는 환경에 따라 소리가 달라진다.
- 꽃이[꼬치], 꽃을[꼬츨], 꽃에[꼬체] :: [꼬ㅊ]
- 꽃만[꼰만], 꽃나무[꼰나무], 꽃놀이[꼰노리] :: [꼰]
- 꽃과[꼳꽈], 꽃다발[꼳따발], 꽃밭[꼳빧] :: [꼳]
체크리스트
여기서는 두가지 의사결정을 요구하는데, 첫째는 리스트 스타일을 적용할 것인가요 둘째는 체크박스에 커스텀 스타일을 적용할 것인가이다. 체크박스는 비활성화 상태여야 한다. 체크박스의 상태를 독자가 아닌 저자가 결정하기 때문이다. Lorem ipsum dolor sit amet consectetur adipiscing elit. Lorem ipsum dolor sit amet consectetur adipiscing elit.
세번째 장, 표
| Name | Age | Occupation | City |
|---|---|---|---|
| Alice | 28 | Engineer | New York |
| Bob | 35 | Designer | London |
| Charlie | 42 | Manager | Tokyo |
네번째 장, 블록
블록 입니다.
코드 블럭
한 나라 안에서 지역적으로나 사회적으로 여러 형태로 쓰이는 말을 단수 혹은 복수의 표준형으로 제시하는 것은 그 나라 국민들의 효율적이고 통일된 의사소통을 위한 것이다. 국어 토박이 화자가 하는 말은 어휘의 형태나 음운의 발음에서 지역적으로나 사회적으로 여러 가지로 나타나는 경우가 많은데,
#include <stdio.h>
printf("Hello, world!"); 한 나라 안에서 지역적으로나 사회적으로 여러 형태로 쓰이는 말을 단수 혹은 복수의 표준형으로 제시하는 것은 그 나라 국민들의 효율적이고 통일된 의사소통을 위한 것이다. 국어 토박이 화자가 하는 말은 어휘의 형태나 음운의 발음에서 지역적으로나 사회적으로 여러 가지로 나타나는 경우가 많은데,
인용 문구
한 나라 안에서 지역적으로나 사회적으로 여러 형태로 쓰이는 말을 단수 혹은 복수의 표준형으로 제시하는 것은 그 나라 국민들의 효율적이고 통일된 의사소통을 위한 것이다. 국어 토박이 화자가 하는 말은 어휘의 형태나 음운의 발음에서 지역적으로나 사회적으로 여러 가지로 나타나는 경우가 많은데,
한 나라 안에서 지역적으로나 사회적으로 여러 형태로 쓰이는 말을 단수 혹은 복수의 표준형으로 제시하는 것은 그 나라 국민들의 효율적이고 통일된 의사소통을 위한 것이다. 국어 토박이 화자가 하는 말은 어휘의 형태나 음운의 발음에서 지역적으로나 사회적으로 여러 가지로 나타나는 경우가 많은데, 이러한 여러 형태나 발음 중 하나 혹은 둘을 표준형으로 제시하고자 하는 것이 표준어 규정의 목적이다. 한국어 어문 규범, 표준어 규정 1부 1장 1항
한 나라 안에서 지역적으로나 사회적으로 여러 형태로 쓰이는 말을 단수 혹은 복수의 표준형으로 제시하는 것은 그 나라 국민들의 효율적이고 통일된 의사소통을 위한 것이다. 국어 토박이 화자가 하는 말은 어휘의 형태나 음운의 발음에서 지역적으로나 사회적으로 여러 가지로 나타나는 경우가 많은데,