삼삼오오의 라스
article thumbnail

하위메뉴 작성된 게시글 수 가독성

존에 Fastboot 스킨을 사용하시는 분들은 하위메뉴 옆에 표시된 숫자를 보셨을겁니다.
메뉴 옆에 표시된 숫자들은 해당 카테고리에 작성된 게시글의 수를 나타내줍니다.
하지만 보시다시피 글자의 크기도 작고 분리되지 않는 듯한 모습입니다.
이는 보는이들로 하여금 불편한 느낌을 안겨줍니다. 즉, 가독성이 떨어집니다.
따라서 가독성을 높이기 위해 게시글 수를 나타내는 숫자를 괄호표시로 묶어보도록 하겠습니다.




변경하기 전



시다시피 하위메뉴 옆에 표시된 숫자들이 분리되지 않아 가독성이 현저히 떨어집니다.

소괄호()로 숫자를 묶어주면 가독성이 훨씬 높아질 듯 합니다.

예를 들어 '블로그설정 6' 과 '블로그설정 (6)' 어느 것이 눈에 더 잘 들어오십니까?

숫자를 괄호로 묶어준 것이 눈에더 잘 들어옵니다.


STEP :: 1



로그 관리의 HTML/CSS 탭에서 CSS 설정으로 들어갑니다.

그리고 'secondNav'를 검색하셔서 아래쪽에 secondNav가 몰려있는 곳으로 스크롤을 내립니다.

그럼 위 이미지와 동일한 부분을 찾으실 수 있는데, 이곳에 태그추가를 통해 괄호를 넣어줄 것입니다.

그리고 폰트사이즈를 조절하여 눈에 확연히 들어오게끔 할 것입니다.


STEP :: 2



시는 바와 같이 display:none; 와 font-size 사이에 태그를 입력해줍니다.

위와 같이 입력하셔야지 숫자 전과 후에 '(', ')'가 묶이게 됩니다.

태그가 적힌 메모파일은 아래에서 다운받아 주시면 됩니다.


카운터에 괄호표시.txt


그리고 폰트사이즈도 조절하여 글씨의 크기를 키워줍니다.

11~12 정도의 크기가 적당합니다. 

이 부분은 여러분의 취향대로 입력하시면 됩니다.



변경한 후



시는 바와 같이 하위메뉴 옆 게시글 수 표시 숫자에 괄호가 묶인 것을 보실 수 있습니다.

확실히 전과 비교하였을 때 가독성이 높아진 것을 느낄 수 있습니다.

또 글자와 숫자가 분리되어 눈에 확 들어옵니다.

블로그에 방문하는 사람들로 하여금 편의성 또한 상승하겠습니다.



[Fastboot] 스킨 티스토리 블로그에 설치하기

[Fastboot] 스킨 블로그 본문 글씨체/폰트크기 변경하기

[Fastboot] 스킨 티스토리 블로그 글꼴/글씨체 변경하기



포스팅 내용은 어떠셨나요? 많은 도움이 되셨나요??

공감댓글은 제게 큰 행복이랍니다 :)

▼▼▼▼▼▼▼▼▼▼▼



profile

삼삼오오의 라스

@SaM.O

포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!