블로그형 랜딩 형식 견본

참고한 블로그 글의 화면 구성·글자 크기·여백을 같은 수치로 옮긴 빈 틀입니다. 파란 딱지는 각 칸의 이름과 수치이고, 글 내용은 전부 자리 표시입니다.

참고 글 1편의 구성 수치

참고 글과 다르게 한 것

※ 글 맨 위에 두는 한 줄 안내 문구 자리 ※

기본 글 16px 입니다.
한 문단은 한 줄에서 네 줄 사이로 짧게 끊고,
줄마다 직접 줄바꿈을 넣습니다.

큰 글 20px.
이야기의 장면을 여는 한마디에 씁니다.

사진 자리세로형 · 가로 680 × 세로 907

사진 설명글 자리 · 13px 가운데 (휴대폰 11px)

작은 글 14px.
참고 글에서 가장 많이 쓰는 크기입니다.
문단 158개 가운데 100개가 이 크기입니다.

사진 바로 아래에서 상황을 풀어 쓰는 문단이
두세 개 이어집니다.

중간 글 17px.
문단 안에서 굵은 글과
빨간 글로 핵심만 짚습니다.

노란 형광펜 + 큰 글을 작은 글 문단 안에 섞습니다.
살구색 형광펜은 낱말 하나를 짚을 때 씁니다.

다른 사람의 말이나 그때 들은 한마디를
따로 떼어 보여 주는 자리

사진 자리가로형 · 가로 680 × 세로 381

가로형 사진 아래에도 작은 글 문단이 이어집니다.
취소선 글은 버린 방법이나 예전 생각을 적을 때 씁니다.

아주 큰 글 26px
결정적인 한 줄

꺾쇠 안에 넣는
한 문장 요약

첫 번째 소제목 자리

사진 자리가로형 · 가로 680 × 세로 451

소제목 하나에 사진 한 장과 짧은 설명 한두 문단.
참고 글은 이 묶음을 네다섯 번 반복합니다.

사진 자리세로형 · 가로 680 × 세로 907

사진 자리바로 위 사진과 붙여서 한 장처럼

묶음을 닫는 중간 글 한 줄.

글의 고비에서 한 번 쓰는
큰 가운데 인용

마무리 문단 자리입니다.
앞의 이야기를 정리하고 다음 칸으로 넘깁니다.

++++++ 〈추가 안내 자리〉 ++++++

구매 링크 앞에 두는 짧은 안내 문단 자리입니다.

(작게 덧붙이는 말 자리)