[08주_2024_12_12] 웹퍼블리싱 4일차

2024년 12월 12일 ( Thursday )
───────────⚪──────
◄◄⠀▐▐⠀►► 𝟸:𝟷𝟾 / 𝟹:𝟻𝟼⠀───○ 🔊

[개인]
🩶 웹퍼블리싱 실시간 강의듣기
🩶 웹퍼블리싱 과제하기
🩶 TIL 작성 및 제출하기
[팀플]
🩶 저녁 팀 스크럼(회고)

---

🤤오늘 진행한 부분

디자인 카타 리서치 시간이 끝나서 발표를 하였다. 내일배움캠프말고 다른 상담 일정이 있어서 디자인 카타 발제를 못들어서 해상도와 사이즈 단위의 개념을 찾았다... 발제를 자세히 봤어야하는데 시간이 없다고 주제만 보고 리서치하여 문제가 생긴거다.

그리고 실시간 강의는 어제로 마무리되어서 오늘은 원격으로 웹퍼블리싱을 들었다.

 

실시간 강의했을 때 나온 개념이 다시 나왔다.

 

• HTML=뼈대
• CSS=디자인
• Java Script=동작

 웹플로우➡️배우는 이유: 기본적인 서비스이기 때문에

• 장점
  • 디자인적 구현의 폭이 가장 넓은 웹 빌더
  • 이미 기술자가 만들어 놓은 요소를 사용하기 쉬움
• 단점
  • 난이도가 높아질 수 있음
  • 개념의 이해도가 필요함

 

웹플로우 기초

 (박스모델)

  모든 html 요소는 박스(box) 모양으로 구성되며, 이것을 박스 모델(box model)이라고 함

•   구성요소
  • 내용:텍스트나 이미지가 들어있는 박스의 실직적인 내용 구분
  • 패딩(padding): 내용과 테투리 사이의 안족 여백, 패딩은 눈에 보이지 않음
  • 테투리(border): 내용과 패딩 주변을 감싸는 테투리
  • 마진(margin):테투리와 아웃 요소 사이의 바깥 여백, 마진과 마찬가지로 눈에 보이지 않dma

 (부모-자식 관계)

  부모 요소의 디자인을 수정 할 때 자식 요소도 영향이 미침

  단, 블럭 수정하는 것은 영향을 받지 않dma

 

 (class)

  동일한 클래스를 공요하는 요소는 동일한 디자인이 적용됨

 

스타일 가이드=디자인 시스템

홈페이지에서 사용된 디자인의 약속들을 미리 설정하고, 설명하는 것

ex. 색상, 타이포그래피, 이미지 설정, 버튼 디자인 등

why?➡️효율적인 구현과 유지보수를 위해

 

---

😆새로 알게 된 사실!

• 점수점 단위로 디자인하지 않고 홀수로 디자인하면 안드로이드,ios 같이 사용해도 해상도에 문제 없음
• ui를 구별하는 것에 차이가 있기 때문에 안드로이드, ios를 따로 만들어주는 것임
• 컴퓨터는 위에서 아래로 가기때문에 위에서 아래로 가는 것이 정방향 아래에서 위로 가는 반대방향
• 사진 등 다양한 것을 넣는 글을 리시 텍스트라고 함

---

💭내일 계획

🤍 데일리 회고

🤍 강의듣기

🤍 TIL 작성 및 제출하기

🤍 저녁 회고