ImageButton 대신 LinkButton을 쓰자
어떤 버튼을 쓰십니까?
각각 어떻게 다른가?
Button은 웹사이트에 기정의된 스타일을 적용하여 통일성을 주기 위해 많이 사용됩니다. 디자인을 중시하는 우리나라의 성향상 많이 쓰인다고 하기에는 무리가 있지 않나 생각됩니다. 실제로 제가 수행한 프로젝트에서 Button을 썼던 경우는 거의 없었습니다. Button은 <input type="button" ... /> 형태로 렌더링이 됩니다.
ImageButton은 디자인이 좀더 중요한 경우에 이미지형태의 버튼으로 사용하기 위해 쓰입니다. 가장 많이 쓰이는 버튼이라는 점은 asp.net 프로그래머라면 아마도 동의하실 겁니다. 해당 컨트롤은 <input type="image" ... /> 형태로 렌더링이 됩지요.
LinkButton은일반적으로 텍스트에 버튼기능을 붙이기 위해 사용됩니다. <a href="javascript
위 버튼들중 LinkButton 버튼을 많이 사용해보셨나요? 혹시 사용하셨다면 __doPostBack('','');을 실행시키기 위한 디자인이 없는 숨김버튼으로만 사용하신건 아닙니까? 저는 이번 포스트에서 ImageButton을 LinkButton으로 바꿔서 사용해보길 권해드리고 싶습니다. 그럼 자세한 내용은 아래에서 확인하시죠.
LinkButton은 왜 텍스트 형태로만 씁니까?
LinkButton이 자주 쓰이지 않는 것은 텍스트 형태의 버튼이기 때문 아닌가요?Text속성만 제공하기 때문에 개발자들은 "음... 텍스트 속성에 문자열만 들어가는건 당연하지"라고 생각하실 수도 있을겁니다. 그러나, 컨트롤 안에 어떠한 속성이 들어가든 그내용(HTML)은 브라우저가 해석한다는 점을 인지하셔야 합니다. 프로그래머분들이 이러한 간단한 사실을 간과하는 경우를 가끔씩 봅니다. 그럼 텍스트 대신에 이미지를 한번 넣어보겠습니다.
디자인에서 아래와 같은 버튼을 확인하실 수 있습니다.
자주 쓸거면 컨트롤로 만듭시다.
이거 맘에 들었어~. 자주 써먹어야지 하시는 분들께는 컨트롤을 제작하여 사용하시길 권장해 드립니다. c# 코드를 html로 변환하기 귀찮아서 그냥 그림으로 대체하겠습니다. ^^;
굳이 이렇게 할 필요가...? 무슨 장점이 있어서요? -_-;
골치 아프게 왜 이렇게 하나요? 그냥 쓰던대로 하면 되지.
맞는 말씀입니다. 사실 저도 살짝쿵 귀찮습니다. 그냥 잘 쓰던 방법이 최고라는 말에는 동의합니다만, LinkButton을 사용하면 기존에 발생하던 두가지 문제를 해결할 수 있습니다.
첫번째장점은, HyperLink와 ImageButton을 같이 사용하는 경우에 발생하는 디자인의 버튼수직 정렬문제가 쉽게 해결됩니다. HyperLink는 anchor, ImageButton은 input 태그로 각각 렌더링 되다보니 수직정렬에 문제가 발생합니다. 게시판을 예로 들면, 목록버튼은 링크니까 HyperLink, 쓰기는 Submit 되어야 하니까 ImageButton으로 쓰는 경우는 비일비재하죠. 디자인 문제를 해결하기 위해 항상 해당 버튼의 스타일 속성을 변경해야 했습니다.
두번째장점은 TextBox 사용시 엔터키 처리가 용이해집니다. .aspx는 하나의 form 서버컨트롤을 허용합니다. 폼 컨트롤 안에서 엔터키를 입력하면 특정 버튼이 실행되는 현상을 보실 수 있습니다. 그러나, LinkButton은 anchor로 렌더링 되기 때문에 실행이 되지 않습니다. 물론 asp.net 2.0에서는 Panel에 DefaultButton 속성을 추가하여 위 문제를 일부 해결하도록 유도하고 있으며, 각자들 엔터키에 대한 처리는 버튼실행, 탭변환등의 방법을 통해 해결하시고 있을걸로 생각됩니다. (요~ 부분도 조만간 다루어보지요)
한번 써볼까?
다른 버튼들이 문제가 심각하지 않거나 거의 없는게 사실입니다. 하지만, 관심 있으신 분들은 한번쯤 시도해보셔도 좋습니다. 저는 현재 수행하고 있는 프로젝트에서 위 내용을 적용시키고 있으며 결과물에 만족하고 있습니다.