HTML → Markdown 변환

HTML을 붙여 넣으면(조각이든 온전한 페이지든) 깃허브 방식 마크다운으로 바꿔 줍니다. 변환기는 DOM을 훑으며 흔한 태그마다 제대로 된 마크다운을 내보냅니다. <h1>부터 <h6>, <p>, <strong>, <em>, <a>, <img>, 중첩을 지원하는 <ul>과 <ol>, <table>, <blockquote>, 언어를 감지하는 <pre><code>, <hr>, <br>입니다. 스크립트와 스타일은 제거합니다. CMS 내보내기나 블로그 글, 복사한 웹페이지를 마크다운으로 옮길 때 씁니다.

변환은 설계상 한 방향으로 손실이 있습니다. 마크다운이 HTML보다 훨씬 작은 언어이기 때문입니다. 클래스, id, 인라인 스타일, 데이터 속성, 위치에 관한 모든 것은 마크다운에 대응물이 없어서 근사되는 대신 버려집니다. CMS에서 내용을 꺼내는 것이 목적이라면 대개 그것이 핵심이고, 마크업이 속성에 의미를 담고 있었다면 문제가 됩니다.

한계가 가장 먼저 드러나는 곳은 표입니다. 깃허브 방식 마크다운 표는 엄격하게 직사각형이라 두 열이나 두 행에 걸친 칸을 표현할 수 없고, 목록이나 또 다른 표가 든 표도 마찬가지입니다. 실제 페이지의 HTML에는 그 셋이 자주 함께 있으며, 그런 경우 정직한 출력은 HTML을 그대로 두는 것입니다. 마크다운은 자기 문법이 없는 자리에 날 HTML을 허용하기 때문입니다.

패턴을 맞추는 대신 DOM을 훑는 것이 지저분한 입력에서도 출력을 믿을 만하게 만듭니다. 브라우저 파서는 닫히지 않은 태그와 암묵적인 요소, 잘못된 중첩을 화면에 그릴 때와 똑같이 고쳐 놓으므로, 변환기가 보는 구조가 곧 독자가 보는 구조입니다. 정규식 기반 변환기는 대신 글자를 읽는데, 균형이 맞지 않는 마크업이 바로 둘이 갈라지는 지점입니다.

마크다운에서 뜻을 갖는 글자는 나가는 길에 이스케이프가 필요합니다. 낱말 안의 밑줄, 숫자와 마침표로 시작하는 줄, 맨 앞의 우물 정 자는 각각 HTML에서는 평범한 글자이고 마크다운에서는 서식 지시입니다. 그래서 충실한 변환은 그것들을 그대로 통과시키는 대신 무력화해야 합니다.