Web | 디자인베이스

Alt 속성 (Alt Attribute)

Alt 속성, 또는 대체 텍스트(Alternative Text)는 HTML에서 이미지 태그(<img>)에 사용되는 속성으로, 이미지의 의미와 내용을 설명하는 텍스트를 제공하는 역할을 합니다. 이 속성은 이미지가 로드되지 않거나 접근성 도구(스크린 리더 등)를…

PT (Point)는 디자인에서 자주 사용되는 단위로, 일반적으로 화면의 물리적 크기에 의존합니다. 주로 iOS에서 사용하는 단위이며, 1pt는 약 1/72 인치로 정의됩니다. PT는 디바이스의 화면 크기나 해상도에 상관없이 일관된 물리적…

데이트 피커(Date Picker)는 사용자가 날짜를 쉽게 선택하도록 돕는 UI 요소입니다. 달력 형태의 인터페이스를 통해 사용자는 특정 날짜를 선택할 수 있으며, 이를 통해 입력 오류를 줄이고 편리하게 날짜를 지정할…

라디오 버튼(Radio Button)은 사용자가 여러 옵션 중 하나의 선택지만 선택할 수 있도록 제공하는 입력 요소입니다. 사용자가 단일 항목만 선택할 수 있는 상황에 주로 사용되며, 여러 개를 중복 선택할…

모달은 사용자의 주의를 특정 작업 또는 내용에 집중시키기 위해 화면 위에 표시되는 대화형 UI 요소입니다.이 요소는 사용자가 모달 내부의 정보를 확인하거나 특정 작업을 완료하기 전까지는 기존 화면과 상호작용할…

모바일 퍼스트(Mobile First)란 웹사이트나 애플리케이션을 설계할 때 모바일 환경을 우선적으로 고려한 후, 태블릿과 데스크톱 환경으로 확장하는 디자인 접근법입니다.이는 스마트폰과 태블릿 사용이 증가하면서 모바일 기기가 인터넷 사용의 주요 플랫폼이…

슬라이더(Slider)는 사용자가 특정 범위 내에서 값을 조절하거나 선택할 수 있도록 하는 UI 컴포넌트입니다. 일반적으로 수평(가로) 또는 수직(세로) 바 형태를 가지며, 사용자는 마우스나 터치로 핸들을 움직여 원하는 값을 설정할…

인풋(Input)은 웹 개발에서 사용자에게 정보를 입력받기 위한 상자나 필드를 의미합니다. 다양한 유형의 정보를 입력할 수 있도록 설계된 요소로, 사용자로부터 텍스트, 숫자, 선택 옵션 등을 입력받거나 선택할 수 있게…

적응형 웹(Adaptive Web Design)은 다양한 디바이스의 화면 크기와 해상도에 따라 미리 정의된 레이아웃을 각각 제공하는 웹 디자인 접근 방식입니다. 이는 특정 화면 크기에 맞춰 개별적인 디자인과 스타일을 적용하는…

체크박스(Checkbox)는 웹 또는 앱 개발에서 사용자가 하나 이상의 옵션을 선택할 수 있는 입력 요소로, 동의, 선택, 허용 등의 선택 사항을 표시하는 데 사용됩니다. 각 옵션을 선택하거나 해제할 수…

콘택트 폼(Contact Form)은 웹사이트나 애플리케이션에서 사용자가 특정 대상(관리자, 고객 서비스, 영업팀 등)에게 메시지를 보낼 수 있도록 제공하는 폼 UI입니다.이는 고객 문의, 지원 요청, 피드백 제출, 비즈니스 문의 등…

툴팁(Tooltip)은 웹사이트나 애플리케이션에서 특정 요소 위에 마우스를 올릴 때 나타나는 작은 정보 박스로, 사용자에게 추가적인 설명이나 가이드라인을 제공하는 UI 요소입니다. 이는 인터페이스의 가독성을 유지하면서도, 필요한 정보를 사용자가 즉각적으로…

파비콘(Favicon)은 웹사이트를 대표하는 작은 아이콘으로, 웹 브라우저의 주소 표시줄, 브라우저 탭, 북마크 목록, 검색 결과 등에 표시됩니다. 파비콘은 웹사이트의 정체성을 강화하고, 사용자가 여러 개의 열린 탭에서 특정 웹사이트를…

헤더는 웹사이트나 애플리케이션의 상단에 위치하는 UI 요소로, 로고, 내비게이션, 액션 버튼(CTA) 등을 포함하는 핵심 영역입니다. 사용자가 사이트를 탐색하는 데 중요한 역할을 하며, 브랜드 아이덴티티를 강화하고 주요 기능에 쉽게…