포트폴리오 만들 때 참고하면 좋을 사이트 정리(이미지편)

내가 살다살다 포트폴리오를 만들어야 하는 날이 올줄은 꿈에도 몰랐다. 
대략 6개월 간의 프론트엔드 수업과정이 거의 끝나가고, 학원에서도 당연하게 포트폴리오 제출을 서두르고 있다.

 

사실 내가 들은 과정은 웹 퍼블리셔? 웹디자이너인데 약간의 코딩을 가미한 정도라 현타가 가끔 오기도 했고 지금도 포트폴리오를 어거지로 만들고 있지만서도 리액트나 추가적으로 공부를 더 해야겠다는 생각이 아주 많이 든다. 

 

와중에 html이나 css 같은 기초 웹 개발에 관심있는 분들을 위해 내가 자주 사용하고 또 자주 도움을 받았던 사이트를 정리하려고 한다. 

 

1. Fontawesome fontawesome.com/icons?d=gallery

Font Awesome

아이콘을 폰트로 이용할 수 있는 곳. 아이콘을 이미지로 이용해도 되지만 메뉴 글자옆에 작게 넣고 싶을 때 이용하면 좋다. 사용방법은 가입 후에 메일로 전달되는 링크를 html 파일에 연결한 다음, icons메뉴에서 arrow(화살표) 혹은 sns 등 원하는 키워드를 입력한 뒤 i태그를 복사해 오면 된다. 생각보다 나는 굉장히 많이 사용하고 있으며 방문  빈도수도 꽤 높은 편이다. 

2. iconfinder www.iconfinder.com/

5,125,000+ free and premium vector icons in SVG, PNG, CSH and AI format.

아이콘을 이미지로 사용해야할 때 무료도 아이콘을 다운받을 수 있는 곳으로 진짜 내가 자주 이용하는 곳이다. 돈을 주고 유료버전 이용도 할수 있으나 가난한 취준생이라 무료에도 만족하며 사용하고 있다. 아이콘 검색 후 내가 원하는 색이나 조금 다른 모양으로 바꾸고 싶을 때는 open in Editor 열어서 원하는 방향으로 수정 후 다운받으면 된다. 

 

3. Css Gradient cssgradient.io/

CSS Gradient — Generator, Maker, and Background

배경색으로 그라데이션 넣고 싶을 때 너무 편하게 만들어줘서 좋은 곳이다. 원하는 색상과 그라데이션 방향 및 모양을 고른뒤 하단에 자동으로 만들어지는 background 어쩌구 그거를 복사해서 CSs에 넣으면 끝이다. 이렇게 간편할 수가 있다니.. 

 

4. pixabay pixabay.com/ko/

사실 다른 사이트 이용했었는데 그래도 pixabay에서 원하는 이미지를 더 많이 찾아볼 수있어 가끔 이용한다. 저작권 걱정없이 사용할 수 있어 좋다. 

 

5.unsplash unsplash.com/s/photos/splash

20+ Splash Pictures [HQ] | Download Free Images on Unsplash

pixabay와 비슷한 곳. 

 

5. color zilla chrome.google.com/webstore/detail/colorzilla/bhlhnicpbhignbdhedgjhgdocnmhomnp?hl=ko

ColorZilla

이건 사이트는 아니고 확장프로그램인데 다른 사이트에서 괜찮은 색상을 발견했거나, 그것과 똑같은 색상이 필요할 때 크롬에 추가해놓고 필요시 클릭해서 색상을 따오기 매우 편리한 프로그램이다.  

html을 처음 시작했거나 구조파악 연습을 위해 Clone 사이트를 많이 만드는 사람이라면 매우 유용하게 사용할 수 있을 것이다. 

 

 

정리하면 되게 많을 줄 알았는데 막상 적으려니 기억이 안난다... 

그럼 오늘도 고통받고 있을 포트폴리오 제작자들 화이팅!