전체 글 376

QuickLinks

상단메뉴 바로가기본문내용 바로 가기 실제 브라우저에서 볼때야 상단메뉴(gnb) 가 바로 보이지만마크업상에서보면 첫번째 라인에서 gnb의 메뉴 하나하나를 보기까지는 상당히 먼 거리 일수가 있다.그래서 상단메뉴 바로가기 라는것도 넣어준다.엄연히 접근성을 위함이라지만, 가끔은 왠 지랄인가..라는 생각이..근데 저거 ie7에서는 또 탭키로 안먹는다 ㅎㅎul 아니라 div 로 해주면 먹는구려.. 본문내용 바로가기도 마찬가지 이럴 경우 css 는width: 0;height: 0;line-height: 0;over-flow: hidden;visibility: hiddenfont-size: 0;border: 0 none; 가로세로 넓이 죽이고 over-flow hidden 만 줘도 안보이지만 이거저거 같이 엮어서( 가..

코드/Html & CSS 2013.03.19

롱테일 법칙

용어 : 롱테일 법칙(Long Tail theory) 해석 : '결과물의 80%는 조직의 20%에 의하여 생산된다'라는 파레토법칙에 배치하는 것으로, 80%의 '사소한 다수'가 20%의 '핵심 소수'보다 뛰어난 가치를 창출한다는 이론이다. 파레토법칙은 20%의 상품이 총 매출의 80%를 창출하고, 20%의 충성스런 고객들이 총 매출의 80% 차지한다는 식으로 '결과물의 80%는 조직의 20%에 의하여 생산된다'는 이론이다. 이같은 '80 대 20 법칙'은 비즈니스 분야에서 황금률로 받아들여져 마케팅의 기본 토대가 되었다. 인기상품을 고객의 눈에 잘 띄는 곳에 진열하여 판매하거나 소수의 우수고객 또는 우량고객을 우대하는 등의 마케팅 기법은 모두 이 이론에 근거한 것이다.롱테일법칙은 파레토법칙과는 거꾸로 8..

display:none 스크린 리더 음성 출력문제

과 스크린 리더 음성 출력문제얼마 전 display:none 이라고 설정한 내용을 스크린 리더가 읽어 주어서 고민이었다라는 글이 올라온 적이 있어습니다. 어제 국내 스크린 리더중 하나인 센스 리더가 업그레이드 하면서 이 문제를 해결하였습니다. 즉 display:none 으로 설정하면 해당 내용은 음성 출력을 하지 않습니다. 물론 센스 리더 가상 커서 옵션 상에서는 읽을 수 있는 옵션도 마련하였습니다.정찬명님께서 보내 주신 display 관련 부분을 센스리더와 드림보이스가 각각 어떻게 음성 출력하는지 비교해 보았습니다. 정찬명님에게 감사 드리며 웹 표준에 조금이나마 도움이 되시기를 바랍니다. 백남중 ....... 이 문장은 display:block 된 문장입니다. 이 문장은 display:none 된 문장..

코드/Html & CSS 2013.03.06

height 100% 높이 잡기

사전 조건DOCTYPE을 사용 할 것IE, Firefox, Opera, Safari 등 모든 브라우저에서 Standard Mode 혹은 Almost Standard Mode가 되는 조건은 아래 와 같다. 위와 같이 HTML Page에 첫번째로 선언하면 기본적인 BoxModel Problem을 해결 할수 있다.다른 Doctype도 많지만 가장 무난히 호환성을 유지해 나가면서 표준을 지키고 여러 브라우저에서 동일하게 표현 하기에 제일 좋은 Doctype이라 생각이 든다. 첫 번째 조건높이가 100%인 div 영역height: 100%;보통 div element에 위와 속성을 주면 안된다 ㅡㅡㅋ원인을 찾아 보니깐 저 조건이 되기위해서는 parent element의 height의 영향을 받기 때문이다.그래서 해..

코드/Html & CSS 2013.02.27

자바스크립트로 stylesheet 파일 로드하기

var lightBoxStyle = document.createElement('link'); lightBoxStyle.rel='stylesheet'; lightBoxStyle.href='/_COMMON/css/jquery.lightbox-0.5.css'; document.getElementsByTagName('head')[0].appendChild(lightBoxStyle); IE7에서 크래쉬난다는 소리가 있더라. 뭐 그딴걸 무시하는 나로썬 냅둬라.. 혹은 var headerHTML = document.getElementsByTagName('head')[0].innerHTML; headerHTML +=""; document.getElementsByTagName('head')[0].innerHTML = h..

코드/JS 2013.01.15

플렉스 코딩 폰트 변경

이런 사소한 걸 국내 사이트에서 찾기가 오히려 빡시다. Quicktip: Changing the font in Flex 3 editor Have you ever wanted to turn enlarge that font size in the code editor in Flex builder 2/3, but have thrown in the towel after several hours poking around to find this setting? Since Flex is build on Eclipse, this part of the editor is actually identical to the Eclipse interface. To change the font, choose Window -> Pref..