반응형
즐겨찾기
-
저작권 걱정없는 무료 아이콘 사이트 top6 ✅ 무료 아이콘 사이트 추천Flaticon세계 최대 아이콘 플랫폼 중 하나PNG, SVG, EPS 등 다양한 포맷 제공일부는 출처 표기 필요하지만, 프리미엄 결제 시 무표기 가능Icons8직관적이고 트렌디한 아이콘 많음PNG 무료 다운로드 가능, SVG·편집 기능은 회원가입 필요상업적 사용 가능 (출처 표기 조건 있음)The Noun Project전 세계 디자이너가 만든 아이콘 모음출처 표기 시 무료 사용 가능무제한/무표기 사용은 유료 구독 필요Material Icons (Google)구글에서 직접 제공하는 아이콘 세트Apache 2.0 라이선스 → 자유롭게 사용 가능깔끔하고 UI/UX 디자인에 최적화Font Awesome웹 아이콘 대표 라이브러리무료/유료 버전 모두 있으며, 무료도 상업적 사용 가능코드.. -
[웹디자인 트렌드] 스크롤 인터랙션 중심 구성으로 UX/UI 혁신하기 ✅ 스크롤 인터랙션이란?스크롤 인터랙션(Scroll Interaction)은 사용자가 웹페이지를 스크롤할 때 텍스트, 이미지, 애니메이션이 반응하는 웹디자인 기법입니다. 단순히 위아래로 움직이는 화면을 넘어, UX/UI를 강화하는 2025년 핵심 웹사이트 트렌드로 주목받고 있습니다.📌 왜 스크롤 인터랙션이 중요한가?UX 몰입도 강화 – 사용자 체험형 웹디자인 제공웹사이트 체류 시간 증가 – 자연스럽게 끝까지 탐색 유도브랜드 아이덴티티 강화 – 기억에 남는 차별화된 경험 제공전환율 최적화 – 제품·서비스 이해도를 높여 구매/문의로 연결🛠️ 스크롤 인터랙션 웹디자인 적용 방법패럴랙스 효과(Parallax Scrolling): 깊이감과 입체감 제공리빌 애니메이션(Reveal Animation): 스크롤 시..
-
설치없이 브라우저 전체페이지 캡쳐하는 법 개발자 도구를 사용하면 별도 프로그램 없이 전체 웹페이지를 이미지로 저장할 수 있어요. 1. 캡처할 웹페이지에서 F12 또는 Ctrl + Shift + I 누르기 (개발자 도구 열기)2. Ctrl + Shift + P 눌러 명령어 검색창 열기3. "screenshot" 입력 → Capture full size screenshot 클릭4. 자동으로 이미지 다운로드 완료! -
감각적인 컬러 조합 추천 사이트 감각적인 컬러 조합을 만들고 참고할 수 있는 사이트를 아래에 추천해드릴게요. 디자이너들 사이에서 자주 사용되고, 실제 실무에도 매우 유용한 사이트들입니다.🎨 감각적인 컬러 조합 추천 사이트Coolors✨ 한 번의 클릭으로 컬러 팔레트를 자동 생성🎨 특정 색을 고정한 채 다른 컬러만 바꾸는 기능도 가능📁 팔레트 저장, 내보내기, 이미지 추출 기능도 탁월Khroma🤖 AI가 사용자의 취향을 학습해서 컬러 조합 추천🧠 내가 좋아하는 컬러 50개를 선택하면 맞춤 조합 제공🌈 실제 글자, 배경, 버튼 등 UI에 적용된 형태로 확인 가능Color Hunt🎯 트렌디한 컬러 조합이 매일 업데이트됨🔍 인기순, 최신순, 랜덤 필터 제공💾 컬러코드 바로 복사 가능Adobe Color🔄 보색, 유사색, 삼각..
-
가독성 좋은 무료 한글 폰트 추천 (상세페이지용) 폰트명 특징 다운로드Noto Sans KR구글 제공 고품질 폰트. 다양한 굵기, 웹·모바일 모두 OK다운로드 바로가기Toss Product Sans토스에서 배포, Pretendard 느낌의 미니멀한 디자인다운로드 바로가기LINE Seed KR라인에서 배포한 최신 서체, 명확한 자소와 깔끔한 인상다운로드 바로가기서울남산체 / 서울한강체서울시 공식 폰트, 공공 디자인 느낌과 안정된 가독성다운로드 바로가기KoPub Batang / KoPub Gothic한국출판문화진흥원 제공, 서적 같은 인쇄 친화적 폰트다운로드 바로가기한겨레결체 / 한겨레본문체신문사 제공, 본문 최적화. 가독성 매우 뛰어남다운로드 바로가기 🎯 추천 조합 팁제목: Toss Product Sans Bold / Noto Sans KR Black..
-
블로그들이 자주 사용하는 참고 사이트 블로그들이 자주 참고하는 사이트는 크게 아래 6가지 분야로 나눌 수 있어요. 각 분야별로 대표적인 사이트를 소개해드릴게요. ✅ 1. 이미지 및 썸네일 제작 썸네일 제작Canva다양한 템플릿으로 썸네일, 포스터, SNS 이미지 제작 가능무료 이미지Unsplash고퀄리티 사진 무료 다운로드무료 이미지Pexels다양한 주제의 고해상도 무료 사진아이콘/벡터FlaticonPNG, SVG 형식의 아이콘 검색 가능배경 제거Remove.bg이미지 배경 제거를 자동으로 해주는 도구 ✅ 2. 키워드 & 트렌드 조사 검색량 확인네이버 키워드 플래너블로그 주제 키워드 검색량 분석키워드 아이디어키워드마스터롱테일 키워드 추천 도구트렌드 확인Google Trends검색 트렌드와 이슈 키워드 확인실시간 키워드소셜메트릭스SNS 트렌드..
퍼블리싱
-
독학으로 퍼블리싱 공부하는 방법 퍼블리싱(웹 퍼블리싱, HTML/CSS/JavaScript로 웹페이지를 만드는 과정)을 독학으로 공부하려면, 단순히 “문법을 배우는 것”보다 만들어보면서 습득하는 방식이 훨씬 효과적이에요.아래 순서대로 진행하면 체계적으로 실력을 올릴 수 있습니다.1. 기본기부터 다지기퍼블리싱의 핵심은 HTML(구조) + CSS(디자인) + **JavaScript(동적 요소)**입니다.단계학습 포인트추천 자료HTML태그 의미와 구조(시맨틱 태그: , 등)MDN HTML 가이드CSS박스모델, Flex/Grid 레이아웃, 폰트·컬러 스타일링CSS Tricks / MDN CSSJavaScriptDOM 제어, 이벤트 처리, 기본 문법JavaScript.info 📌 팁: 하루 1~2개 태그나 속성을 직접 써보고, 브라우저에서 ..
-
[css/script] 실무 적용 d-day 활용 카운트다운 소스 디데이 설정하여 카운트다운 보여주기 ">
-
다음지도 html 삽입 가이드 (PC/모바일 사이즈별 적용 사용 예시)
-
[CSS] Transform 속성 쉽게 배우기 – 이동, 확대, 회전, 기울이기 ransform 속성은 HTML 요소에 회전, 크기 조절, 이동, 기울이기 등의 2D 또는 3D 변형을 적용할 수 있게 해주는 CSS 속성이에요.쉽게 말해, 요소의 모양이나 위치를 변화시키는 데 사용돼요. 🔧 주요 transform 함수들함수 이름설명translate(x, y)요소를 x, y 방향으로 이동scale(x, y)요소의 크기를 x배, y배로 조절rotate(각도)요소를 회전skew(x각도, y각도)요소를 기울임matrix(...)위 모든 변형을 한번에 줄 수 있는 복합 함수 (고급용) 📌 예시로 보면 더 쉬워요css .box { transform: translate(50px, 20px); } ➡️ .box라는 요소가 오른쪽으로 50px, 아래로 20px 이동해요.css .box { tran..
-
유튜브 동영상 비율대로 반응형으로 적용하는 방법 -
레이아웃 가변형 2단 가변형#wrap {margin:0; width:auto; padding:10px; border:1px solid #bdbdbd; background:#f7f7f7;}#header,#container{width:auto; padding:10px; border:2px solid #bfbfbf; background:#e5e5e5;}.snb,#content{background:#fff; border:1px solid #bdbdbd; text-align:center;}.snb{width:180px; float:left;}#content{height:200px;margin-left:200px;_margin-left:197px;}.clear {clear:both;}#footer{padding:10px; back..
일상정보
- 2025년 9월, 꼭 챙겨야 할 지원금 꿀팁 5가지 📌 2025년 9월, 꼭 챙겨야 할 지원금 꿀팁 5가지목차민생회복 소비쿠폰 2차 지급새출발기금 확대 지원청년 지원금 (근속·주거·자산)부모·육아 지원금기초 복지 지원금1. 민생회복 소비쿠폰 2차 지급지급 시기: 2025년 9월 22일부터대상: 소득 상위 10%를 제외한 국민지원 금액: 1인당 10만 원 추가사용처: 전통시장, 소상공인 매장, 지역사랑상품권 가맹점💡 Tip: 카드 포인트로 자동 지급되므로, 카드사 앱 또는 정부24에서 반드시 확인하세요.2. 새출발기금 확대 지원시행 시점: 2025년 9월대상: 부채 상환에 어려움을 겪는 서민·영세 자영업자지원 내용: 채무 조정, 이자 감면, 장기 분할 상환💡 Tip: 신용회복위원회·금융기관 홈페이지를 통해 온라인 신청이 가능하며, 지난 회차 탈락자도 .. 2025.09.05
- 2차 소비쿠폰, 9월 22일부터 지급 시작 2차 소비쿠폰 9월 22일부터 지급 시작! 신청 방법·대상자 기준 총정리 올여름 지급되었던 1차 소비쿠폰에 이어, 드디어 2차 민생회복 소비쿠폰 지급 소식이 발표되었습니다. 추석과 김장철을 앞두고 소비 진작 효과를 노린 이번 지원은 전국민의 약 90%가 혜택을 받을 수 있을 것으로 보입니다. 오늘은 지급 일정, 신청 방법, 대상자 기준을 정리해드릴게요!🗓 지급 일정과 금액지급 시작일: 2025년 9월 22일(월)지원 금액: 1인당 10만 원지원 대상: 국민 약 90%지난 1차 쿠폰(1인당 15만~55만 원)보다 규모는 줄었지만, 물가 부담 완화와 소비 진작을 위해 추가로 마련된 정책입니다.👨👩👧👦 대상자 기준과 제외 조건이번에도 건강보험료 기준을 중심으로 지급 대상이 정해집니다. 다만, 고.. 2025.09.03
- 혼자서도 가능한 온라인 부업 종류? 단계별 실전 방법! 혼자서도 가능한 온라인 부업 종류? 단계별 실전 방법!바쁜 일상 속에서 '투잡', 'N잡'이라는 말이 더는 낯설지 않게 들리는 요즘.하지만 많은 분들이 이런 고민을 하곤 하죠.“직장 다니면서 혼자서도 가능한 온라인 부업이 있을까?”“어디서부터 어떻게 시작해야 할까?”오늘은 특별한 기술 없이도 혼자서 가능한 온라인 부업 종류와단계별로 실전에서 바로 활용할 수 있는 방법을 소개해드릴게요.✅ 1. 온라인 부업, 왜 해야 할까?💰 수입 다각화: 고정 수입 외에 추가 소득 창출⏳ 시간 유연성: 주말, 출퇴근 시간, 밤 시간에도 가능🏡 장소 제약 無: 집에서도, 카페에서도 가능🎯 2. 혼자서 가능한 온라인 부업 종류 5가지1) 블로그 또는 SNS 콘텐츠 제작수익 구조: 애드센스, 제휴 마케팅, 체험단추천 플랫.. 2025.08.07
- 실무에 쓰기 좋은 AI 모델 프롬프트 작성법 AI 툴 프롬프트 작성후 결과물 "A beautiful young woman with flawless natural skin, soft makeup, and long dark hair. She is posing under natural daylight with a clean white background. The woman is holding a cosmetic skincare bottle close to her face, promoting the product. Her expression is calm and elegant, with a fresh and minimalistic aesthetic. Ultra-realistic photography style, sharp focus, bright .. 2025.09.01
반응형