본문 바로가기

전체 글24

placeholder 줄바꿈 처리 placeholder 줄바꿈을 하려면 을 추가합니다. cs 2020. 6. 24.
외부영역 클릭 시 레이어 팝업 닫기 외부영역 클릭할 경우 레이어팝업이 닫히는 스크립트입니다. See the Pen 외부영역 클릭시 레이어팝업 닫기 by wisesilver (@wisesilver) on CodePen. 2020. 6. 24.
이미지 용량 최적화 이미지의 특성을 고려하지 않고 올바르지 않은 확장자로 이미지를 저장할 경우에도 용량이 커질 수 있습니다. 또한 올바른 확장자로 이미지를 저장했더라도 원본 이미지 용량이 너무 크면 홈페이지 로딩이 느려질 수 있습니다. 그렇기 때문에 홈페이지 제작 시 이미지의 원본 화질을 최대한 유지하면서 용량을 줄이는 과정이 필요합니다. 이미지 파일 형식 GIF 보통 로딩바 이미지 같은 애니메이션 이미지의 경우 GIF로 저장합니다. 256색 이하의 색상으로 표현되는 아이콘, 이미지 (PNG가 10~30% 정도 더 뛰어난 압축률을 제공하기 때문에 256색 이하 이미지는 PNG로 저장합니다.) 애니메이션 이미지 또는 투명한 부분까지 저장이 가능하나 반투명한 알파값은 표현 불가 투명한 부분과 이미지의 경계가 뚜렷한 경우 사용 .. 2020. 6. 24.
웹 개발 입문자에게 추천하는 HTML, CSS 사이트 HTML, CSS 같은 경우 기본개념을 알지 못하면 해당 역할을 알면서도 실무에 제대로 응용을 하지 못하는 경우가 많습니다. 프로트엔드개발자 뿐만 아니라 백엔드개발자도 유지보수 등 기본 화면 제작을 위해 어느정도 HTML, CSS를 익힐 필요성이 있습니다. 1. 웨버 스터디 입문 추천합니다. 참고서처럼 개념이 자세히 서술돼있습니다. 웨버스터디 웹 제작을 처음 접하는 사람들을 위한 무료 강의. 웹 제작, 웹 디자인을 위한 HTML과 CSS에 대해 보다 쉽게, 보다 깊이 다룹니다. 초보자부터 숙련된 개발자까지 모두 함께 할 수 있는 사이트 webberstudy.com 2. 생활코딩 입문 ~ 중급 이상 추천합니다. HTML, CSS, jQuery, Javascript, Github 등 실무에 유용한 정보를 익.. 2020. 6. 23.
개발 소스 비교 사이트 두개의 소스를 비교할 수 있는 유용한 사이트를 소개하고자 합니다. 필자의 경우 사이트 재구축 전 변경된 CSS 소스와 싱크를 맞추기 위해 해당 사이트를 이용했는데, 별도의 프로그램 설치가 필요없어서 간편하게 사용할 수 있습니다. 1. Diffichecker Diff Checker Try our desktop app Offline mode, advanced features and more www.diffchecker.com 소스 비교 가능한 사이트입니다. UI가 단순해서 쉽게 사용 가능하지만, 소스가 많을 경우 위치 찾기가 번거로운 단점이 있습니다. 2. DiffNow DiffNow www.diffnow.com 소스, 파일, URL 비교 가능한 사이트입니다. 위치 찾기 기능이 있어 소스를 비교하기에 용이합.. 2020. 6. 23.
애드센스 신청방법 및 승인 TIP 애드센스란? 애드센스는 구글이 운영하는 수익 배분 사업의 일환으로 운영되기 시작하였다. 수익 배분 사업을 쉽게 풀이하자면 광고 게재 사업 정도라고 보면 된다. 광고주들이 구글에게 광고를 의뢰하면 구글은 개인 사이트 및 블로그에 광고를 게시한다. 이로부터 구글이 일정 수익 이상을 받으면 고객에게 광고료를 지급하는 방식이다. 애드센스 신청자격 블로그의 경우, 설치형 블로그 또는 이글루스나 티스토리 자유롭게 보장된 블로그에만 적용이 된다. 애드센스 신청방법 1. 애드센스 홈페이지 이동 Google 애드센스 - 웹사이트에서 수익 창출하기 Google 애드센스의 웹사이트 수익 창출 기능을 사용하여 수익을 올려보세요. Google 애드센스에서 광고 크기를 자동으로 최적화하여 광고의 노출 및 클릭 가능성이 높아집니다.. 2020. 6. 23.