실무에 바로 적용할 수 있는 웹 제작 꿀팁 및 유용한 자료실 공간입니다.
나눔웹이 제공하는 핵심 노하우와 마케팅 인사이트를 자유롭게 활용해 보십시오.

나눔웹 마케팅 꿀팁

검색 결과에 파비콘이 안 나올 때, favicon 크기와 link 태그 점검 순서

구글이나 네이버 검색 결과에서 우리 사이트만 지구본 모양 기본 아이콘으로 나온다면, 파비콘 파일 크기와 홈페이지의 link 태그부터 확인해 보시는 게 좋습니다.
검색엔진은 브라우저 탭과 달리 정해진 조건을 만족하는 아이콘만 가져가기 때문에, 탭에서는 잘 보여도 검색 결과에는 빠지는 경우가 꽤 많습니다.

💡 작은 아이콘 하나가 왜 중요할까요?

모바일 검색 결과에서는 사이트 이름 옆에 파비콘이 함께 표시됩니다. 경쟁 업체는 로고가 보이는데 우리만 기본 아이콘이면 같은 순위라도 눈에 덜 띄고, 신뢰감에서도 손해를 봅니다. 리뉴얼 후 아이콘 경로가 바뀌면서 조용히 사라지는 경우도 자주 봤습니다.

1. 크기는 48px의 배수, 정사각형으로

구글 검색 센터 가이드는 파비콘을 48px의 배수인 정사각형(48×48, 96×96, 144×144 등)으로 준비하라고 안내합니다. SVG는 크기 제한이 없어 함께 넣어 두면 좋습니다. 예전 관행대로 16×16 ICO 하나만 두면 탭에서는 보여도 검색 결과용으로는 부족할 수 있습니다.

용도권장 파일메모
검색 결과·브라우저 탭favicon.ico 또는 PNG 48×48 이상48px 배수 정사각형
고해상도 화면favicon.svg크기 제한 없음
아이폰 홈 화면 추가apple-touch-icon.png 180×180투명 배경 피하기

2. link 태그는 홈페이지에 있어야 합니다

검색엔진은 하위 페이지가 아니라 홈페이지(도메인 루트)의 <head>에서 아이콘을 찾습니다. 게시판 레이아웃에만 태그를 넣었거나, 메인만 별도 레이아웃을 쓰면서 태그가 빠진 경우가 실제로 흔합니다. 파비콘은 호스트 이름(도메인)마다 하나라서, www 유무가 다르면 각각 확인해야 합니다.

<!-- 홈페이지 <head> 안에 넣는 기본 세트 -->
<link rel="icon" href="/favicon.ico" sizes="48x48">
<link rel="icon" href="/favicon.svg"
      type="image/svg+xml">
<link rel="apple-touch-icon"
      href="/apple-touch-icon.png">

3. 아이콘 경로가 막혀 있지 않은지 확인

robots.txt에서 업로드 폴더 전체를 막아 두면 아이콘 파일도 함께 차단됩니다. 또 아이콘 주소가 로그인 페이지로 리다이렉트되거나 404가 나지 않는지 브라우저 주소창에 직접 입력해 보시면 바로 알 수 있습니다.

# robots.txt 에서 아이콘 경로를 막지 않았는지 확인
User-agent: *
Disallow: /files/

# 아이콘을 /files/ 아래에 두었다면 예외 처리
Allow: /files/favicon/

모든 조건을 맞춰도 검색 결과에 반영되기까지는 며칠에서 몇 주가 걸립니다. 구글 서치 콘솔에서 홈페이지 URL 검사 후 색인 생성을 요청하면 조금 앞당길 수 있습니다.

"검색 결과 첫 줄의 작은 아이콘도 브랜드의 얼굴입니다."

나눔웹은 리뉴얼 오픈 전 점검 목록에 파비콘과 홈 화면 아이콘을 넣어,
도메인과 레이아웃이 바뀌어도 아이콘이 빠지지 않도록 확인합니다.


List of Articles
번호 분류 제목 글쓴이
» 마케팅 검색 결과에 파비콘이 안 나올 때, favicon 크기와 link 태그 점검 순서 new 나눔웹
40 UI/UX 모바일 버튼이 잘 안 눌린다면? 터치 영역 44px 기준과 padding으로 넓히는 법 new 나눔웹
39 모바일 모바일 hover 색상이 눌린 채 남을 때, @media (hover)로 해결하기 나눔웹
38 퍼블리싱 position: sticky가 안 먹힐 때, 부모 overflow부터 확인해야 하는 이유 나눔웹
37 웹 성능 메인 배경 동영상 때문에 홈페이지가 느릴 때, 용량 줄이기와 video 태그 설정 나눔웹
36 마케팅 검색 결과 설명이 엉뚱하게 나올 때, title과 meta description 쓰는 법 나눔웹
35 퍼블리싱 썸네일 이미지 찌그러짐, object-fit과 aspect-ratio로 비율 맞추는 법 나눔웹
34 모바일 모바일 문의 폼 자동완성이 안 뜬다면? autocomplete 값과 인증번호 자동 입력 나눔웹
33 UI/UX 버튼 클릭 테두리(outline), 지우지 말고 :focus-visible로 정리하는 법 나눔웹
32 퍼블리싱 flex 레이아웃이 모바일에서 옆으로 삐져나올 때, min-width: 0이 필요한 이유 나눔웹
31 웹 성능 메인 배너 LCP가 느리다면? 첫 화면 이미지는 lazy 대신 fetchpriority로 나눔웹
30 마케팅 네이버 서치어드바이저 등록 순서, 새 홈페이지가 검색에 안 나올 때 점검할 4가지 나눔웹
29 웹 성능 글씨가 안 보이다가 갑자기 뜬다면? '웹 폰트 로딩' 1초 단축하는 마법 나눔웹
28 웹 성능 구글 SEO 점수 폭발! 이미지 로딩 속도 3배 높이는 '단 1줄'의 마법 나눔웹
27 마케팅 카톡에 우리 회사 링크 보낼 때 뜨는 '회색 빈 박스' 없애는 필수 세팅 (OG 태그) 나눔웹
26 마케팅 '제출하기' 버튼은 그만! 클릭률 200% 높이는 마법의 단어 (CTA) 나눔웹
25 마케팅 돈 버는 마케터의 비밀! 유입 출처를 추적하는 마법의 꼬리표 'UTM' 나눔웹
24 퍼블리싱 촌스러운 '파일 선택' 버튼, 복잡한 꼼수 없이 예쁘게 디자인하기 나눔웹
23 UI/UX 팝업 띄울 때마다 화면이 덜컹! '스크롤바 밀림 현상' 1줄 해결법 나눔웹
22 퍼블리싱 수십 줄의 모바일 반응형 코드, 단 '1줄'로 끝내는 마법 (clamp) 나눔웹
Board Pagination Prev 1 2 3 Next
/ 3
rhwlsghkcocndgus XE2.1.39 STAGE1.5.4