[1人 프로젝트] 키즈가오 클론코딩 2회차(完)

모두의 HTML5 & CSS3 - 교보문고

🎉 성과

완성한 부분

HTML, CSS로 제작한 웹사이트에 애니메이션 효과 적용

 

완성한 이유

HTML과 CSS도 익숙하지 않아 어렵게 작업했는데, 애니메이션 부분은 더 어렵기 때문에 애니메이션 효과 넣기 전까지 완료했다.

 

---

 

✨ 느낀점

🧡 좋았던 점

기초 개념을 잡는데 도움

애니메이션 효과를 넣는 방법에 대해 모르고 있었는데, 실습을 통해 animation과 @keyframe의 이용방법을 습득 할 수 있었다.특히, -webkit-, -moz- 등 브라우저에 따라 웹사이트가 적용이 안된다는 점, 정상작동하기위해서 해당 브라우저에 대한 코드를 추가로 작성해야한다는 것을 알게되었다.또 animation효과 넣은 css파일은 파일크기와 나중에 코드읽기 복잡하게 만드는 원인이어서 main.css에서 분리하여 따로 css파일로 만들어야 한다는 저자분의 조언을 얻게되었다.

 

재미있다.

정적인 웹사이트를 만들때보다 애니메이션을 넣고 웹사이트를 보니 공부에 더 흥미가 갔다.