본문 바로가기

반응형

Design

(98)
유튜브 사이즈 크기 조절 및 이미지 만드는 방법 홈페이지를 제작할 때나 포스팅을 할 때 반응형으로 제작되어 있지 않은 지도나 유튜브,비메오등의 동영상 플레이어들은 아이프레임화로 사이즈가 고정되어 있어 크기를 줄이거나 늘릴때 이미지나 동영상이 잘려 나옵니다. 이에 대응 할 수 있는 방법은 크기를 %로 바꿔 css표기하는 방법인데, 지도의 경우는 클래스를 지정해 홈페이지에서 따로 표기를 하는 번거로움 등을 예로 들 수 있고, 적용도 힘들다는 단점이 있습니다. ​ 이를 보완해줄 수 있는 방법이 바로 아래에 표기된 사이트입니다. 사용방법은 아주 간단합니다. 유튜브나 비메오등의 사이트 주소를 그대로 복사해 해당 사이트에서 임베드 시키면 소스코드가 하단에 나오게되는데 그 소스코드를 긁어 복사해 적용하고 싶은곳에 바로 적용하시면됩니다. ​ 프론트작업이 어려운 분들..
CSS 소개와 사용방법 (CSS란 무엇인가?) CSS 소개 첫 단추 페이지를 포스팅하기 전에 잠시 CSS가 태어나게 된 일화를 간단히 소개 후 넘어가도록 할게요 먼저 CSS는 Cascading Style Sheets의 약어로 사전적 용어로 풀이해 나타내면 계단식 스타일 시트라고 불립니다. 홈페이지 제작을 했었던 1,2세대 초기 웹디자인과 개발자들은 CSS라는 표준형 언어가 생기기 전에는 웹페이지 폰트에 컬러를 주거나 단일 페이지나 공용 페이지에 특수한 효과를 주고 싶을 때, 모든 페이지에 일일이 스타일 용어를 적용시키거나 개발자를 통한 프로그래밍적 언어로 제어를 해야 했습니다. ​ 이때 당시에는 웹디자이너가 추구하는 미적 효과와 그것들을 실행해야 하는 개발자 사이에 마찰이 불가피했었는데요, 페이지가 늘어나면 늘어날수록 일일이 대입해 적용해야 했기 때..
제이쿼리 슬라이더, 캐러셀 유틸 모음 (jQuery, Carasel) 홈페이지내에 제이쿼리 슬라이더,캐러셀 유틸 모음 페이지 입니다. 마치 회전목마가 돌아가는 것 같다는 의미의 캐러셀은 주로 홈페이지 메인상단에 위치하고 있으며, 쇼핑몰에서 프로모션이나 팝업이벤트를 보여주는 기능으로 많이 사용합니다. 모바일에서도 팝업등으로 많이 사용하고 있기 때문에 같이 연동되는 캐러셀을 사용하는게 중요합니다. 제이쿼리 버전에 영향을 받을 수도 있고, 많은 제이쿼리를 연결하면 동작을 하지 않을수도 있을 수 있어서 사이트내에 소스를 적용 및 확인 하시고 기능이 작동하는 슬라이드를 사용하시면 될 것 같습니다. 목록 캐러셀 모음 링크 보편적인 캐러셀 Cycle2 적용하기 배경을 제어하는 유틸소스 모음 ■ 캐러셀 모음 (이미지가 돌아가는 배너 코드) Carousel slide show [bxsli..
한눈에 알기쉽게 설명하는 실업급여 신청 및 받는방법 실업급여를 받는 방법을 개인적으로 정리하는 겸 이웃분들도 간편하게 참고하시라고 적어둡니다. 퇴사를 하기전 먼저 포스팅을 읽으면 도움이 되실거에요 ​  퇴사하게 된 후, 해야 할 것 두 가지 1> 자발적 퇴사인가 경영으로 인한 퇴사 및 계약직인 경우 재계약 종료인가를 먼저 확인합니다. 이는 실업급여를 받기 위한 중요한 요소로, 자발적 퇴사인 경우 피보험단위기간이 적립만 되고 : 퇴사 처리 (실업급여 X) - 구인 시작합니다. 계약 종료 및 경영으로 인한 퇴사일 경우 : 이직 처리 (실업급여 O) - 실업급여 신청하러 갑니다. (단, 피보험단위기간 6개월 이상일 것) ​  2> 30살 이상일 경우, 건강보험이 자동으로 부양자 처리가 되지 않기 때문에, 직장을 다니며, 4대 보험 납입하는 가족이 있다면 그 쪽..
[일본어폰트] 상업용 무료 일본어 폰트 다운받기 일본어를 표기함에 있어 사용이 용이하지 않은 기존의 한글 폰트를 대체할 개성 많은 일본어 폰트 모음 사이트입니다. 귀여운 글씨체 / 손글씨 / 캘리그라피 / 상업용 무료폰트 태그가 붙은 폰트 모음 등으로 나누어 필터를 구분하고 있으며, 왠만한 폰트는 전부 상업용 무료로 풀려있지만 한번 더 확인 후 사용하시면 좋을듯 하네요 :-) 각각의 다운로드 링크를 클릭하면 내려받을 수 있는 사이트로 2차 이동을 하게 끔 되어있으니 참고하세요 사용범위 확인 문구 상업용으로 무료폰트만 찾고싶으시면 Commercial-use OK 버튼을 눌러 이용하세요 ​ Usage Permission ※Free for personal and non-commercial projects
인터넷 익스플로러(ie)가 단계별로 종료됩니다. 타이틀만 보고도 이웃분들은 "아! 올것이 왔구나" 라고 생각하실 수도 있겠네요. ​ 인터넷을 검색한다던 의미의 인터넷 익스플로러. 마이크로소프트가 만들고 오랫동안 배포해왔었던 인터넷 익스플로러 (이하 IE)와 구형 엣지 브라우저를 1월경 종료시키는데 이어 내년 2021년 8월경 Microsoft 365 IE의 지원에 대한 완전한 종료 또한 선언했습니다. 문제가 있어도 이제 공식적으로 사후처리는 없을것 이라는 내용입니다. 사실상.. 어도비 플래시와 함께 종료가 예정되어 있었던 다음 타깃이라고 예상했었고 명맥만 유지한채로 원래의 순기능만을 제공했었습니다. ​ 종료에는 많은 복합요인이 있을것이라 생각되지만 아무래도 제일 큰 요인은 두가지 정도로 꼽을 수 있을것이라 생각됩니다. ​ 1. 보안도 취약하고 느리고 ..
웹디자이너에서 웹퍼블리싱 디자이너로 초창기 90년대의 1세대 웹디자인을 지나 화려한 모션을 보여주는 플래시 웹디자인 2세대를 넘어서, 스마트폰이 보급되는 3세대 웹디자인은 모든 디바이스를 관리해야 하는 반응형이라는 생소한 단어로 무장했습니다. ​ 1. 이에 따라 3세대 웹 환경은 웹디자이너와 함께, 다양한 디바이스를 응대할 수 있는 웹 퍼블리셔라는 직업 두 분류로 나뉘었는데, ​ 사실상 대기업이나 큰 중견기업에 들어가지 않는 이상 오너는 현실적으로 퍼블리셔라는 인원을 따로 고용하진 않습니다. 소기업 오너와 대부분의 관리자분들은 퍼블리싱의 영역을 웹 디자이너의 역량으로 생각하시는 분들이 꽤나 많습니다. 이에 많은 회사는 웹 디자이너가 퍼블리싱까지 겸할 수 있는 디자이너를 뽑는 추세입니다. 어쨌든 페이지의 레이아웃도 소비자에게 보여야 하는 디..
구글과 네이버의 문화에 따른 웹디자인의 차이 [알쓸신잡] 비단 구글과 네이버뿐만이 아니고, 외국의 홈페이지는 간결하면서도 [선택지>선택지]로 홈페이지가 넘어가는 반면, 우리나라의 홈페이지는 한눈에 모든 정보가 모여 소비자로 하여금 선택지를 찾게 끔 만들어 놓고 있습니다. ​ 우리나라에서는 정례화되어서 "이 홈페이지는 너무 간결하다~"라는 이야기보다는 "뭐야~ 홈페이지에 왜 이렇게 내용이 없어?"라고 반문을 묻는 반면, 외국 홈페이지에는 깔끔하고 심플한 메뉴. 선택지에서 다른 선택지로 내가 필요한 정보만을 나열하여 보게 끔 만든 것이 대부분이라.. 한상차림에서 연결되는 웹디자인 에피소드가 흥미롭네요 :-)

반응형