2020년 2월부터 회사에 입사한지 어느 덧 4개월차가 되었다.

4개월동안 일을 하면서 그동안 몰랐던 것들을 많이 배우게 되었다.

그리고 학원에서 배우지 않았던 것들이 실제 실무에서 많이 활용되는것도 있었다.

그래서 지금까지 배운것들을 하나씩 나열해 보며, 정리하는 시간을 가지자.

공부하면서 익힌 퍼블리셔 팁,

• 각 브라우저 캐시 지우기, firefox 새로고침 : ctrl + F5
  참고 : https://wishml.tistory.com/26

• jquery의 cdn 라이브러리의 cdn보다는 인터넷이 안되는 환경에서 작업할 것을 대비해
  다운로드 받아 작업해야한다.

• 모바일 이미지는 항상, 짝수로 표현 모바일 레티오때문에 이미지가 흐려질 수 있다.

• 자식선택자를 남발하지 말것, 나중에 유지 보수(수정)이 어려워 질 수 있다.

• 보통 form태그는 백개발에서 사용하기 때문에, form요소의 style을 변경하지 않는것이 좋고, 선택자로 잡는것도 피한다.

• {div}, {span} element들은 아무런 의미가 없는 태그들 이다.
  그래서 레이아웃을 잡을용도로 많이 사용하고
  div는 display:block을 사용하고 싶을 때, span태그는 display:inline을 사용하고 싶을 때 사용한다.

• 안드로이드폰이 아닌 ios에서 viewport가 바뀌면 즉,
  ( 사용자가 세로로 보던 화면을 가로로보게되면) font-size가 자동으로 조절되는 경우가 생긴다.
  그것을 방지하기 위해 {-webkit-text-size-adjust:none}값을 주어 ios폰에서의 폰트사이즈 자체조절을 막아준다.
  참고 : https://developer.mozilla.org/en-US/docs/Web/CSS/text-size-adjust

• input 태그는 따로 font-family를 지정해주어야 한다. body 태그에 font-family를 주어도 안먹히기 때문이다.
  이러한 태그들이 종종 있는데, 그 이유는 태그자체고유의 값이 있기 때문이다.

• Naming, 형태의미상태 순으로 조합(btn_apply_on.jpg)

• id는 camelCase, class는 underscope사용

• prefix / subfix / suffix 정의 접두사를의미, (tab_notice, tbl_product)

• box-sizing:border-box는 width와 height 기준으로 잡힌다. 즉, padding 기준으로는 잡히지 않음.

• 슬릭에서 컨텐츠를 한번 div로 감싸준다, 유지보수를 위해

• 클래스는 최대 3개 이하로 짠다.
  어떠한 틀에 클래스를 입력하고 그 해당 클래스를 잡고, 개발을 할 경우 관리자페이지에서 내용을 바꿀 때 해당클래스가 없으면 바꾸지 못하게 되어 문제가 생길 수 있다.
  ex).app .photo .line{text-align:center} --> 문서에 컨텐츠영역 맨위에 위치해 있으므로 .app이 없는 곳에선 사용하지 못함.

자주사용하는 사이트, 프로그램

N-WAX (google 확장프로그램)
HTML Validator : HTML마크업 오류검출(google 확장프로그램)
CSS Validation Service : CSS 오류검출, url : https://css-validator.kldp.org/