10 sites Divi avec des pages de portfolio sympas

La page portfolio est l'une des pages les plus importantes pour quiconque fournit un service. Il montre non seulement le type de travail que vous effectuez, mais montre également au visiteur votre niveau d'expertise et les clients avec lesquels vous avez travaillé. Les pages de portfolio peuvent être conçues de différentes manières. Dans cet article, nous examinerons 11 sites Web Divi avec des pages de portfolio intéressantes pour vous inspirer pour votre prochain design Divi.

Les pages de portefeuille incluent généralement le portefeuille standard, le portefeuille de filtres ou les modules de portefeuille pleine largeur. Cependant, il existe d'autres façons d'afficher votre portefeuille. Certains construisent le portfolio avec des éléments tels que des images, des textes de présentation ou des galeries. Bien sûr, cela doit bien fonctionner dans la mise en page de la page. Nous verrons des exemples de chacun.

Je vais montrer une image de la section que j'aime et discuter de ce que j'ai aimé à ce sujet. Les sites Web ne sont pas dans un ordre particulier. Attendez jusqu'à la fin pour quelques liens pour vous aider à mettre à niveau votre propre page de portfolio en utilisant Divi.

1. Boon créatif

Ce site affiche une liste de services qui s'ouvrent en bascule dans la section héros suivie d'une section pleine largeur pour afficher un devis. La section portfolio affiche les catégories des services, le nom du client et la description du client à gauche, et les images du projet à droite. Chacun des éléments du portefeuille est séparé par un mince séparateur. Des exemples de sites Web incluent des liens pour afficher le site Web en direct.

Voir le site Web

2. piquet rond

Ce site présente les éléments du parc en trois colonnes et comprend une section en une seule colonne. Les trois sections de colonnes placent une superposition sur les images de chaque projet avec le logo du client en blanc. Des icônes tracées en blanc dans les coins inférieurs indiquent la catégorie du projet. La section à colonne unique montre une image du projet avec du texte et un bouton sur un arrière-plan à motifs. Dans la troisième section, il fournit des liens pour en voir plus dans chaque catégorie.

Voir le site Web

3. Léo Whou Teng

Cette page place les éléments du portfolio dans une disposition à plusieurs colonnes sans espace entre les images. Survoler l'un d'eux révèle une superposition bleue sur l'image et une case en bas qui affiche le nom et les catégories du projet. Le portfolio comprend deux et trois colonnes et alterne la mise en page. Les images utilisent différents arrière-plans et montrent les images des projets sur différents types d'appareils. Ce site fait un excellent usage de la couleur.

Voir le site Web

4. Graphiques multimédias Studinger

Ce site présente la page du portfolio avec le logo, le nom et le titre de la page de l'entreprise sur une image d'arrière-plan élégante qui apparaît à peine à travers la superposition en monochrome. La section portfolio utilise des boutons stylisés pour le filtre et affiche les projets dans une grille à trois colonnes. Le survol fait tourner l'image et fournit un lien. La page comprend également un appel à l'action, un formulaire de contact et un pied de page révélateur avec un code QR et des boutons de suivi social qui correspondent à la marque du site.

Voir le site Web

5. Catherine Cliffe

Cette page de portfolio montre une image plein écran avec titre et description dans une superposition en parallaxe. Le défilement révèle une section de texte avec le nom et l'emplacement du projet et les noms des personnes impliquées. Suit une galerie qui comprend des images en plein écran et une grille à trois colonnes. D'autres projets suivent un modèle similaire avec des images présentées dans une grille à deux ou trois colonnes.

Voir le site Web

6. Conception de sites Web super divins

Celui-ci numérote chaque projet et affiche une image qui comprend le logo de l'entreprise et les services fournis, le titre du projet avec une police manuscrite, une brève description du projet et un bouton pour voir le projet en direct. Le texte du titre, la bordure et les couleurs des boutons correspondent à la marque du site. Ensuite, un CTA à une application de réservation en ligne.

Voir le site Web

7. Obtenez la conception Web

Cette page de portfolio charge des images de projets similaires à Pinterest. Ils sont affichés dans une grille de 4 ou 5 colonnes (selon la taille de votre écran et le niveau de zoom). Survoler n'importe quel projet révèle une loupe. En cliquant dessus, l'image s'ouvre dans une lightbox. La plupart des images sont des mises en page complètes de sites Web, tandis que d'autres sont la zone des héros.

Voir le site Web

8. Caporal Marketing Digital

Cette page de portfolio affiche une image pleine largeur avec un titre, un slogan et un bouton avec une bordure intéressante qui correspond aux couleurs de la marque du site. Le défilement révèle le portefeuille filtré dans une grille à trois colonnes. Le portfolio montre les logos du client en monochrome qui s'affichent en couleur au survol. Ils comprennent également le nom du client et le service fourni. La ligne de gauche affiche les noms des réseaux sociaux dans un texte orienté latéralement. Ils restent à l'écran lors du défilement.

Voir le site Web

9. Le puissant renard

Cette page est présentée avec un arrière-plan pleine largeur avec une superposition sombre et une police élégante pour afficher le titre de la page. Le portfolio filtré affiche les logos du client en monochrome. Le survol de l'un des projets fait apparaître une superposition de la direction d'où vient la souris. La superposition affiche le nom de l'entreprise et les services fournis ainsi qu'un lien pour voir le projet en direct. Ceci est suivi d'un CTA, d'une section à deux colonnes avec une image d'arrière-plan en parallaxe et un curseur de témoignage, des boutons de suivi social et un flux Instagram.

Voir le site Web

10. Waka

Celui-ci a été développé pour le mobile d'abord. La page est introduite avec une grande section avec un texte extra-large qui comprend un titre et une description. Le défilement et le ticker apparaissent en bas de la page et restent à l'écran à cet endroit. Le curseur se transforme en une grande flèche et se transforme en une grande main lorsque vous survolez une image. Les projets sont affichés sur deux colonnes. La page comprend également une liste de services, un formulaire de contact et une inscription à la newsletter. Le pied de page est révélé lors du défilement et affiche une vidéo qui apparaît à travers la section de texte découpée.

Voir le site Web

Mettre fin aux pensées

C'est notre regard sur 11 sites Web Divi avec des pages de portfolio sympas pour vous inspirer pour votre prochain site Web Divi. Il y a beaucoup d'articles ici sur le blog ET qui se concentrent spécifiquement sur des portfolios ou des éléments tels que des textes de présentation, des images ou des galeries.

En voici quelques-uns :

• Comment utiliser un portfolio filtrable et une post-navigation pour organiser des études de cas avec Divi
• 3 belles mises en page de projet gratuites (et comment en créer plus avec Divi Builder)
• Comment utiliser les leads Divi pour mesurer l'efficacité de votre site portfolio
• Comment créer une page d'accueil de portefeuille minimal avec Divi
• Utilisation de filtres, de sections de héros et de CTA pour étendre une page d'accueil de portefeuille minimal
• Téléchargement gratuit de Divi: Pack de mise en page du portefeuille de la page d'accueil
• Téléchargement gratuit de Divi: Pack de mise en page de portefeuille créatif à une seule page
• Utiliser l'animation de pliage de Divi pour faire fleurir les blurbs
• Comment ajouter des effets de survol avancés au module Blurb de Divi à l'aide de Hover.css
• 5 façons amusantes de styliser le module Blurb de Divi
• Créer une galerie de niveaux de gris en couleurs avec le module Divi Gallery
• Comment créer un effet de chevauchement unique avec des images d'arrière-plan
• Comment utiliser les nouvelles options de filtre de Divi pour embellir vos images

Nous voulons de vos nouvelles. Lequel de ces sites Web avec des pages de portfolio sympas sont vos favoris ? Faites le nous savoir dans les commentaires.

Image en vedette via Graphic farm / shutterstock.com