9 웹 사이트 디자인 아이디어 + 영감을주는 사이트

웹 사이트 디자인 아이디어훌륭한 웹 사이트 디자인을 생각해내는 것은 어려울 수 있습니다.


창의적인 주스를 주문형으로 공급할 수없는 경우 갇히고 좌절하기 쉽습니다..

그것이 지금 또는 때때로 느끼는 기분이라면이 게시물이 도움이 될 것입니다..

다음은 디자이너를 극복 할 수있는 실용적인 방법을 제공합니다. 블록 아이디어가 흐르지 않을 때.

준비된? 시작하자…

느낌이들 때 9 웹 디자인 팁

좋은 아이디어를 얻을 수 있도록 웹 디자인 팁부터 시작하여 즉시 작업 내용을 개선 할 수 있습니다..

1. Pinterest 분위기 보드 사용

Pinterest는 훌륭한 도구입니다. 무드 보드. 프로젝트에 도움이되거나 방향을 제시 할 시각적 자료를 수집 할 수 있습니다. 이미지, 색 구성표, 레이아웃, 기존 웹 사이트 등이 될 수 있습니다..

Pinterest 무드 보드

무드 보드는 디자인 영감의 중심 허브 역할을합니다. 고객이나 공동 작업자와 공유하여 자신의 자료에 기여할 수도 있습니다..

2. 단계별 계획 작성

계획 만들기당신은 그들이 말하는 것을 알고 있습니다 : 계획 실패는 실패 할 계획입니다. 이것은 웹 디자인에서도 마찬가지입니다. 웹 사이트 디자인 아이디어가 나오지 않으면 아직 기본 사항을 다루지 않았기 때문일 수 있습니다. 기본 사항이 제자리에있을 때만 창의력을 발휘할 수 있습니다. 계획은 다음과 같습니다.

  1. 웹 사이트 목표 정의 — 사이트에서 실제로 달성해야하는 것이 무엇인지 알아야합니다. 그렇지 않은 경우 대체 무엇을 설계하고 있습니까? 좋은 목표는 스마트입니다 : 에스특이한, 미디엄측정 할 수있는, 염색 가능, 아르 자형엘레 반트 전적으로. 그것에 더 여기.
  2. 구매자의 여정을 스케치하십시오 — 전체 목표 외에도 방문자가 어떤 길을 가고 싶어하는지 파악해야합니다. 그들이 당신의 목표를 염두에두고 사이트를 방문했을 때부터. 이렇게하면 길을 안내하는 구조를 만들 수 있습니다. Hubspot에는 좋은 기사 그것에.
  3. 스타일 가이드 제공 — 스타일 가이드를 만들면 디자인의 일관성을 유지할 수 있습니다. 글꼴, 색상 및 기타 디자인 요소를 정의합니다. 하나를 사용하면 특히 다른 사람과 작업 할 때 균일 성을 촉진합니다. 구글 좋은 예입니다.
  4. SEO 계획 — SEO에도 계획이 중요합니다. 방문자와 검색 엔진 모두에 대한 정보를 구성하는 방법을 이해하는 웹 사이트 맵을 작성하십시오..

3. 먼저 구조에 집중

계획을 세우는 것처럼 웹 사이트 구조에 집중하면 프로세스에서 벗어나 조감도를 높일 수 있습니다..

컴퓨터와 다른 매체로 작업하는 데 도움이 될 수 있습니다. 예를 들어, 펜 하나만으로 종이에 스케치를하면 색상 및 기타 세부 사항을 잊을 수 있습니다. 플립 차트 또는 화이트 보드를 사용하는 경우 전체 작업을 공동 작업으로 만들 수도 있습니다..

포스트잇 메모에 웹 사이트를 그리는 것도 좋은 방법입니다. 이것은 당신이 필수에 충실하도록 강요 할 것입니다. 이것의 변형은 먼저 회색 음영으로 디자인을 만들고 나중에 색상을 추가하는 것입니다. 이렇게하면 색상에 의존하지 않고 시각적 계층을 구축해야합니다.

그레이 스케일로 시작
로라 엘리자베스 / 매싱 매거진

컴퓨터를 사용하여 디자인하는 데 어려움을 겪고 있다면“스 퀸트 테스트”를 사용할 수 있습니다. 그것은 화면에서 멀어지고 눈을 가늘게 뜨는 것을 의미합니다. 흐릿한 이미지는 사이트에서 가장 눈에 띄는 부분과 처음 방문한 방문자가 가장 먼저 눈에 띄는 부분을 보여줍니다.

4. 웹 표준에 충실

창의성을 발휘하는 것은 디자이너의 본성입니다. 일반적으로 좋은 일입니다. 창의성을 발휘할 수있는 경계를 설정해야합니다..

예를 들어, 웹 디자인에는 여러 가지 표준이 있습니다. 방문자는 특정 디자인 강의 및 웹 사이트 요소에 익숙합니다. 규칙을 너무 많이 위반하면 혼동되어 꺼질 수 있습니다.

확립 된 표준 중 다음과 같습니다.

  • 모든 페이지에서 브랜딩 및 디자인의 일관성
  • 왼쪽 상단의 웹 사이트 로고
  • 오른쪽 상단 또는 센터의 연락처 정보
  • 화면 상단의 기본 탐색
  • 홈페이지의 주요 헤드 라인 / 가치 제안 및 클릭 유도 문안
  • 헤더의 검색 기능
  • 웹 사이트 바닥 글의 소셜 미디어 아이콘

우리는 열렬한 인터넷 사용자라고 확신합니다. 이미 웹 사이트에서 더 많은 표준을 준수하고 있음을 알고 있습니다. 그렇지 않은 경우 더 많은 것을 찾을 수 있습니다 여기.

5. 미니멀리즘과 CTA 버튼에 집중

사이트와 페이지의 목표를 알면 해당 목적에 맞지 않는 모든 것을 제거 할 수 있습니다. 이를 통해 디자인을 간소화하고보다 즐겁게 볼 수 있습니다..

다시, 이것을 뒷받침하는 연구가 있습니다. 위에서 언급 한 동일한 연구에서 Google은 시각적 복잡성이 웹 사이트 이의 제기와 부정적인 상관 관계가 있음을 발견했습니다. 요컨대 – 사람들은 압도되기를 원하지 않습니다! 웹 사이트 속도와 같은 다른 기능에는 디자인 단순화가 좋습니다..

안전하게 제거 할 수있는 몇 가지 사항은 다음과 같습니다.

  • 메뉴 항목 — 물론 다른 사람들이 더 많은 사이트를 탐색하기를 원합니다. 그러나 오버로드 된 메뉴는 매우 혼란스럽고 부정적인 영향을 줄 수 있습니다. 다시 – 필수 사항을 고수!
  • 사이드 바 — 점점 더 많은 웹 사이트가 사이드 바를 단계적으로 폐지하고 있습니다. 사이드 바에 무엇이 있습니까? 정말 중요합니까?
  • 진흙 투성이 전문 용어 — 스톡 사진에 사용되는 것과 같은 것은 언어에 적용됩니다. 과도하게 사용 된 문구, 진부한 단어 및 빈 단어는 사람들을 돋보이게합니다. 그것들의 사용을 중지하고, 글에 성격을 주입하고, 배우십시오 힘 단어카피 라이팅 배우기.

6. 모바일로 시작

모바일 장치가 전 세계를 뒤흔들 었습니다. 이제는 데스크톱 컴퓨터보다 전화 및 태블릿을 통해 웹 서핑을하는 사람들이 더 많습니다..

또한, 구글 발표 새로운 모바일 우선 지수를 출시하고 있습니다. 즉, 검색 엔진이 완전히 작동하면 검색 엔진이 모든 웹 사이트를 모바일 사이트에서 먼저 판단합니다. 제대로 작동하지 않으면 검색 순위가 올라갑니다.

따라서 웹 사이트를 디자인 할 때는 먼저 모바일 사이트를 시작하는 것이 좋습니다. 이제부터 모바일 사용자가 주요 고객이됩니다. 따라서, 당신은 그들이 만족을 느끼게하는 것이 좋습니다.

동시에 웹 사이트 디자인 아이디어를 제시하는 것이 좋습니다. 다시 한 번, 모바일에서 시작하여 디자인의 목적을 통해 필수 요소에 집중하고 생각해야합니다. 그런 다음 화면 크기가 커짐에 따라 요소를 더 전개하고 추가 할 수 있습니다..

7. 콘텐츠 형식에주의하십시오

콘텐츠 형식은 웹 디자이너를위한 과소 평가 도구입니다. 콘텐츠는 블로그 게시물 또는 판매 사본 형태로 사이트의 가장 중요한 요소입니다. 결국 방문자가 소비하기를 원하는 것입니다. 디자인의 목적은 디자인 방식을.

불행히도, 지금까지 사람들은 너무 포화되어 페이지의 모든 것을 읽는 사람은 거의 없습니다. 대신 대부분의 방문자가 스캔합니다. 또한, 그들은 경향이 F 자 모양으로하세요.

그것은 당신이 당신의 컨텐츠가 더 많은 영향력을 가지도록 소비 습관에 맞도록 만들어야한다는 것을 의미합니다..

이를 수행하는 방법은 다음과 같습니다.

  • 제목 포함 — 제목은 내용을 분류하는 좋은 방법입니다. 또한 많은 독자들이 스캔을위한 앵커 포인트로 사용하고 흥미로운 제목 아래 해당 부분을 읽기 전용으로 사용합니다. 따라서 제목을 사용하고 설명 적이어야합니다..
  • 단락 및 목록 사용 — 아무도 큰 텍스트를 읽고 싶지 않습니다. 단락은 내용을 작은 덩어리로 나눕니다. 새로운 포인트를 열 때마다 새로운 것을 엽니 다. 리스트는 비슷한 기능을 가지고 있으며 정보를보다 쉽게 ​​이용할 수 있도록합니다. 그것들도 사용하십시오.
  • 미디어와 영상을 놓치지 마십시오 — 시각 정보는 텍스트보다 인간의 뇌에 훨씬 더 접근하기 쉽습니다. 따라서 이미지와 기타 미디어를 사용하여 사본의 요점에 밑줄을 긋는 것이 좋습니다. 또한 더 긴 텍스트를 나누는 좋은 방법이기도합니다..
  • 글꼴 최적화 — 글꼴 사용도 가독성에 크게 영향을줍니다. 여기에 가장 중요한 도구는 크기와 선 높이입니다. 간다 16px 이상 사용하는 글꼴이 작을수록 줄 높이를 더 추가하십시오..

이 기사를 조사하면 위의 모든 내용이 적용되는 것을 볼 수 있습니다.

8. 한 페이지 디자인 시도

당시 웹 사이트 디자인은 폴드. 중요한 것은 사용자가 스크롤을 시작하는 한계를 넘어야했습니다. 아직도 어디에 있는지에 대해 할 말이 있습니다. 사용자는 대부분의 시간을 보냅니다.

방문자 시청 시간-접기

그렇다고 폴드가 페이지의 전부와 끝이라는 것을 의미하지는 않습니다. 사람들은 실제로 스크롤합니다. 사실, 당신이 그들에게 이유를 주면 그들은 전체 페이지를 아래로 스크롤합니다.

크레이지 에그 (Crazy Egg) 원래 판매 페이지를 교체 20 배 더 긴.

한 페이지 디자인

결과: 전환율이 30 % 증가했습니다! 현재 구매자의 여정이 여러 페이지를 넘어가는 경우 대신 한 곳으로 통합하는 것이 좋습니다. 이것은 모든 차이를 만드는 웹 사이트 디자인 아이디어 중 하나 일 수 있습니다..

슬라이드 쇼 / 캐 러셀 또는 탭 / 아코디언에 콘텐츠를 넣지 마세요. 작동하지 않습니다.!

9. A / B 테스트 고용

때로는 다른 웹 사이트 디자인 아이디어를 평가할 때 올바른 방법을 결정하기가 어려울 수 있습니다. 당신은 앞뒤로 생각하고, 조정하지만, 당신의 결정을 확신하지 못합니다. 어떤 시점에서, 생각은 더 이상 자르지 않을 것입니다. 사용자가 결정하도록해야합니다.

A / B 테스트는 웹 사이트 개선에 도움이되는 훌륭한 방법입니다. 이는 방문자에게 무작위로 다양한 버전의 디자인을 제공 한 다음 반응 방식을 확인하는 것을 의미합니다. 결과에 따라 결정을 내릴 수 있습니다.

거의 모든 것을 테스트 할 수 있습니다. 전체 페이지 디자인에서 색상 변경, 이미지, 기사 제목 및 글꼴에 대한 클릭 유도 문안. 이 모든 것이 페이지 성능에 큰 차이를 만들 수 있습니다. 그러나 테스트하지 않으면 알 수 없습니다!

이 도구들플러그인 시험에 도움이 될 것입니다.

6 개의 영감을주는 웹 사이트로 새로운 웹 사이트 디자인 아이디어 생성

이 시점에서 여전히 고착 감을 느끼면이 마지막 부분에서 웹 디자인 영감으로 가득 찬 여러 웹 사이트를 살펴 봅니다..

1. Awwwards.com

어워드

이 웹 사이트는 전세계 웹 디자이너, 개발자 및 대행사에게 상을 수여합니다. 그들은 웹 디자인 예제의 방대한 검색 가능한 아카이브를 가지고 있습니다. 또한, 블로그 디자인을 자세하게 소개하는 부분과 할 수있는 부분 이 달의 후보자 사이트에서 투표. 모두 고품질이며 진정으로 영감을줍니다!

2. WebDesign-Inspiration.com

웹 사이트 디자인 영감

완성 된 웹 디자인 프로젝트의 갤러리입니다. 산업, 유형, 색상 팔레트 또는 스타일 등 원하는 것을 찾기 위해 여러 가지 방법으로 필터링 할 수 있습니다. 보관함이 너무 커서 자체 웹 사이트 디자인 아이디어를내는 데 필요한 유일한 페이지 인 경우가 종종 있습니다.

3. SiteInspire.com

siteInspire

이 웹 사이트는 웹과 대화식 디자인을 모두 보여줍니다. 이전 예제와 마찬가지로 스타일, 유형, 주제 및 플랫폼을 포함한 다양한 방법으로 항목을 필터링 할 수 있습니다. 계정을 만들면 좋아하는 디자인 모음을 설정할 수도 있습니다.

4. OnePageLove.com

한 페이지 사랑

이 예는 한 페이지 디자인을 위해 특별히 제작 된 웹 디자인 영감 사이트입니다. 이 기사의 앞부분에서 아이디어를 언급했습니다. 갤러리를 탐색하거나 원하는 것을 구체적으로 검색 할 수 있습니다. 자신의 한 페이지 사이트를 만들 때 흔들 리십시오.

5. Dribbble.com

웹 사이트 디자인 아이디어 영감을위한 dribbble

Dribbble에서 디자이너들은 그들의 작품을 과시합니다. 앱부터 아이콘, 일러스트레이션 및 기타 예제에 이르기까지 모든 것이 될 수 있습니다. 일반적인 영감을 위해 사용하거나 태그 다음과 같이 가장 관심있는 것을 찾기 위해 웹 디자인.

6. Behance.net

Behance

이 웹 사이트는 Dribbble과 매우 유사합니다. 또한 디자이너가 포트폴리오를 연결하고 과시 할 수있는 장소이기도합니다. 많은 웹 디자인 예제가 있으며 검색 기능을 사용하여 찾을 수 있습니다..

마무리

웹 디자인 아이디어는 나무에서 자라지 않습니다. 때로는 좋은 것을 내기 위해 약간의 도움이 필요합니다. 고맙게도 이와 같은 게시물이 있습니다.!

위의 게시물에서 언급 한 웹 디자인 팁, 도구 및 리소스가 창의성 영역으로 다시 돌아 왔기를 바랍니다. 분명히, 더 유용한 것들이 많이 있습니다. 그래서 우리는 당신의 의견을 듣고 싶습니다.!

웹 디자인 아이디어를 생성하기위한 추가 팁, 도구 또는 영감을 알고 있습니까? 그렇다면 아래의 의견 섹션에서 공유하십시오!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map