HTML코딩 : 리펙토링, 코딩 기초 기술 문제

HTML코딩 : 리펙토링, 코딩 기초 기술 문제


리펙토링이 필요한 나쁜 코딩 중 하나를 언급하며, HTML코딩에 필요한 지식 하나 다뤄봅니다.


문제점: 위험하거나 표준이 아닌 기술을 사용한다.

많은 사이트에서는 쿠키, 자바스크립트, 플래시, PDF, 자바 같은 비 HTML코딩 기술들을 사용한다.


이 기술들(HTML코딩) 모두가 자신의 역할이 있지만, 웹에서 너무나 남용되고 있는 게 현실이다. 또한, 실제 사용하면서 대부분 웹 개발자가 생각하는 만큼 호환성이 높거나 안정적이지 않아서, 이 브라우저 저 브라우저에서 사용자에게 보안 구멍을 피하려면 페이지를 닫으라는 잦은 보안 경고의 주범이 된다.


보통 구글이나 다른 대부분 검색엔진에서는 이 기술들을 지원하지 않는다.


결국, 이런 기술이 지원되지 않을 때도 사이트의 페이지 대부분이 정상적으로 작동할 수 있도록 노력해야 한다. 다행히도, 이런 종류의 문제점은 확연히 드러나서 알아차리기 쉽다.

다음과 같은 공지를 보게 된다면 HTML코딩에 문제가 있는 것이다.


쿠키가 필요합니다.

죄송합니다. 이 사이트에 접속하기 위해서는 쿠키를 사용할 수 있도록 설정해야 합니다.

계속 진행하려면 인터넷 브라우저에서 쿠키를 허용하도록 설정하십시오.


저희 사이트에서는 소비자의 취향을 파악하고, 좀 더 나은 배송과 개인화된 서비스를 제공하며, 기존에 구매하셨던 상품을 다시 구매하는 일이 없도록 쿠키를 사용합니다.


HTML 쿠키 허용


이런 사이트는 사용자의 짜증을 유발할 뿐만 아니라 구글 같은 검색엔진에서 신경 쓰지 않게 되어 검색했을 때 맨 뒤 페이지에서나 보이게 된다.


창피하게도 다음 예는 HTML 코드 정리에 대한 웹 페이지에서 나온 메시지다.


알림: 이 페이지의 목차는 동적으로 생성됩니다. 제대로 보기 위해서는 자바스크립트 사용이 가능하도록 설정해주세요.


동적 컨텐츠를 다루는 올바른 방법은 서버 측에서 템플릿을 생성해 클라이언트로는 정적 HTML 형태로 보내는 것이다.


내가 찾은 사이트는 위에서 말한 안 좋은 HTML코딩 결과를 대부분 포함하고 있었다.


본 사이트는 자바스크립트, 쿠키, 플래시, 팝업 창을 사용하고 인터넷 익스플로러, 넷스케이프 내비게이터(넷스케이프 6 제외), 오페라의 최선 버전에서 정상적으로 작동하도록 개발됐습니다.


이 사이트가 해상도에만 제한을 뒀다면 -100점 만점이 됐을 것이다.


HTML 쿠키 사용, 악취


그 대신 이 사이트는 새로운 것을 하나 추가했다. 나조차 간과했던 팝업의 존재를 상기시켜줬다.


팝업의 마구잡이식 사용으로 인해 팝업차단 소프트웨어가 널리 사용되면서 정상적인 사이트에게는 팝업이란 더는 믿을 만한 기술이 아니게 됐다.

물론 자바스크립트나 다른 비 HTML코딩 기술을 사용해야 하는 경우가 있다. 앞으로 구글맵이나 유튜브 같은 사이트를 만들지 말라는 뜻은 아니다.


단지 현란한 기술은 최소한으로 하고 자바, 자바스크립트, 플래시 같은 기술 없이도 가능한 것은 기술을 사용하지 않고 개발하려 노력하는 게 좋다는 뜻이다.


HTML 코딩, 리펙토링


그런 면에서 플리커Flickr에서 나오는 다음과 같은 메시지는 훨씬 덜 거슬린다.


플리커를 최대한 활용하시려면, 자바스크립트 실행이 가능한 브라우저와 최신 버전의 매크로미디어 플래시 플레이어가 필요합니다.


이 페이지의 큰 차이점이라고 한다면 자바스크립트나 플래시를 활용할 수 없는 상태더라도 내가 보려는 페이지의 컨텐츠를 볼 수 있다는 점이다.


모든 컨텐츠를 완벽하게 볼 수 있거나, 모든 기능을 활용하지는 못하더라도 최소한 페이지에 접근은 할 수 있다. 이것은 사용자뿐 아니라 구글 같은 검색엔진에도 훨씬 좋다.


사이트 개발자로서 나는 클라이언트의 요구사항을 더 단순하게 할 수 있는지 확인할 것이다. 하지만 이것이 최우선 과제는 아니다.


출처 : 효율적인 XHTML 웹 표준 사이트 구축을 위한 리팩토링 HTML, 엘리엇 러스티 해롤드, 에이콘

이 글을 공유하기

댓글(0)

Designed by JB FACTORY