Web 100

마우스 커서 변경 방법, 모래시계, 십자가; Mouse Cursor Change

cursor 라는 CSS 속성에 다음의 값을 지정해 주면, HTML 웹페이지의 마우스 커서 모양이, 십자가나 모래 시계 등으로 변경됩니다. all-scroll: 좌, 우측 스크롤이 가능할때 나타나는 커서 (24x24) (FF : move와 커서 동일) auto : 기본값, 브라우저가 마우스 커서 자동 지정 (12x21) col-resize : 테이블의 세로폭을 리사이즈 할때 나타나는 커서 (21x17) crosshair : 십자가 (17x17) default : OS에서 설정한 마우스의 기본 커서 (대부분 화살표) (12x21) hand : 링크나 개체를 이동할때 나타나는 손 모양의 커서 (17x22) (IE 전용) move : 이동용 커서 (19x19) no-drop : 접근 불가나 Drop 불가를 나..

Web 2017.11.10

글꼴의 단위에 따른 크기 비교표

브라우저의 기본 글꼴크기(1em/100%)를 기준으로한 글꼴 비교표 pointspixelsemspercent글꼴 6pt글꼴 8px글꼴 0.5em글꼴 50%글꼴 7pt글꼴 9.5px글꼴 0.55em글꼴 55%글꼴 7.5pt글꼴 10px글꼴 0.6em글꼴 60%글꼴 8pt글꼴 11px글꼴 0.7em글꼴 70%글꼴 (기준) 9pt글꼴 (기준) 12px글꼴 (기준) 0.75em글꼴 (기준) 75%글꼴 10pt글꼴 13px글꼴 0.8em글꼴 80%글꼴 10.5pt글꼴 14px글꼴 0.85em글꼴 85%글꼴 11pt글꼴 15px 글꼴 0.95em글꼴 95%글꼴 12pt글꼴 16px글꼴 1em글꼴 100%글꼴 13pt글꼴 16.5px글꼴 1.05em글꼴 105%글꼴 14pt글꼴 19px글꼴 1.1em글꼴 110%글꼴..

Web 2017.11.07

모바일 웹사이트 제작 전 알아두면 좋은 10가지

1. 해상도를 고려한 레이아웃 관련자료: http://www.happyjung.com/bbs/board.php?bo_table=lecture&wr_id=1285 모바일 웹사이트 제작은 일반 웹사이트 제작과 있어서 가장 큰 차이점은 해상도 차이에 따른 레이아웃입니다. 모바일 기기가 넷북이나, 노트북, 데스크탑 보다도 디스플레이의 크기가 작기 때문에 이점을 고려한 웹사이트 기획 및 디자인, 퍼블리싱이 필요합니다. 게다가 모바일 기기마다 해상도가 제각각이라는 점도 참 난감한 요소지요. 국내에서 보통 모바일 웹사이트 제작은 전 해상도를 고려하기 보다는 최근 출시된 스마트폰을 기준으로 해서 기획, 개발 및 검수 되는 사례가 많습니다.(아이폰, 갤럭시S) 그래서 요즘에는 이들 스마트폰 환경에 최적화된 모바일 웹사이..

Web 2017.11.06

사이트 등록하기

구글 ( www.Google.com ) 1. 구글 회원가입후 로그인 2. 내계정 > 웹마스터도구 > 사이트추가 웹마스터도구 : https://www.google.com/webmasters/tools/home 3. 등록할 웹사이트 주소 입력 4. 메타테그 또는 생성된 html 파일을 웹페이지에 등록 ( 둘중에 하나만 해도 됨 ) 참고사이트 http://goodlifegood.tistory.com/442 야후 ( www.Yahoo.com ) 1. 야후 회원가입 후 로그인 2. http://siteexplorer.search.yahoo.com/ 3. 등록할 웹사이트 주소 입력 4. 메타테그 및 생성된 html 파일을 웹페이지에 추가 ( 둘다 해야함 ) 참고자료 http://goodlifegood.tistory..

Web 2017.11.05

해상도에 따라서 이미지, 동영상의 사이즈를 자동적으로 조절

[ 방법 1. CSS 활용 ] 해상도에 따라서 이미지의 크기가 자동으로 변하면서도, 이미지 본래의 크기보다 해상도가 커지는 경우에는 이미지 크기가 고정 최대 크기(max-width)를 100%로 지정하여, 자동으로 크기가 조정되고 중요한 점은 둘러싼 div 인경우 마찬가지로 % 형태로 되어 있어야 합니다. [ 방법 2. CSS 활용 ] [ 방법 3. jQuery 활용 ] 해상도에 따라서 이미지의 크기가 자동으로 변하면서도, 이미지 본래의 크기보다 해상도가 커지는 경우에는 이미지 크기를 고정하는 방법 참고자료 http://adminplay.com/webhosting07/169935 http://www.erzsamatory.net/86 http://tobyyun.tumblr.com/post/557704170..

Web 2017.11.02

호스팅 서버 IP확인 & 서버 IP 노출 방지 체크리스트

서버의 트래픽을 절약해 주기 때문에 사용하지만, 공격을 차단해 주고 실제 서버의 IP를 숨겨주기 때문에 사용합니다. 특히 중소규모의 디도스 공격이 잦은 사이트라면 클플 사용으로 상당한 효과를 거둘 수 있지요. 그런데 실제 서버의 IP가 노출되면 이것도 모두 소용없게 됩니다. 서버 IP를 직접 공격할 수 있게 되니까요. [ 운영 서버 IP 를 확인하는 방법 ] 1. ping 2. http://network-tools.com/ 이 사이트는 해당 호스트에 대한 DNS 정보와 Traceroute 등등 호스트에 대해 공개된 정보를 보여주는 사이트 도메인 Traceroute 및 DNS 정보, 도메인 정보와 IP whois 를 지원 3. http://iphostinfo.com/cloudflare/ 클라우드플레어를 사..

Web 2017.11.01

검색엔진에 잘 노출되는 방법

검색엔진에 잘 노출되는 10가지 방법 1. 웹 사이트와 연관성이 매우 높은 핵심 키워드를 선정할 것 2. 각 페이지에 메타 태그를 적용시킬 것 3. 검색로봇이 수집하기 쉬운 페이지 구성 형태를 갖출 것 4. 이미지보다는 텍스트를 지향할 것 5. 텍스트에 핵심 키워드가 포함되도록 할 것 6. 문장은 두괄식으로 작성할 것 7. 문장 속에 링크를 늘 포함시킬 것 8. 저작권에 문제가 없다면 쉽게 퍼갈 수 있도록 구성할 것 9. 과거 페이지를 업데이트할 것 10. 링크가 끊어진 페이지를 즉시 수정할 것 전체내용보기 : http://blog.naver.com/kickthebaby/20016387052 구글에서 공개한 검색 엔진 최적화 기본 가이드 1. SEO의 기초 -. 명확하고 독창적인 타이틀의 사용 -. “d..

Web 2017.10.21

네이버 검색등록 삭제하기

네이버 검색등록 삭제하는 방법을 정리해봅니다. 1. 도메인 및 호스팅이 유효해서 제어가 가능한 경우 사이트 삭제하고자 하는 사이트 HTML 문서의 태그 사이에 아래의 메타태그를 추가해주셔야 합니다. 메타태그를 추가하여 검색로봇의 접근을 막은 후, 웹마스터도구를 통해 루트페이지를 재수집 요청합니다. 2. 도메인 삭제 등의 이유로 접속할 수 없는 경우 참고자료 http://kin.naver.com/qna/detail.nhn?d1id=1&dirId=10601&docId=282843574

Web 2017.10.20

접속자 로그 분석 서비스

네이버나 구글에 광고를 집행하는 경우, 부정클릭에 대한 피해가 매우 큽니다. 접속기록에 대한 신뢰성 문제로, 내가 기록한 것이 아닌 제3자에 의한 기록을 근거로 부정클릭에 대한 이의제기를 네이버나 구글에 해야하는데요. 로그 분석 업체를 정리해봅니다. 1. 로그접속자마케팅 http://www.http.or.kr/ 2. 스마트로그 http://smlog.co.kr/ 3. 코이스 (시피시가드) http://www.cpcguard.com/

Web 2017.10.19