한글폰트는 영문폰트에 비해서 양이 많지 않으니 찾기 수월하지만 영문의 경우는 아주 어렵습니다. 비슷한 폰트들도 많고 양도 많아서 원하는 폰트를 찾기가 쉽지 않죠. 해외 영문폰트 사이트 중에 이미지를 스캔하거나 기존의 폰트가 있는 이미지를 업로드해서 검색해주는 사이트가 있습니다. 하지만 모든 폰트를 보유하고 있는 것이 아니어서 업로드한 폰트중 50%정도는 찾을 수가 있습니다. 더구나 이미지가 선명하고 검색조건에 맞는다면 폰트를 찾을 확률이 높아집..

중세 고딕양식 형태 대표적인 폰트인 Old London체입니다.

무료폰트 사이트에서 폰트를 사용하는데 있어서 주의할 점이 있습니다. Free for personal use 개인용으로 사용할 경우 무제한 사용가능한 폰트입니다. 상업적 용도는 안됩니다. Free- 개인용 상업용 사용가능합니다. demo- 주로 개인이 만드는데 폰트의 일부만 업로드 해 놓고 전체를 사용하려면 이메일을 보내면 얼마를 어디로 입금하는 조건으로 답장을 줍니다. 한글폰트도 데모버전이 있지만 한글은 개인이 만들수가 없습니다. 글자의 수..

영문 무료폰트는 엄청 많습니다. 영문폰트가 만들기도 쉽지만 종류도 다양해서 무료폰트 사이트에 가면 다운 받아 사용할 수 있지만 상업용으로 제한이 있는 경우가 있으니 주의해야합니다. 하지만 개인용으로 사용하는 것은 제한이 없습니다. 소개하는 폰트는 숫자폰트인데요. 두자리이상의 숫자에 둥근 외곽선을 만들 수가 있어서 아주 유용합니다. 다음의 사진은 예제입니다.  첨부된 pdf파일을 보니 상업용 제한은 없지만 이것을 팔거나 수정하면 안된답니..

포토샵에서 적당한 크기의 새문서를 만듭니다. 1번의 색상도구의 전경색을 클릭하고 2에서 파란 색을 선택하고 나온 다음, 단축키로 alt+delete키를 누르면 전경색이 문서에 입혀집니다. 1번의 새레이어만들기 아이콘을 클릭하면 2번에 레이어가 만들어집니다. Shift+Backspace키를 누르면 fill 창이 3번의 50%Gray로 되어있는 상태로 나옵니다. 4의 OK버튼을 클릭하면 2번 레이어에 회색이 입혀..

인디자인을 시작할때 문서의 크기 단위가 대부분 파이카로 되어있는데 이를 미터법단위인 밀리미터로 바꾸는 방법은 메뉴에서 편집(Edit)-환경설정(Preferences)을 클릭하거나 단축키인 ctrl+k를 눌러주면 다음과 같은 창이 나옵니다. 1번의 단위항목을 클릭하고 2번의 수평 수직 부분의 아이콘을 각각 클릭하여 단위를 밀리미터로 변경하면 다음부터 새문서를 만들때 밀리미터로 나오게 됩니다.    어도비 프..

네비게이션 바에 메뉴를 만들때 일일히 태그를 만들고 CSS로 작업을 하는데 시간이 많이 걸리죠. 보통은 제이쿼리나 자바스크립트로 만들어야 드랍다운이나 애니메이션이 가능한데 이런 기능을 넣으려면 시간이 더 걸립니다. 이 프로그램을 이용하면 색상도 자유롭게 넣을 수 있고 1분만에 예쁜 디자인의 메뉴바를 만들 수 있습니다. 사용법도 아주 직관적이라서 화면에 나온 것만 보고도 금방 만들 수 있습니다. 개인용으로 사용하면 ..

웹페이지 제작시 기존에는 페이지 전체에 적용되는 배경이미지를 하나만 사용할 수 있었다. css3에서는 여러개의 배경이미지를 사용할 수 있다. body { background-image:url("images/bg.jpg"), url("images/footer.jpg"); background-repeat: repeat-x; background-position: top center, bottom center; } 여러개의 속성값을 부여할 때..

네이버블로그는 이런 기능이 안되지만 티스토리(태터툴스,텍스트큐브)나 익스프레스엔진(Xe)같은 php기반의 CMS(Content Management System)를 사용하면 메뉴가 추가되면서 배경이미지가 자동으로 추가되고 글자의 많고 적음에 따라 배경이미지도 변하도록 하는 기법이 슬라이딩 테크닉(Sliding Door Technic)입니다. 메뉴버튼의 link상태와 hover상태에 따라 변하게도 할 수 있습니다. 하나의 이미지 안에 4개의 이미..

앞 강좌에서 네비게이션바를 기본만 만들었는데 마우스오버시 색상이 변화되는 것도 해보고 방문한 링크도 다른 색으로 표현해본다. 이전의 코드를 불러오면 다음과 같다. <style type="text/css"> #nav ul { list-style-type: none; } #nav ul li { float: left; margin-right: 40px; text-align: center; } #nav ul li a { display: bl..

네비게이션바는 웹페이지에서 다른 페이지로 이동하기 위해서 여러가지 버튼형식으로 만들어진 메뉴의 집합이다. 이것은 타이틀 아래에 있는 경우도 있고 사이드바에 위치하기도 하며 어떤 때는 페이지의 하단에 위치하기도 한다. 이 네이게이션바는 웹페이지에서 아주 중요한 역할을 하기 때문에 디자인에 각별한 신경을 쓰게 된다. 제이쿼리나 플래시를 이용하여 아주 다양하게 만들어지고 정지된 메뉴가 아닌 슬라이딩 효과를 주게 되고 사진을 넣어서 움직이게 하여 ..