스크래치에서 웹 사이트 디자인 – Illustrator 또는 Photoshop?

웹 사이트를 처음부터 디자인 할 때 나중에 Adobe Dreamweaver에서 웹 사이트를 슬라이스하고 코딩하려는 경우 Illustrator 또는 Photoshop에서 웹 사이트 디자인을 만들어야합니까? 왜?

빠른 문자 답변 : Illustrator와 Photoshop 사이에서 PhotoShop은 래스터이므로 웹 사이트와 동일합니다.

약간 더 자세한 답변 : 두 가지를 모두 사용합니다.

다른 대답 : Adobe Fireworks 사용을 고려하십시오. 웹 그래픽 제작을 중단하면 Fireworks를 사용하기가 훨씬 쉬워집니다.

긴 지루한 강의 답변 :

"Slice-n-Dice"방법은 약간 날짜가 있습니다. 그것은 10 년 전에 인기가 있었지만 요즘에는 실제로 권장되는 접근법이 아닙니다. 나는 제안 할 것이다 :

• 사이트를 '스케치'하려면 어떤 앱 (AI / PSD)을 사용하십시오. 고 충실도를 자유롭게 느끼지만 단지 모형으로 취급하십시오.

• 설치가 완료되면 사이트 구축을 시작하십시오. HTML / CSS / JS에 대해 자세히 알아보십시오.

• 필요에 따라 PhotoShop으로 이동하여 필요한 개별 그래픽 요소를 만듭니다.

왜? 글쎄, 포토샵에서 디자인하는 것은 작업하는 매체를 설명하지 않습니다. 고정 캔버스이고 웹은 고정 캔버스가 아니고 표준 캔버스도 아닙니다. 그것은 픽셀 완벽한 아이디어로 팀을 이끌고 웹은 단순히 픽셀 완벽하지 않습니다.

로고 및 아이콘을 만들려면 Fireworks 또는 Illustrator를 사용하십시오. 사진 편집에는 Photoshop을 사용하십시오. 다른 모든 것에는 그다지 중요하지 않습니다. 어떤 그래픽 소프트웨어를 사용해야하는지에 대한 논쟁이 있었지만 개인적으로 선호합니다.

그러나 다음 사항에 유의하십시오.

• 그래도 Fireworks는 PNG 압축에 더 좋습니다. 파일 크기는 Photoshop보다 20 % -30 % 작습니다.

• 길을 아는 경우 웹 사이트 이외의 다른 웹 컨텐츠 (예 : 티셔츠, 포스터, 전단지 등)를 디자인하는 것이 벡터 기반 프로그램에서 시작하는 것이 좋습니다.

DA01에 동의하지 않습니다.

웹 문서가 정적 이미지가 아니라는 사실은 웹 사이트를 레이아웃하고 디자인하는 그래픽 편집기의 유용성과 관련이 없습니다. 디자인 모형은 웹 사이트의 프로토 타입 일 필요는 없으며 그렇게해서는 안됩니다. 디자인 모형은 사이트의 미적 디자인을 시각화하고 조각하는 데 도움이되는 문서입니다.

한 장의 종이나 화이트 보드에 웹 문서의 품질이 거의 없다고해서 웹 사이트를 와이어 프레임하는 데 사용할 수있는 것은 아닙니다. 마찬가지로, 브라우저 창을 확장하고 크기를 조정할 수 있다는 사실은 디자인 모형의 가치와 관련이 없습니다. 숙련 된 웹 디자이너는 레이아웃의 특정 부분을 탄력적으로 계획하고 웹 기술의 한계를 설명해야합니다. 레이아웃의 모든 시각적 요소는 여전히 평평한 이미지 내에서 표현 될 수 있습니다 (결국 화면에 렌더링되는 방식).

둘째, 디자인에 대한 단편적인 접근 방식은 품질 결과에 도움이되지 않습니다. 수백 개의 고립 된 위젯이 아닌 웹 레이아웃을 디자인하고 있습니다. 전체 레이아웃을 모방하지 않으면 기본적으로 최종 결과가 어떻게 보이는지 전혀 모를 것입니다. 전체 컴포지션에 대한 개요없이 개별 그래픽 요소를 개별적으로 추가하면 우수한 설계 방식에 반합니다. 추가 할 항목이 없을 때가 아니라 제거 할 항목이 없을 때 디자인이 완료됩니다.

마지막으로, 모형 이미지를 조정하는 것보다 코드에서 설계를 변경하는 데 훨씬 오래 걸립니다. 그렇기 때문에 코드를 작성하기 전에 항상 모형을 디자인하여 계획해야합니다. Fireworks 또는 Illustrator와 같은 벡터 그래픽 프로그램을 사용하든 Photoshop과 같은 래스터 프로그램을 사용하든 상관 없습니다. 그러나 디자인을 코딩하기 전에 항상 그래픽 편집기에서 디자인을 망치 아야합니다.

재미있는 방법으로 이것을 설명하는 좋은 게시물이 있습니다 :) http://www.gomediazine.com/tutorials/photoshop-vs-illustrator-part-1/

다음은 매우 신뢰할 수있는 출처 "http://99designs.com/help/whats-the-difference-between-photoshop-and-illustrator"의 더 나은 설명입니다.

"궁극적으로 어떤 도구를 사용할지 결정하는 것은 콘테스트 주최자가 처방해야하지만 일반적으로 Illustrator는 로고 및 인쇄 작업에 사용해야하지만 Photoshop은 웹 디자인 및 컴퓨터에서만 볼 수있는 모든 디자인에 사용해야합니다. 화면."

"슬라이스"가 필요한 경우 Dreamweaver로 이동하지 않고 Photoshop을 직접 사용할 수 있습니다.

필요한 그래픽 부분을 선택하고 한 번에 하나씩 웹에 저장하여 포토샵에서 자동 및 수동으로 두 가지 슬라이스 방법이 있습니다.

HTML을 생성하면서 "자동으로 분할"할 때마다 코드를 제어하지 않기로 결정합니다. 커리어가 시작되면 괜찮아요, 배우고 있지만 코드를 알아야 할 시점에 도달 할 것입니다. 자신의 HTML과 CSS.

자동 슬라이싱이 더 유용한 유일한 순간은 이메일을 디자인 할 때 테이블 코드를 생성해야 할 때입니다.

포토샵 이미지 준비. 즉, 사이트의 내용에 관한 것입니다. 고객은 귀하의 포트폴리오 향상 비용을 지불하지 않습니다. KL

포괄적 인 웹 디자인 모형을 위해서는 포토샵을 사용해야합니다.

Illustrator 디자인은 여전히 ​​Photoshop 디자인에 비해 처리 속도가 느립니다.

아이콘과 웹 요소를 디자인하는 경우 일러스트 레이터에서 디자인을 제안한 다음 해당 요소를 포토샵에 배치하십시오.

Photoshop에서 모형을 만들면 빠른 프로토 타입을 위해 해당 문서를 Fireworks로 쉽게 전송할 수 있습니다.

Photoshop이 더 나을 것입니다. 사용자가 슬라이스하는 데 도움이됩니다.