오페라 브라우저의 활용팁(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주소로 변환해 두는 것이다. 그러면 자신의 컴퓨터에서 설정한 값이 최우선이므로 다른 사이트로 나가지 않는 것이다. 물론 이런 방법은 차단이지 제거가 아니다. 그리고 확인해 보지는 않았으나 자신의 컴퓨터에 웹서비스를 해두지 않으면 호스트를 찾지 못하거나 파일이 없다는 에러 화면이 브라우저상에 뜰 가능성이 있다.

관련된 내 블로그:

by 금메달.아빠 on 2010.07.27 00:43 주요 단어: , , , ,
  • BlogIcon jinmoda 2010.07.24 19:08 신고 주소 수정/삭제 답글

    좋은정보 잘 보고 갑니다.
    오페라에 이런기능도 있군요. 전에 잠깐 사용해보고 브라우저가 무거운거 같아서 지워버렸는데.

    • BlogIcon 금메달.아빠 2010.07.25 11:02 신고 주소 수정/삭제

      댓글 감사합니다. 건전한 의견교환을 환영합니다.
      오페라를 쓰다 보면 재미있고 안보이던 부분이 보입니다. 예를 들면 text-shadow 등이 한가지 예입니다.

      요새는 취향에 관계없이 두세개의 브라우저를 쓰는 것도 좋은 경험이 될 것입니다.
      오페라는 마이너이다 보니 새로운 기능이 많이 돋보입니다.
      행복한 하루되세요.

  • BlogIcon 미후왕 2010.07.27 01:49 신고 주소 수정/삭제 답글

    안녕하세요. Kata Pro님
    히야~ 역시 프로와 아마의 차이가 확연히 들어나는 좋은 정보와 글입니다.
    제가 사실 요즘 제가 사용하는 PC한대에서 제 블로그의 광고 가 보이지 않아 의문이었는데
    이것이 원인일 수 있을 것 같습니다. 정보의 역이용일까요? ^^
    아무튼 전혀 모르고 있던 기능이네요. 분명히 오페라쯤 되면 광고 차단 기능을 있을텐데
    하고 천천히 찾아보던 중이었습니다. 딱 걸렸군요 ^^
    좋은 정보 감사드립니다.

    • BlogIcon 금메달.아빠 2010.08.02 01:22 신고 주소 수정/삭제

      안녕하세요? 조금이나마 유익한 정보가 되어 힌트가 되었다니 기쁩니다. 저는 자주 다니는 웹페이지의 불필요한 요소, 자바스크립트를 꺼두고 서핑하고 있습니다.

      광고차단 뿐 아니라 각종 내용을 차단하는 것으로 응용이 가능합니다.
      그럼, 오늘은 이만...

  • BlogIcon 금메달.아빠 2010.08.30 23:44 신고 주소 수정/삭제 답글

    관련 자료, 트랙백한 주소를 모아둡니다.
    http://viewofield.egloos.com/4801791 --- 구글달력과 연관된 내용등
    http://beffecter.tistory.com/834 ---뉴스와 비평
    http://kimdh08.egloos.com/3264551 IT 밸리에 발행되는 외부 블로그 글에 대한 단상
    http://corset.tistory.com/135 --- Adblock Plus

체크하면 비공개 댓글이 됩니다