demun(대문블로그)

Design2014. 1. 29. 23:31

AdobeEdgeReflowCC 는 반응형에 최적화된 툴이라고 보시면 됩니다.반응형으로 웹페이지를 제작하는데 있어 AdobeEdgeReflowCC는 마우스로 비교적 간단이 웹페이지를 만들수 있게 해주는 툴입니다. AdobeEdgeReflowCC 의 좋은점중 하나가 포토샵의 전용파일인 psd 파일을 불러올수 있다는 점입니다.여기에는 몇가지 조건이 있는데요. 하나 하나 알아보겠습니다. 먼저 포토샵에서 작업하던 psd 를 열어서 Edge Reflow 프로젝트를 생성합니다.조건 1. 최신버젼인 14.2 여햐 합니다. 포토샵에서 파일 - 생성 - Edge Reflow 프로젝트 생성을 클릭합니다.psd의 이름이 프로젝트의 이름이 됩니다.제가 연 psd 의 이름은 Homepage.psd 입니다. 이제 AdobeEdg..

Design2012. 10. 12. 09:00

배경 패턴 등을 다운로드 받을수 있는 사이트를 알려드리겠습니다.제가 쭉 들러보고, 사용해보니 아주 좋습니다.회원가입이나 제약없이 그냥 보고 맘에 들면 바로 다운로드 받을수 있습니다. http://subtlepatterns.com/ 마우스를 갖다대어보고 맘에 들면 왼쪽에 다운로드를 클릭해서 사용하시면 됩니다.아래보시면 태그가 있습니다.태그에서 원하는 스타일을 선택한다음 쭉 둘러보는것도 좋은 방법입니다.

Design2012. 1. 29. 06:00

티스토리에 적용하는 리본 서식을 계속적으로 쓰고 있습니다. 오늘은 그중에서 세번째에 해당하는 겁니다. 이것도 외국사이트에서 본것인데 그럭저럭 좋은 글같아 제가 따라해보고 배포, 공유하는 겁니다. 이미지들은 제가 일단 만들어서 사용해보고, 코딩해본것입니다. 폴더의 안에는 포토샵 파일인 psd 도 포함이 되어 있습니다. 포토샵 파일인 psd 의 경우 아래에 표시된 대로 그라디언트와 리본받침의 색깔만 적절하게 조정하시면 다양하게 사용할 수 있습니다. 다운로드 받아서 압축을 해제해서 사용하세요. 참고 티스토리 리본 제목 서식 만들기 3

Design2012. 1. 26. 06:00

티스토리에서 사용할 수 있는 리본서식중에서 첫번째에 해당하는 이미지들입니다. 폴더의 이름은 images 로 했으며 폴더 안에는 포토샵 파일인 psd 파일도 같이 포함이 되어 있습니다. 그래서 포토샵으로 열어서 이미지의 색깔을 변경하는 것도 가능합니다. 폴더의 내용은 아래와 같습니다. 이미지를 활용해서 사용하는 방법은 따로 적었습니다. 티스토리 리본 제목 서식 만들기 1 => http://demun.tistory.com/2061 압축을 했으니 압축을 해제해서 사용하세요.

Design2011. 12. 7. 06:00

저의 경우는 스킨을 만지고 html 관련일을 많이 하다보니 색상에 대해서 많이 다룰때가 있습니다. 그중에서도 요즘에는 CSS3에 대해서 많이 공부하며 시험봅니다. CSS3에는 색상을 선택할때 rgb로 하는것이 좋습니다. 물론 hex 로 해도 되지만 rgb로 하면 불투명도를 선택할 수 있는 장점이 있고, 색상또한더 잘 지원한다는 글을 본적이 있습니다. 그래서 저도 간단한것을 제외하고는 rgb를 사용하려고 합니다. 사설은 잠시 접고 여하튼 css를 사용하다보면 rgb코드를 자주 접해야하는데 그때마다 프로그램을 가동합니다. 더군다나 아래처럼 3가지가 다 필요할때도 있고 아닐때도 있지요. 여하는 저의 경우는 rgb 와 hex 코드가 필요합니다. hex는 많이 다뤄서 잘 아는데 rgb 는 잘 몰라 색상을 보면서 ..

Design2011. 2. 26. 06:00

스킨 관련해서 많은 웹써핑을 하다보면 노이즈 텍스쳐 배경이 적용된곳을 많이 볼수 있습니다. 현재 제 블로그도 이런 형태인데요. 아래의 이미지가 배경으로 되어 있습니다. 이런 형태의 블로그나 사이트를 많이 볼수 있습니다. 아래 이미지와 주소를 알려드리니 한번 구경해보세요. http://www.billytamplin.com/ http://2010.dconstruct.org/ http://dribbble.com/ http://heyindy.com/ http://kennymeyers.com/ 아래는 제가 예제로 만든 파일을 올려드립니다. 다운로드 받아서 맘껏 사용하세요.

Design2011. 2. 13. 18:38

구글 api 를 사용하면 블로그에 있는 글꼴을 동일하게 보일수 있습니다. 현재 저도 하나 사용하고 있는데요. 현재 제 블로그에는 네이버글꼴과 구글글꼴 총 두개를 api 로 사용하고 있습니다. 구글 웹폰트 보기 => http://code.google.com/webfonts 이중에 이쁜놈을 하나 골라서 사용해보세요. 제가 사용하는것은 arimo 라는 웹폰트입니다. 아래 파랑색배경에 보이는것입니다. 사용하는 방법. 사용하는 방법은 위그림처럼 원하는 글꼴을 클릭하세요. 그럼 아래처럼 미리보기를 통해 미리볼수 있습니다. 좀더 상세한 설정을 위해 Launch in font previewer 를 클릭합니다. 그럼 아래처럼 상세한 설정을 할수 잇고 바로 반영이 됩니다. 위의 주소를 스킨편집에서 사이에 넣습니다. 그리고..

Design2011. 1. 18. 21:53

블로그에 사용하기 좋은 next , prev 버튼을 배포합니다. 붙어있는 파일과 각각 떨어져있는 이미지 파일을 배포합니다. 붙어있는 이미지파일은 하나의 파일로 background-position을 이용하면 한장의 이미지로 이용할수 있어서 이렇게 배포합니다. 이미지의 크기는 150*50 으로 맞춘겁니다. 붙어있는 이미지 각각의 이미지 next prev 포토샵에서 한컷. 이미지 파일은 PNG 파일이니 크기조정 가능합니다. 하나로 된것과 분리된것 모두 포함합니다.

Design2011. 1. 17. 06:00

포토샵 실력이 딸려서 틈틈이 공부하면서 만든것을 공유합니다. PSD 파일을 포함하니 그대로 사용하거나 수정하셔서 사용해도 될듯합니다. 이미지파일하나 우선 업로드 합니다. 포토샵에서 보이는것을 그대로 찍었습니다. 색만 수정하시면 다른스타일로 사용이 가능할겁니다. 아래처럼 두개의 파일이 들어있습니다. 하나는 png 파일이고 하나는 psd 파일입니다.

Design2010. 12. 27. 06:00

처음에 만들었던 티스토리 스킨은 저장이 되어있지 않아서 스샷을 찾을수가 없네요. 지금까지 작업했던 스킨중에서 스샷을 올릴수 있는것들입니다. 간략한 설명과 함께 스샷을 첨부합니다. 스샷은 하단까지 모두 캡쳐된 긴 스샷이므로 더보기를 통해 확인하시고 이미지가 길다는 점을 참고하세요. 스샷을 찍을 당시 사이드바 수정등을 통하지 않고 전체적인 느낌만을 캡쳐했기때문에 자세이 보면 약간씩 이상할수도 있습니다. 전부 제가 제작하고 배포했던 스킨들이과, 티스토리 용입니다. 가장 최신의 버젼 no.13입니다. 나름대로 배경이나 이미지에 신경을 좀 썻고 배포버젼은 하단의 배너영역을 없엤습니다 no.12버젼입니다. 하단의 배너영역이 포함된 버젼이지요. 이번것도 이전과 비슷합니다. 사이드바와 전체적인 스타일만 약간 수정한겁니..