autofocus 문서가 로드되면 autofocus 속성이 들어간 input 태그에 자동으로 focus가 이뤄집니다. required 회원가입을 할 때 필수항목을 입력하지 않으면 경고 문구가 뜨고 넘어가지 않죠? 원래는 스크립트로 구현해야 하는데 HTML로 쉽게 할 수 있는 방법이 바로 required 속성입니다. input태그 모두 required속성을 주겠습니다. 그리고 한 칸을 비운채로 submit버튼을 누르면 어떻게 될까요? 다음 placeholder 고객이 회원가입을 할 때 해당 입력창에 뭘 입력해야 하는지 힌트를 주는 속성이 바로 placeholder입니다. 물론 응용해서 회원가입 뿐만 아니라 다양한 용도로 사용할 수도 있겠죠? readonly 입력은 받지 않고 읽기와 복사만 가능한 속성입니다..
웹폰트 사용하기 웹사이트의 주소를 복사하여 스타일 시트나 html의 ‘ 대부분의 모던 브라우저에서 지원하는 woff 글꼴 파일을 먼저 선언하고 ttf파일은 그 다음에 선언한다.(ttf가 용량이 크기 때문에) woff파일의 형식을 지원하는 브라우저는 woff를 다운로드 하고 굳이 ttf는 따로 다운로드 하지 않습니다. 외부 스타일 css파일로 연결할 경우 html파일의 부분에 외부 스타일 link을 연결해 놓고 css파일에는 다음과 같이 입력합니다. @font-face{ font-family :‘글꼴이름‘; src : local('글꼴명‘), url('경로명/글꼴이름‘) format(’파일유형‘), url('경로명/글꼴이름‘) format(’파일유형‘), url('경로명/글꼴이름‘) format(’파일유형..
텍스트나 배경에 순수한 검정을 사용하면 안 되는 이유 https://uxmovement.com/content/why-you-should-never-use-pure-black-for-text-or-backgrounds/ Why You Should Never Use Pure Black for Text or Backgrounds Did you know that pure black text can cause eye strain? A survey found that “58 percent of adults in the U.S.” have experienced eye strain from working on computers. Designers can do their part to reduce the likeliho..
랜딩 페이지란 무엇인가요? 홈페이지와 랜딩 페이지의 차이점 홈페이지와 랜딩 페이지에 무슨 차이점이 있는지 헷갈리실 수 있는데요. 주요 차이점은 랜딩 페이지가 단일 마케팅 또는 판매 목적으로 활용하기에 좀 더 적합하다는 것입니다. 반면에 홈페이지에는 다양한 요소가 있습니다. 소개 페이지나 이미지 갤러리, 온라인 쇼핑몰 등이 있을 수 있는데요. 랜딩 페이지는 오로지 사용자들이 원하는 목표를 달성하도록 유도하는 가장 필수적인 정보만을 제공합니다. 랜딩 페이지에는 CTA에서 벗어나게 하는 추가 링크가 많지 않다는 점을 염려하실 수 있습니다. 결과를 먼저 말씀드리자면 랜딩 페이지를 보는 사용자에게는 페이지를 나가거나 전환하는 두 가지의 선택지 밖에 가지고 있지 않은데요. 그렇기 때문에 전환율을 높이거나 잠재 고객..
smile-o meh-o frown-o https://fontawesome.com/v4/icon/smile-o fa-smile-o: Font Awesome Icons Get 1535 icons right now with FA Free, plus another 7020 icons with Pro, which also gets you another 53 icon category packs as we finish them! Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle. Ligatures for easier des fontawesome.com https://fontawesome.com/v4/icon/..