본문 바로가기

작업/웹디자인

 (11)
개인, 상업 무료 폰트 | 겟쇼 get show 겟쇼 폰트. 폰트명에 걸맞게 시원시원한 스타일의 폰트. 그래서 그런지 여름하고 잘 어울릴 느낌이다! 숫자 스타일도 가볍게 쓰기 좋고 필기체지만 직관적인 느낌이 난다. 아쉽지만 웨이트는 한가지. 대문자 E가 참 귀엽다. 왠지 서핑 브랜드 티셔츠에 나올 법한 폰트랄까. 그래서 끄적인 서퍼의 명언이었던듯? 이미지도ㅎㅎㅎ내 생각엔 정말 찰떡. 항상 생각하는 바이지만 한글도 이런 폰트들이 많이 생겨났음 좋겠다. 무료로ㅎㅎ 그레인 준 배경에 잘 보이게끔 블랙으로 올려봤는데, 물든듯한 컬러로 넣어줘도 참 예쁘겠다. 빈티지 스럽게 작업해도 좋겠지만, 작게 포인트로도 예쁘더라! 굿굿 예뽀라
개인 무료 폰트 | 영문 필기체, 레터링이 예쁜 Antro Vectra 개인 무료 이용 가능한 폰트 아마도 다폰트에서 찾은 폰트일텐데 조만간 진행 할 포폴 작업때 써볼까해서 가져와 봤다. 사실 블로그에는 상업용까지 전부 무료로 가능한 폰트들만 포스팅 하려 했는데, 하다보니ㅎㅎㅎㅎㅎ 내 맘에 드는것만 손이 간다..... 포스팅은 강제성이 없기 때문에...내 맘이 젤 중요함.ㅋㅋㅋㅋ쓴 표가 나듯 안나듯 한 폰트지만 짧은 글이거나 긴 글이거나 여러모로 쓰기가 좋은 폰트다. 그래서인지 레터링 타투에 많이들 쓰는 듯 하다. 표가 안난다는건 촌스럽지 않다는 거지. 자간만 조금씩 조절해주면 완벽한 레터링이 된다. 개인 작업으로만 사용이 가능하고, 숫자 4가 저 모양인게 참 아쉽다. 짧은 문구와 긴 글 예시안. 필기체, 손글씨에서만 느낄 수 있는 차분함이 잘 살린 폰트다. grunge 이..
: hover 간단한 리스트 만들기 HELLO MENU ABOUT CONTACT :hover로 스타일 변경만 적용한 리스트. 간단한 코드로 컬러나 이미지만 예뻐도 잘 만든것 처럼 보여질 수 있다. ▶코드는 https://jsfiddle.net/yf0xcpe9/
개인, 상업 무료 폰트 | 마틸다 Mattilda 개인, 상업용 무료로 이용 가능한 폰트 두번째로 가져온 무료폰트는 마틸다 폰트다. 레옹과 그 마틸다가 생각나냐고 한다면..글쎄? 안봐서 잘 모르겠음ㅋㅋㅋㅋㅋ Note of the authorHello, and thank you for downloading this font. Mattilda is good for Brand design, T-shirt, Handwritten logo adn many more. I made it with love, so I hope you’ll love to use it! Cheers :) 저자가 쓴 말을 보면 다운로드 한거 고맙고 브랜드 디자인, 티셔츠, 필기체 로고 등등에 유용하다고 한다. 그리고 본인 작업물에 큰 사랑을 표현하고 있다. 귀엽다. 헷 그?녀?의 말처럼 타..
HTML 한바퀴 ⑥HTML과 5 ●html과 css css란 html요소들이 어떻게 보여질지를 정의하는 언어. html에 css를 적용하는 방법은 3가지가 있다. 인라인/내부/외부 인라인 스타일 html 태그 안에 적용 내부 스타일 시트 html 문서 내에 적용 외부 스타일 시트 css파일에 적고 html문서에 연결하는 방법. -중복시 적용 순위. 인라인 > 내부>외부> 웹 브라우저 기본 스타일 내부/외부 시트 안에 선언 된 것들 중에서는 마지막에 선언된걸로 적용. -css 선택자 #id 특정 아이디. 한개 .class 해당 요소들. 여러개 ●html과 자바스크립트 -자바스크립트는 객체 기반의 스크립트 언어. -html로 내용을 작성하고 css로 디자인을 한다면 자바스크립트로는 동작을 구현한다. -웹페이지에 사용할 스크립트를 정의할때,..
HTML 한바퀴 ⑤form,input ●form -사용자가 입력한 데이터를 서버로 보낼때 사용한다. -form안에 input태그를 넣고 type으로 다양한 유형 지정이 가능하며 method로 데이터 전달 방식을 설정한다. -블록요소. ●method -사용자로 부터 받은 데이터를 서버로 전달하는 방식에는 두 가지가 있다. get -주소(url)에 데이터를 추가하여 전달하는 방식. -눈에 보여지기도 하고 데이터의 크기가 제한적. post -데이터를 별도로 첨부하여 전달하는 방식. -외부에 보여지지 않고, 데이터 크기 제한x -get보다 보안성이 높음. 이 form 태그 안에 인라인 방식으로 action과 method를 넣어주고, 사이에 을 넣어주면 된다. ●input -type의 종류 text 텍스트를 입력. 글자가 나옴 password 비밀번..
HTML 한바퀴 ④레이아웃 ●레이아웃 tcp에서는 레이아웃을 잡는 법을 3가지로 나눴다. div로 나누는 법, html5 태그로 쓰는 법, table로 짜는법. 결과부터 말하자면 이 세개 중 제일 최신의 방법은 html5 태그를 쓰는법이다. div로 나누는 법은 각각의 div에 id, class를 부여한 제작자는 이 부분이 상단인지 컨텐츠인지 주소 정보인지 등등을 말하지 않아도 알지만 읽는 컴퓨터는 이게 뭔지 모르는 상태에서 페이지 읽기 때문에 의미 파악에 어렵다. 쉽게 말해 컴퓨터도 파악을 해야 검색 시 잘 보여줄 수 있다. 그래서 레이아웃만을 위한 태그를 만든게 html5이다. 웹상에는 곡선이 없다. 모든걸 네모로 수치화?하는데 table은 이 네모네모의 세상에서 참 짜기 쉽게 되어있는 판이다. 페이지 전체를 table로 보고..
HTML 한바퀴 ③display,iframe ●블록과 인라인 -코딩하면서 제일 중요한 부분이라고 생각함. 이 기본을 정확히 이해해야 모든게 풀린다. -요소가 어떻게 보여지는가를 결정짓는것은 display속성이다. -display는 block과 inline으로 나뉜다. ●display : block; -width:100%; 인 요소. -요소의 너비는 한 줄 천체 공간을 차지한다. 옆에 누구를 둘 수 없음. 대표 요소 , , , , ●display : inline; -요소 만큼의 가로 크기를 가짐. 대표 요소 , , ●iframe -inline frame의 약자. -html페이지 안에 하나의 웹 페이지를 삽입하는것. 예시 -이 외에도 , , 가 있지만 html5가 지원하지 않으므로 알 필요 없음.

티스토리툴바