몇 년 전, 저는 Web Highlights 브라우저 확장 프로그램을 만들기 시작했어요. 그때는 웹에서 글을 정말 많이 읽었는데, 읽은 내용을 정리할 방법이 없었어요. 나중에 필요할 때 그 정보를 다시 찾느라 애먹는 일이 잦았죠.
그래서 웹페이지의 텍스트에 형광펜 표시를 하고, 그 형광펜 표시를 어디서든 다시 볼 수 있는 방법을 찾았어요. 몇 가지 도구가 있었지만 제게 맞는 건 없었어요. 그래서 직접 Web Highlights를 만들었어요.
지금은 수십만 명의 사용자가(저도 포함해서) 이 온라인 형광펜을 매일 쓰고 있고, 저는 이제 이 도구 없이 일하는 하루를 상상하기 어려워요. 이 글에서는 웹페이지에 형광펜 표시를 하고 메모하는 기본부터 고급 검색과 필터, AI 요약, 간격 반복(spaced repetition) 학습까지, 시작하는 방법과 가장 효율적으로 쓰는 방법을 보여 드릴게요.
설치하기
먼저 브라우저 확장 프로그램을 설치해야 해요. Web Highlights는 Chrome, Edge, Brave 등 Chromium 기반 브라우저와 Firefox에서 쓸 수 있어요.
Web Highlights 확장 프로그램은 Chrome 웹 스토어, Microsoft Edge 추가 기능, 또는 Firefox 부가 기능에서 찾을 수 있어요.
단계별 안내가 필요하다면 문서의 설치 가이드를 확인하세요.
오른쪽 위의 "Chrome에 추가" 버튼을 클릭하면 시작 가이드로 이동하고, 이 가이드가 설정 과정을 안내해 줘요.
먼저 확장 프로그램 아이콘을 고정해 두면 편해요. 브라우저 오른쪽 위의 확장 프로그램 아이콘을 클릭한 뒤 "고정" 아이콘을 클릭하면, 쓸 때마다 바로 손이 닿는 곳에 있어요.
계정 만들기(선택)
이 형광펜 도구의 좋은 점은 계정을 만들지 않아도 바로 쓸 수 있다는 거예요. Web Highlights 기능 대부분은 무료이고 계정 없이 쓸 수 있어요. 예를 들면 이런 기능이에요.
- 🖋️ 웹사이트와 PDF에 형광펜 표시
- 🎨 여러 가지 형광펜 색상
- 🔖 북마크 저장
- ✍️ 메모 작성
- 🏷️ 태그 만들기
- 📤 Markdown으로 내보내기
- 💾 자료 백업
- ⚡ 효율을 높여 주는 단축키
- 📖 읽기 모드 — 페이지를 방해 요소 없는 문서로 저장
그 밖의 기능은 무료 계정이 필요하고, 그중 상당수는 유료 Premium·Ultimate 플랜에 포함돼요. 유료 플랜은 7일 동안 무료로 써 볼 수 있어요. 자세한 내용은 문서의 시작하기 가이드를 확인하세요. 계정과 유료 플랜으로 쓸 수 있는 주요 기능은 다음과 같아요.
- 🔄 형광펜 표시를 동기화하고 어떤 기기에서든 열기
- 👨🏼💻 강력한 웹 앱 — 그리드, 목록, 메이슨리 보기
- 📷 이미지에 형광펜 표시
- 𝐓 서식 있는 형광펜 표시 — 제목, 글머리 기호, 코드 블록 등을 그대로 유지
- 🧠 무제한 간격 반복 학습 — 형광펜 표시를 플래시카드로 바꿔 읽은 내용을 기억 (무료 플랜과 Premium은 플래시카드 10장까지)
- 🤖 AI 요약 및 AI 채팅 — 브라우저 내장 AI로 요약을 만들고 콘텐츠에 대해 대화 (무료 플랜과 Premium은 하루 1회, Ultimate는 더 많이)
- 📄 Notion으로 바로 내보내기
- 📘 Markdown으로 Obsidian에 내보내기
- 🔗 Capacities로 내보내기
- 📑 PDF 파일과 HTML 파일로 내보내기
- 📱 휴대폰에서 페이지를 북마크로 저장
- 🎬 무제한 YouTube 형광펜 표시 — YouTube 동영상 스크립트에 형광펜 표시와 메모 (무료 플랜과 Premium은 하루에 동영상 1개)
- ⏰ 이메일 알림 설정
- 📚 Kindle 형광펜 표시와 메모 가져오기
- 🔎 고급 필터 — AND/OR 조건, 보이는 항목 맞춤설정, 빠른 필터 문법
- 🔗 형광펜 표시 공유하기
계정은 무료로 만들 수 있어요. 클라우드 동기화를 쓰면 형광펜 표시가 클라우드에 백업되고, app.web-highlights.com 웹 앱에서 어떤 기기로든 자료를 열 수 있어요. 동기화는 7일 체험 기간에는 무료이고, 그 뒤에는 Premium과 Ultimate에 포함돼요. 업그레이드하지 않아도 형광펜 표시는 그대로 남고, 동기화만 멈춰요.
계정 만드는 법
이메일 주소로 계정을 만들거나 "Google로 로그인"을 클릭하면 돼요.
Web Highlights는 개인정보 보호를 매우 중요하게 여기며, 사용자의 데이터에 대해 다음을 약속해요.
- 승인된 사용 사례 외에는 제3자에게 판매하지 않아요
- 확장 프로그램의 핵심 기능과 관련 없는 목적으로 사용하거나 전송하지 않아요
- 신용도 판단이나 대출 목적으로 사용하거나 전송하지 않아요
개인정보 보호에 대한 자세한 내용은 Web Highlights의 개인정보처리방침 또는 Chrome 웹 스토어에서 확인할 수 있어요.
형광펜 표시 시작하기
계정 없이 쓰든 계정을 만들었든 상관없어요. 어떤 웹사이트나 PDF에서든 텍스트에 형광펜 표시를 하면서 바로 시작할 수 있어요.
아무 사이트에나 들어가 텍스트를 선택하면 형광펜 아이콘이 나타나고, 여러 형광펜 색상 중에서 고를 수 있어요. 형광펜 표시를 하는 모든 방법은 공식 형광펜 표시 가이드에 정리돼 있어요.
저처럼 어떤 주제로 글을 쓴다고 해 볼게요. 최근에 쓴 글 중 하나는 웹 컴포넌트(Web Components)에 관한 글이었어요. 이럴 때 저는 인터넷에서 자료를 찾고, 글에서 필요한 문단에 형광펜 표시를 해요. 원하는 텍스트를 선택하고 Web Highlights의 형광펜 아이콘을 클릭하면 끝이에요. 형광펜 아이콘을 클릭하면 기본 색상으로 표시되고, 옆에 있는 색상 중 하나를 클릭해도 돼요.
영상으로 보는 게 더 편하다면, 첫 형광펜 표시부터 아래에서 다루는 메모, 태그, 대시보드까지 전체 흐름을 이 짧은 영상에서 볼 수 있어요.
팝업이 뜨는 게 싫을 때도 있죠. 그럴 때는 설정에서 형광펜의 자동 팝업을 끌 수 있어요.
걱정하지 마세요. 팝업을 꺼도 텍스트를 선택한 뒤 마우스 오른쪽 버튼을 클릭하면 형광펜 표시를 할 수 있어요. 컨텍스트 메뉴에 Web Highlights 아이콘이 보이면 선택한 텍스트에 형광펜 표시 항목을 클릭하세요.
단축키도 쓸 수 있어요. 주소창에 chrome://extensions/shortcuts 주소를 붙여 넣으면 단축키를 직접 정할 수 있어요.
긴 글에 형광펜 표시를 할 때는 측면 패널 상단에서 빠른 형광펜을 켜 보세요(Alt+Q, Mac에서는 Option+Q). 선택하는 텍스트마다 현재 색상으로 바로 형광펜 표시가 돼요. 팝업도, 추가 클릭도 없어요.
태그와 메모 만들기
형광펜 표시를 하고 나면 팝업이 나타나고, 여기서 태그를 달거나 메모를 남길 수 있어요. 예를 들어 저는 나중에 웹 앱에서 형광펜 표시와 메모를 쉽게 찾으려고 "mental-health" 태그를 골랐어요. 형광펜 표시는 측면 패널에서도 보고 수정할 수 있어요.
태그를 클릭하면 그 태그가 달린 형광펜 표시와 페이지를 언제든 모아 볼 수 있어요. 측면 패널에서는 이렇게 보여요.
웹 앱에서 형광펜 표시 찾기
여러 페이지에 형광펜 표시를 해 두었다면 app.web-highlights.com에 로그인해서 언제 어디서든 찾아볼 수 있어요.
ℹ️ 웹 앱은 위에서 설명한 대로 계정을 만든 경우에만 쓸 수 있어요.
대시보드는 이렇게 생겼어요. 저는 이미 형광펜 표시를 꽤 많이 해 두었죠.
기본적으로 형광펜 표시를 한 페이지는 날짜별로 묶이고, 만든 시간 순서로 정렬돼요. 웹사이트별로 묶거나 묶기를 아예 끌 수도 있어요.
웹 앱은 그리드, 목록, 메이슨리 레이아웃을 지원하고, 원하는 보기는 섹션마다 기억돼요. 그래서 페이지는 목록으로, 형광펜 표시는 그리드로 보는 식으로 매번 다시 설정하지 않아도 돼요. 형광펜 표시를 한 페이지를 클릭하면 그 페이지에서 한 형광펜 표시를 모두 볼 수 있어요.
예를 들어 아래는 Tiago Forte가 만든 강력한 정리 기법인 PARA 방법에 관한 페이지에서 제가 한 형광펜 표시예요.
왼쪽 탐색 메뉴에서 형광펜 표시를 한 페이지와 형광펜 표시를 오가며 볼 수 있어요. "페이지"에는 형광펜 표시를 한 페이지가 보이고, "형광펜 표시"로 바꾸면 페이지를 열지 않고도 모든 형광펜 표시를 볼 수 있어요.
페이지와 형광펜 표시 말고도 탐색 메뉴에서 메모, 태그, 웹사이트, 작성자, 색상, AI 요약, AI 채팅, 문서, 이미지, 컬렉션을 둘러볼 수 있고, 각각 자체 보기와 정렬 옵션이 있어요. 전체 개요는 웹 앱 그리드 및 필터 문서를 확인하세요.
태그로 관련 형광펜 표시 찾기
이제 앞에서 만든 "mental-health" 태그를 찾아볼게요. 이 태그로 필터를 걸면 목록이 바뀌고, 그 태그를 단 페이지와 형광펜 표시만 보여요. 정보를 다시 찾기가 정말 쉬워지죠.
"mental-health" 태그가 달린 형광펜 표시가 두 개 있는 게 보이죠.
AND/OR 조건을 쓰는 고급 필터
태그도 좋지만, 자료 범위를 좁히려면 여러 조건을 함께 걸어야 할 때가 있어요. 이럴 때 고급 필터가 필요해요. 고급 필터는 Ultimate 플랜에 포함돼요.
웹 앱에서 필터 바를 열고 태그, 웹사이트, 작성자, 색상, 날짜 범위 같은 조건을 추가할 수 있어요. 특히 강력한 점은 필터를 AND 또는 OR 조건으로 묶을 수 있다는 거예요.
- AND — 항목이 활성 필터를 모두 만족해야 해요(결과가 좁아져요)
- OR — 항목이 활성 필터 중 하나만 만족해도 돼요(결과가 넓어져요)
예를 들어 저는 AND 조건으로 태그 두 개를 한꺼번에 걸어서 딱 필요한 교집합을 찾을 때가 많아요. 검색창에서 바로
빠른 필터 문법을 써도 돼요.
tag:mental-health처럼 입력하고 Enter를 누르면 끝이에요. 시간이 정말 많이 절약돼요.
여기에 더해 보이는 항목 맞춤설정으로 그리드에 어떤 메타데이터를 보일지 정할 수 있어요. 필요에 따라 제목과 날짜만 보거나 더 자세한 정보를 표시할 수 있죠.
웹사이트 필터
특정 웹사이트로 필터를 걸 수도 있어요. 왼쪽 탐색 메뉴에서 "웹사이트"로 이동하면 지금까지 형광펜 표시를 한 모든 웹사이트를 한눈에 볼 수 있어요.
예를 들어 "medium.com"을 선택하면, 전에 주석을 달았거나 북마크한 페이지가 모두 보여요.
검색 필터
찾는 정보를 가장 빨리 찾는 방법은 강력한 전체 텍스트 검색이에요.
웹 앱 왼쪽 탐색 메뉴에서 "검색"을 클릭하고(또는 확장 프로그램 측면 패널의 검색을 쓰고) 입력을 시작하세요. 검색 보기에서는 모든 유형의 항목이 한꺼번에 나와요. 페이지, 형광펜 표시, 태그, 웹사이트, 작성자, 색상, 이미지, AI 요약, AI 채팅까지 검색어와 맞는 모든 것을 한눈에 볼 수 있어요.
예를 들어 아래는 "habit"이 들어간 모든 결과예요.
여기서 유형 필터를 추가해 결과를 좁힐 수 있어요. 화살표 키로 필터 드롭다운을 오가며 Enter로 적용하거나, 검색창에서 빠른 입력 문법을 바로 써도 돼요.
예를 들어
type:highlights를 입력하면 형광펜 표시만 보여요. 형광펜 표시와 페이지를 함께 보는 것처럼 필터를 여러 개 겹쳐 쓸 수도 있어요.
활성 필터는 필터 바에 배지로 표시되니 무엇이 적용됐는지 한눈에 알 수 있어요. 배지의 ✕를 클릭하면 그 필터가 지워지고, 모두 지우면 전체 결과로 돌아가요. 빠르고 키보드로 다루기 좋아서, 필요한 자료를 찾는 일이 정말 간단해져요.
북마크 저장하기
Web Highlights는 텍스트에 형광펜 표시를 하는 데만 쓰는 게 아니에요. 나중에 이어서 형광펜 표시를 하거나 그 페이지를 다시 찾을 수 있도록 페이지를 북마크로 저장할 때도 아주 유용해요.
텍스트를 선택하지 않은 상태에서 아무 웹사이트에서나 마우스 오른쪽 버튼을 클릭하고 "페이지를 북마크로 저장"을 골라도 돼요.
활용 예시: 나중에 읽기 목록에 페이지 저장하기
저는 흥미로운 글을 발견하면 북마크로 저장하고 "ToRead" 태그를 달아 두곤 해요. 나중에 웹 앱에서 그 태그가 달린 페이지만 필터로 모아 보면 돼요.
제 나중에 읽기 목록은 이래요.
한 걸음 더 나아가, 글을 잊지 않도록 알림을 설정할 수도 있어요. 형광펜 표시를 한 페이지에서 시계 아이콘을 클릭하고 날짜와 시간을 고르면 돼요.
그러면 그 글을 잊지 않도록 알려 주는 이메일을 받게 돼요.
읽기 모드와 문서 저장
제가 거의 매일 쓰는 기능 중 하나가 읽기 모드예요. 나중에 볼 글이나 방해 없이 읽고 싶은 글을 찾으면, 측면 패널에서 바로 문서로 저장할 수 있어요. Web Highlights가 광고, 팝업, 쿠키 배너 같은 군더더기를 걷어내고 깔끔하게 읽을 수 있는 버전만 남겨 줘요.
읽는 환경도 바꿀 수 있어요. 글꼴 크기, 줄 간격, 레이아웃 너비를 조절하고 라이트, 다크, 세피아, 고대비 모드 중에서 고를 수 있어요. 저장한 문서는 웹 앱의 "문서" 섹션에서 볼 수 있어서 어떤 기기에서든, 오프라인에서도 다시 열 수 있어요.
AI 요약과 AI 채팅
내장 AI를 지원하는 컴퓨터에서 Chrome이나 Microsoft Edge를 쓴다면 AI 요약과 AI 채팅 기능이 마음에 들 거예요. AI 요약은 형광펜 표시와 페이지 내용을 간결하게 정리해 줘요. 모든 처리가 기기 안에서 이뤄지기 때문에 데이터가 컴퓨터 밖으로 나가지 않아요.
AI 채팅은 한 걸음 더 나아가 콘텐츠에 대해 대화할 수 있게 해 줘요. 이어서 질문하거나, 특정 부분을 깊이 파고들거나, 어려운 주제를 설명해 달라고 할 수 있어요. 핵심만 알면 되는 긴 연구 논문을 읽을 때 특히 유용했어요.
YouTube 형광펜 표시
몇 년 전에 있었으면 좋았겠다 싶은 기능이에요. YouTube 형광펜 표시예요. Web Highlights는 YouTube 동영상의 스크립트를 불러와서 일반 글처럼 형광펜 표시를 하고 메모를 달 수 있게 해 줘요. 스크립트의 아무 부분이나 클릭하면 동영상이 정확히 그 장면으로 이동해요. 교육 콘텐츠를 많이 보는 분이라면 확실히 달라지는 걸 느낄 거예요.
형광펜 표시 내보내기
자료 조사를 위해 형광펜 표시를 어느 정도 해 두었다면 Notion이나 Obsidian 같은 다른 도구로 내보내고 싶을 수 있어요.
그래서 Web Highlights에는 여러 가지 내보내기 기능이 있어요. 메모를 즐겨 쓰는 연구 도구로 쉽게 옮길 수 있어요.
고를 수 있는 내보내기 옵션은 다음과 같아요.
- Markdown 복사
- HTML 복사
- PDF 파일로 내보내기
- HTML 파일로 내보내기
- Capacities로 내보내기
- Notion으로 내보내기
- Obsidian으로 내보내기 (Markdown 이용)
Markdown이나 HTML로 복사하는 건 모든 플랜에서 되고, PDF 파일이나 HTML 파일로 내보내려면 Ultimate가 필요해요. 이 옵션은 모두 형광펜 표시를 한 페이지의 점 세 개 아이콘을 클릭하면 나와요. 아래는 자료를 Markdown으로 내보내 Notion 같은 개인 지식 관리(PKM) 도구로 가져오는 예시예요.
예시: Markdown 복사
웹 앱에서 형광펜 표시를 한 페이지의 "Markdown 복사"를 클릭하면 메타데이터를 포함해 그 페이지의 모든 형광펜 표시가 복사돼요.
복사한 Markdown을 Notion 같은 곳에 붙여 넣으면 이렇게 보여요.
Web Highlights는 이미지, 제목, 태그, 형광펜 표시, 메모까지 페이지에 관한 모든 정보를 옮겨 줘요.
읽은 내용 기억하기
솔직히 말해서, 온라인에서 읽은 것 중 일주일 뒤에도 기억나는 게 얼마나 될까요? 헤르만 에빙하우스의 고전적인 기억 실험에서는 복습하지 않으면 새로 익힌 내용의 약 3분의 2가 단 하루 만에 사라졌어요. 바로 그래서 저는 Web Highlights에 간격 반복 학습을 넣었어요.
원리는 간단해요. 형광펜 표시가 플래시카드가 되고, Web Highlights가 과학적으로 최적화된 간격에 맞춰 복습할 때를 알려 줘요. 내부적으로는 SuperMemo(SM-2) 알고리즘을 써요. Anki 같은 플래시카드 앱의 기본 스케줄러가 바탕으로 삼은 방식이에요. 잘 아는 카드는 더 나중에, 헷갈리는 카드는 더 빨리 다시 나와요.
더 궁금하다면 이 주제를 깊이 다룬 글도 있어요. Spaced Repetition — How to Make Your Readings Stick in Long-Term Memory(영문)
마치며
Web Highlights를 쓰면 자료 정리가 훨씬 효율적이에요. 텍스트에 형광펜 표시를 하고 태그를 달아 두면 온라인에서 본 정보를 언제든 쉽게 찾을 수 있어요. 메모는 생각을 정리하는 데 도움이 되고, 내보내기 기능으로 작업 결과를 Notion, Obsidian, Capacities 같은 즐겨 쓰는 도구로 옮길 수 있어요.
AND/OR 조건 고급 필터, 방해 없는 읽기 모드, AI 요약, YouTube 스크립트 형광펜 표시, 간격 반복 학습 같은 기능까지 갖추면서, Web Highlights는 단순한 형광펜을 훌쩍 넘어섰어요. 온라인에서 진지하게 자료를 조사하는 모든 분을 위한 지식 관리 도구가 됐어요.
