첫 WordPress 사이트 구축을 위한 최고의 팁과 도구

저는 오늘 고백할 것이 있습니다. 저는 훌륭한 웹 디자이너가 아닙니다. 저는 정식 교육을 받은 적이 없습니다. 저는 완전히 독학했습니다. 내 공예는 글쓰기이고, 나는 프리랜서 작가가 되고 적절한 웹사이트를 위한 예산이 없는 데 필요한 요소로 웹 디자인을 선택했습니다. 나는 하루 1부터 내가 싫어하고 시간이 지남에 따라 조정할 수 없는 저예산 웹사이트에 비용을 지불하는 것보다 내가 좋아하는 괜찮은 DIY 웹사이트를 가지기로 결정했습니다(그러나 몇 가지 "실수" ​​가능성 있음). 결국 우리는 저예산 서비스 제공업체가 얼마나 될 수 있는지 알고 있습니다.

그렇게 아마추어 DIY 웹 디자인에 입문하기 시작했습니다. 꽤 빨리, DIY 웹사이트 과정은 웹 디자인에 대한 나의 관심을 불러일으켰습니다. 나는 여전히 "진정한 디자이너"는 아니지만 내 작업 흐름을 최대화하고, 내가 좋아하는 테마를 둘러보고, 내가 원하는 특정 조정을 구현하는 데 필요한 기본 사항을 충분히 알고 있습니다.

여기 거래가 있습니다. 저는 전문 웹 디자이너가 아닙니다(그리고 아마 앞으로도 없을 것입니다). 그리고 나와 같은 DIY 사람들을 위한 리소스를 찾는 것이 어려울 수 있습니다. 대부분의 것을 알아낼 만큼 똑똑하고 시간을 투자할 의향이 있지만 실제 기술 배경이 없는 사람들입니다.

이것들은 내가 길을 따라 선택한 DIY 웹 디자이너를 위한 최고의 도구와 리소스 중 일부입니다. 비슷한 경향이 있다면 이것이 당신을 위한 것입니다!

웹사이트 빌더 및 사용자 정의 가능한 테마

저는 개인적으로 웹사이트 빌더의 열렬한 팬이 아닙니다. 저는 WordPress를 사랑하고 대부분의 웹사이트 빌더가 제공하는 것보다 훨씬 더 많은 제어 권한을 갖는 것을 좋아합니다. 모든 고민 없이 원하는 정확한 사이트를 얻기 위해 드래그 앤 드롭이라는 아이디어가 마음에 든다면 WordPress용 Divi 테마를 살펴보세요. 또한 WordPress에 대한 수많은 사용자 정의 테마를 찾을 수 있습니다.

WordPress 자식 테마를 만드는 방법

일반적으로 완벽한 테마를 찾는 것은 거의 불가능합니다. 항상 수행해야 하는 몇 가지 수정 사항이 있습니다. 따라서 Twenty Fifteen과 같은 멋진 WordPress 기본 테마를 선택하고...

모든 디자이너는 좋아하는 테마가 있으며 이 DIY(비)디자이너가 가장 좋아하는 것은 GeneratePress입니다. 내가 상상하는 모든 것을 할 수 있고 추가 기능은 100% 가치가 있고 매우 저렴하며 비디오 자습서는 내 질문의 98%에 답하고 개발자(Tom)는 지원 포럼에서 매우 활동적이고 반응이 좋습니다. 나는 이 테마를 2년 동안 사용해 왔으며 이보다 더 행복할 수 없습니다.

외모관리

요즘은 모바일 친화적인 반응형 디자인이 절대적으로 필요하다는 것을 알고 있습니다. 모바일이 아니거나 반응형이 아닌 웹사이트를 휴대폰으로 방문했는데 예쁘지 않습니다. 요즘에는 대부분의 테마에 반응형 요소가 있습니다. 여러분의 테마에도 반응형 요소가 있는지 확인하세요. 그런 다음 구축 과정에서 Duo, Screenify 또는 Browser Shots와 같은 도구를 사용하여 사이트 디자인이 모든 장치에서 잘 보이는지 확인하십시오.

스타일 가이드를 사용해 본 적이 있습니까? 웹사이트의 글꼴, 스타일, 헤드라인 서식 및 색상과 같은 디자인의 모든 시각적 요소에 대한 참조 시트입니다. 웹 사이트를 구축하고 조정할 때 가지고 있고 참조하는 것이 매우 편리하며 Stylify Me를 사용하여 자신의 웹 사이트를 생성할 수 있습니다.

이것은 DIY 디자인 경력의 이 시점에서 이해할 수 없는 것처럼 보일 수도 있고 아닐 수도 있습니다. 그러나 CSS에서 일부 특정 요소의 모양을 조정하기 위해 약간의 수정을 가하고 싶은 날이 올 것입니다. 시간이 되면 튜토리얼에 빠져들거나, 테마에서 지원을 찾거나, CSS 생성기를 사용하여 원하는 코드를 얻을 수 있습니다. 또한 페이지에서 보고 싶은 것을 빌드한 다음 CSS 코드를 생성할 수 있는 드래그 앤 드롭 편집기인 Webflow를 확인할 수 있습니다. 유료 서비스이지만 DIY에 반대되는 경향이 있습니다.

이것은 작은 감자이지만 사이트에 파비콘이 있는지 확인하십시오. 이 파비콘 생성기를 사용하거나 WordPress 사이트용 간단한 파비콘 플러그인을 사용하여 프로세스를 매우 간단하게 만들 수 있습니다. (비전문적인 의견으로는 플러그인 경로를 훨씬 선호합니다.)

모두가 좋아하는 글꼴: 글꼴

글꼴은 웹 디자인의 황금 자식입니다. 모두가 서체를 좋아하는 것 같습니다. 그러나 당신이 무엇을 하고 있는지 모른다면, 글꼴은 일종의 위협이 될 수 있습니다. 폰트를 사고, 설치하고, 수정도 하고… 사이트를 보기 좋게 만들고 싶다면 Google Fonts를 설치하고 웹 친화적인 서체의 매우 강력한 데이터베이스를 사용할 수 있습니다. 또한 간단한 웹 검색으로 잘 어울리는 Google 글꼴 조합을 쉽게 찾을 수 있습니다.

Type-Finder는 일련의 짧은 질문을 하고 글꼴 제안을 제공하는 사이트입니다. 원하는 것을 선택하고 선택하면 잘 진행되고 있습니다. 특히 글꼴과 글꼴 이론에 정통하지 않은 경우 글꼴을 더 쉽게 선택할 수 있습니다.

용감하고 머리글, 핀 등에 원하는 정확한 글꼴을 얻을 준비가 되었으면 Glyphr를 확인하십시오. 글꼴 편집기이며 매우 훌륭합니다.

워크플로 도구

당신이 바지 자리에 앉는 DIY 디자이너라면 작업 흐름에 대해 거의 생각하지 않습니다. 그러나 나는 훌륭한 디자인 워크플로 요소가 DIY 웹 디자인을 훨씬 덜 골치 아프게 만들 수 있다는 것을 (힘들게) 배웠습니다.

모든 디자이너가 툴킷에 포함해야 하는 13가지 브라우저 기반 도구

아, 브라우저 기반 앱. 자체 업데이트되는 견고한 소프트웨어입니다. 물건을 다운로드하는 데 어려움을 겪을 필요가 없습니다. 그리고 아마도 가장 환상적인 것은 선택한 앱이 모든 기기에서 액세스할 수 있다는 것입니다.

"실제 웹 디자이너"에게서 가장 먼저 채택하고 싶은 것은 와이어프레임의 개념입니다. 와이어프레임은 종이에 각 페이지를 스케치하는 것처럼 간단할 수도 있고 Adobe Photoshop에서 그리드처럼 복잡할 수도 있습니다. 내 목적을 위해 일반적으로 종이에 스케치하면 충분하지만 (결국 내 디자인에 대해 초기술적 인 기술을 얻지는 못함) 디지털 그리드에서보다 공식적으로 사물을보고 싶다면 Mockflow (유료 서비스)를 확인하십시오. 목업.

내가 막히게 되는 또 다른 장소는 단어가 어디로 가고 어떻게 보일지입니다 – 사본을 쓰기 전에. 이를 위해 더미 텍스트 생성기가 좋습니다. 사이트를 구축할 때 사이트에 사본이 있으면 단어가 실제로 무엇인지에 집착하지 않고 쉽게 평가할 수 있습니다(이는 제 개인적인 몰락입니다).

선과 단어로 노는 것을 멈추고 색상으로 노는 것을 시작할 때 몇 가지 재미있는 옵션이 있습니다. 색상 선택기는 내가 가장 좋아하는 것 중 일부입니다. 색상을 선택한 다음 색상 선택기가 멋진 색상 조합을 만들어냅니다. Adobe와 Color Wizard는 두 가지 재미있는 옵션입니다.

색상 선택기로 잘리지 않으면 Pictaculous와 같은 것을 사용할 수 있습니다. 마음에 드는 이미지를 업로드하면 이미지에서 가져온 컬러 테마가 나옵니다. 꽤 멋져!

그게 다가 아니야

DIY 디자이너에게 훌륭한 디자인 도구는 끝이 없지만, 이러한 도구는 초심자 디자이너의 삶을 훨씬 더 쉽게 만들어 줍니다. 갖고 싶은 도구는 무엇입니까?

무료 전자책: 웹 디자이너를 위한 25가지 필수 도구

디자이너의 툴킷은 성공의 열쇠가 될 수 있지만 워크플로에 어떤 도구를 포함해야 하는지 어떻게 알 수 있습니까? 이 25가지 도구는 성공적인 웹 디자이너에게 꼭 필요한 도구라고 생각합니다.