본문 바로가기

CSS6

[강추] 실용예제로 배우는 웹 표준 http://www.yes24.com/24/goods/1522512 평소에 웹표준에 대해 관심이 많았던 차에 우연히 이 책을 알게 되어 구입을 하게 되었는데, 정말 도움이 많이 되는 책이다. 초보를 위한 책이라기 보다는 뭐랄까...주먹구구식으로 써왔던 CSS에 대해 이론적으로 배우게 된다고 할까? 그 동안 아마추어로서 사이트 개발을 하면서 CSS를 써오면서도 제대로 배운 적도 없고 항상 목말라 있었는데 이 책을 읽으면서 그 중요성과 활용도, 가치, 웹 표준에 맞춰야 하는 당위성을 찾아가고 있다. 2008년 맥을 사용한 이후부터는 사이트를 만들면서 맥용 사파리나 파이어 폭스에서도 IE에서와 동일한 UI와 기능이 동작하도록 항상 신경을 쓰면서 만들었는데, 어찌보면 그 만큼 시간이 더 투자될 수도 있겠으나 사.. 2010. 6. 20.
웹 표준 개발자의 IE8 고려사항. 네이버 스마트에디터의 UI를 담당하고 계신 정찬명님(지금도 담당하고 계신가?)이 쓴 글입니다. 웹프로그래머나 디자이너라면 참고적으로 꼭 한번 읽어보면 도움이 되지 않을까 싶습니다. http://naradesign.net/wp/2009/03/12/670/ IE8이 웹표준에 맞춰 개발이 되었다고는 하는데 ACID3에서는 매우 낮은 점수를 받아 정말 웹표준을 지원하는 것이 맞냐는 반발도 많은 것 같습니다. (참고로 애플 사파리나 오페라 브라우저는 100점에 가까운 점수를 받았다고 하더군요.) (파이어폭스 3.1 베타3의 Acid3 점수. http://acid3.acidtests.org/) 어쨌거나, 과거 비표준 IE7에 맞춰서 개발된 웹사이트들은 당장은 IE8에서 호환성 모드를 제공하기 때문에 웹페이지가 깨지.. 2009. 3. 21.
네이버 스마트에디터 풍부한 스타일을 사용하려면 앞으로 네이버 스마트에디터(이하 SE)를 계속 쓰게 될 것 같아 팁을 적어놓을 겸 해서 카테고리를 아예 하나 만들었다. 게시판에 붙여서 쓰다보니 글을 작성할 때는 인용문구나 여러 가지 효과가 잘 적용이 되는데, 작성한 뒤에 게시글을 보면 그 효과가 나타나지 않아 생각해 보니 역시 스타일시트가 제대로 적용되지 않아서였다. SE가 제공하는 스타일시트는 2가지가 있는데 말 그대로 기본적인 스타일시트를 적용하는 default.css와 다른 하나는 style.css다. (모두 하위 css 폴더에 저장이 되어 있다.) style.css 를 열어보면 아니나 다를까 .smartOutput이라는 클래스가 정의되어 있고, 친절히 주석까지 붙어 있었는데 그걸 못봤네... .smartOutput{ font-size:12px;.. 2009. 2. 11.
게시판 만들기 진행상황 마지막으로 글을 올린지도 벌써 한달이 지났군요. 그 사이 쇼핑몰을 공부하면서 만드느라 게시판 쪽에 신경을 쓸 겨를이 없었는데, 어차피 이 게시판도 쇼핑몰에서 쓸 것이라 계속 손을 보고는 있습니다. 현재는 CSS를 적용해서 나름 조금 더 깔끔하게 꾸몄습니다. 아직 회원 관리 기능과의 접목과 게시판 관리 기능 등등이 할 일이 많네요. 제일 고민되는 부분이 사이트와의 연동인데, 옛 제로보드처럼 위의 게시판 본체 부분을 두고 상단과 하단에 다른 소스를 불러와서 전체 사이트와 연동이 되게 해야 하나...걱정입니다. 쇼핑몰에서 보이는 부분과 관리자 영역에서 보이는 상하단 부분이 다르다 보니, 이걸 합리적으로 해결하는 방법을 찾고 있습니다. (도와주세요...-_-) 그나저나 게시판 만들면서 공부했던 것들이 쇼핑몰을 .. 2009. 1. 15.
폼나는 라운드 버튼 만들기 개인적으로 참 마음에 드는 버튼입니다. 위는 완성된 모습이구요. 아래는 동작원리입니다. 백 그라운드 이미지를 CSS로 처리해서 눌렀을 때와 정상 상태일 때의 모양이 다르게 보입니다. 태그를 이용하더군요. (정확한 원리는 잘...--a) http://www.oscaralexander.com/tutorials/how-to-make-sexy-buttons-with-css.html 2009. 1. 9.
폼에 CSS 적용하기 CSS를 공부하다 보니 참 재미있더군요. 아래 튜토리얼은 Form에 CSS를 적용해서 깔끔하게 레이아웃을 잡아줍니다. http://www.webcredible.co.uk/user-friendly-resources/css/css-forms.shtml 2009. 1. 9.