모바일 크롬의 사라진 확대/축소 메뉴, 크롬 실험실에서 되살리는 방법

<h2>모바일 크롬, 확대/축소 옵션</h2> <p>요즘 어지간한 웹 사이트들은 PC와 스마트폰, 혹은 태블릿 등 모바일 기기에서 각각 맞춤형으로 표시되는, 반응형 웹사이트로 구성되어 있어 사용하는 기기에 맞춰 자동으로 최적화된 최적화된 화면을 이용할 수 있습니다.</p> <p> </p> <p>(이제는 흔치 않은 경우지만) 아직 PC용 레이아웃만 지원하는 웹사이트의 경우, 모바일 기기에서 텍스트나 이미지의 크기가 비정상적으로 작게 표시 되는 등의 문제가 있을 뿐 아니라, 스마트 기기의 줌인/줌아웃 기능도 작동하지 않도록 제약을 걸어 놓은 경우가 있습니다.</p> <p> </p> <p>사실 제가 자주 접속하는 업무용 웹사이트가 PC 레이아웃만 지원할 뿐 아니라, 화면 확대/축소/이동 등의 기능에 제한이 걸려 있었습니다.</p> <p><figure class="imageblock alignCenter" data-ke-mobileStyle="widthOrigin" data-filename="chrome-mobile-zoom-01.jpg" data-origin-width="700" data-origin-height="467"><span data-url="https://blog.kakaocdn.net/dn/9ECWv/btsDKxE4wxp/wZwC34lBwkV5kpDRY6ZK90/img.jpg" data-lightbox="lightbox"><img src="https://blog.kakaocdn.net/dn/9ECWv/btsDKxE4wxp/wZwC34lBwkV5kpDRY6ZK90/img.jpg" srcset="https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2F9ECWv%2FbtsDKxE4wxp%2FwZwC34lBwkV5kpDRY6ZK90%2Fimg.jpg" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" alt="모바일 크롬 확대/축소 옵션" data-filename="chrome-mobile-zoom-01.jpg" data-origin-width="700" data-origin-height="467"/></span></figure> </p> <p>이미지 왼쪽의 텍스트나 이미지를 보면 스마트폰에서 읽기 힘들 정도로 작게 표시되고 있어 이 웹사이트에 접속할 때는 두 손가락을 이용해 줌인/줌아웃 기능을 매번 사용해 왔습니다.</p> <p> </p> <p>아울러 이 웹사이트에서는 컨텐츠 일부가 화면 표시 영역 밖에 고정되어 볼 수 없는 경우도 종종 발생하곤 했는데, 이럴 때는 <span style="color: #ee2323;"><b>모바일 크롬 오른쪽 상단의 [⁝] 버튼을 눌러 [확대/축소] 기능을 터치</b></span>해 화면 비율을 강제로 바꿔 사용하곤 했습니다.</p> <h2>실험실에 숨은 모바일 크롬, 확대/축소 옵션</h2> <p>사실 요즘 모바일 기기용 레이아웃을 지원하지 않는 웹사이트가 거의 없는터라, 이런 식의 사용법은 매우 흔치 않은 것이긴 했지만, 제 경우 하루에도 몇 번씩 접속해야 하는 사이트다보니 [확대/축소] 기능을 매우 유용하게 이용하고 있었습니다.</p> <p> </p> <p>그런데 최근 모바일 크롬 업데이트 이후 [⁝] 메뉴에서 [확대/축소] 기능이 사라져 버렸습니다.</p> <p>자주 사용하던 기능이 업데이트 이후 사라졌으니 크롬의 실험실로 옮겨졌을 것이라 짐작되었고, 어렵지 않게 찾을 수 있었습니다.</p> <p> </p> <p>먼저 모바일 크롬 창을 열고 <span style="color: #ee2323;"><b>주소창에 chrome://flags를 입력</b></span>해 Experiments(실험실) 화면을 띄웁니다.</p> <p><figure class="imageblock alignCenter" data-ke-mobileStyle="widthOrigin" data-filename="chrome-mobile-zoom-02.jpg" data-origin-width="467" data-origin-height="700"><span data-url="https://blog.kakaocdn.net/dn/b4fT1l/btsDI62Pwwr/V4PGhkWISTDHIuLwNkCq6k/img.jpg" data-lightbox="lightbox"><img src="https://blog.kakaocdn.net/dn/b4fT1l/btsDI62Pwwr/V4PGhkWISTDHIuLwNkCq6k/img.jpg" srcset="https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fb4fT1l%2FbtsDI62Pwwr%2FV4PGhkWISTDHIuLwNkCq6k%2Fimg.jpg" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" alt="chrome://flags" data-filename="chrome-mobile-zoom-02.jpg" data-origin-width="467" data-origin-height="700"/></span></figure> </p> <p> </p> <p>실험실 검색창에 '<span style="color: #ee2323;"><b>zoom</b></span>'을 입력하면, Zoom 키워드가 포함된 실험실 항목들이 쭉 표시됩니다.</p> <p>여기서 <span style="color: #ee2323;"><b>Accessibility Page Zoom</b></span> 항목의 설정값이 [Default]로 표시되는데, 이 Default 항목을 터치합니다.</p> <p><figure class="imageblock alignCenter" data-ke-mobileStyle="widthOrigin" data-filename="chrome-mobile-zoom-03.jpg" data-origin-width="467" data-origin-height="700"><span data-url="https://blog.kakaocdn.net/dn/DCxcs/btsDGrs4nrq/GK10OgD1AIYEPuM57R1Ymk/img.jpg" data-lightbox="lightbox"><img src="https://blog.kakaocdn.net/dn/DCxcs/btsDGrs4nrq/GK10OgD1AIYEPuM57R1Ymk/img.jpg" srcset="https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FDCxcs%2FbtsDGrs4nrq%2FGK10OgD1AIYEPuM57R1Ymk%2Fimg.jpg" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" alt="Accessibility Page Zoom" data-filename="chrome-mobile-zoom-03.jpg" data-origin-width="467" data-origin-height="700"/></span></figure> </p> <p> </p> <p>[Default] 로 설정되어 있는 <span style="color: #ee2323;"><b>기본 값을 [Enabled]로 바꿔 줍니다</b></span>.</p> <p><figure class="imageblock alignCenter" data-ke-mobileStyle="widthOrigin" data-filename="chrome-mobile-zoom-04.jpg" data-origin-width="467" data-origin-height="700"><span data-url="https://blog.kakaocdn.net/dn/r2fc8/btsDKcgS5C7/HjEUH9JZjozPsn5o1YKOAK/img.jpg" data-lightbox="lightbox"><img src="https://blog.kakaocdn.net/dn/r2fc8/btsDKcgS5C7/HjEUH9JZjozPsn5o1YKOAK/img.jpg" srcset="https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fr2fc8%2FbtsDKcgS5C7%2FHjEUH9JZjozPsn5o1YKOAK%2Fimg.jpg" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" alt="모바일 크롬 화면 확대/축소 메뉴" data-filename="chrome-mobile-zoom-04.jpg" data-origin-width="467" data-origin-height="700"/></span></figure> </p> <p> </p> <p>설정을 바꾸고 나면, 모바일 크롬 화면 하단에 크롬을 재 실행할 때 변경 값이 적용된다는 안내문구가 표시되며 [<span style="color: #ee2323;"><b>Relaunch</b></span>] 버튼을 누르면 모바일 크롬이 종료되었다가 재실행됩니다.</p> <p><figure class="imageblock alignCenter" data-ke-mobileStyle="widthOrigin" data-filename="chrome-mobile-zoom-05.jpg" data-origin-width="467" data-origin-height="700"><span data-url="https://blog.kakaocdn.net/dn/KfKAA/btsDGoJU2tW/Pc22EkCKFcAdLW1bABBP30/img.jpg" data-lightbox="lightbox"><img src="https://blog.kakaocdn.net/dn/KfKAA/btsDGoJU2tW/Pc22EkCKFcAdLW1bABBP30/img.jpg" srcset="https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FKfKAA%2FbtsDGoJU2tW%2FPc22EkCKFcAdLW1bABBP30%2Fimg.jpg" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" alt="모바일 크롬 재실행 메시지" data-filename="chrome-mobile-zoom-05.jpg" data-origin-width="467" data-origin-height="700"/></span></figure> </p> <p> </p> <p>참고로 이 단계에서 모바일 크롬을 재실행해도, 원래 열어 놓았던 크롬 창들은 다시 열리니, 창이 닫혀버릴 염려는 하지 않아도 됩니다.</p> <p> </p> <p>일련의 과정을 실행한 뒤, 다시 모바일 크롬의 [⁝] 버튼을 터치하면 없어졌던 [확대/축소] 메뉴가 표시되고, 이 메뉴를 선택 하면 화면 하단에 화면 확대/축소 게이지가 생겨 자유롭게 확대/축소가 가능해 집니다.</p> <p><figure class="imageblock alignCenter" data-ke-mobileStyle="widthOrigin" data-filename="chrome-mobile-zoom-06.jpg" data-origin-width="700" data-origin-height="515"><span data-url="https://blog.kakaocdn.net/dn/dyGOeD/btsDKyxe2Re/V2koUl8fytafX8wmyL5ON0/img.jpg" data-lightbox="lightbox"><img src="https://blog.kakaocdn.net/dn/dyGOeD/btsDKyxe2Re/V2koUl8fytafX8wmyL5ON0/img.jpg" srcset="https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FdyGOeD%2FbtsDKyxe2Re%2FV2koUl8fytafX8wmyL5ON0%2Fimg.jpg" onerror="this.onerror=null; this.src='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png'; this.srcset='//t1.daumcdn.net/tistory_admin/static/images/no-image-v1.png';" alt="모바일 크롬 확대/축소 옵션" data-filename="chrome-mobile-zoom-06.jpg" data-origin-width="700" data-origin-height="515"/></span></figure> </p> <p>아울러 저는 화면 확대/축소 기능보다, 접속한 사이트에서 화면 표시 영역을 벗어난 구간으로 이동할 수 없도록 막혀 있었던 것이 더 큰 문제있는데, [확대/축소] 기능을 살려 놓는 것만으로 자유로운 화면 이동이 가능해졌습니다.</p> <p> </p> <p>사실 포스팅 초반에 밝힌 바와 같이, 요즘 어지간한 웹사이트들은 모바일 기기에 대응하는 레이아웃을 지원하여, 터치 스크린을 두 손가락으로 줌인/줌아웃 하는 방식으로 확대/축소할 수 있는 터라, 모바일 크롬의 메뉴에서 해당 기능을 숨겨버린 것으로 짐작됩니다.</p> <p> </p> <p>아무튼 저처럼 PC 전용 레이아웃만 지원하는 웹사이트에 접속해야 하는데, 화면 확대/축소나 컨텐츠 영역 이동이 되지 않는 경우라면, [확대/축소] 기능을 강제로 활성화시켜 사용해 볼 것을 권합니다.</p> <p> </p> <p>마지막으로, 이 포스팅에서 살펴본 크롬 실험실의 기능은, 예고없이 사라져 버릴 수 있습니다.</p> <p>검색창에 Zoom 이라고 입력해도 Accessibility Page Zoom 항목이 표시되지 않는 경우라면, 해당 기능을 아예 막아버린 것으로 더 이상 사용할 수 없는 상태입니다.</p> <p> </p> <div class="txc-textbox" style="BORDER-TOP: #f3c534 1px dashed; BORDER-RIGHT: #f3c534 1px dashed; BORDER-BOTTOM: #f3c534 1px dashed; PADDING-BOTTOM: 10px; PADDING-TOP: 10px; PADDING-LEFT: 10px; BORDER-LEFT: #f3c534 1px dashed; PADDING-RIGHT: 10px; BACKGROUND-COLOR: #fefeb8">관련글 <ul style="LIST-STYLE-TYPE: none; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px"><!-- google_ad_section_start --> <p><a href="https://comterman.tistory.com/2750" target="_blank" rel="noopener">2023.04.01 - 모바일 크롬 첫 화면, 자주 가는 사이트 항목에 구글 검색 기록 뜨지 않게 설정하는 방법.</a></p> <p><a href="https://comterman.tistory.com/2679" target="_blank" rel="noopener">2022.05.14 - 모바일 크롬 브라우저의 '터치하여 검색' 기능 설정법. 크롬 브라우저의 자동/반자동 검색</a></p> <p><a href="https://comterman.tistory.com/2544" target="_blank" rel="noopener">2021.06.19 - 안드로이드 크롬 브라우저, 주소 표시줄 옆 마이크 버튼 없애는 두 가지 방법</a></p> <!-- google_ad_section_end --></ul> </div>