본문 바로가기

반응형

웹디자인

(2)
[UX] 사용자가 훑어보기 좋은 웹&앱 디자인을 만드는 6가지 원칙 1. 관례를 이용하라 관례란 널리 사용되거나 표준화된 디자인 패턴을 가리킨다. 통용되고 있는 관례를 따르면 사용자가 내용을 빠르고 쉽게 이해하는 데 도움이 된다. 마치 교통 안내 표지판처럼! 웹 관례가 자리를 잡을수록, 사용자들의 삶이 편해진다. 새로운 사이트를 갈 때마다 처음 접하는 요소가 어떤 역할을 하는지, 어떤 방식으로 작동하는 지 매번 이해하려고 노력할 필요가 없기 때문이다. 그러나 종종 디자이너들은 관례 이용을 꺼리곤 한다. 관례를 따르면 사용자가 이해하기 쉬운 디자인이 완성될 가능성이 커진다는 것을 알지만, 본인을 고용한 이유가 관례를 답습하는 데 있지 않고 무언가 새롭고 다른 것을 창조하는 데 있다고 생각하기 때문이다. 저자에 따르면, 혁신적인 결과를 내려면 대체하고자 하는 것이 지닌 가치..
[생활코딩] WEB2 CSS- 미디어쿼리 반응형 웹 반응형 디자인 Responsive Web! 수많은 형태의 화면에서 동작해야하는데, 그래서 여러가지 화면에 대응되는 웹페이지를 만들기 위해 고려해야한다. 다양한 환경에서 적응할 수 있는 이 기술들을 발전시킨 끝에, '반응형 디자인'이라는 최신 흐름까지 나타나게 된 것이다! 화면의 크기에 따라서 웹 페이지의 각 요소들이 반응해서 동작하게 되는 것이 바로 반응형 디자인이다. 이 반응형 디자인을 순수한 웹, CSS에서 구현하는, '미디어 쿼리'를 배워보겠다. 일단 이렇게 기본 세팅을 해놓고, 화면의 크기가 800px을 기점으로 반응형으로 변하게 해보는 것이다. @media() 라는 미디어 쿼리라는 표시를 해주고, ( ) 안에 '~일때'라는 값을 지정해준다. "화면의 width가 800px 이상일 때 ..

728x90
반응형