퍼블리셔 12
[PC] EEUU 쇼핑몰
쇼핑몰 EEUU의 작업이 완료되어 사이트를 소개해드립니다. 1. PC 쇼핑몰 eeuu는 고급 코트를 판매하는 인터넷 쇼핑몰입니다. 좋은 기회를 얻어 퍼블리셔로 프로젝트에 참여했고, 사이트 제작이 완료되어 이렇게 소개해드립니다. 고급스러운 이미지를 나타내기 위해 색은 최대한 배제하고 퀄리티가 높은 사진들을 많이 사용했습니다. 또한 세련된 느낌을 내기 위해 메인 이미지가 슬라이드로 바뀌는 것이 아니라 서서히 전환되는 형태로 제작하였습니다. pc와 모바일 함께 작업했으며, 모바일 페이지 소개 포스팅도 조만간 준비해보겠습니다. 2. 샵 샵 이미지는 썸네일 크기를 키워 이미지가 돋보이도록 만들었습니다. 사진이 좋아서 홈페이지가 더욱 고급스러워 보입니다. http://www.eeuu.co.kr/ EEUU 본 결제 ..
[꿀정보] 벤치마킹 사이트 굿디자인웹
안녕하세요. 플입니다. 오늘은 벤치마킹 사이트를 추천드리려고 합니다. 1. 굿디자인웹 http://gdweb.co.kr/ 굿디자인웹 국내 최우수 이미지, 웹사이트. 굿디자인웹 gdweb.co.kr 벤치마킹할 때 주로 찾는 사이트입니다. 굿디자인웹이죠. 업데이트도 빠른 편이고 심사를 거쳐서 올라오는 홈페이지들이다 보니 도움이 많이 됩니다. 유행하는 디자인이나 구조도 생각해볼 수 있습니다. 2. 카테고리 위의 이미지처럼 디자인 타입에 따라서 분류를 나눠 찾아볼 수도 있습니다. 원하는 디자인 느낌을 찾기 편하죠. 모바일이나 해외사이트도 볼 수 있어서 좋습니다. 저는 특히 해외사이트를 볼 수 있다는 점을 좋아합니다. 이렇게 카테고리도 나눠져 있어서 찾아볼 때 유용하죠. 특별한 디자인을 하고 싶다고 생각할 때 해..
[css] z-index
안녕하세요. 플입니다. z-index에 대해 그려봤어요. 2. z-index z-index z-index는 겹치는 요소들 간의 순서를 정리해줄 때 사용해요. 위쪽으로 올리고 싶은 요소에 값을 더 크게 적어주는데 z-index: 30; 위처럼 숫자를 값으로 입력하고, 숫자가 높을수록 위쪽으로 올라온답니다. 포토샵의 레이어와 동일하다고 여기면 조금 더 쉽게 이해할 수 있죠. 포토샵을 몰라도 괜찮아요. 이렇게 생각해보면 어떨까요? 1층보다는 2층이 위에 있죠. 숫자는 그런 의미랍니다. 일반적으로 요소들이 겹치는 일은 거의 없지만 position을 사용하면 이야기가 달라져버립니다. 한 요소에만 position을 사용한다면 상관없겠지만 사람 일이라는 게 그렇게 마음대로 되지는 않다는 걸 저희는 이미 알고 있죠. ..
[css] hover로 색 바꾸기
안녕하세요. 플입니다. 오늘은 hover를 이용해 마우스 오버 시 색을 변경해보겠습니다. ▷hover hover는 '맴돌다'라는 뜻을 가진 영어단어입니다. 마우스가 위에서 맴돌고 있을 때라고 이해할 수 있습니다. 저는 마우스 오버 시 적용되는 css로 생각하고 작업합니다. ▷사용 이유 hover를 사용하는 건 사용자의 편의를 위해 들어가는 효과입니다. 마우스를 올렸을 때 어떤 효과가 적용되거나 마우스의 모양이 손가락 모양이 되면 사용자들은 '클릭을 하는 부분'이라는 것을 직감적으로 알게 됩니다. 오늘 예시로 사용할 메뉴 색상을 변경하는 것을 살펴보면 마우스를 올렸을 때 색상이 변경되면 사용자는 클릭하는 부분이라는 것을 쉽게 알 수 있습니다. 이처럼 사용자의 클릭을 유도해 조금 더 쉽게 홈페이지를 이용할 ..
[Node.js] cmd로 실행하기
안녕하세요. 플입니다. 오늘은 Node.js를 실행해보겠습니다. 1. cmd 열기 실행창을 열어 cmd를 열어줍니다. 단축키는 window + R입니다. 2. 폴더 이동하기 기본 폴더가 C로 설정되어 있으니 D폴더로 이동해줘야 합니다. d:를 입력해 폴더를 이동해줍니다. d폴더로 이동했습니다. 다음은 Node.js파일을 저장한 폴더로 이동해줍니다. 명령어는 cd 폴더명입니다. cd는 "Change Directory"의 줄임말로 디렉토리, 즉 폴더를 바꿔주는 명령어입니다. 저는 폴더명을 nodejs라고 저장했기 때문에 cd nodejs라고 적어주었습니다. 엔터를 누르면 폴더가 이동된 걸 확인할 수 있습니다. 3. Node.js 실행하기 제가 실행시킬 node.js 파일입니다. nodejs라는 폴더 안쪽에 ..