Design/퍼블리싱 지식창고 (46) 썸네일형 리스트형 css 반응형 em,rem,vw,vh,calc로 코드 작성하는 법 기본적으로 아무것도 세팅하지 않았을 때 브라우저는 100%비율 기준 font-size를 16px으로 보여주게 되는데, 이를 반응형이면서 정수로 떨어지기 위해 편한 계산방법으로 설정하기 위해 세팅하는 방법이다. 폰트로만 사용하는게 아니라 마진,패딩 다 사용가능하다. 1. html font 사이즈는 기본으로 16px 이다.대부분 폰트사이즈는 아무것도 설정하지 않았을 시에 html에 100%로 맞추어져 있다. 이렇게 그냥 기본사이즈에 코드를 만들어나가면 화면에 16px로 나온다. 이는 곧 1em이라고 정의할 수 있다. (px은 해상도 설정을 위해 수치상으로 기록하는 것 뿐 명확한 명칭은 em이 맞다)기본으로 설정된 값 font-size:100%; = 1em; = 16px; 똑같은 말이다. p도 16px로 출.. 홈페이지 제작의 기초 홈페이지를 제작하기 위한 기초적인 내용을 담았습니다. 비전공자가 전공자가 되기 위해 배워야 하는 이론적 내용들을 웹디자이너 관점으로 이해하기 쉽게 풀어낸 포스팅들로 홈페이지를 만들어야 하는 때와 검색등록에 관련한 포스팅입니다. 1. 홈페이지의 유형홈페이지는 소비자에게 알리기 위한 용도로 사용되며 성격에 따른 레이아웃과 구성을 각기 달리해야 합니다. 그에 따른 분류에 대한 포스팅입니다. 다양한 홈페이지의 제작 유형을 크게 3종류로 분류한다면?다양하게 제작된 홈페이지들의 유형을 대분류로 나누어 쉽게 기록하고 짚어가도록 하겠습니다. 홈페이지는 인터넷을 토대로 온라인상에서 다양한 소비자 및 고객과 소통하는 창구로서, 정말blue-seal.tistory.com 2. 홈페이지를 구성하기위한 조건홈페이지를 보여주기.. JS유틸 모음 CSS로 웹페이지와 홈페이지에 대한 디자인을 만족시킨 후 움직이는 다양한 스크립트 소스로 화려한 동작을 부여하는 단계로 만들어진 웹페이지에 임팩트를 줄 수 있습니다. 또한 JS로 제작할 수 있는 기능적인 부분은 개발자에게 부탁하지 않고도 퍼블리싱 쪽에서 간단하게 처리될 수 있는 부분 또한 있어서 다양한 유틸리티를 숙지하고 있는 것도 중요합니다.(즐겨찾기) ■ MOBISCROLL : 별도의 개발 없이 달력을 지원하는 기능달력의 기능조차도 사실은 개발자가 만들어야 하는 기술 중에 하나입니다. (동작으로 작동해야 하기 때문에 퍼블리싱도 한계가 있을 수 있습니다) 그 작업을 유틸리티로 적용해 사용할 수 있는 기능이며, 달력뿐만이 아닌 다양한 유틸리티를 지원합니다. 무, 유료의 사용에 따라 지원하는 범위도 다르고.. CSS 핵심 명령어 및 유틸리티 모음 홈페이지의 뼈대로 불리는 html로 골격을 만든 후에는 아름답고 이쁘게 만드는 미적 작업을 진행해야 하는데 그 작업은 모두 css공간에서 이루어집니다. css의 정의부터 간단하게 움직이는 애니메이션까지 다양한 강의 포스팅을 담았습니다.CSS소개와 사용방법-css란 무엇인가? / css 사용방법홈페이지와 웹의 컨텐츠를 이쁘게 꾸미는 CSS에 대해 알아봅니다.홈페이지 컬러 값 조절하기- RGBA / 16진수 hex값웹상에서 사용하는 대표적 컬러 RGBA의 뜻과 16진수의 사용방법을 알아봅니다.홈페이지 배경이미지 제어하기- background웹상에서 배경 효과를 제어하는 다양한 방법을 알아봅니다.홈페이지 선을 제어하는 방법- border (width,style,color)선을 둥글게 만들거나 두껍게 하거나 아.. HTML 핵심 명령어 및 유틸리티 모음 우리가 PC, 모바일 화면에서 자주 만날 수 있는 다양한 홈페이지를 만들기 위한 첫 번째 과정으로 웹 환경 제작에 있어 뼈대가 되는 HTML코드에 대한 강의 목록을 담고 있습니다. 미적으로 훌륭하게 만드는 작업 전에 초기환경을 세팅하는 내용이 주로 담겼으며 정보 저장과 필수적인 유틸리티에 대한 연결을 시작으로 코드를 사용하는 기초적인 방법부터 반응형 홈페이지를 만들기 위해 (하나의 홈페이지 제작으로 여러 해상도에서 보일 때) 대응해야 하는 레이아웃의 방법까지를 담았습니다.DOCTYPE, META TAG(홈페이지 정보 담기)홈페이지 제작 을 위해서는 홈페이지의 정보를 담고있는 DOCTYPE(독타입)과 홈페이지의 성격을 담고있는 META TAG(메타태그)를 선언해 주는것 으로 제작이 시작됩니다.LINK sc.. 웹디자이너 (퍼블리싱 비중이 매우 높을때) 면접시 질문 공통질문회사에 지원한 이유자기소개디자인시에 자신의 업무스타일성격의 장점 및 단점 업무질문디자인 레퍼런스 체크하는 방식디자인으로 바꿔서 취업한 이유디자인은 따로 배운건지사용하시는 툴사이트를 만들때 웹디자인과 퍼블리싱을 포함해 몇 일이 걸리는지??웹디자인과 앱디자인 방향웹디자인과 웹퍼블리싱 작업의 연계정도?? 퍼블리싱 질문- html과 CSS 숙지하고 있는 정도는 어느정도 되시나요??- 웹표준과 웹접근성에 대해 설명해 주세요웹표준은 크로스브라우징에 맞춰 W3C 등의 표준화 기구에서 정의 해준 명세에 맞게 마크업 하는 것 웹접근성은 이용자, 이용자의 장비에 관계없이 이용할 수 있는 웹 사이트를 구성하는 것. 시각장애인 등도 이용 할 수 있으며, 여러 PC나 장비에서도 접근 할 수 있는 웹 사이트를 뜻합니다.-.. 디자이너의 작업 화면을 공유하는 협업 툴 제플린 아이폰이 등장하고 나서 스마트폰의 시대가 본격적으로 열리고 앱을 만들기 위해 디자인했던 예전의 모습은 웹디자인에서 했던 방식을 그대로 고수하는 경우가 많았습니다. 하지만 그렇게 진행되다 보니 해상도가 다른 앱의 특성상 파일을 여러 번 전달하는 경우가 많아졌고, 프로토 디자인이 되었다면 그 작업내용을 공유하고 피드백받기 위해 (컨펌받기 위해) zip파일로 만들어 클라이언트에게 전달해 피드백을 받고, 피드백이 완료되었다면 개발자에게 전달할 때에도 수치값을 ppt에 적어 전달하는 등의 시간과 효율이 두 배,세 배가 걸리는 일련의 작업들을 디자이너가 진행하곤 했습니다. (디자인하는 시간보다도 공수가 훨씬 많이 들었습니다.) 파일도 따로 전달해야 했죠. 하지만 이제는 협업툴이 등장하면서 시간을 단축시켜 주고 작업.. 웹퍼블리싱 강의 및 홈페이지 제작 유틸 모음 홈페이지 제작을 위해 필요한 3박자. 뼈대가 되는 HTML과 인테리어를 담당하는 CSS, 유동적인 홈페이지를 위해 필수적인 JS는 차례대로 유기적으로 흘러가야 합니다. 기획, 디자이너, 개발자 할 거 없이 웹에 관련된 업무를 하는 직군이라면 알아야 할 업무 소통을 위해 필수적인 다양한 웹퍼블리싱에 대한 내용을 담고 있으며, 학습의 과정과 제작에 필요한 유틸리티를 한 데 모아봤습니다. 또한 티스토리의 스킨을 수정하기 위해 각각의 코드 요소들이 웹 상에서 어떻게 돌아가는지를 보여주고 있기 때문에 기초에 관련된 각각의 내용을 숙지한다면 티스토리 블로그 또한 원하는 대로 <span style="color: #333333; text-align: start.. 이전 1 2 3 4 ··· 6 다음
