Sıfırdan Web Sitesi Tasarlamak - Illustrator veya Photoshop?

Bir web sitesini sıfırdan tasarlıyorsam ve daha sonra dilimlemeyi ve Adobe Dreamweaver'da kodlamayı planlıyorsam, web sitesinin tasarımını Illustrator veya Photoshop'ta mı oluşturmalıyım? Neden?

Hızlı gerçek cevap: Illustrator ve Photoshop arasında, PhotoShop, raster olduğu gibi, web sitesi gibi.

Biraz daha ayrıntılı cevap: her ikisini de kullanırsınız.

Alternatif yanıt: Adobe Fireworks uygulamasını kullanmayı düşünün. Fireworks, web grafikleri üretmek için asıldığınızda kullanımı çok daha kolaydır.

Uzun sıkıcı ders cevabı:

"Slice-n-Dice" yöntemi biraz tarihlidir. On yıl önce popülerdi ama bugünlerde gerçekten önerilen yaklaşım değil. Şunu öneririm:

• Siteyi 'çizmek' için hangi uygulamayı (AI / PSD) kullanın. Yüksek sadakatle gitmekten çekinmeyin, ancak bunu sadece bir model olarak kabul edin.

• kurduktan sonra siteyi oluşturmaya başlayın. HTML / CSS / JS'ye dalın.

• gerektiğinde, ihtiyacınız olan bireysel grafik öğelerini oluşturmak için PhotoShop'a atlayın.

Neden? Photoshop'ta tasarım yapmak içinde çalıştığınız ortamı hesaba katmaz. Bu sabit bir tuvaldir ve web sabit bir tuval değildir, hatta standart bir tuval değildir. Ekibi piksel mükemmel bir fikre yönlendirir ve web piksel mükemmel değildir.

Logo ve simge oluşturmak için Fireworks veya Illustrator uygulamasını kullanın. Fotoğraf düzenleme için Photoshop'u kullanın. Diğer her şey için çok az önemlidir. Hangi grafik yazılımın kullanılacağı konusunda tartışmalar olduğunu biliyorum ama bu gerçekten kişisel bir tercih.

Ancak şunu unutmayın:

• Fireworks, PNG sıkıştırması için daha iyidir. Dosya boyutları Photoshop'tan% 20 -% 30 daha küçük olma eğilimindedir.

• Yolda biliyorsanız, site için başka web dışı içerik (tişörtler, posterler, el ilanları vb.) Tasarlayacaksınız. Vektör tabanlı bir programa başlarsanız daha iyi olur.

DA01 ile aynı fikirde değilim.

Bir web belgesinin statik bir görüntü olmaması, bir web sitesinin düzenlenmesi ve tasarlanması için bir grafik düzenleyicinin kullanışlılığı ile ilgisizdir. Tasarım modelinizin web sitenizin çalışan bir prototipi olması gerekmez (ve olmamalıdır). Tasarım maketi, sitenizin estetik tasarımını görselleştirmenize ve şekillendirmenize yardımcı olan bir belgedir.

Bir kağıdın veya beyaz tahtanın bir web belgesinin tüm dakika niteliklerine sahip olmaması, bir web sitesinin tel kafesleri için kullanılamayacağı anlamına gelmez. Benzer şekilde, tarayıcı penceresinin gerilebilmesi ve yeniden boyutlandırılabilmesi, tasarım modellerinin değeri üzerinde bir etkiye sahip değildir. Herhangi bir deneyimli web tasarımcısı, düzenin belirli bölümlerini elastik olarak planlamayı ve web teknolojilerinin sınırlamalarını dikkate almayı bilecektir. Bir mizanpajın tüm görsel unsurları hala düz bir görüntüde temsil edilebilir (daha sonra ekranda bu şekilde oluşturulur).

İkinci olarak, tasarıma parça parça yaklaşım kalite sonuçlarına elverişli değildir. Bir web düzeni tasarlıyorsunuz, yüze yakın widget değil. Tam düzenin bir maketi olmadan, temelde sonuç sonucunun nasıl olması gerektiği hakkında hiçbir fikriniz olmadan şeyleri tokat ediyorsunuz. Kompozisyona genel bir bakış olmadan gittiğinizde tek tek grafik öğelerini parça parça eklemek, iyi tasarım uygulamalarına ters düşer. Eklenecek şeyleriniz bittiği zaman değil, kaldırılacak şeyleriniz bittiğinde bir tasarım tamamlanır.

Son olarak, kodda tasarım değişiklikleri yapmak, bir model görüntüsünü değiştirmekten çok daha uzun sürer. Bu nedenle, kodlamadan önce tasarımınızı maketlerde daima planlamanız gerekir. Fireworks veya Illustrator gibi bir vektör grafik programı veya Photoshop gibi bir raster programı kullanmak size kalmış. Ancak, kodlamaya başlamadan önce tasarımınızı her zaman bir grafik düzenleyicide çekiçlemelisiniz.

İşte bunu komik bir şekilde açıklayan iyi bir yazı :) http://www.gomediazine.com/tutorials/photoshop-vs-illustrator-part-1/

burada çok güvenilir bir kaynaktan daha iyi bir açıklama var "http://99designs.com/help/whats-the-difference-between-photoshop-and-illustrator"

"Sonuçta, hangi aracın kullanılacağına karar verilmesi yarışma sahibi tarafından verilmelidir, ancak genel olarak Illustrator logolar ve baskı işleri için kullanılmalı, Photoshop ise web tasarımı ve sadece bilgisayarda görülen herhangi bir tasarım için kullanılmalıdır. ekran."

"Dilimleme" gerekiyorsa doğrudan Photoshop'u Dreamweaver'a gitmeden kullanabilirsiniz.

Grafiğin ihtiyacınız olan kısmını seçerek ve web için her seferinde bir parça kaydederek otomatik ve manuel olarak photoshop'ta 2 dilim dilimi vardır.

HTML oluştururken "otomatik olarak dilimlediğiniz" her zaman kod üzerindeki kontrolü kaybetmeye karar verirsiniz. Kariyerinizin başlangıcında sorun yok, öğreniyorsunuz, ancak kodu bilmeniz gereken bir noktaya ulaşacak, çünkü optimizasyon için gelişmiş bir metin düzenleyicide (örneğin Ultraedit yazılımı) daha iyi bir el kodudur. kendi html ve css.

Otomatik dilimlemeyi daha kullanışlı bulduğum tek an, e-postalar için tasarım yaparken tablo kodu oluşturmak zorunda olduğum zamandır.

görüntü hazır photoshop. yani sitenin içeriğiyle ilgili. Müşteri, portföy geliştirmeniz için ödeme yapmıyor. KL

Kapsamlı web tasarımı maketleri için photoshop kullanmanız oldukça açıktır.

Illustrator tasarımları, photoshop tasarımlarına kıyasla hala daha yavaş işlemeye meyillidir.

Simgeler ve web öğeleri tasarlıyorsanız, illustrator uygulamasında tasarlamanızı ve bu öğeleri photoshop'a yerleştirmenizi öneririm.

Photoshop'ta maketler oluşturursanız, hızlı prototipleme için bu belgeleri kolayca Fireworks uygulamasına aktarabilirsiniz.

Photoshop daha iyi olacak. Kullanıcıların dilimlemelerine yardımcı olacaktır.