Et dans le post invité TurboBlog. Cette fois, nous avons le plaisir de vous proposer du matériel préparé par Julia Solntseva — notre rédacteur indépendant. Dans son premier article pour notre blog, Julia a partagé sa propre vision de la conception Web minimaliste et l'a étayée par des exemples convaincants. Cependant, il vaut mieux voir une fois que d'en entendre parler plusieurs fois.

Aujourd'hui, sur le marché de l'art commercial, le désir d'une forme minimaliste de présentation de l'information devient de plus en plus clair. Et cette tendance n'est pas nouvelle. C'est une conséquence logique du développement et du changement d'étapes de l'art. Une fois, dans les années 60, le minimalisme s'est déclaré pour la première fois comme une direction artistique distincte. Son apparition est une protestation, une réaction au triomphe absolu de l'expressionnisme à cette époque, et surtout de sa forme exagérée - l'expressionnisme abstrait.

Le monde moderne traverse différentes étapes de développement des technologies Internet. L'ère du web 1.0 est révolue - l'ensemble de ce qu'était et de ce qu'était Internet avant l'avènement des technologies du web 2.0, dont nous sommes tous avec vous les participants et les créateurs directs.

Récemment, des chercheurs dans le développement des technologies Internet, menés par Jason McCabe Calacanis, le leader de Netscape.com, nous prophétisent l'avènement d'une nouvelle ère - le web 3.0, dont les spécificités, mis à part le fait qu'Internet deviendra plus socialement orienté, ils n'ont pas été en mesure de formuler la conception web moderne est impossible sans tenir compte des spécificités de chaque étape de la technologie web et du design qui l'a visualisée.

La première étape du développement du design à l'ère du Web 1.0. étaient caractéristiques :

• des couleurs flashy, principalement issues de la palette web safe ;
• jaune omniprésent;
• contraste incroyablement ennuyeux, comme le blanc sur le bleu ou le rouge sur le noir ;
• une image au lieu d'un arrière-plan et, par conséquent, une illisibilité complète du texte;
• l'absence d'une structure claire de la grille modulaire, et dans les cas particulièrement graves - la grille modulaire elle-même.

Voici à quoi ressemblaient les sites Web des entreprises célèbres dans les années 90 :







Les designers ne connaissaient et n'aimaient qu'une seule police - Comic Sans.Mais il faut rappeler que le design a évolué en parallèle avec les technologies Internet. Les designers n'avaient nulle part et personne de qui apprendre - ils étaient des pionniers.

Puis, au tournant des années 90 et 2000, l'évolution du design et du graphisme entraîne une course à la créativité. Il y a quelques années à peine, les concepteurs ont fait de leur mieux pour retenir l'attention du visiteur avec des leurres visuels, qu'il s'agisse d'un flash impressionnant ou d'une 3D réaliste. Des formes abstraites et une interface non standard - tout cela, bien sûr, a attiré l'attention de l'utilisateur, mais l'a en même temps distrait du contenu du site, à propos duquel la plupart des sites ne remplissaient pas leur fonction première - informer. En conséquence, aujourd'hui, Internet est sursaturé de modèles créatifs, ce qui a créé de nombreux sites du même type.

C'est vrai ce qu'on dit : à notre époque, pour être différent, il faut être simple. Et le minimalisme répond dans une certaine mesure à ces exigences. Comme autrefois en peinture, le minimalisme dans la conception Web aujourd'hui est une tentative de retirer le contenu du bruit de l'information, placer des accents, former un schéma clair de perception. Un design lumineux est capable de garder l'attention du visiteur, minimaliste - pour le diriger dans la bonne direction.

Principes de base de la pensée minimaliste :

• rejet de la subjectivité de la perception ;
• rejet du symbolisme et des formes métaphoriques ;
• clarté géométrique étonnante;
• équilibre des contrastes;
• surfaces neutres, textures douces.

Designer paresseux ou designer minimaliste ? Comment reconnaître les talents ? Pour former un système de perception, les designers minimalistes utilisent certaines méthodes. En savoir plus sur eux.

Utilisation minimale de graphiques ne doit pas signifier son absence.

Simplifier les graphiques au minimum- l'une des principales techniques du minimalisme, tandis que les graphismes minimalistes doivent avoir leur propre style et message sémantique.




couleur de fond discrète, essentiellement - diverses variantes de la combinaison de noir et blanc, ou principalement de couleurs claires, qui créeront un style commercial du site et évoqueront ainsi un sentiment de confiance, de fiabilité, de stabilité et de sérieux chez les utilisateurs. une information important Couleur.


Clarté de grille modulaire- C'est important. Les informations qui ont une structure claire sont facilement perçues et mémorisées.rnL'utilisation d'une grille modulaire et de guides facilitera non seulement la structuration de tous les éléments de conception les uns par rapport aux autres, mais économisera également beaucoup de nerfs pour le maquettiste, qui calculera les dimensions de tous les éléments du substrat beaucoup plus rapidement.








Navigation conviviale. La navigation, simplifiée au minimum, accélérera le processus de recherche d'informations et de compréhension de la structure du site. C'est l'un des moyens élémentaires de transmettre rapidement des informations au visiteur. Les concepteurs de sites Web ont souvent recours à une navigation simple.


Dans le vrai sens du terme - supprimer tout ce qui est inutile.Moins de graphiques. Si vous décidez d'utiliser du matériel photographique, faites-en une illustration claire du type d'activité de l'entreprise.


Palette. La sélection correcte de la palette est très importante pour la formation de la perception nécessaire des informations. Le minimalisme n'est pas synonyme de simplicité et de matité, ou pas de couleur du tout, le minimalisme est un style de présentation de l'information. Les historiens de l'art ne donnent que des conseils stylistiques, et tout le reste est une question de goût du concepteur de sites Web et des préférences du client.




Conception simplifiée, nous retirons la police en premier lieu. Si le contenu du texte est primordial pour vous, la police pour le design est "king and god". Expérimentez non seulement avec les types de polices, mais aussi avec les intervalles, les couleurs. Il y a quelques faits intéressants sur les polices. Naturellement, le concepteur, travaillant avec des polices, souhaite que son site soit original. Mais la vérité est que la plupart des utilisateurs qui ont la chance de visiter ce site n'ont que polices système, et 99 % ont des polices Systèmes Windows. L'expérience a donc ses limites logiques, utiliser le cas échéant des polices non standard : logos, inscriptions.

Portée du minimalisme dans la conception Web Quant à moi, le minimalisme, en principe, n'a aucune restriction quant à la portée de son application. Mais la pratique consistant à utiliser cette direction s'est développée de telle manière que le plus souvent
Les concepteurs Web utilisent ce style lors de la création des sites suivants :

site carte de visite, portfolio:




Site Web d'entreprise:


Des couleurs sobres et le rejet des fioritures, une navigation facile, des informations clairement structurées et l'accent mis sur le contenu aideront à créer un style commercial.

blog / page personnelle:




Fondamentalement, les principes de conception d'un blog et d'une page personnelle sont les mêmes que les principes de conception d'un site Web. Mais il y a des différences qui sont fixées par la nature même de la blogosphère : un menu latéral, une navigation simplifiée, la place principale est donnée au texte. bon exemple, qui illustre les principes de conception de blogs, peut être le style du site Facebook. Rien ne doit distraire l'utilisateur de l'information et de la communication :


Il convient de rappeler que lors de l'utilisation d'un style minimaliste dans la conception, il est également nécessaire de prendre en compte les spécificités des polices, des schémas de couleurs et de l'identité visuelle de l'entreprise dans son ensemble.

Bien sûr, l'attitude envers le minimalisme dans la conception Web, ainsi que envers le minimalisme dans l'art, peut être différente pour différentes personnes : de l'admiration complète au rejet complet. Le client peut ne pas aimer la nouvelle vision actuelle de l'artiste, il peut lui sembler que le designer n'a tout simplement rien fait, mais le fait que la mode du minimalisme ne fait que prendre de l'ampleur reste un fait. Ainsi, par exemple, un style populaire en architecture et en design d'intérieur - la haute technologie - utilise largement des techniques minimalistes :


De nombreux photographes préfèrent ce genre de photographie, en particulier les lomographes. Utiliser l'espace vide comme attribut principal pour attirer l'attention est la principale technique du genre :






Et enfin, je voudrais exprimer la devise des designers minimalistes, qui exprime très bien l'essence de la direction minimaliste de la conception Web - "Faire plus avec moins".

On le retrouve souvent dans les éléments de mises en page plates (Flat) ou dans la conception matérielle (Material Design). Le concept de base et les caractéristiques restent pratiquement inchangés dans le temps, par exemple :

• Beaucoup de gens préfèrent créer des projets dans des combinaisons de couleurs à prédominance blanche et noire.
• En règle générale, les concepteurs laissent beaucoup d'espace libre, en particulier dans les zones autour de l'image centrale.
• Des polices sans empattement sont également utilisées.

Les points ci-dessus ne sont pas les principales exigences d'un design minimaliste, mais ils sont assez courants et peuvent servir d'indicateur de style, quelle que soit la période.

Ce qui est vraiment important dans minimalisme moderne, est un accent particulier sur un type de contenu, sans concurrence avec d'autres éléments. Il peut s'agir d'une photo, d'un logo ou d'un simple bloc de texte.

La navigation, Coordonnées et d'autres objets sont presque toujours moins visibles dans la mise en page (bien qu'ils puissent être présents dans la vue ou apparaître sur le défilement).

uppertodo.com

Récemment, les concepteurs ont également commencé à incorporer l'animation dans ce type de sites, suivant et voulant rendre une page Web plus "vivante" et interactive. Cependant, vous devez être extrêmement prudent avec cela. L'animation doit être discrète et réalisée dans le même style (couleurs, police, etc.) que la conception principale.

Une autre tendance majeure du minimalisme est la taille du texte. Les interprètes préfèrent un calibrage précis - des lettres super petites ou géantes avec des arrière-plans contrastés et images simples. Un contraste élevé est idéal pour créer une mise au point dans une structure simple et mettre l'accent sur le « bon » contenu.

Avantages du design minimaliste

Passons maintenant aux plus intéressants, à savoir les avantages de cette direction et leur utilisation dans des projets réels.

1. Manque de clinquant et de désordre

Ce qui est excessif n'est pas sain. Lors de la création d'une mise en page, il est très facile de se laisser emporter, d'inclure tout ce que vous pouvez et d'obtenir ainsi un "mauvais plat avec de bons ingrédients". Comme nous l'avons dit plus haut, l'un des principes les plus importants du minimalisme est de ne pas encombrer le site d'objets inutiles dont l'utilisateur peut se passer. Chacun des éléments peut être beau et fonctionnel en soi, mais lorsqu'ils sont assemblés, ils deviennent gênants et gâchent l'image globale.

motocms.com

La première chose à laquelle nous prêtons attention est le bloc central contrasté et l'en-tête de texte. De plus, le regard se porte sur les catégories/services de l'entreprise, où le visiteur peut immédiatement trouver ce dont il a besoin. Rien de plus. Grâce à cela, la mise en page est très populaire.

En supprimant les détails inutiles et en les simplifiant, vous obtenez une image visuelle nette qui est facilement perçue par le public. Vous trouverez d'autres solutions similaires dans notre sélection.

En plus de réduire l'encombrement, une conception minimaliste vous aidera à vous concentrer sur les éléments les plus importants d'une page Web. En les rendant plus visibles, vous montrerez aux visiteurs du site à quoi prêter une attention particulière, et vous pourrez augmenter considérablement la conversion du projet.

3. Augmenter la créativité

Les limites d'un style minimaliste obligent en fait le designer à être plus créatif. Le plus souvent, il est beaucoup plus difficile de supprimer et de supprimer tous les détails afin que seul l'essentiel reste dans le modèle. Par conséquent, recherchez solutions simples pour la mise en œuvre la plus efficace - c'est un aspect plutôt utile de la créativité, qui contribue au développement d'une pensée non standard de l'interprète.

4. Convivialité

De toute évidence, une mise en page avec moins d'éléments est beaucoup plus facile à travailler. Par exemple, prenez le réseau social Facebook - il a un million de fonctionnalités, des milliers d'articles différents et pas mal de distractions. L'utilisateur moyen doit passer assez de temps pour apprendre à utiliser la plate-forme et à s'y comporter. Pour beaucoup, c'est vraiment difficile.

Comme alternative, pensez à quelque chose comme Tumblr ou Instagram. Les services ont également pas mal de fonctionnalités, comme tout réseau social, mais la fonctionnalité devient claire après quelques minutes passées sur le site.

Le but de cette fable est qu'un design minimaliste (et simple) est garanti pour que vos visiteurs se sentent chez eux et leur permettent de s'adapter beaucoup plus rapidement aux fonctionnalités d'un projet web.

orendasecurity.com

5. Moins de codage/développement

Lors de la création d'un modèle, il est souhaitable de réfléchir à la manière dont il "fonctionnera" par la suite sur un site réel. Si un concepteur de sites Web oublie les fonctionnalités du code et se livre à une fantaisie qui deviendra un cauchemar pour un codeur, cela ne se terminera pas bien.

D'autre part, faire une mise en page qui éviterait des souffrances inutiles lors de son intégration ultérieure est une excellente occasion pour l'interprète de démontrer ses compétences professionnelles.

En général, le style minimaliste dans la conception est beaucoup plus facile à mettre en œuvre en raison de sa simplicité et de sa structure.

6. Meilleure vitesse de téléchargement et compatibilité entre navigateurs

Lorsqu'un visiteur se rend sur un site minimaliste, il peut souvent s'attendre à ce qu'il fonctionne parfaitement dans n'importe quel navigateur. De plus, en raison du manque de nombreuses images et détails, votre ressource se chargera beaucoup plus rapidement et le contenu sera plus facile à percevoir. Ce point est très important tant pour l'impression générale du projet web que pour le référencement.

belancio.com

7. Vous aide à vous concentrer sur le contenu

Malgré le développement actif du format média, le contenu textuel est toujours hors compétition. Le design minimaliste le sert parfaitement et permet au visiteur de se concentrer uniquement sur le contenu. Cependant, il ne faut pas oublier que le contenu du site doit être clair et concis.

Résumé

Comme vous pouvez le constater, il présente de nombreux avantages, grâce auxquels ils restent populaires quelles que soient l'époque et la portée. Par conséquent, lors de la création de votre prochain projet, nous vous recommandons de porter une attention particulière à ce style. Même si vous ne souhaitez pas l'utiliser dans sa forme la plus pure, mais simplement emprunter quelques principes, il vous aidera à créer des mises en page vraiment de haute qualité.

Le style de minimalisme dans la conception Web a toujours été aimé et demandé par les concepteurs. Cependant, la légèreté apparente des sites minimalistes a un schéma strict, soumis à certaines règles et principes. utilisons examen des politiques de Smashing Magazine essayons de comprendre les principales composantes de ce style attrayant.

1. Moins c'est plus
Cette phrase est probablement la description la plus connue du style minimaliste. Il a été introduit par l'artiste Lubwig van der Rohe lors de la description de l'esthétique du minimalisme. En conception de sites Web, ce postulat est atteint en plaçant un nombre très minimal d'éléments, uniquement ceux qui sont nécessaires à une conception particulière.

2. Éliminez les choses inutiles
Cette phrase est empruntée aux auteurs de Strunk and White de leur livre The Elements of Style. Là, elle sonnait comme "Débarrassez-vous de mots inutiles". Les auteurs l'ont utilisé pour décrire la philosophie minimaliste. Appliqué à la conception Web, cela signifie ne pas inclure d'éléments inutiles dans votre conception. Pour cela, concentrez-vous sur les fonctions principales de votre site et, sur cette base, ne laissez que les fonctions et éléments nécessaires.

3. Simplifiez à la limite
Cela signifie que vous essayez de simplifier constamment la conception à la limite de la fonctionnalité et de la convivialité, au point où l'intégrité du site est violée.

4. Chaque détail compte
Dans un design minimaliste, chaque détail que vous laissez compte. C'est précisément en raison de son petit nombre et de son exclusivité que tout élément, qu'il s'agisse d'un trait autour d'une image, d'une palette de couleurs, d'un espace blanc, d'un trait tracé, tout cela déterminera le visage de votre site, ses émotions et son style.

5. Palette de couleurs minimale
Dans un design minimaliste, la couleur prend sens spécial. Choix palette de couleurs et l'accent de couleur est particulièrement important. Et, bien que de nombreux designers préfèrent les options classiques de blanc, gris et noir, il y a une place pour absolument n'importe quelle couleur dans un design minimaliste.

6. L'importance de l'espace blanc
L'espace vide (le plus souvent blanc) est la base de tout design minimaliste. C'est l'espace libre autour de l'élément qui régule sa signification dans la conception globale et détermine la hiérarchie des éléments.

7. Utilisez du gris
Le gris est fondamental dans le design minimaliste. Les nuances de gris sont utilisées comme arrière-plan, dans les images, pour écrire des textes. La couleur grise a toujours l'air élégante et avantageuse en elle-même, ainsi qu'en combinaison avec le noir et le blanc.

8. Utilisez une excellente typographie
L'utilisation de grandes typographies est une tendance puissante et intéressante. Une grande inscription peut parfaitement combiner la fonction d'un élément graphique décoratif et porter en même temps une certaine composante sémantique.

9. Utilisez des motifs et des images d'arrière-plan
Un motif d'arrière-plan subtil ou une image d'arrière-plan active peuvent ajouter du piquant et de l'intérêt à un design minimaliste.

10. Utilisation de grilles modulaires simples
Protozoaires grilles modulaires pas nécessairement de nature minimaliste, mais sans aucun doute l'un des plus moyens efficaces organiser les informations sur le site et indiquer les liens entre les blocs.

11. Utilisez des cercles décoratifs
Toutes sortes de cercles décoratifs se trouvent dans les en-têtes de nombreux modèles et sont également utilisés comme accents dans le menu de navigation.

Avec le développement des technologies Internet et de la conception de sites Web, il y a eu ces dernières années une certaine tendance (pas partout et pas pour tout le monde) à simplifier la page. Simplification de la conception et du code. Et c'est l'idée principale du minimalisme dans la conception Web, "moins c'est plus".

La partie la plus importante de la page est le contenu, donc le minimalisme élimine tout ce qui n'est pas nécessaire pour faire ressortir le contenu. Dans le même temps, le contenu, à son tour, met l'accent sur le design. Créer un tel site à première vue semble plus facile que, par exemple, un site coloré avec des titres clairs, mais ce n'est pas le cas. Ici, il est très important de maintenir la commodité de son utilisation avec le contenu minimum de la page.

Et pourtant, il est très rare qu'un site minimaliste ait l'air moche ou pas stylé. Par conséquent, le minimalisme, avec sa légèreté et son élégance, est le plus souvent utilisé dans certains sites Web d'entreprise, ainsi que dans les blogs, les portefeuilles et les réseaux sociaux.

Aujourd'hui, nous verrons des exemples de pages pour chacune de ces sections (à la fin de l'article - un aperçu des sites russes dans le style du minimalisme):

Blogues

Ici, j'ai décidé de tricher, et en même temps de vous faire plaisir - je posterai le plus intéressant gratuitement Thèmes WordPress dans le style du minimalisme, vous pouvez donc non seulement regarder, mais aussi télécharger.

Design assez standard, fond blanc et petits caractères.

Il y a déjà plus de créativité ici - nous voyons un logo intéressant et un jeu avec des polices.

Oulap

Et ici, la police est grande - et encore une fois, rien de plus.

Doc

Il y a beaucoup d'espace libre sur ce thème, il y a aussi un accent rouge.

mener

Un design plus "féminin" et plus doux, les titres sont même roses.

Ce thème combine photo et texte tout en conservant un grand nombre de air.

Et voici un arrière-plan plus intéressant.

Le dernier des thèmes a un fond noir et de petits accents. Ils donnent une certaine image à la page, tandis que l'accent est mis sur le contenu.

Portefeuille

Comme je l'ai déjà écrit, le minimalisme est idéal pour présenter votre travail - rien ne les distraira simplement !

Un design aussi simple, le logo, la photo principale et l'inscription de bienvenue sont mis en évidence sur la page.

Gris avec un design splash rouge-bleu, les accents, encore une fois, ressemblent à une photo et à un logo.

Les créateurs de cette page ont identifié des domaines de leur activité.

Conception douce et crémeuse. La mise au point est de retour sur la photo.

Il n'y a presque pas d'images, mais le logo rouge se démarque - le point le plus brillant de la page.

Ici, en général, tout est très, très petit, en effet, rien de superflu.

Une combinaison glamour de noir et de rose, plus une grande photo, définissent le caractère du site.

Sur cette page, l'entreprise expose immédiatement les travaux du portfolio, présentant le niveau de leur travail.

Sites Web d'entreprise

Le minimalisme dans la conception de leur site Web d'entreprise est choisi par les entreprises qui souhaitent mettre l'accent sur le principe de travail : "Les affaires passent avant tout".

L'entreprise a clairement décidé de se concentrer sur trois éléments de menu.

Le graphique élégant ci-dessous montre le profil de l'entreprise.

Ce site met en avant le slogan et les services de l'entreprise.

Autre exemple de site où le centre de la composition est une photo.

Sur cette page, seul le menu principal du site Web de l'entreprise est présenté à partir du texte.

Logo, prix et une courte histoire sur le produit - il n'y a rien d'autre sur la page.

PAPA

Pomme

Classiques du genre) Menu, quelques mots sur le produit et le produit lui-même.

SOFA

Encore une fois, toute l'attention est concentrée sur les produits de l'entreprise.

Des médias sociaux

Un exemple classique et avant-gardiste est facebook.

Linkedin choisit également un design minimaliste, bien que la page ait même une bannière.

L'un des nouveaux réseaux sociaux pour les designers, tout est simple et soigné. Bien que, je suppose, le profil du réseau obligeait encore les créateurs à l'embellir un peu.

Le service de bookmarking populaire essaie de ne pas distraire les utilisateurs de l'objectif principal - ajouter un lien vers les signets

Google rend toujours les choses simples.