찐망고'S 퍼블리싱그리고디자인

안녕하세요 찐망고입니다. 결국 제가 구글머터리얼 심볼(Material Symbols)에 대해서  또 포스팅을 하게 되었네요.솔직히 Customize 기능이 넘 사라 좀 쓸만하죠? 이전 발행글이 하나 있는데 css로 적용했던 방법을 포스팅 하였습니다. 새로운 구글 머티리얼 심볼 활용법: 웹아이콘의 모든 것안녕하세요 찐망고입니다. 이전에 xeicon관련 포스팅을 했었는데요.드디어 다음 포스팅을.. 2021.07.23 - [WEB/CSS] - 웹에서 사용가능한 웹아이콘 적용방법 - XEIcon 웹에서 사용가능한 웹아이콘 적용uiweb.tistory.com  이번 포스팅은 수업 중 클론 코딩을 하다가 저 펭귄그림 있는 부분에 아이콘들을구글 아이콘을 html요소로 적용해보자로 시작해서포스팅으로 마무리를 해봅니다 ..

안녕하세요 찐망고입니다.오늘은 구글 머터리얼 디자인 Implementing accessibility부분에 대해 포스팅을 시작합니다. Implementing accessibility 접근성 구현표준 플랫폼 컨트롤과 시맨틱 HTML(웹에서)을 사용하면, 앱은 플랫폼의 보조 기술과 잘 작동하는 데 필요한 마크업과 코드를 자동으로 포함하게 됩니다. 각 플랫폼의 접근성 표준을 충족하고, 그 보조 기술(단축키 및 구조 포함)을 지원하면 사용자에게 효율적인 경험을 제공합니다.  Do. 표준 플랫폼 대화 상자와 같은 기본 요소를 사용하세요.Caution. 비표준 요소(예: 비표준 플랫폼 대화 상자)를 사용하여 표준 대화 상자 작업을 수행하는 데 주의하세요. 이러한 경우 보조 기술과 잘 작동하려면 추가적인 테스트가 필요..

안녕하세요 찐망고입니다.오늘은 머터리얼 디자인, 레이아웃과 타이포그래피 관련 포스팅을 해볼게요  Material Design의 터치 대상 가이드라인은 화면을 볼 수 없거나 작은 터치 대상을 누르기 어려운 사용자들이 앱 내의 요소를 쉽게 탭할 수 있도록 돕습니다. Layout and typography 터치 및 포인터 대상 (Touch & Pointer Targets) 터치 대상 (Touch Targets)터치 대상은 사용자 입력에 반응하는 화면의 일부입니다. 이들은 요소의 시각적 경계를 넘어 확장됩니다. 예를 들어, 아이콘의 크기가 24 x 24dp일 수 있지만, 주변 패딩이 포함되어 전체 48 x 48dp의 터치 대상을 형성합니다.대부분의 플랫폼에서는 터치 대상을 최소 48 x 48dp로 설정하는 것이..

안녕하세요 찐망고입니다.  Material Design 접근성안녕하세요 찐망고입니다. Material Design은 Google에서 2014년에 개발한 디자인 언어로,웹과 모바일 애플리케이션의 사용자 인터페이스(UI) 및 사용자 경험(UX)을 향상시키기 위해 만들어졌는데요. Mauiweb.tistory.com 오늘은 Material Design에서 중요한 요소 중 하나인 접근성과 관련하여, 특히 보조 기술(Assistive Technology)에 대해 알아보겠습니다   Assistive technology  보조 기술은 장애를 가진 개인의 기능 능력을 향상, 유지, 또는 개선하는 데 도움을 줍니다.스크린 리더(screen readers), 확대 도구(magnification tools), 보청기(hear..