1. 팀별 프로젝트 진행 상황 및 본인 업무 오늘은 어제 받은 소스 파일을 살펴보고 어떻게 적용하는 것이 좋을 지 살펴보았다. 게시판 작업을 하는 부분에서 현재 이용하는 솔루션에는 한계가 있음을 팀원이 알아내서 그 부분을 수정하기 위해 솔루션을 다른 것으로 대체할 지, 기능을 한정할 지 업체에 문의했다. 대체를 할 경우 윅스가 아닌 아임웹으로 진행할 예정이다. 텍스트 파일은 오늘 중에 전달받을 예정으로 대략적인 구성을 먼저 생각 중이다. 이전에 받은 이미지로 임의로 작업을 해보았다.
2. 오늘 강의를 통해 프로젝트에 적용한 부분css변수와 css파일을 연동시키면서 여러 브라우저에 호환이 가능하도록 하는 기능에 대해 알아보았는데, 웹사이트를 html, css를 통해 제작할 시에 기본적으로 알아두어야 하는 내용이어서 도움이 되었다. 프로젝트에 직접적인 적용은 없을 것으로 보인다.
3. 어려웠던 점과 해결방법 오늘 강의에서는 reset css와 nomalize css, 그리고 css 변수에 대해 알아보았다. 리셋과 노멀라이즈는 index.html파일에 link로 연동을 시켜주고 위치는 style.css 위에 위치시켰다. 바디태그에 h1부터 h6까지 만들어 내용을 넣어주고 리셋.css를 적용해 보았다. 적용해보니 아무런 디자인이 적용되어 있지 않음을 확인할 수 있었다. 그렇게 리셋된 상태에서 style.css에서 커스텀을 할 수 있다. nomalize는 적용을 해도 보기에 차이가 없는데, 이는 디자인이 적용되었으나 브라우저간의 오차를 줄이는 방향으로 적용되는 것이다. 실무에는 노멀라이즈 기능이 더 많이 쓰이나 두 개 다 알고있어야 하는 내용이라고 한다.
다음으로 css변수를 알아보면, style.css에서 :root 안에 변수와 변수값을 넣어 일률적인 수정이 가능하도록 적용을 해보았다. 컬러와 폰트사이즈를 지정한 후에 h1과 h2에 var를 사용하여 변수를 입력해 주었다. 변수를 활용하여 내가 사용하는 변수에 영향력을 주는 범위를 css선택자를 활용하여 지정해 보았다. intro와 footer로 아이디를 만들어 intro영역에 변수를 입력하여 intro p영역에만 적용되도록 작성해 보았다. 이렇게 css에서 활용되는 reset과 nomalize, css변수에 대해 알아보았다.
4. 아쉬웠던 점 웹사이트를 제작을 하면서, 사용하는 솔루션마다 적용되는 지점이 다르고, 선택할 수 있는 디자인이 많은 것이 장점이 되기도 하지만 반대로 구상을 하는데에는 복잡하게 작용되었다. 업체와의 조율이 다행히 잘 되고는 있으나, 좋은 결과를 얻을 수 있도록 노력해야 할 것 같다.
