Ray Style Life

웹브라우저에 관심이 쪼~ 끔 있어서 이것저것 쓰다가, 컴터와 폰 모두 파이어폭스로 통일했습니다.

나름 건드려서 새로탭도 적용해뒀고.
크롬/엣지에서 쓰던 확장들도 비슷한 기능이 있는 것들로 거의다 대체해뒀고 (원노트 클리퍼만 빼고)

그러나 커뮤니티에서 뉴스로 파이어폭스 기반으로 Arc 브라우저 스타일의 브라우저가 나왔다길래 한번 살펴만 봤습니다.

홈페이지 : https://www.zen-browser.app/

일단 제가 세팅하고 쓰는 파이어폭스랑 비슷... 하네요 

새로탭 지원되고, 파이어폭스의 기능은 모두 제공되고 있습니다만, 아직 알파라서 그런지 한글은 지원을 하지 않네요. 이건 뭐 곧 해결될 것 같습니다. 어차피 파이어폭스에서 지원되는건 다 지원될 것 처럼 보이니까요.

지금도 모질라 파이어폭스의 '확장&테마'(Extensions & Themes) 적용은 가능한 것으로 보입니다.

요즘 브라우저들이 데탑+모바일 모두 지원을 하는데 젠 브라우저는 별도의 모바일 버전은 아직 없고 (알파버전이니까..) 데스크탑의 윈도우/맥/리눅스 버전 존재하며, 모바일의 경우 모바일 파이어폭스와 동기화 가능합니다. (파이어폭스 동기화 기능을 사용하네요. 이건 머리 잘 쓴것 같습니다.)

뉴스에 뜬 내용을 정리하면 

상세기능 소개 : https://news.hada.io/topic?id=16405 

    Zen은 아름다운 디자인과 개인정보 보호에 중점을 둔 웹 브라우저
    사용자 경험을 중시하며 데이터를 수집하지 않음
    속도를 위해 설계되었으며, 매 릴리스마다 경쟁 브라우저를 능가하는 빠른 브라우징 경험을 제공

Zen의 주요 기능

    Split views: 여러 사이트를 동시에 탐색할 수 있도록 브라우저를 그리드, 가로/세로 등 여러 뷰로 분할할 수 있음
    Workspaces: 브라우징 필요에 맞게 작업 공간을 생성하여 정리된 상태를 유지
    Profile switching: 업무와 개인 프로필 간에 원활하게 전환
    Side web panels: 현재 페이지를 떠나지 않고 즐겨찾는 사이트와 서비스를 즉시 접근
    Compact Mode: 작은 화면에 적합한 화면 공간을 최대화하는 간소화된 브라우징 경험을 제공

그외 기능

    Beautifully designed: 직관적이고 미적으로 만족스러운 인터페이스 제공
    Customizable: 테마, 레이아웃 등으로 개인 맞춤화 가능
    Keyboard shortcuts: 효율성을 높이는 키보드 단축키 제공
    Tab groups: 작업 흐름을 간소화하는 탭 그룹 기능 제공
    Vertical tabs (곧 출시 예정): 공간과 질서를 최대화하는 수직 탭 기능 제공

라고 합니다.

Edge 로 설정한지 며칠 되었다고 갑자기 Firefox 를 깔아서... Edge 처럼 세팅... 
1) 세로탭
2) PWA 활성화

뭔가 살~~ 짝 어색하지만 90% Edge 화 성공 ㅋㅋ 

3월에는 포토샵을 공부하리라

평소에 Edge 브라우저를 쓰고 있습니다. Google 서비스를 사랑하는(?) 저는 처음엔 크롬을 썼으나, 확장도 호환되고, 세로탭 덕분에 Edge 로 넘어 갔습니다. 

깔끔하게 파비콘만 나오고, 마우스 커서를 가져다 대면 딱! 탭 이름이 나오는게 깔끔하더라구요.  
과거 4:3 비율 모니터나 노트북을 썼을때는 사이드바를 혐오했으나 와이드 비율로 넘어오면서 이쪽이 더 사용성이 좋은것 같더라구요. 

-추가 : Brave 브라우저가 세로탭을 지원하네요. Chrome 세로탭 미지원, 웨일 미지원 / 다른브라우저는 안써서 모르겠습니다 ^_^

문득 서브로 쓰는 Firefox 브라우저는 해당기능이 없나... 싶었는데 확장들이 있긴 하더라구요. 하지만 Edge 처럼 깔끔하게 보이는건 아니라 아쉬웠는데, 저만 이렇게 생각한건 아닌것 같습니다. 

커스터마이징이 쉬운 Firefox 답게 이걸 바꾸는 방법이 있더라구요 ㄷㄷㄷ 

기본적인 Firefox 화면은 이렇습니다. 탭바 주소표시줄이 모두 위에 있죠 

이걸  1) 상단의 탭바를 없앤다, 2) 확장을 설치하고 커스텀해서 엣지의 세로탭처럼 만든다! 가 목표입니다.
최종 결과물은? 

이렇게!!!! 되었습니다. (성공!!) 
웹페이지를 앱으로 만드는 PWA 는 파폭에서 정식 지원하진 않지만, 방법은 있는데, 꽤 불편하더라구요... 추천은 안드립니다. 
위의 커스텀 방법은 Github 에서 방법을 찾아온것입니다. 
출처 : GitHub - sagars007/firefox-vertical-tabs: Vertical tabs for Firefox, inspired by Edge.

1) 파이어폭스 상단의 탭바 숨기기

Firefox 주소창에 about:config를 입력하고 나오는 페이지에서 위험을 감수하고 계속하기를 선택한다. 

설정 이름 검색 란에 toolkit.legacyUserProfileCustomizations.stylesheets 을 입력 -> 오른쪽의 전환 (영문판 기준 Toggle)을 눌러 값을 False 에서 True 로 변경 
--------------

Firefox 주소창에  about:support를 입력. 

프로파일 폴더 옆의 폴더 열기를 실행 -> 윈도우 탐색이 창이 뜹니다.

열린 폴더 안에 chrome 이라는 이름의 폴더를 만들고, 첨부 파일에 있는 userChrome.css 파일을 저장한 후 Firefox 를 다시 시작합니다.

2) 확장 프로그램 설치 및 커스텀 하기
사용할 확장은 Tab Center Reborn 입니다. 
Firefox 실행 후 확장 관리에서 검색을 하시거나 아래 링크를 눌러 설치 하시면 됩니다. 
└ 설치 링크 : https://addons.mozilla.org/ko/firefox/addon/tabcenter-reborn/

설치후 확장기능 관리에 들어가면 (메뉴를 못찾겠으면, 주소창에 about:addons 을 치면 됩니다.)

추천 옵션은 
└ Animations: on
└ Use current browser theme: on
└ Compact Mode: Enabled
└ Favicon-only pinned tabs: on
입니다. 

마지막의 Custom Stylesheet 을 on 으로 하신뒤, 첨부파일의 tabCenterReborn.min.css 을 메모장으로 열어서 해당 내용을 복사해서 붙여넣어 주시고 Firefox 를 재시작 하시면 엣지와 같은 세로탭을 사용하실 수있습니다.