Les meilleurs conseils et outils pour créer votre premier site WordPress

J'ai un aveu à vous faire aujourd'hui : je ne suis pas un très bon webdesigner. Je n'ai jamais eu de formation formelle, je suis complètement autodidacte. Mon métier est l'écriture, et j'ai choisi la conception de sites Web comme un élément nécessaire pour être un écrivain indépendant et ne pas avoir le budget pour un site Web approprié. J'ai décidé dès le premier jour que je préférais avoir un site Web de bricolage décent que j'aimais (mais avec quelques "erreurs" possibles) plutôt que de payer pour un site Web à petit budget que je détestais et que je ne pouvais pas ajuster au fil du temps. Nous savons tous à quel point les fournisseurs de services à petit budget peuvent être, après tout.

C'est ainsi qu'a commencé mon entrée dans le web design amateur DIY. Assez rapidement, le processus de création de site Web a suscité mon intérêt pour la conception de sites Web. Je ne suis toujours pas un « véritable designer », mais je connais suffisamment les principes de base pour optimiser mon flux de travail, me frayer un chemin autour d'un thème que j'aime et mettre en œuvre les modifications spécifiques que je souhaite.

Voici le problème : je ne suis pas (et ne le serai probablement jamais) un concepteur de sites Web professionnel. Et il peut être difficile de trouver des ressources là-bas pour les bricoleurs comme moi - des gens qui sont assez intelligents pour comprendre la plupart des choses et prêts à consacrer du temps, mais qui n'ont pas de véritables connaissances techniques.

Ce sont quelques-uns des meilleurs outils et ressources pour le concepteur de sites Web DIY que j'ai ramassés en cours de route. Si vous êtes du même avis, celui-ci est pour vous !

Créateurs de sites Web et thèmes personnalisables

Personnellement, je ne suis pas un grand fan des créateurs de sites Web - j'adore WordPress et j'aime avoir beaucoup plus de contrôle que la plupart des créateurs de sites Web. Si vous aimez l'idée du glisser-déposer pour obtenir le site exact que vous voulez sans toute l'agonie, jetez un œil au thème Divi pour WordPress. Vous pouvez également trouver un grand nombre de thèmes personnalisables pour WordPress.

Comment créer un thème enfant WordPress

Habituellement, il est presque impossible de trouver le thème parfait ; il y a toujours des modifications à faire. Alors, pourquoi ne pas simplement prendre un joli thème WordPress par défaut, comme Twenty Fifteen, et ma...

Chaque designer a son thème préféré - et le favori de ce (non) designer DIY est GeneratePress. Il peut faire à peu près tout ce que j'envisage, les modules complémentaires en valent la peine à 100% et sont donc abordables, les didacticiels vidéo répondent à 98% de mes questions et le développeur (Tom) est très actif et réactif dans les forums de support. J'utilise ce thème depuis 2 ans et je ne pourrais pas en être plus heureux.

Soigner les apparences

De nos jours, même moi, je sais qu'une conception adaptée aux mobiles et réactive est un must absolu. J'ai visité des sites Web sur mon téléphone qui n'étaient ni mobiles ni réactifs, et ce n'est pas joli. De nos jours, la plupart des thèmes ont un élément réactif - assurez-vous que le vôtre aussi. Et puis, pendant que vous êtes dans le processus de construction, utilisez un outil comme Duo, Screenify ou Browser Shots pour vous assurer que la conception de votre site sera belle sur n'importe quel appareil.

Avez-vous déjà utilisé un guide de style ? Il s'agit d'une feuille de référence pour tous les éléments visuels de votre conception : les polices, les styles, la mise en forme des titres et les couleurs de votre site Web. Il est extrêmement pratique d'avoir et de référencer lorsque vous créez et modifiez votre site Web, et vous pouvez générer le vôtre avec Stylify Me.

Cela peut sembler insondable à ce stade de votre carrière de concepteur de bricolage - ou peut-être pas - mais le jour viendra où vous voudrez apporter quelques modifications au CSS pour peaufiner l'apparence de certains éléments spécifiques. Le moment venu, vous pouvez vous complaire dans des didacticiels, rechercher le support de votre thème ou vous tourner vers un générateur CSS pour trouver le code que vous souhaitez. Vous pouvez également consulter Webflow, un éditeur par glisser-déposer qui vous permet de créer ce que vous voulez voir sur la page, puis de générer le code CSS pour vous. C'est un service payant, cependant, qui a tendance à aller à l'encontre du bricolage.

C'est une petite pomme de terre, mais assurez-vous que votre site a un favicon. Vous pouvez utiliser ce générateur de favicon ou obtenir un plugin favicon simple pour votre site WordPress afin de rendre le processus super simple. (Je préfère de loin la route du plugin, à mon avis non professionnel.)

Les préférées de tous : les polices

Les polices sont l'enfant d'or de la conception Web; il semble que tout le monde aime les polices de caractères. Mais si vous ne savez pas ce que vous faites, les polices peuvent être un peu intimidantes. Acheter une police, l'installer, voire la modifier… ouais. Si vous voulez simplement que votre site soit beau, vous pouvez installer Google Fonts et utiliser une base de données assez robuste de polices de caractères adaptées au Web. Il est également facile de trouver des combinaisons de polices Google qui s'harmonisent avec une simple recherche sur le Web.

Type-Finder est un site qui vous pose une courte série de questions et vous propose ensuite des suggestions de polices. Choisissez et choisissez ceux que vous aimez, et vous êtes sur la bonne voie. Cela facilite le choix des polices, surtout si vous ne maîtrisez pas bien les polices et la théorie des polices.

Lorsque vous vous sentez courageux et prêt à obtenir la police exacte que vous souhaitez pour vos en-têtes, épingles, etc., consultez Glyphr. C'est un éditeur de polices et c'est super cool.

Outils de flux de travail

Lorsque vous êtes un concepteur de bricolage volant par le siège de votre pantalon, vous pensez rarement au flux de travail. Mais j'ai appris (à la dure) que certains éléments de workflow de conception peuvent rendre votre conception Web DIY beaucoup moins pénible.

13 outils basés sur un navigateur que chaque concepteur devrait avoir dans sa boîte à outils

Ah, l'application basée sur un navigateur. C'est un logiciel solide qui se met à jour. Vous n'avez pas à vous soucier du téléchargement de choses. Et, peut-être le plus fantastique de tous, l'application de votre choix est accessible sur n'importe quel ma...

La première chose que vous voulez adopter des "vrais concepteurs de sites Web" est le concept de wireframes. Les wireframes peuvent être aussi simples que l'esquisse de chaque page sur papier ou aussi complexes que des grilles dans Adobe Photoshop. Pour mes besoins, les croquis sur papier suffisent généralement (je ne suis jamais super technique avec mes conceptions, après tout), mais si vous préférez voir les choses de manière plus formelle sur une grille numérique, consultez Mockflow (qui est un service payant) ou Moqups.

Un autre endroit où je suis coincé est l'endroit où les mots iront et à quoi ils ressembleront - avant que j'aie écrit la copie. Pour cela, un générateur de texte factice est idéal. Avoir une copie sur votre site au fur et à mesure que vous le construisez facilite l'évaluation sans s'attarder sur ce que seront réellement les mots (ce qui est ma chute personnelle).

Lorsqu'il est temps d'arrêter de jouer avec les lignes et les mots et de commencer à jouer avec la couleur, vous avez quelques options amusantes. Les sélecteurs de couleurs font partie de mes choses préférées - je choisis une couleur, puis le sélecteur de couleurs crache de superbes combinaisons de couleurs. Adobe et Color Wizard sont deux options amusantes avec lesquelles jouer.

Si vos sélecteurs de couleurs ne vous conviennent pas, vous pouvez utiliser quelque chose comme Pictaculous. Téléchargez une image que vous aimez et elle crachera un thème de couleur tiré de l'image. C'est vraiment cool!

Ce n'est pas tout

Il n'y a pas de fin aux outils de conception qui sont parfaits pour les concepteurs de bricolage, mais ce sont les choses que j'ai trouvées qui facilitent la vie du concepteur débutant. Quel est l'outil que vous aimeriez avoir ?

Ebook gratuit : 25 outils indispensables pour les concepteurs de sites Web

La boîte à outils d'un designer peut être la clé de son succès, mais comment savoir quels outils inclure dans votre flux de travail ? Nous pensons que ces 25 outils sont indispensables pour tout concepteur de sites Web qui réussit.