Editoryal ve Dergi Web Tasarım El Sanatınızı Geliştirmek için 10 İpucu
Gittikçe daha fazla gazete ve dergi yayını çevrimiçi oluyor ve web siteleri genellikle geleneksel sitelerden biraz daha fazla düşünce ve özen gerektiriyor. Editörler, yayınlarının tasarımlarına yüzyıllardır zaten çok fazla önem ve dikkat gösteriyorlar, bu nedenle dergi web tasarımına aynı düzeyde kaliteyi getirmek istemeleri doğaldır.
Ancak, bu yayınların ilgilenmesi gereken tek şey üslup değildir.
Ayrıca işlevsellik ve kullanıcı deneyimini de dikkate almaları gerekir. Bu nedenle, bu tür web sitelerinin kullanımının, bakmaları kadar kolay olmasını sağlamak bir web tasarımcısı veya editoryal site sahibi olarak size bağlıdır.
En İyi 10 Editoryal ve Dergi Web Tasarım İpuçları
Bu nedenle, içerik açısından zengin bir haber veya dergi web sitesi oluşturmak veya güncellemekle görevlendirildiyseniz, burada editoryal ve dergi web tasarım zanaatınızı geliştirmek için 10 ipucu
1. Dergi Tarzı Bir Tema Kullanın
Ekstra dergi WordPress teması
Dergi web tasarımı söz konusu olduğunda, bu açık görünebilir, ancak çevrimiçi bir derginin tasarımını iyileştirmenin en iyi yollarından biri, bu amaç için özel olarak tasarlanmış bir tema kullanmaktır. Bu, özellikle WordPress kullanıyorsanız geçerlidir.
Bu dergi ve haber temaları tipik olarak, okuyucuyu bunaltmadan çok sayıda farklı makaleyi tek bir yerde görüntülemeyi kolaylaştıran iyi tasarlanmış ana sayfalara sahiptir. Diğer kullanışlı özellikler genellikle en son gönderileri görüntülemenin farklı yollarını, içeriğin kategoriye göre kolay gruplandırılmasını, geniş menüleri ve çok daha fazlasını içerir.
WordPress kullanıyorsanız, sunulan birçok çok amaçlı tema ile bu bölümde şımartılacak veya seçim yapacaksınız. Özellikle çeşitli biçimlerde gelen çok sayıda içeriğe sahip web sitelerini işlemek için oluşturulmuş olanlardan bahsetmiyorum bile.
Bunun gibi bir temaya harika bir örnek, Ekstra temamızdır. Divi Builder tarafından desteklenir ve sitenizin ana sayfasının yanı sıra kategori ve iç sayfalar için özel düzenler oluşturmayı kolaylaştırır. Ekstra tema paketinde, basılı bir dergi veya gazeteye uygun makaleler yayınlamanıza olanak tanıyan önceden oluşturulmuş çok sayıda sayfa düzeni bulacaksınız.
Nexus, koleksiyonumuzdan dergi web tasarımı için kullanılabilecek başka bir tema örneğidir. Ekstra teması kadar yeni olmasa da, temiz, çok yönlü bir editoryal web sitesi oluşturmanın basit bir yolunu sunarak hala bir yumruk getiriyor. Extra, yaşam tarzı ve kültürel başyazılar için harika bir seçimdir, ancak Nexus teknoloji ve spor haberleri web siteleri için hala dikkate değerdir.
İster siteyi yeniden tasarlıyor olun, ister sıfırdan başlayın, doğru temayı seçmek bu süreçte önemli bir adımdır. İçeriğinizi görüntülemek için size birçok farklı yol sunan ve temiz ve okunması kolay bir tasarıma sahip olanı seçtiğinizden emin olun.
2. Kitlenizi Tanıyın ve Onlar İçin Tasarım Yapın
Tasarımınızın hedef kitleniz için doğru olduğundan emin olun
En son web tasarım trendlerini takip etmek önemlidir, ancak sitenizin görünümünü temel alabileceğiniz birden fazla dergi web tasarım stili olduğunu hatırlamak da önemlidir. Hedef kitlenizi veya müşterinizin hedef kitlesini tanımak, özellikle editoryal siteler için her başarılı web tasarım projesinin başladığı yerdir.
Popüler bir mizah sitesi olan Cracked.com, "Film Evrenlerinin 20 Kuralı (Gerçek Hayatta Asla Olmayacak)" gibi mizahi fotoğraflar ve başlıklarla dolu satırlar ve makalelerle dolu bir ana sayfa tasarımına sahiptir. Öte yandan, sanat ve tasarım için çevrimiçi bir başyazı olan Loppist, ekranın üst kısmında büyük bir arka plan fotoğrafı ve altında minimum içerik ile daha zarif bir site tasarımına sahiptir.
Dergi web tasarımının hiçbir tarzı doğru ya da yanlış değildir ve her ikisi de yayınladıkları içerik ve hedef kitleleri için iyi çalışır.
Bu yayınlar, okuyucularının farklı zevk ve beklentilerine uygun ana sayfalar ve makale düzenleri tasarlamayı kolaylaştıran hedef kitlelerinin kişiliklerini bilir.
3. Daha Büyük ve Daha Cesur Görüntüler Kullanın
Görsellerinizle yaratıcı olun – görsel Naghiyev / Shutterstock.com
Başyazılar, dergilerinde onlarca yıldır büyük ve cesur görseller kullandılar, ancak web, varlığının çoğunda daha küçük görsellere bağlı kaldı. Geçmişte bu, basit bir tercih meselesi olmaktan çok, ekran boyutları ve indirme hızları gibi daha pratik nedenlerle olmuştur.
Ancak, zaman değişiyor ve internetin kısıtlamaları yavaş yavaş ortadan kalkıyor. Bu nedenle doğru zamanda doğru görseli kullanmanın gücünü gözden kaçırmamalısınız. Yüksek kaliteli, iyi optimize edilmiş görüntüleri haber veya dergi sitesi tasarımınızın odak noktası yapmaktan korkmayın.
Kendi fotoğraflarınızı çekemiyorsanız, stok fotoğrafları kullanın, ancak onları seçerken daha stratejik olun. Makalenizin mesajını okuyucularınıza iletmeye yardımcı olan göz alıcı, iyi hazırlanmış görseller bulmak için Shutterstock veya iStock gibi kaliteli siteleri kullanın.
Unsplash ve Gratisphotography gibi telifsiz siteleri bile kullanabilirsiniz. Aslında, projeniz için ücretsiz, yüksek kaliteli görseller bulabileceğiniz pek çok yer var.
Stok görsel kullanmaya karar verirseniz, makaleniz için bir stile veya temaya bağlı kalmaya çalışın. Örneğin, burada Elegant Themes'ta, genellikle illüstrasyonlar veya fotoğraflar yerine vektör görselleri kullanmayı tercih ediyoruz.
Bu fotoğrafları belirli makaleler için büyük başlık resimleri olarak kullanmaktan korkmayın. Yaratıcı olun, böylece siz veya müşteriniz doğru görsel efektleri kullanarak daha iyi hikayeler anlatabilirsiniz. Her yeni gönderi oluşturduğunuzda, durun ve ana görselinin bir dergi kapağı olarak gösterilmeye değer olup olmadığını düşünün.
Doğru WordPress dergi temasını seçmeye geri dönersek, en iyileri WordPress yazı düzenleyicisinin kısıtlamalarından kurtulan sayfa düzenleri oluşturmanıza izin verecektir. Bu, makaleleriniz için metin ve görüntüleri harika bir etkiyle birleştiren düzenler tasarlamanıza olanak tanır.
4. Birden Çok, İyi Tasarlanmış Yazı Tipi Kullanın
Tipografinin gücünü hafife almayın – görsel Oleksii Badusov / Shutterstock.com
Web dostu yazı tiplerini kullanmak hala çok önemlidir. Giderek daha fazla insan mobil cihazlar aracılığıyla haber tüketiyor, bu da yazı tiplerinizin çok çeşitli ekran boyutlarında harika görünmesi gerektiği anlamına geliyor. Ama hepsi hakkında endişe orada değil.
Özellikli görseller, kullanıcıları bir makaleye tıklamaya teşvik etmenin en iyi yollarından biridir. Ancak, iyi seçilmiş yazı tiplerinin gücünü hafife almayın. Sitenizin tasarımında oyunun kurallarını değiştiren eklemeler olmayabilirler, ancak büyük bir rol oynarlar.
Tek bir sayfada birden çok yazı tipi kullanmayı da düşünmelisiniz. Makalenizin başlığı için bir yazı tipi, başlıklar için başka bir yazı tipi ve paragraflar için üçüncü bir yazı tipi kullanın. Birbirini tamamlayan ve yapmayan yazı tiplerinin bir karışımını denemeyi deneyin.
Bugün içerik tüketmek için kullanılan cihazların çeşitliliği nedeniyle, 2016'da ortaya çıkan bazı heyecan verici tipografi eğilimleri var, bu nedenle web sitenizi denediğinizden ve içeriğinize en uygun olanı gördüğünüzden emin olun.
5. Büyük Görüntüleri İyi Seçilmiş Yazı Tipleriyle Birleştirin
Görüntüleri ve metni birleştirmeyi deneyin

Büyük ve cesur görselleri iyi tasarlanmış yazı tipleriyle birleştirdiğinizde, editoryal içeriklerin hayat bulmasını sağlayacak göz alıcı görseller oluşturabilirsiniz. Domani Studios'un bunu ana sayfasında nasıl yaptığına bir göz atın. Bir gönderinin genel mesajını öne çıkarmak için bir makalenin özelliği veya başlık resmi için aynı tekniği kullanabilirsiniz.
Her zaman büyük, kalın yazı tipleri olması da gerekmez. Yayınınız için en iyisinin ne olduğunu görmek için tasarımlarınızla oynayın. Örneğin, hafif bir yazı tipi, üst düzey, sofistike bir moda dergisi için daha iyi çalışabilir.
6. Bir Izgara Sistemi Kullanın
Izgara düzenleri harika bir etki için kullanılabilir
Editoryal dergiler on yıllardır geleneksel yayınlarda ızgara sistemlerini kullandılar, bu nedenle web tasarımcılarının bu uygulamayı tasarımlarına dahil etmeleri doğaldır. Izgara sistemi, içeriği görsel olarak çekici ve kullanıcının tüketmesi daha kolay bir şekilde görüntülemek için yatay ve dikey çizgiler kullanan, genellikle bir web sitesinin ana sayfası olan bir sayfa için bir yapıdır.
Kendi ızgara sistemlerinizi tasarlamak için sayfa oluşturucuları kullanabilirsiniz ve buna Divi Builder dahildir. Dergi web tasarımınızı geliştirmenin basit bir yolunu istiyorsanız, Tom'un en iyi WordPress ızgara eklentileri hakkındaki gönderisine göz atın.
Görsel olarak en çekici ızgara sistemleri metinden daha fazla resim kullanır, bu nedenle izleyicilerinizin beğeneceği ve ızgara sistemlerini kullanırken arkasındaki hikayeyi bilmek isteyeceği çekici küçük resimler kullandığınızdan emin olun.
7. Beyaz Alanı Kucaklayın
Beyaz boşluktan korkma
Beyaz alan, dergi web tasarımı dünyasında ve genel olarak çevrimiçi tasarımda büyük bir hayır-hayırdı. Tasarımcılar, özellikle grafik tasarımcılar, beyaz alanın “boşa harcanmış alan” olması nedeniyle mevcut her ons beyaz alanın kullanılmasını savunan katı bir kurala bağlı kaldılar. Bu büyük bir sorun yaratır – dağınıklık.
Beyaz boşluk olmadan, sizin veya müşterilerinizin harika başlıklar ve göz alıcı görseller tasarlamak için harcadığı tüm zaman, bu boşluksuz tasarımların sunduğu karmaşa içinde boşa harcanabilir. Beyaz alanı benimseyin ve okuyucuya dikkatlerini nereye odaklaması gerektiğini göstermek için kullanın.
Örneğin, Medium'u alın. Bu site, makalelerde kenar çubukları göstermez ve sayfalarda çok az ek öğe kullanır. Reklamlar, e-posta katılım formları ve diğer unsurlarla dikkati dağıtmak yerine, okuyucunun dikkatinin odaklanması gereken tek bir şey vardır – içerik.
8. Google'ın Materyal Tasarımını Kullanın
Google Materyal Tasarımını benimsemeye hazır olun
Randy Brown'ın 2016'daki web tasarım trendleri tahminini okursanız, Google'ın Materyal Tasarımının bu yıl önemli bir oyuncu olacağını ve editör tasarımcılarının dikkat etmesi gerektiğini bilirsiniz.
Google tarafından 2014'ün sonlarında Android cihazlarda kullanılmak üzere tanıtılan Materyal Tasarımı, düz tasarıma yeni bir bakış. Temel olarak, tipik olarak düz elemanlara fazladan bir veya iki katman verir, böylece tamamen düz olmazlar ve bu popüler tasarım trendine yeni bir soluk getirir.
Bu, öğeleri kartlara dönüştürür, böylece birbirlerinden farklılaşırlar. Bunu dergi web tasarım stratejinize dahil etmenin harika bir örneği, makale listeleri gibi ana sayfa öğeleri için kullanmaktır. Yukarıdaki resimde görebileceğiniz gibi, Wired bu tasarımı ana sayfalarındaki farklı makaleleri görsel olarak ayırmak için kullanır. Makale kartlarında, üzerlerine geldiğinizde bir "kaldırma" animasyonu bile var.
Bu dergi web tasarım trendi, web tasarımcılarına, standart bir düz tasarımın sunduğu tipik seçeneklerden daha görsel olarak çekici bir şekilde, bir sayfadaki iki veya daha fazla öğe arasında ayrım yapma seçeneği sunar.
9. Zarif Mikro Etkileşimler Kullanın
Daily Beast kenar çubuğundaki mikro etkileşimlere örnek
Dan Virgillito'nun 2016'da tasarımcıların bilmesi gereken beş UX trendi hakkındaki gönderisinde, editoryal web sitelerinde harika çalışan iki harika mikro etkileşim örneğinden bahsetti.
Mikro etkileşimler, bir kullanıcının bir web sitesinde gezinmesine yardımcı olan küçük küçük etkileşimlerdir. Bu, bir web sayfasının sağ alt köşesinde, kullanıcıyı tıklandığında doğrudan sayfanın en üstüne götüren küçük bir düğme içerebilir.
Dan'in verdiği mükemmel bir örnek, kullanıcının bir makalede ne kadar ilerlediğini bilmesini sağlayan bir ilerleme çubuğudur. Daily Beast bunu, her makaleye eşlik eden Bu Listeyi Oku kenar çubuğu özelliğinde kullanır. Bu özelliği dergi web tasarımınıza eklemek, kullanıcıları içeriğinizle mümkün olduğunca uzun süre meşgul tutmanın harika bir yoludur.
10. Kutu Dışı Önemli Bilgiler
Okuyucuları cezbetmek için ara kutularını kullanın
Bazı yayınlar, önemli bilgileri bir kutuya koymaktan ve okuyucunun daha kolay sindirebileceği bir şekilde bir makalenin yanında görüntülemekten yeterli miktarda faydalanabilir. Bu uygulama, yemek pişirme web sitelerinde popülerdir ve içerik listelerini kenar çubuklarında veya makalenin kenarlarına yakın bir yerde görüntülemek için etkili bir yol sağlar.
Ayrıca, yaratıcı web siteleri tarafından, bir okuyucunun bir Kendin Yap projesini tamamlamak için ihtiyaç duyacağı malzemelerin bir listesini görüntülemenin bir yolu olarak da kullanılabilir. Editörler, sitelerinde nasıl yapılır makaleleri üretiyorlarsa bu aynı uygulamaları kullanabilirler, ancak bunları kullanmanın başka yolları da vardır.
Örneğin, tersine çevrilmiş piramit yöntemini kullanan yayınlar, bir makalenin ana noktalarını ve gerçeklerini bu kutulardan birinde göstermeyi yararlı bulabilir, ancak daha sonra bu noktaları ve gerçekleri detaylandırmak için tüm makaleyi kullanabilir.
Bazı ek içeriklerle çıkmak, makalenizi desteklemek ve web sitenize göz atan herkesi çekmek için okuyucularınıza kolayca sindirilebilir bilgiler sağlamanıza yardımcı olabilir.
Dergi Web Tasarımı Üzerine Son Düşünceler
Stil, bu tür web sitelerinde dikkate alınması gereken en önemli unsurlardan biridir ve bunun iyi bir nedeni vardır. Yayınlanan her içerik parçası da dahil olmak üzere tüm yayın, bu stil etrafında döner. Bu nedenle, bir tasarımcı olarak bu stili uygularken işlevselliği ve sitenin genel kullanıcı deneyimini göz önünde bulundurmanız çok önemlidir.
Bir editoryal siteye her yeni tasarım eklediğinizde, bunun sitenin kullanıcı deneyimini nasıl etkileyeceğini düşünün. Örneğin, arka plan videoları harika görünüyor, ancak mütevazı bir internet bağlantısına sahip bir kullanıcının içeriğinizi yüklemesini engellediğinde bir web sitesine getirebilecekleri faydalar hızla buharlaşıyor.
En sevdiğiniz çevrimiçi dergi web tasarımlarından bazıları nelerdir? Aşağıdaki yorumlarda bize bildirin.
Dacian G / Shutterstock.com'dan makale küçük resmi
ev borcu WordPress sitesi