본문 바로가기

먹고살거/웹지식[IT정보]

(20)
퍼블리셔들의 지침서 리스트업~! 상식 & 팁-웹표준교과서-웹 접근성 & 웹 표준 완벽 가이드-읽기 좋은 코드가 좋은 코드다 : 더 나은 코드를 작성하는 간단하고 실전적인 테크닉-웹사이트 해부하기 : 실무에 적용하는 인터랙션 디자인 프레임워크 실무 마크업-HTML & CSS(실전 홈페이지 제작을 위한 파워테크닉)-웹표준 핵심가이드북 XHTML+CSS(웹 접근성에서 크로스 브라우징까지)-만들면서 배우는 HTML5 + CSS3 + jQuery -실력이 탐나는 드림위버 CS5 HTML CSS (2011) 실무 구현-다이내믹한 웹표준 사이트를 위한 DOM스크립트-자바스크립트 완벽 가이드-거침없이 배우는 자바 스크립트-jQuery Mobile-사전처럼 바로 찾아 쓰는 jQuery 모바일-모바일 애플리케이션 UX & UI 디자인 프로젝트 -HTML..
windows 7 localhost 세팅 퍼옴 http://snoopybox.co.kr/1537
웹퍼블리셔의 정체성 웹 표준을 지키고 웹 접근성을 향상 시키는 사람. UI 개발자, HTML 코더, Front-end Engineer. 편집디자인 1년 웹디자인 1년 웹코더 3년의 경력을 가진 웹퍼블리셔이다. 이제 사회생활 6년째에 접어들은 나. 아직도 갈길이 멀다.
팀교육 : 코딩정의서 ♣ CSS 속성 작성시 css속성은 한줄로 작성하되, 너무길어 가독성이 떨어질경우 여러줄로 작성할것. 아래와 같은 순서로 css속성를 작성할것. display, position(top,left), float, overflow (min-width, width), (min-height, height) (padding, margin) font(text-indent, text-align, font-weight, font-size, line-height, font-family, color) border, background z-index, zoom 예) .select {float:left; width:200px; padding-top:20px; border:1px solid red;} ♣ html, css 주석 ..
HTML5 [2012년, HTML5 혁명 온다] 모바일 생태계 지각변동 HTML5 지원 단말기 전망(자료 : SA) 연도 2009년 2011년 2012년 2016년 대수 300만대 3억6000만대 6억7300만대 15억6000만대 비중 1% 22% 41% 85% HTML5가 나오기까지 주요 웹 기술 발전 현황 1991년 HTML 1994년 HTML2 1996년 CSS1·자바스크립트 1997년 HTML4 1998년 CSS2 2000년 XHTML1 2002년 테이블리스 웹디자인 2005년 아작스(AJAX) 2009년~ HTML5 http://www.etnews.com/201112230155
인터넷 웹 콘텐츠 접근성 지침서 지침1.인식의 용이성 1.1텍스트 아닌 콘텐츠의 인식 1.2영상매체의 인식 1.3색상에 무관한 인식 지침2.운용의 용이성 2.1이미지 맵 기법 사용 제한 2.2프레임의 사용 제한 2.3깜빡거리는 객체 사용 제한 2.4키보드로만 운용 가능 2.5반복 네비게이션 링크 2.6반응시간의 조절기능 지침3.이해의 용이성 3.1데이터 테이블 구성 3.2논리적 구성 3.1온라인 서식 구성 지침4.기술의 진보성 4.1신기술의 사용 4.1별도 웹사이트 제공 자료제공 : 인터넷 웹 콘텐츠 접근성 지침서 http://award.standardmag.org/list/9/index.html
차세대 인터넷 세상 지배할 HTML5(새로운 인터넷 규칙) 잡아라 이제 html의 새로운 시대가 열렷다 드뎌 html5!! 하지만 2014년의 일이라니..ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ ☞HTML5(HyperText Markup Language 5) 인터넷 홈페이지를 제작하는 데 쓰이는 최신 규칙. 별도 프로그램을 깔지 않아도 인터넷 접속프로그램(브라우저) 상에서 화려한 그래픽 효과를 내고 음악·동영상을 자유롭게 감상할 수 있다. 오는 2014년 기술표준으로 공식 발표될 예정이다. 별도의 프로그램 설치 안 해도 다양한 콘텐츠 마음대로 사용 애플·MS·구글·페이스북 등 글로벌 IT 기업들 주도권 경쟁 세계 최대 소셜네트워크(인맥관리)서비스 페이스북은 전 세계에서 8억명 이상의 가입자를 확보했다. 기업가치는 1000억달러(약 114조원)를 넘는 것으로 평가된다. 페이스북은 인터넷에..
팀교육 : faq 제이쿼리 만들어보기 QNA,FAQ 공통 폼 faq 제목1 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 제목2 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 제목3 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq 제목4 영역입니다. faq 내용 영역입니다. faq 내용 영역입니다. faq..
팀교육 : 따라다니는 퀵메뉴 만들기 컨텐츠 영역 퀵메뉴 [출처] 따라다니는 퀵메뉴 만들기|작성자 kaeng
웹표준으로 코딩된 곳(마크업이 맘에들어) 아주 잘되었다고 생각한다 플래시를 사용하지 않고 효과를 부드럽게 주었고 메뉴 구조도 자연스럽고 가끔 크로스 브라우징이 안된곳이 눈에 띄지만ㅋㅋㅋㅋㅋㅋㅋㅋㅋ 글도 마크업이 좋다! http://enter.kyonggi.ac.kr/index.asp
팀교육 : 인접 컨텐츠에 맞춰 늘어나는 div, div 안에서 세로 중앙정렬되는 컨텐츠 Style div.wrap {width:600px; *zoom:1} div.wrap:after {content:""; clear:both; display:block} div.wrap .left {width:300px; float:left} div.wrap .right {width:250px; float:right; border:5px solid #666666; padding:10px; position:relative} div.wrap .right p {line-height:16px} div.wrap .right.js_on {padding:0 10px} div.wrap .right.js_on p {position:absolute} Javascript jQuery(function(){ $(".wrap .r..
코딩좀 공유합시다. 유용한 정보가 많은곳 http://www.webmini.net/webtip?PHPSESSID=2e86b0c1f2dbb51a98f00c47004c6668
웹퍼블리셔 작업의 구조설명(이해하기 쉽다.) 어떤 사람의 몸매 -> HTML 그사람의 옷차림,헤어스타일 -> CSS 그사람의 전체적인 스타일 -> HTML + CSS .몸매와 옷차림이 좋아 전체적인 스타일이 좋은사람은 킹카등극 .몸매가 좋으면 옷매무새가 살고 옷을 골라입는것에 따라 몸매의 결점을 커버가능 .몸매(키 등)를 바꾸려면 뼈를깍는 고통과 시간이 소요 .옷차림이나 헤어스타일은 손쉽게 변경가능 .몸매는 표준이 존재한다 -> HTML구조의 표준화 .양말을 귀에걸면 안된다 -> 적절한 CSS의 사용 이걸 읽고 나서야 이해를 할수있었다. 근데 javasrcipt와 jquery는 뭘까? 그사람의 성격???????행동????몸짓손짓?????? '_'ㅎㅎㅎㅎ뭐든 뭔가 액션을 취한것이겠지? 오홍홍홍홍 이쁜짤 신민아
웹퍼블리셔의 필독 하코사 http://cafe.naver.com/hacosa 웹접근성연구소 http://www.wah.or.kr/index.asp W3C 대한민국 사무국 http://www.w3.org/ 한국장애인인권포럼 http://www.ableforum.com/ 한국 웹 접근성 그룹 http://kwag.net/ 신현석님 블로그 http://hyeonseok.com/ 정찬명님 블로그 http://naradesign.net/wp/ 필수도서 Best 5 http://naradesign.net/wp/2007/07/17/124/ 자기가 하고싶고 관심이 있다면.. 이미 알고계신것일수도 있습니다^^* 일단 검색해봅시다!
팀교육 : floating banner Style #content_a {width:800px; height:1200px; padding:10px; margin:0 auto; border:5px solid #333} #quick {position:absolute; top:100px; left:50%; margin-left:425px; width:180px; padding:10px; text-align:center; height:100px; background:#000; color:#fff; font-weight:bold} Javascript jQuery(function($){ var quickBox = $("#quick"); var quickTop = parseInt(quickBox.offset().top); //퀵메뉴 top 포지션을 변수로..
웹퍼블리셔 트랙백URI - http://naradesign.net/wp/2007/01/02/99/trackback/ - 나라디자인의 정찬면님 - 웹 퍼블리셔의 세 가지 기술. 1. 구조 기술(Structure Technique) - Semantic Markup 과 Valid Markup 을 모두 구사하는 기술. 2. 표현 기술(Rendering Technique) - CSS 만을 이용하여 표현에 관계된 요소를 처리하고 이를 최적화 하는 기술. 3. 호환 기술(Compatibility Technique) - 다양한 Vendor, Platform, Device 에 대하여 동일한 Content 또는 동일한 View 를 제공하는 기술. 구조기술(structure technique). 문법적으로 유효한 XHTML 을 구사하..
팀교육 : 탭메뉴 HTML 공지사항 공지사항 리스트입니다. 공지사항 리스트입니다. 공지사항 리스트입니다. 공지사항 리스트입니다. 공지사항 리스트입니다. 보도자료 보도자료 리스트입니다. 보도자료 리스트입니다. 보도자료 리스트입니다. 보도자료 리스트입니다. 보도자료 리스트입니다. 이벤트 이벤트 리스트입니다. 이벤트 리스트입니다. 이벤트 리스트입니다. 이벤트 리스트입니다. 이벤트 리스트입니다. CSS #tab_nav {width:190px; min-height:110px; border:4px solid #E6E6E6; padding:6px; overflow-y:auto} #tab_nav h2 {background:#999; color:#fff; font-weight:bold;} #tab_nav h2 a {display:bloc..
팀교육 : 접근성을 해치지 않는 팝업 열기 HTML 새 창 JS function openPopup(name, url, left, top, width, height, toolbar, menubar, statusbar, scrollbar, resizable) { var objPopup; toolbar_str = toolbar ? 'yes' : 'no'; menubar_str = menubar ? 'yes' : 'no'; statusbar_str = statusbar ? 'yes' : 'no'; scrollbar_str = scrollbar ? 'yes' : 'no'; resizable_str = resizable ? 'yes' : 'no'; objPopup = window.open(url, name, 'left='+left+',top='+top+',..
팀교육 : 이미지 갤러리 HTML CSS #gallery p {float:left; border:6px solid #333333; padding:5px} #gallery ul {clear:both; padding:10px 0 0 0} #gallery ul li {float:left; margin:0 4px 0 0; border:4px solid #333333} #gallery ul li.on {border:4px solid #FF3300} JQUERY jQuery(function($){ var imgThumb = $("#gallery ul li"); //썸네일 리스트를 변수로 저장 $("#gallery ul li:eq(0)").addClass("on"); //리스트 중 첫번째에 on 클래스 부여 //alert(thumbLengt..
웹접근성이란게 뭘까? 웹접근성이란게 뭘까? 대충 정리를 해보자면 → 모든 사람들이 쉽게 볼수있는 웹페이지를 만드는 거라 할수있다. 장애인, 저사양 컴퓨터 사용자, 저속 회선 사용자, 노인, 리눅스, 텍스트 브라우저 사용자 등 신체적, 환경적 조건에 관계없이 웹에 접근하여 이용할 수 있도록 보장하는 것입니다. 그러기 위해선 표준코딩이 필요하다. 표준코딩 이건 또 뭐냐..? 말하는것을 들으면.. 플래쉬 없이 스크립트로 하고 alt 값만 잘 집어넣으면 된다고 하던데.. 카도 인가 뭔가에서 돌려서 100%에 가깝게 해야 된다고...ㄷㄷ 더 잘알아보야겠다.. ㅋㅋㅋㅋㅋㅋㅋㅋ 참고사이트 =웹 접근성 연구소 http://iabf.or.kr/Lab/ =웹 접근성 향상 캠페인 https://www.kado.or.kr/wa/About/Acti..