오페라 브라우저의 활용팁(V) 컨텐츠 차단및 제거방법

오페라(Opera) 브라우저 고급기능에 접근하여 컨텐츠를 차단하다.
차단은 군데군데가 하얗게 남게 되고, 제거는 깨끗이 레이아웃이 재정렬 되는 방법이다. 제거는 사용자가 어느 정도 지식이 있어야 이해될 것이다.

컨텐츠 차단법(I)

오페라 브라우저 --> 마우스 오른 클릭 --> 콘텐트 차단(메뉴) 클릭 -->
  페이지내의 차단하고 싶은 이미지, 동영상등을 클릭 --> 완료 버튼 클릭

Discussion

열람하고 있는 사이트의 페이지에 들어있는 요소를 사용자가 취사선택할 수 있는 방법으로 이후 방문하더라도 차단된 내용은 계속 유효하다. 차단된 내용이 무엇인지 확인하려면 같은 수순에서 "완료" 버튼 오른쪽에 있는 "자세히..." 버튼을 누르면 상세내용을 알수 있다.

멀티미디어 파일, 이미지 뿐 아니라 자바스크립트에 의해 구동되는 요소들도 차단가능하다.
그러나 차단된 내용의 영역은 페이지 안에서 공백으로 표시되 는 경우가 있다. 이는 영역의 요소에 높이 속성을 고정값으로 지정한 것이 원인이 될 수 있다.

참고:  인터넷 익스플로러의 경우는 옵션으로 사이트 차단 기능이 있다.
이러한 방법을 잘 축적해둔 오페라 브라우저 대응 사이트도 있다.(영문, 뉴질랜드 사이트)
참조 주소: http://www.fanboy.co.nz/adblock/opera/

컨텐츠 제거법(II)

오페라 브라우저 --> 환경설정 --> 고급설정(탭) --> 콘텐트 -->
스타일옵션 버튼을 클릭 --> 디스플레이(탭) --> 내 스타일시트를 지정 -->
프레젠테이션 모드(탭) --> 작성자 모드: 내 스타일시트를 체크
제거한 예:  유명 국내 포털 이므로 광고가 제거된 부분이 금새 눈에 띄게 될 것이다.

오른쪽 로그인 부분도 제거해 보았다.

CSS

위에서 내 스타일시트를 지정하기 위해서는 미리 사용자 스타일시트를 만들어야 한다.

 /* 예를 들면 <div id="advertise_top"> 요소를 제거하려면 */
div#advertise_top {display:none}

Discussion

이 방법은 사용자의 스타일시트(CSS)를 사용하여 페이지내 요소들을 제거(비표시)로 전환하는 방식이다. 그러기 위해서는 페이지 안에서 사용하는 DOM을 보고 제거하고자 하는 요소의 클래스명이나 ID값을 찾아야 한다.

자바스크립트에 의해서 구동되는 요소들은 DOM에 나타나지 않기 때문에 CSS만으로 완벽하게는 차단하기 어렵다. 그리고 웹페이지가 항상 요소 클래스 또는 ID를 지정하는 것이 아니기 때문에 반드시 효율적이라고는 말할 수 없다. 자주 방문하게 되는 웹사이트라면 번거롭더라도 스타일시트를 써서 차단하면 불필요한 요소를 제거(비표시)로 해볼만 하다. 단지 <script>로 지정되어 스크립트로 요소를 생성하는 DOM에서는 자바스크립트를 차단하는 것으로 충분하지만 요소를 만들어 두고 내용을 자바스크립트로 추가하는 경우는 CSS를 병행해야 공백까지 제거된다.

이 방법은 특히 차단 영역이 공백으로 표시되지 않고 레이아웃은 깨끗이 재배치된다. 마치 웹페이지의 일부 요소가 처음부터 없던 것 처럼 제어가 가능하다.

참고: 요소 클래스와 ID를 보려면 오페라(Opera)의 개발자도구(Dragonfly, 잠자리 기능)을 쓰거나 파이어폭스의 애드온( FireBug)를 쓰면 알기 쉽다.

사용자 스타일시트 지정과 브라우저의 비교

브라우저	사용자 지정 스타일시트
Opera 전 버전	가장 자유도가 높다
Safari 4, 5	환경설정 --> 고급탭 --> 스타일시트
FireFox	아마도 OK로 기억함
Chrome	사파리를 따라 했겠죠?
Internet Explorer 7	"사용자 CSS가 뭐죠?"

브라우저의 이 기능을 어디에 쓸것인가?

  그럼 이런 컨텐츠 차단/제거 기능을 어디에 응용할 수 있는가?
예를 들면

• 어린이에 유해 사이트 차단,
• 본문과는 무관한 광고 차단 또는 광고 제거,
• 때로는 통계를 작성하는 자바스크립트의 차단,
• 페이지 로딩 시간 절약 등
• 통신비 절약
  

이 응용가능하다.
그리고 차단하면 그만큼 웹페이지가 가벼워지면 트래픽양이 줄어들어 종량제 요금도 절약되고 지구 온난화 방지에도 기여한다고 말할 수 있겠다. 광고없는 인터넷에서 지구온난화 방지에도 조금이나마 기여해 보자.

그외의 방법

http://ko.wikipedia.org/wiki/광고_필터링
호스트파일을 조작해 두면 어떤 브라우저에서도 광고등 컨텐츠를 차단할 수 있다. 원리적으로 본다면 특정 컨텐츠 사이트 IP주소를 자신의 IP주소로 변환해 두는 것이다. 그러면 자신의 컴퓨터에서 설정한 값이 최우선이므로 다른 사이트로 나가지 않는 것이다. 물론 이런 방법은 차단이지 제거가 아니다. 그리고 확인해 보지는 않았으나 자신의 컴퓨터에 웹서비스를 해두지 않으면 호스트를 찾지 못하거나 파일이 없다는 에러 화면이 브라우저상에 뜰 가능성이 있다.

관련된 내 블로그:

[연구와 개발] - 블로그 인쇄용 스타일시트(CSS)에 관하여
[일상을 논함] - 내가 오페라(Opera) 인터넷 브라우저를 쓰는 이유
[일상을 논함] - 내가 사파리(Safari) 웹브라우저를 쓰는 이유
[일상을 논함] - 오페라 브라우저의 활용 팁(I) 소스보기로 편집까지
[일상을 논함] - 오페라 브라우저의 활용 팁(II) 암호관리자의 고급 옵션
[일상을 논함] - 오페라 브라우저의 활용 팁(III) 노트장 기능으로 상용구를 쓸수 있다
[일상을 논함] - 오페라 브라우저의 활용 팁(IV) CSS로 읽기도구를 구현하다
[일상을 논함] - 광고 없는 인터넷에 서핑하고 싶다
[일상을 논함] - 점점 쌓이는 웹쓰레기는 언제 치워질 것인가?