brunch

#6 Webflow_공홈 공부 1_기본기

<UXUI 디자이너의 성장 기록>

by WON LEE

Webflow 공홈 영상 공부


25.04.09 수요일


Box

상자가 우리가 설정한 속성에 따라 위에 쌓이거나 나란히 쌓인다.

텍스트 문서처럼 동작 (왼쪽 상단에서 시작하고 가장자리에 닿으면 줄바꿈될 수 있음 / 하지만 웹상의 콘텐츠는 리플로우 될 수 있으며, 상자 모델을 사용하면 사용 가능한 공간에 따라 이러한 콘텐츠가 어떻게 반응하는지 (어떻게 래핑하고, 어떻게 리플로우하는지) 명확하게 정의할 수 있음

상자의 속성을 제어할 수 있음.



HTML

웹의 가장 중요한 기반 중 하나

이는 페이지의 기본 구조, 즉 콘텐츠 상자

webflow에서는 여기 ‘요소추가’패널에 HTML(요소)이 있음 (메뉴 + ADD) > 버튼, 제목, 문단, 양식 등 온갖 다양한 요소의 옵션 제공



CSS (cascading style sheets)

HTML 요소의 스타일과 레이아웃을 정의하는 방법

우측 스타일 패널 > CSS 컨트롤



JavaScript(webflow의 상호작용 부분)

상호작용 패널

사이트에 고도로 진보된 애니메이션을 구축하기 위해 복잡한 javascrpt 코드를 알 필요없이 시각적으로 아름다운 매력적인 웹 상호작용을 만들 수 있음



�Tip

Made in web flow 마켓플레이스

Start with a plan (와이어프레임, 모형 > 프레임워크, 가이드라인, WSG)

Templates

Foundations






설정 > backups > 이 사이트의 이전 버정에 엑세스할 수 있는 곳

Localization > 다양한 언어 관리



오른쪽 패널

Custom attributes 사용자 정의 속성

Search index settings 검색 인덱스 설정

keyword
작가의 이전글#5 Webflow! No-code 웹사이트 디자인 툴