jichani / korean_endangered_species

미니 프로젝트_ 한국 멸종위기 종 사이트 제작
https://koreanendangeredspecies.dlawlcks12.repl.co
0 stars 0 forks source link
html-css-javascript

korean_endangered_species

[서버 링크 주소]https://koreanendangeredspecies.dlawlcks12.repl.co

모티브한 사이트 : 국립생태원 (https://www.nie.re.kr/nie/main/main.do)

프로젝트 진행일 : 2023.04.25(월) ~ 2023.04.26(화)

모티브한 페이지 :

국립생태원 > 멸종위기 야생생물 > 소개 (https://www.nie.re.kr/nie/main/contents.do?menuNo=200129)

국립생태원 > 멸종위기 야생생물 > 지정현황 (https://www.nie.re.kr/nie/pgm/edSpecies/edSpeciesList.do?menuNo=200127)

의도 :

  1. 한국의 멸종위기종들을 소개하고 경각심을 주는 홈페이지를 만들어보고 싶었다.
  2. div를 이용하여 각각의 배치를 조정하는 방법을 공부하고 싶었다.
  3. header , section, aside, footer 등을 이용하여 공간을 분할하고 싶었다.

기능 :

  1. 상단의 헤더를 고정하여 스크롤을 내려도 상단에 헤더가 고정되게 만들었다.
  2. input 태그와 label 태그를 이용하여 button을 만들었고 버튼을 누를 때마다 그에 맞는 다른 리스트가 보여지게 만들었다.
  3. 오른쪽 아래에 top으로 가는 버튼을 만들어서 오른쪽 아래에 고정이 되게 만들었다.

어려웠던 점 :

  1. div의 정렬을 배치하는 것이 내 마음대로 되지 않아서 많은 시간을 사용할 수 밖에 없었다.
  2. button에 들어가는 item list들이 너무 많아서 하나하나 입력하는 것이 시간이 너무 오래 걸렸고 몇개는 작업을 다 하지 못했다.

아쉬운점 :

  1. 반응형 웹사이트를 만들지 못한 것이 아쉽다.
  2. 조금 더 경각심을 줄 수 있는 멘트나 사진들을 넣었으면 좋았을 것 같다.
  3. 웹페이지에 좀 더 동적인 이벤트를 넣어보고싶다.

앞으로의 할 일 :

  1. div의 공간 배치에 대해서 더 알아볼 예정이다.
  2. 사이트를 어떻게하면 좀 더 동적이며 사람들에게 경각심을 불러 일으킬 수 있을지 생각해보아야겠다.

교수님 피드백 :

  1. 요즘 트렌드처럼 사진이나 버튼 만들기 (테두리를 없애는 등)
  2. 원본 페이지처럼 텍스트 라인 유지
  3. 반응형으로 만들어보기