Harika Portföy Sayfalarına Sahip 10 Divi Sitesi

Yayınlanan: 2018-07-26

Portföy sayfası, hizmet veren herkes için en önemli sayfalardan biridir. Yalnızca yaptığınız işin türünü göstermekle kalmaz, aynı zamanda ziyaretçiye uzmanlık düzeyinizi ve birlikte çalıştığınız müşterileri de gösterir. Portföy sayfaları birçok farklı şekilde tasarlanabilir. Bu yazıda, bir sonraki Divi tasarımınız için size ilham vermek için harika portföy sayfalarına sahip 11 Divi web sitesine bakacağız.

Portföy sayfaları genellikle standart portföy, filtre portföyü veya tam genişlikte portföy modüllerini içerir. Ancak, portföyünüzü göstermenin başka yolları da var. Bazıları portföyü görseller, tanıtım yazıları veya galeriler gibi öğelerle oluşturur. Tabii ki, bunun sayfa düzeni içinde iyi çalışması gerekiyor. Her birinin örneklerini göreceğiz.

Beğendiğim bölümün bir resmini göstereceğim ve neleri sevdiğimi tartışacağım. Web siteleri belirli bir düzende değildir. Divi'yi kullanarak kendi portföy sayfanızın seviyesini yükseltmenize yardımcı olacak birkaç bağlantı için sonuna kadar bekleyin.

1. Nimet Yaratıcı

Bu site, bir teklif göstermek için tam genişlikte bir bölümün ardından kahraman bölümünde geçiş yaparak açılan hizmetlerin bir listesini görüntüler. Portföy bölümü, solda hizmet kategorilerini, müşterinin adını ve müşteri tanımını ve sağda proje resimlerini gösterir. Portföy öğelerinin her biri ince bir bölücü ile ayrılır. Web sitesi örnekleri, canlı web sitesini görüntülemek için bağlantılar içerir.

Web Sitesine Bakın

2. yuvarlak mandal

Bu site, portföy öğelerini üç sütunda gösterir ve tek bir sütunda bir bölüm içerir. Üç sütun bölümü, her projenin görüntülerinin üzerine müşterinin logosunun beyaz olduğu bir kaplama yerleştirir. Alt köşelerdeki beyaz çizgili simgeler proje kategorisini gösterir. Tek sütun bölümü, desenli bir arka plan üzerinde metin ve bir düğme ile projenin bir görüntüsünü gösterir. Üçüncü bölümün altında, her kategoride daha fazlasını görmek için bağlantılar sağlar.

Web Sitesine Bakın

3. Leo Whou Teng

Bu sayfa, portföy öğelerini, resimler arasında boşluk bırakmadan çok sütunlu bir düzende yerleştirir. Bunlardan herhangi birinin üzerine gelindiğinde, görüntünün üzerinde mavi bir kaplama ve altta projenin adını ve kategorilerini gösteren bir kutu görünür. Portföy iki ve üç sütun içerir ve düzeni değiştirir. Görüntüler farklı arka planlar kullanır ve projelerin görüntülerini farklı cihaz türlerinde gösterir. Bu site, renkleri mükemmel bir şekilde kullanıyor.

Web Sitesine Bakın

4. Studinger Medya Grafikleri

Bu site, tek renkli kaplamada zar zor görünen zarif bir arka plan resminin üzerinde şirketin logosu, adı ve sayfa başlığı ile portföy sayfasını tanıtır. Portföy bölümü, filtre için stilli düğmeler kullanır ve projeleri üç sütunlu bir ızgarada gösterir. Gezinme görüntüyü döndürür ve bir bağlantı sağlar. Sayfada ayrıca bir harekete geçirici mesaj, iletişim formu ve sitenin markasıyla eşleşen QR kodu ve sosyal takip düğmeleri içeren açıklayıcı bir alt bilgi bulunur.

Web Sitesine Bakın

5. Catherine Cliffe

Bu portföy sayfası, paralaks içinde bir bindirme içinde başlık ve açıklama içeren tam ekran bir görüntü gösterir. Kaydırma, projenin adı ve konumu ile ilgili kişilerin adlarını içeren bir metin bölümünü ortaya çıkarır. Bunu, tam ekran ve üç sütunlu bir ızgarada görüntüler içeren bir galeri. Diğer projeler, iki veya üç sütunlu bir ızgara içinde gösterilen resimlerle benzer bir model izler.

Web Sitesine Bakın

6. Süper İlahi Web Tasarımı

Bu, her projeyi numaralandırır ve şirketin logosunu ve sağlanan hizmetleri, elle yazılmış bir yazı tipiyle projenin başlığını, projenin kısa bir açıklamasını ve projeyi canlı görmek için bir düğmeyi içeren bir resim görüntüler. Başlık metni, kenarlık ve düğme renkleri sitenin markasıyla eşleşir. Bunu takiben bir çevrimiçi rezervasyon uygulamasına yönelik bir CTA var.

Web Sitesine Bakın

7. Web Tasarımını Alın

Bu portföy sayfası, Pinterest'e benzer proje resimleri yükler. 4 veya 5 sütunlu bir ızgarada görüntülenirler (ekran boyutunuza ve yakınlaştırma düzeyinize bağlı olarak). Herhangi bir projenin üzerine gelindiğinde bir büyüteç ortaya çıkar. Buna tıklamak, görüntüyü bir ışık kutusunda açar. Görüntülerin çoğu, web sitelerinin eksiksiz düzenleridir, diğerleri ise kahraman alanıdır.

Web Sitesine Bakın

8. Caporal Pazarlama Dijital

Bu portföy sayfası, sitenin markalı renkleriyle eşleşen ilginç bir kenarlıkla başlık, kısa açıklama ve düğme ile tam genişlikte bir resim görüntüler. Kaydırma, filtrelenmiş portföyü üç sütunlu bir ızgarada gösterir. Portföy, müşterinin logolarını, üzerine gelindiğinde renkli olarak görüntülenen monokrom olarak gösterir. Ayrıca müşterinin adını ve sağlanan hizmeti de içerirler. Soldaki satır, sosyal ağların adlarını metin halinde yana doğru gösterir. Kaydırmada ekranda kalırlar.

Web Sitesine Bakın

9. Kudretli Tilki

Bu sayfa, koyulaştırılmış bir kaplamaya sahip tam genişlikte bir arka plan ve sayfanın başlığını görüntülemek için zarif bir yazı tipi ile tanıtıldı. Filtrelenen portföy, müşterinin logolarını monokrom olarak görüntüler. Projelerden herhangi birinin üzerine gelmek, farenin geldiği yönden bir bindirme getirir. Yer paylaşımı, projeyi canlı görmek için bir bağlantı ile birlikte şirketin adını ve sağlanan hizmetleri görüntüler. Bunu bir CTA, paralaksta bir arka plan görüntüsü ve bir referans kaydırıcısı, sosyal takip düğmeleri ve bir Instagram beslemesi içeren iki sütunlu bir bölüm izler.

Web Sitesine Bakın

10. Vaka

Bu, önce mobil için geliştirildi. Sayfa, başlık ve açıklama içeren ekstra büyük metin içeren büyük bir bölümle tanıtılır. On scroll ve ticker sayfanın alt kısmında belirir ve bu konumda ekranda kalır. İmleç, bir görüntünün üzerine geldiğinizde büyük bir oka dönüşür ve büyük bir ele dönüşür. Projeler iki sütun halinde görüntülenir. Sayfa ayrıca hizmetlerin bir listesini, iletişim formunu ve haber bülteni katılımını içerir. Altbilgi, kaydırmada ortaya çıkar ve metnin kesilen bölümü boyunca gösterilen videoyu görüntüler.

Web Sitesine Bakın

Biten Düşünceler

Bu, bir sonraki Divi web siteniz için size ilham vermeye yardımcı olacak harika portföy sayfalarına sahip 11 Divi web sitesine bakışımız. ET blogunda özellikle portföylere veya tanıtım yazıları, resimler veya galeriler gibi öğelere odaklanan birçok makale var.

İşte sadece birkaçı:

  • Divi ile Örnek Olayları Düzenlemek için Filtrelenebilir Portföy ve Gezinme Sonrası Nasıl Kullanılır
  • 3 Ücretsiz Güzel Proje Sayfası Düzeni (& Divi Builder ile Daha Fazla Nasıl İnşa Edilir)
  • Portföy Sitenizin Etkinliğini Ölçmek için Divi Lead'leri Nasıl Kullanabilirsiniz?
  • Divi ile Minimal Portföy Ana Sayfası Nasıl Oluşturulur
  • Minimal Portföy Ana Sayfasını Genişletmek için Filtreleri, Kahraman Bölümlerini ve CTA'ları Kullanma
  • Ücretsiz Divi İndirme: Ana Sayfa Portföy Düzen Paketi
  • Ücretsiz Divi İndirme: Yaratıcı Tek Sayfa Portföy Düzeni Paketi
  • Blurbs Bloom yapmak için Divi's Fold Animasyonunu Kullanma
  • Hover.css Kullanarak Divi'nin Blurb Modülüne Gelişmiş Hover Efektleri Nasıl Eklenir
  • Divi'nin Blurb Modülüne Stil Vermenin 5 Eğlenceli Yolu
  • Divi Galeri Modülü ile Gri Tonlamalıdan Renkliye Galeri Oluşturma
  • Arka Plan Görüntüleriyle Eşsiz Bir Üst üste Binen Efekt Nasıl Oluşturulur
  • Resimlerinizi Güzelleştirmek için Divi'nin Yeni Filtre Seçeneklerini Nasıl Kullanabilirsiniz?

Senden duymak istiyoruz. Harika portföy sayfalarına sahip bu web sitelerinden hangileri favorileriniz? Yorumlarda bize bildirin.

Graphic farm / Shutterstock.com aracılığıyla Öne Çıkan Görsel