Mes collègues m’entendent souvent râler dans l’open space lorsque je vois un thème WordPress conçu sur une base de Twitter Bootstrap, d’autant plus lorsque l’on voit le code source et l’usage qui en est fait. Cette traduction d’un article de Fränk Klein défend assez bien mon point de vue.
NDA : Certains compléments ou interprétations sont ajoutés entre crochets, certaines tournures de phrase sont légèrement adaptées. Enfin, certains termes ne sont pas traduits car ancrés dans le jargon des métiers du Web.
——
Depuis sa sortie en 2011, Bootstrap est rapidement devenu le framework le plus populaire sur Github. Cette popularité a également eu un impact sur le monde des thèmes WordPress, avec de plus en plus d’auteurs utilisant cet outil au cours du développement ou même au moment de publier des thèmes présentant Bootstrap comme argument de vente unique. (ou principal)
C’est quelque chose de surprenant car Bootstrap n’est pas vraiment l’outil adapté pour le développement d’un thème WordPress.
Bootstrap : le mauvais outil pour cette tâche
Bootstrap a été créé chez Twitter comme outil pour que les développeurs back-end puissent aisément créer des interfaces pour leurs applications. Avant Bootstrap, beaucoup d’autres bibliothèques furent utilisées, aboutissant en des interfaces incohérentes et difficiles à maintenir.
Bootstrap a donc été créé avec un but précis en tête, et continue à être développé d’après cette vision initiale du projet. Il a été créé pour que les développeurs puissent se concentrer sur du code back-end et itérer rapidement sans se soucier de l’aspect front-end.
C’est pourquoi Bootstrap n’est pas le bon outil pour créer un thème WordPress : le thème WordPress, ou l’apparence du site une fois le thème activé, est tout ce qui compte. [Il n’y a rien à attendre d’original dans votre thème, dans son aspect graphique, avec un outil de back-end]
Bootstrap ne fait pas les choses à la WordPress
WordPress facilite le développement de thème en mettant à disposition un lot de fonctions utilisables dans les fichiers de template. En tirant parti de la sortie HTML de ces fonctions, les développeurs peuvent écrire du code propre et efficace qui fonctionne avec une grande variété de contenus [ou de structures].
Bootstrap, d’autre part, a sa propre approche de la façon dont le code HTML est [et doit être] structuré, et il ne cadre pas très bien avec ce que WordPress fournit par défaut.
Partant de cette différence, les développeurs doivent prendre des mesures supplémentaires et écrire un surplus de code pour modifier le comportement de WordPress afin de l’ajuster au fonctionnement du framework. Un bon exemple pour cela sont les menus de navigation. Au lieu d’utiliser le code généré par wp_nav_menu(), les développeurs doivent écrire des Walkers personnalisés qui changent la structure HTML de sortie de sorte que les codes CSS et JavaScript de Bootstrap puissent être utilisés.
De cette approche en ressortent davantage de code et une efficacité moindre, une maintenance plus difficile et un temps de développement supérieur, tout en ne permettant aucun bénéfice sur les améliorations produites par les fonctions natives de WordPress.
Bootstrap est pléthorique
Le code d’un framework ne peut jamais être aussi efficient qu’un code écrit pour une proposition spécifique, pour la simple raison que les frameworks se construisent sur une base générale pour tendre vers des cas plus spécifiques, et ajoutent des redondances dans le processus. Souvent, plusieurs classes CSS doivent être ajoutées à des éléments HTML pour obtenir le résultat visuel désiré, classes CSS qui une fois combinées apportent le CSS nécessaire.
Ce qui s’ajoute à ce problème est que, bien des fois, le code CSS utile pour la conception du thème n’est pas le seul packagé, mais l’ensemble du code du framework l’est également.
Bootstrap n’encourage pas au bon design
L’une des fonctionnalités les plus populaires de Bootstrap est le colonage (12 colonnes), cette grille « full responsive« . En ajoutant des classes à la structure HTML, les développeurs peuvent créer des sites web adaptés à toutes les tailles d’écran.
Malheureusement, l’utilisation d’une grille prédéfinie est une mauvaise approche pour l’aboutissement d’un bon design. Le problème majeur est que vous concevez de l’extérieur, bousculant le contenu dans des boîtes prédéfinies. En résultent des modèles qui offrent un sentiment de rigidité et un aspect mécanique, sans proportions appropriées ou harmonie.
L’approche de la « taille unique » garantit également que le thème que vous concevez ne s’adapte pas à toutes les contraintes telles que les dimensions de l’image ou de la longueur de la ligne. Que vous utilisiez une [police de caractère] sans-serif étroite ou une didone-serif qui a besoin d’espace pour respirer, la grille reste la même. Il en ressort souvent une mauvaise lisibilité et une typographie non harmonieuse.
Une meilleure approche
Tout grand design de thème commence avec une vision. Quel est le but derrière le thème que vous concevez ? Qui envisagez-vous comme utilisateur et dans quel contexte ?
Cela vous informe sur les contraintes avec lesquelles vous devez travailler. Concevoir un portfolio riche en images est un défi [(voire besoin)] différent de celui de créer une expérience optimale pour une thème de magazine proposant de longs articles.
Une fois que vous avez défini une vision, vous commencez alors la conception de l’intérieur. Obtenez un échantillon du contenu pour effectuer des tests, puis commencez à concevoir l’expérience du parcours de ce contenu. Vous verrez qu’une fois que vous vous concentrez sur le contenu, vous pouvez construire autour de lui les éléments du design qui restent, et obtenir un résultat harmonieux.
Sur le plan technique, utilisez un gabarit de thème de départ qui vous permette de démarrer rapidement avec une structure de base et vous permette de plonger rapidement dans le balisage de présentation, sans trop porter votre attention sur le design. Utilisez des bibliothèques et les extraits de code (snippets) pour réduire le temps de développement. Les thèmes par défaut fournis avec WordPress sont généralement de bonnes ressources pour extraire des fragments de code.
Article issu de la traduction et de l’adaptation de : Why Bootstrap is a bad fit for WordPress Themes
Bien entendu, selon moi, cela ne s’arrête pas uniquement à Bootstrap en particulier. D’autres bibliothèques du même type soulèvent la même problématique, bien que certaines soient plus adaptées à un aspect front-ent, mais l’objet de l’article n’est pas de les lister mais de soulever le problème de leur utilisation pour du thème WordPress. D’ailleurs EdenPulse a également écrit un billet sur le sujet.
Partager la publication "Pourquoi Bootstrap n’est pas adapté pour un thème WordPress"
Salut,
Je comprends ce point de vue mais il est difficilement compatible avec le marché des thèmes. Et va bouger ce tas de gras (attention y a des thèmes super, on les connaît, on peut compter les bons artisans sur les doigts de la main). Changer le HTML du walker n’est pas forcément une mauvaise chose (une tonne de div et de classes qui ne servent à rien), je le fais d’ailleurs souvent.
Je veux bien que le mec n’aime pas bootstrap et ce n’est pas moi qui vais le contredire, je ne l’utilise pour ainsi dire jamais à moins que le client en ait absolument envie (donc jamais).
Le truc, c’est va dire aux dévs de thèmes et tutti d’embaucher un vrai designer, c’est plus vraiment rentable pour lui. L’état du marché…
Dans l’absolu j’approuve totalement, j’aimerais pouvoir m’offrir systématiquement les services d’un designer.
Donc l’ami Franky il est sympa, globalement je pense comme lui mais dans la vraie vie, il faut qu’il donne de vraies solutions qui fonctionnent en prod.
Hello,
Je pense que tu es resté bloqué sur « il ne faut pas utiliser Bootstrap » et que tu n’as pas vu ce qui est proposé : faire des thèmes WordPress avec son propre code et non celui de Bootstrap.
WordPress génère du code grâce à certaines de ses fonctions, c’est ce code qu’il faut styler grâce à CSS et non transformer le markup pour qu’il colle à la feuille de styles.
Dans tout cela on ne parle pas encore de design et de recherches graphiques, juste de logique de fonctionnement.
Bien sûr que WordPress est flexible et peut être plié à toutes tes volontés.
Mais quand une fonction ne permet pas de modifier le markup facilement, certains développeurs reproduisent totalement une fonction déjà existante de WP juste pour mettre les classes Bootstrap : du temps perdu.
Avoir une « kickstart » CSS pour WordPress, c’est ça qui serait une bonne idée. Mais le problème va bien plus loin : ceux qui achètent ces thèmes sont rassurés par Bootstrap, parce que c’est documenté, et que ça pallie (souvent) leur manque de compétence en la matière. L’offre trouve sa demande, la demande motive l’offre.
Les meilleures ventes sur ThemeForest par exemple sont composées de Bootstrap. Pour faire clair ce sont aussi les thèmes les plus horribles que j’ai jamais eu à dépiauter.
Ça me fait penser au domaine de l’alimentation, il y a ceux qui ont leurs recettes et leurs ustensiles de cuisine, et ceux qui ont leurs plats préparés et leur four à micro-ondes.
Les plats préparés c’est bien pour faire gagner du temps, mais pas pour servir en resto.
Bon ça reste un point de vue à argumenter, pas facile d’être exhaustif dans ce type d’article.
Bonne soirée à toi et merci pour ton commentaire.
Moi je n’utilise pas bootstrap donc qu’on l’enlève je m’en fous pas mal, j’applaudirais même ^^. J’ai commencé par être inté HTML/CSS donc pas besoin de bootsrap. Ce qui m’agace c’est les principes généraux vs la réalité du terrain. Je veux défendre les dévs qu l’utilisent et ne sont pas tous des bourrins !
Je ne vois pas dans quel cas faudrait réécrire toute une fonction pour le bootstrap. Je préfère un dèvqui va utiliser boostrap poru un rendu semi-correct plutôt que des applis au look totalement dégueulasse.
Dans l’idéal effectivement mieux vaut faire sans.
Salutation @Geoffrey, @Julien.
Un gros +1 pour cet article, la traduction, pour la pertinence des propos et pour vos commentaires.
En tant que web designer spé WP et WebPerf, le fait de voir un fichier CSS de 6000 lignes (cf. Github bootstrap.css) cela parait totalement futile pour un Thème WordPress…! Bon certes on le minifie, mais avant regardons la feuille de style et ses class !? Ce sont des classes qui semblent plus utiles pour prototyper une UI d’App avec des « .btn » etc. que faire un thème WP.
Ce qui est logique, on part d’une library/CSS/JS pour faire des applications type dev Twitter ou gros site web, UI spécifique, et à côté on un thème WordPress qui a ses propres classes CSS (dynamiques qui changent en fonction du « Template Page ») adaptés au HTML généré par the Loop et autre PHP/WordPress.
Moi, cela fait penser une image genre à enfoncer un truc carré dans une forme de rond. Ce n’est pas fait pour. C’est du vécu, j’ai déjà adapté un thème basé sur Bootstrap… C’est pour moi plus de perte de temps à comprendre la logique et refaire du CSS « en double » mais « valide » WP ou aller modifier le HTML de chaque fichier PHP !
À nuancer, cependant, selon les besoins d’un projet, si le site a besoin des JS fournis alors peut-être, mais pour le CSS, c’est vraiment loin de la philosophie WordPress et du Hierarchy Template et des classes CSS WP.
Ou alors, si, mais il y a + de boulot à « alléger » et « re-WP-iser » le CSS, que de faire le style et web design du site !
« Avoir une « kickstart » CSS pour WordPress, c’est ça qui serait une bonne idée. »
= Grave ! un kickstart WP normé codex et WebPerf compliant 😀
Après, c’est ce que je fait. Je pars du Theme 2014, je retire ce qui n’est pas utile au projet, et j’ajoute les fonctions PHP utiles genre fil ariane ou snippets indispensables genre « change expéditeur WordPress par e-mail client ». Ensuite, j’intègre la charte graphique à la CSS WP et reste plus qu’à ajouter ma créativité par l’ajout de style CSS.
Donc au final le moteur HTML et CSS est le thème 2014, de base livré par WP, aux normes du Codex, et le style + design est de mon cru pour ajouter de l’identité graphique au projet + charte graphique.
Encore, une fois, c’est à nuancer. Un thème type pour un Portfolio, là le thème WP 2014 sera pas pertinent, mais pour créer un site d’actu, ou un blog, ou encore un petit site vitrine, c’est pratique.
« Changer le HTML du walker n’est pas forcément une mauvaise chose (une tonne de div et de classes qui ne servent à rien), je le fais d’ailleurs souvent. »
= Pareil, avec des snippets pour virer le surplus de class WP… cela allège le HTML et le rend + lisible. Si en passant, cela allège la charge de rendu du navigateur, c’est bénef.
Juste pour « rire », je mets 2 liens donc 2 petits projets :
http://w40kgames.com/
http://www.designmoteur.com/
Sauriez-vous reconnaitre qu’à la base c’est le fameux Twenty Fourteen (?) ..alors que j’ai ajouté du style CSS simple tel que le bon choix de la typo, la couleur, l’UI, etc. et des illustrations et images, et du CSS qui s’adapte bien au HTML/PHP/WordPress !
Faire cela et regagner un rendu graphique, original, à partir du bootstrap, c’est + compliqué, disons, pour ne pas paraphraser l’article original, en FR et vos commentaires.
A ce propos, pour rester chez http://themeshaper.com/2013/12/19/5302/
Il y des réflexions sur le Theme 2015 et … par possibilité/volonté d’avoir un genre de kickstart WP. = extrait du post =
= « Default theme developer, Konstantin Obenland (who helped build the last three themes that shipped with WordPress!), shares some insight into the design and development of previous default themes, and proposes an interesting approach to the development of Twenty Fifteen. » :
= « I think it would be great if we could combine the two approaches, start from scratch and use an existing theme, for Twenty Fifteen. Let’s create a theme design from scratch, much like Twenty Twelve and Twenty Thirteen, and have it be based on _s, as the pre-existing theme. »
= « But most importantly: Let changes only be in style.css. That’s it! No additional functionality or bloat. If anything, we take unneeded code out. This doesn’t mean it can’t look good. It doesn’t mean it will be less awesome than its predecessors. CSS is a powerful tool, if in the right hands. »
source = http://konstantin.obenland.it/2013/12/19/twenty-fifteen/
En conclusion, si l’idée évoqué en dec 2013, par l’article, ce serait de partir du Theme/framawork WP _s et de simplifier le WP2014 pour faire le WP Fifteen. Ça semble pas mal du tout, comme approche.
Les commentaires qui ont fait durer la discussion jusqu’en juin sont aussi intéressants.
Après, je pense que cette discussion ici ou sur le post WP2015, est « loin » du marché des Thèmes WP qui est « dans son/leur monde », comme nous on est dans le nôtre.
Hello Ewen,
Merci pour ton commentaire et tes apports, notamment les quelques liens qui sont très intéressants.
Justement en te lisant je pensais au thème _s duquel nous allons (en agence) probablement proposer un fork avec davantage d’accessibilité et de possibilités niveau CSS/JS (« pre-RWD-isé ») notamment pour simplifier certaines tâches répétitives propres aux projets que l’on traite.
Après effectivement l’objet de l’article est de dire que par défaut Bootstrap n’est pas fait pour cela, mais peut-être qu’un projet plus précis d’interface en aurait parfaitement besoin. Cela nous est déjà arrivé en agence de bosser avec car les fonctionnalités demandées étaient à 90% présentes dans ce framework.
Bonne journée à vous ! 🙂
Salut tout le monde,
L’article est très intéressant et m’a amené à la réflexion d’éviter d’utiliser Bootstrap… Parce que oui, je l’utilise souvent.
Seulement, je ne l’utilise pas pour ce à quoi il sert en premier : faire une interface back-end aisément (comme précisé dans ton article).
Ce qui m’intéresse uniquement, c’est le système de grille.
Alors, certes, il n’y a pas que Bootstrap et, parfois, j’utilise celui « fait maison ». Mais, j’estime qu’avec la nouvelle version, on ne peut pas lui enlever que son système de grille est vraiment performant.
Ensuite, retoucher le HTML de WordPress, je le fais constamment car je n’aime pas ce que me génère WordPress.
De plus, rien ne nous empêche de filtrer les fonctions pour y ajouter les class nécessaires.
Très honnêtement, tu le fais une fois de manière propre et efficace et tu as ton « starter » WordPress avec Bootstrap 😉 (ou n’importe quel autre framework).
Il existe pourtant des système de grid bien plus puissants et performants que Bootstrap comme Susy par exemple : http://susy.oddbird.net/demos/
Bonjour,
il y a un truc quand même, c’est que pour celles et ceux qui sont entrés dans ces métiers avec l’envie de faire un beau code (qui ne l’est pas toujours au final, chacun son niveau, mais là n’est pas la question), qui se considèrent un peu artisans, un peu créatifs, qui aiment répondre sur mesure à demande, utiliser ces bootstraps, ça peut être vite frustrant … même pour un thème WP ^^.
Créatif avec les grids ? J’ai du mal.. productif et rapide, oui je suis d’accord..
Euh … l’un n’empêche pas l’autre, à mon sens, et par ailleurs, j’ai justement exprimé que pour le créatif, comme tu le suggères, c’était frustrant, et même vite frustrant.
Ceci dit, je ne suis pas certain que la démarche grid soit issue d’une pensée à visée de productivité, ou uniquement ça, je pense qu’il faut aussi regarder du côté des créatifs, design-ergonomie, et de leurs problématiques.
Je parle bien des grilles, mais pas de leur intégration dans un framework spécialement. 😉
Bonjour à tous !
Personnellement, je rejoins plus Thomas. Après quelques années à modifier des thèmes achetés j’ai finalement décidé d’en créer un à moi. J’en avais vraiment marre de me refaire à chaque fois à un autre style de code et comme dit précédemment, c’est du lourd des fois !
Du coup, partant de la feuille blanche (vraiment blanche), j’ai commencé à créer un mix de fonctions WP avec Bootstrap. Et moi qui n’aime pas non plus le code superflus et trop lourd, je peux vous dire que comme thème « starter », ça fait plutôt bien l’affaire.
En tant qu’intégrateur web, je demande simplement au graphiste d’essayer de faire en fonction des grids mais aucune autre contraintes. Du coup, ça lui pose pas de problèmes et à moi non plus. Et quand il veut faire un truc hors des grids, jle fais rapidement en custom.
Du coup, pour l’utilisation que j’en ai (grid, fonctions js), vous avez peut être d’autres idées pour encore plus simplifier la chose ?
Donc en gros, hormis un reset et des grid tu n’as rien pris d’autres ? Je pousse le bouchon 😉
Donc un BT 0.1 t’aurais presque suffi.. 😉 Je repousse un peu..
Non non, pas que ça bien sûr. Les boutons, dropdown, carousel, tabs, tableaux, et différents utilitaires responsive 🙂
Mais encore une fois, je suis ouvert à toutes propositions 😀
Bootstrap est bien, WordPress est bien, mais quitte à en faire hurler quelques-uns, mon expérience longue quand même de 3 ans sur TB et 5 ans sur WP m’amène au constat suivant.
Bootstrap si on ne l’allège pas n’aide pas à la légereté d’un site en front, et comme 99% du temps on ne le dégrossit pas, BT reste pour moi une brique back end.
WP, je vais en faire hurler certains, n’est pas fait pour faire de l’application, j’en suis navré. En terme de maintenance, évolution, et communauté, rien de tel qu’un framework à la SF ou ZD. La communauté est différente et à une logique métier qu’on aura du mal à retrouver dans la communauté WP.
Haissez moi, démembrez moi, mais c’est mon avis.. Donc est-ce BT et WP sont fait pour être ensemble ? Ben non mon capitaine…
Bonne soirée à tous et bravo pour cet article.
Hello,
Merci pour ce point de vue pertinent que je partage carrément.
L’idée de l’article n’était effectivement pas de dénigrer TB mais bien de faire ressortir ce qui ressemble à une incohérence à utiliser TB combiner à WP.
Tu as parfaitement résumé la chose 🙂
Bonne soirée !
Bootstrap c’est bien, wordpress c’est de la daube.
C’est donc en commençant par ces lignes aguichantes que je vais tenter de vous expliquer mon point de vue très très très différent du votre.
En fait pour moi vous dites que bootstrap c’est mal car vous ne savez pas l’utiliser. Bootstrap c’est un « framework », et comme tout framework, il s’adapte. Le truc c’est qu’il faut être dev front (un mec qui ne part pas en courant quand on dit nodejs, bower, gulp, uglify…) pour savoir s’en servir car il est conçu pour être recompilé. Oui, bootstrap n’est pas un simple ficher .css. Il est adaptable à tout un tas de situations. En réalité bootstrap est juste là pour qu’on ai pas à recoder quelque chose de courant, et pour feet à tous les besoins (css limitation) on doit le recompiler, mais heureusement grâce à lesscss c’est facile 🙂 .
Je ne parle pas de la fonctionnalité de theming de bootstrap qui rappelle obviously que c’est bien un framework et rien d’autre.
En outre bootstrap n’est pas forcément évident à utiliser pour un dev backend car il y a tout un tas de choses frontend à savoir pour bien l’utiliser (notamment pour le responsive et les components). J’ai donc beaucoup de mal à comprendre pourquoi on dit que c’est fait pour eux (et je sais de quoi je parle, je suis dans une boîte de dev backend).
WordPress c’est pourri et pas que le code, pourquoi ? Parce que justement la communauté est amateur, la plupart des « développeurs » wordpress ne sont qu’intégrateurs – pour pas dire stagiaires. Alors on fait un thème en utilisant bootstrap parce que c’est à la mode.
Donc oui, un thème wordpress bootstrap a toutes les chances d’être daubé.
Cependant je ne suis pas fermé au développement « à la main » bien fait (rare sur les thèmes wordpress d’ailleurs). Je tiens juste à souligner que bootstrap est bien un framework et qu’il se prête à cette utilisation comme à d’autres.
Bonne soirée,
Nek.
Bonsoir également,
Points de vue différents parce que mal compris ?
Je n’ai pas dit que Bootstrap était mal, tout comme je n’ai pas dit que WordPress était adapté à tous les projets.
Je vous invite à relire l’article, et éventuellement poser des questions si vous ne l’avez pas compris. Nous sommes là pour en discuter.
Je ne me suis pas permis de juger vos compétences, j’utilise Bootstrap dans des projets, pas tous, pour les bonnes raisons 😉
Tout comme Bootstrap, WordPress permet de ne pas réinventer la roue. Limiter sa qualité à sa communauté amatrice c’est comme continuer à dire que Bootstrap est fait pour les dev back-end.
Dois-je en déduire quelque chose sur vos compétences en WordPress ? (ou développement tout court)
Bonne soirée également.
Sinon, pour une méthode « sémantique » d’utiliser Bootstrap, je vous conseille ce p’tit lien bien sympatique: https://coderwall.com/p/wixovg
/!\ il date d’avant la version 3.2, le portage Sass n’existait pas.
Maintenant que BS est directement disponible en Sass, c’est beaucoup plus simple.
Hello,
Merci pour le partage 🙂
Bonne soirée.
Et que pensez-vous de FoundationPress ?
Même chose que Bootstrap ou mieux adapté ?
Merci de vos avis avant que je me lance à étudier ce thème starter.
Je suis désolé de ne pas aller dans le sens de cet article, mais je ne comprends pas que vous parliez de Boostrap et WordPress sans mentionner l’excellent roots.io qui propose justement un framework et une méthodologie éprouvée pour bien développer des thèmes WordPress sur une base Boostrap.
Bonjour également,
C’est justement parce que roots.io ne va pas dans le sens de cet article que je ne le mentionne pas.
Mon postula est celui-ci : « Bootstrap n’est pas adapté pour du thème WordPress tel qu’il est utilisé aujourd’hui ».
Je n’ai jamais dit que c’était difficile, juste que ce n’est pas adapté, ou pas optimal.
Si je regarde la galerie de http://roots.io/gallery/ je n’ai pas besoin de regarder le code source des sites web pour savoir que c’est du Bootstrap derrière… pourquoi ? Il y a une forme d’homogénéisation malsaine du design web dans tous les sites utilisant Bootstrap (sauf rares exceptions), et ça n’est pas quelque chose de normal selon moi. Un design doit répondre à une problématique. Si tous les sites se ressemblent c’est soit qu’ils ne répondent pas à une problématique précise, soit qu’ils ont tous la même problématique initiale (ce dont je doute).
Je ne sais pas si ma position est plus claire ainsi. Mais le but n’est pas de faire changer d’avis les pro-Bootstrap, j’ai bien conscience que cet outil apporte pas mal d’aide à ceux qui ne savent pas faire de responsive, entre autres, et qu’il répond plus à une problématique technique pour les développeurs, qu’à une problématique de design.
Bonne journée.
Je vais parler pour ne rien dire mais je suis d’accord avec tout le monde en fait…
Au niveau web je pense qu’il faut savoir distinguer le website d’une webapp. Dans une certaine mesure je trouve cela ridicule d’utiliser BT pour un design de website, en revanche (et encore) BT offre tout même un excellent starter pour les design webapp.
Pour résumer un site web doit être unique, alors qu’une application full web doit fournir un cadre de travail agréable dans la lignée des softs natifs et donc avoir une interface relativement standardisé. Je pense que l’origine de BT et sa prétention actuelle réponds correctement a cette problématique.
Le véritable problème réside dans le fait qu’une bonne partie des utilisateurs WP sont effectivement amateur.
N’étant pas du tout web designer et m’essayant a WP j’ai tout de suite souhaité réaliser mon propre thème mais en utilisant ma version de BT. Le constat est simple j’aurais été plus rapide à faire un style sur mesure.
On ne parle jamais pour ne rien dire 🙂
Merci pour ton avis que le sujet !
Bonne soirée.
Bonjour,
L’article est intéressant même si je suis plus nuancé sur certains points.
Par exemple :
« Malheureusement, l’utilisation d’une grille prédéfinie est une mauvaise approche pour l’aboutissement d’un bon design. »
Comme en P.A.O., les grilles sont très utiles et surtout ne sont pas fatalement incompatibles avec des « proportions appropriées » ou « harmonieuses ».
D’ailleurs, à l’inverse de vous, il m’arrive de pester au travail contre des prestataires qui n’utilisent pas de grilles, et produisent des sites qui seraient nettement plus lisibles et harmonieux s’ils s’étaient calé sur une grille (ce qui n’implique pas forcément un site formaté dans le moule).
En outre, je pense qu’avant de blâmer les utilisateurs qui utilisent Bootstrap pour faire du Front-End, il faudrait aussi s’interroger sur la communication légèrement coupable de Bootstrap qui mentionne sur sa page d’accueil, presque comme un slogan :
« Bootstrap makes front-end web development faster and easier. It’s made for folks of all skill levels, devices of all shapes, and projects of all sizes. »
Hello Alexis,
Merci pour ton commentaire.
Attention à ne pas être trop radicaliser mon propos. Je n’ai jamais dit que les grilles n’étaient pas une bonne chose, au contraire. (voir ce vieil article à propos de grille)
Ce que je dis, c’est que vouloir placer n’importe quel type de contenu dans la même grille n’est pas optimal du tout, notamment dans le cadre d’utilisation de typographies variées. Une fonte a ses propres règles et mesure, je pense que la grille doit prendre en compte ces aspects, ce qui n’est pas du tout le cas des utilisateurs basiques de Bootstrap, qui ne prennent que trop rarement le temps de personnaliser la grille de Bootstrap.
La faute à Bootstrap ou aux compétences des utilisateurs ? Je ne sais pas.
C’est marrant, je ne suis pas d’accord (dans la limite du raisonnable) avec cet article. Nous avons codé le blog olybop.info basé sur bootstrap et le design est cool et le résultat plus que satisfaisant…
Je trouve que les 2 bien couplés c’est un super combo… Maintenant, si vous me trouvez des remarques constructives dans la façon dont mon site à été codé, je suis preneur (c’est en se remettant en question qu’on avance)
Hello David,
Merci pour ta référence et ton ouverture d’esprit.
Du coup j’en profite pour préciser ma pensée : je n’ai pas dit que ce n’était pas possible de faire du bon boulot avec Bootstrap, juste que de base il n’est pas adapté et beaucoup de personnes s’arrêtent à ce que le framework fournit sans aller plus loin (par peur ou par défaut de compétences).
Concernant ton site, j’ai effectivement des choses à redire sur les points que j’évoque dans l’article :
Bootstrap demande une attention toute particulière que beaucoup de personnes ne prennent pas le temps d’apporter.
Bonne continuation.
Pourtant, je suis surpris par la rapidité de son site web, je serais curieux de savoir pourquoi et comment ils ont arrivé à cela.
Hello Gino,
En temps de chargement c’est vrai que nous sommes sous la barre de la seconde de chargement. Ce qui prend énormément de ressources c’est les images (mais ça même en les compressants et en mettant un cache, on peut pas trop faire grand chose), on a une machine dédié pour le blog, optimisée coté server et côté code + un cron qui passe à date varié pour tous les partages des réseaux sociaux (qui allège plusieurs dizaine de requêtes par pages) + une bonne grosse optimisation du code et de l’huile de coude. Cela permet avec tout ça de supporter les 200k visiteurs mensuels 🙂
Bonjour,
Bootstrap est le framework CSS le plus utilisé dans le monde et ce n’est pas par hasard!!
Et pour voir pourquoi l’utiliser, je vous laisse avec ce lien : http://www.opentuto.com/informatique/maitriser-bootstrap-3-par-la-pratique/
Bonjour Adam,
Ce n’est effectivement pas par hasard : les développeurs sont fainéants et si un outil peut faciliter le travail de conception d’une grille responsive, même sans avoir de connaissances suffisantes en CSS, alors ils vont sauter dessus. Et c’est naturel quand on cherche à être efficace rapidement, parfois même en dépit de la qualité.
Merci pour votre ressource. Je constate cependant qu’il manque (pour un tutoriel « complet ») tout un pan sur la manière d’utiliser Bootstrap en production. C’est exactement ce que je critique aux utilisateurs lambda de ce framework : faire l’impasse sur la performance et la qualité du produit final.
Bonne continuation, et j’espère bonne complétion de votre tutoriel.
Certes, les dev sont fainéants. Et comme les webdesigner (contrairement aux « vrais » graphistes) le sont encore plus, on se retrouve avec des design conçus à grands coups de slideshow fullscreen et de tout ce qui doit être à la mode (comme, fût un temps, le style « morceaux de cuir recousus » ;)). Je pense même que les boulangers le sont, mais eux, ils n’ont guère de possibilité de l’être au boulot (à part en achetant des viennoiseries surgelées). Nous sommes tous fainéants et nous avons bien raison de l’être ! Fournir des efforts dont on pourrait se passer, c’est un peu bête.
Je suis tombé sur cet article en cherchant des ressources sur l’utilisation de Bootstrap (que je n’ai encore jamais utilisé) avec WordPress (que j’ai utilisé déjà quelques fois).
Et comme bien souvent dans ces oppositions c’est bien/c’est mal, les deux camps ont raison à un moment : lorsque qu’on comprend ce que l’on fait et que le boulot est bien fait, c’est bien ! Faut-il en faire des articles ?
Quand je vois ce que me livrent les 3/4 des webdesigner, je leur demande d’utiliser un framework HTML/CSS ou un thème ; quand je vois la tronche du code des thèmes et de certaines extensions WordPress (ou autre CMS), je désinstalle beaucoup et je paie parfois pour rien.
Mais le soucis dans tout ça, c’est tout de même le manque d’objectivité ou, peut-être davantage, ce ton typiquement web qui consiste à enfoncer une solution plutôt que d’avoir un discours nuancé.
Tu dis dans ton article que les grilles c’est-pas-bien mais dans ton article sur les grilles, tu les encensent. Tu dis que Bootstrap avec WP c’est-pas-bien mais tu dis ne pas parler de Roots.io parce que, lui, il le fait bien.
Ça fait tout de même avancer les choses, dans la mesure où il y a de vrais bons arguments dans ton article, mais il faut en lire un tas d’autres pour avoir une idée globale, réaliste et juste. Et je pourrais citer tellement d’autres exemples : less vs sass, WP vs Drupal (vs SPIP :D), reset css|normalize or not, jQuery vs Angular, etc. jusqu’aux mythiques PHP vs The World, MySQL vs PostgreSQL voire Apache vs Nginx|lighttpd. On se doute bien que faire tout from scratch en ruby, pur JS, MongoDB sous un linux lui aussi from scratch avec Nginx, c’est bien, mais nous ne sommes pas tous des agences web performantes ni des nolife omniscients ! Donc on cherche à tout faire, dans la limite de nos connaissances (et parfois à contrecœur, surtout quand je vois le nombre de requêtes SQL de WP).
Du coup, je ne sais toujours pas si je vais tenter d’utiliser pour la première fois Bootstrap avec WP (le blog de @olybob est très joli et ne « sent » pas du tout le bootstrap), utiliser des grilles (j’ai dû en utiliser une ou deux fois), regarder si roots.io vaut le coup (et ainsi, une fois de plus, je perds peut-être mon temps à étudier une techno qui va se faire lyncher d’ici 6 mois), etc. Parce que je suis un être moyen : beaucoup beaucoup moins bon que tous les dev sérieux que je connais, bien meilleur que la plupart des prétendus dev et même ce qui se disent webdesigner qui peuplent forums moyens et blog inutiles. Et en tant qu’être moyen, je suis influençable donc j’attends de l’info pertinente.
Petit aparté : à côté de ça, tu fais – comme bien d’autres je constate – de la performance web ciblée WP et là-dessus (il y a pourtant à faire !), je ne trouve aucune ressource de qualité sur le web (je passe les « installez WP machin-cache, cocher minify et gzip »).
Bonjour également 🙂
Cela commence en général par la flemme de réfléchir sur un article car beaucoup prennent la mouche en lisant ce genre de réflexion. Je n’ai rien contre les grilles, je les utilise au quotidien, et cette article comme mes commentaires vont dans ce sens. Ma remarque à ce propos va simplement contre l’usage d’UNE SEULE ET UNIQUE grille quel que soit le projet. C’est un contresens du concept même de design qui doit répondre à une problématique précise. Il est (presque) impossible d’avoir une seule solution à plusieurs problème.
Se cantonner à adopter une techno pour l’utiliser brute sans apprendre à aller plus loin que la base qu’elle apporte, c’est se cantonner à faire un travail médiocre. La plupart des thèmes Bootstrap que tu vas trouver en « Premium » sont des thèmes de très mauvaises qualité (technique) et plutôt très homogène (visuellement).
L’info pertinente il ne faut pas l’attendre (fainéant ! :p) mais aller la chercher au travers d’articles qui vont souvent se concentrer sur un angle de vue d’un problème précis. Parce qu’on est tous sensibles à des degrés différents sur des sujets différents (et tant mieux), et qu’en tant que webdesigner moyen, mon attention s’est porté sur ce que je croise au quotidien dans mes activités en agence et en tant qu’indépendant, abordé d’après un certain angle de vue qui est le mien, et semble-t-il partagé avec Fränk (ça ne doit pas être un hasard).
Autrement je ne fais pas que de la performance sous WordPress puisque je suis d’abord développeur front-end, mais effectivement WordPress est comme bootstrap, pratique mais pas suffisant si tu en restes à une basique installation, et très vite gourmand si tu le laisses faire tout seul, ou si tu y installes par dessus les thèmes à la mode à la sauce Bootstrap+SuperSlider+InfiniteScroll+Masonry+Nawak.io.
Si ta remarque portait sur le fait que les ressources de ce blog ne sont pas satisfaisantes pour ce qui est de la performance web sous WordPress, il faut savoir que j’écris gratuitement (comme beaucoup) et que j’aimerais pouvoir offrir tout mon « moyen » savoir sur un plateau avec un coupe de champagne pour chaque visiteur, mais hélas ce blog est gratuit. Par contre il est ouvert au guest-blogging, c’est une chance 😉
Autrement la doc de WordPress dissémine pas mal de bons conseils de performance, cì et là, notamment sur les WP_Query.
Pour le style « morceaux de cuir recousus » là j’avoue que je ne te suis plus…
Bonne soirée
Oui, oui, bonjour, bonsoir, bises, ce que tu veux 🙂
Ma remarque portait sur le fait que l’on trouve de très nombreux articles (sur ton site comme les autres) sur des sujets « bateaux » (ou du moins traiter de la sorte, typiquement « améliorer la sécurité de votre WordPress ») mais très peu bien traités sur des sujets fondamentaux. Je parle là de WP.
Tu dis que l’info pertinente il ne faut pas l’attendre mais je ne l’ai jamais attendue ! Et rarement trouvée en ce qui concerne WP.
Donc je m’étonne que toi, par exemple, qui a les connaissances, parle un peu légèrement de bootstrap+WP mais n’aborde pas la perf web alors que tu serais un des rares voire le seul à le faire en français.
J’ai très souvent voulu ouvrir un blog, pas uniquement technique, mais j’estime que ce que j’ai à dire n’apportera pas plus que l’existant. Tant d’autres devraient faire de même…
PS : pour le style « cuir recousu », ça a été un thème très à la mode, ultra classique, que l’on trouvé même dans les générateurs de thèmes WP.
Hello,
Cet article reste une traduction, le but n’était donc pas de faire dire autre chose à l’auteur originel. Apporter une plus-value personnelle ici me semblait déplacée et embrouillant.
Concernant la qualité de mes articles, comme je l’ai dit avant, on a tous nos spécialités. Certains contenus apportent simplement une vision différente sur un sujet donné, comme par exemple mon dossier la sécurité de WordPress qui avait pour but de proposer un contenu qui ne se limitait pas uniquement à 3 plugins, mais aussi aux bonnes pratiques, le tout réuni dans un seul dossier. Je ne connais aucun autre article francophone sur le sujet, mais effectivement je ne peux pas non plus rentrer dans les exemples ultra précis, car on parle bien d’un CMS auto-hébergé sur des serveurs très variés avec des installations quasi tout le temps différente. Il faut donc généraliser.
Idem pour la performance, si je devais me lancer sur un tel sujet, je ne ferai finalement que croiser des données déjà existantes sur le web dans différentes langues, et serai obligé de me limiter à des exemples (plutôt génériques) puisque chaque projet apporte son lot de contraintes rarement identiques. On se retrouverait donc avec un article composé de conseils « bateaux », qui par ailleurs ne sont pour la plupart jamais mis en place sur les projets existants où j’interviens. Ce qui me fait dire que même ce genre d’article peut servir encore longtemps de référence. Les bons exemples sont ceux sur la compression Gzip ou le cache navigateur, pour lesquels je vois beaucoup de projet qui font l’impasse sur ces sujets.
Bref, peut-être que ton niveau de connaissances n’est pas « moyen » du tout finalement, et que les articles génériques dans ce genre ne t’intéressent plus parce que tu attendrais des conseils ou des articles de recherche plus approfondis. J’aimerais avoir suffisamment de temps pour cela (et pas sûr que mes connaissances soient suffisantes). Mais hélas j’ai deux autres activités pro qui me prennent un peu de temps à côté 😉
Bonne continuation et merci pour tes retours.
PS. Je suis persuadé que ces générateurs de thèmes se sont inspirés de quelque chose 😉 Je ne me fais pas de souci, j’ai encore mes PSD sous le main pour certifier de l’originalité. (pour l’époque) Et je peux t’assurer que ça prend du temps à créer.
Voila, je t’ai vexé, tu as changé le design de son site 😉
Au passage, j’utilise WP-rocket sur un site (bientôt deux) et j’en suis content, contrairement aux usines à gaz qui vont parfois jusqu’à me ralentir WP (Super Cache, Total Cache et deux ou trois autres testés) !
Il n’est pas impossible que ce soit ici que je l’ai découvert (p’tet même dans ce fil). Si c’est le cas, merci !
Oui c’est cela oui oui :p
Ravis que WP Rocket réponde à tes besoins. Il y a probablement l’article sur WP Rocket qui a également circulé sur les réseaux sociaux 🙂
Merci à toi pour ta lecture !
Hello! Je re poste un commentaire ici, pour plusieurs raisons, d’abord pour dire qu’au 1er septembre 2014, j’avais évoqué 2 de mes projets web, et qu’en décembre 2014, début 2015. J’ai fait un redesign de chacun;
L’un avec un WP theme/template adapté + avec bbPress + BudyPress
L’autre avec un theme/template adapté.
qui finalement n’ont plus la base TwentyFourteen que j’utilisais depuis Juillet2013.
Donc 2015, nouveau framework, nouvelle base Thème WordPress.
..et toujours pas de Bootstrap dans mes themes..!
Ah aussi, le mag n°63 Web Design, vu hier, parle de Foundation (bon TLM connait déjà)
mais surtout de FoundationPress
= http://foundationpress.olefredrik.com/
Si ça peut faire avancer le débat.
Ah et aussi, maintenant c’est le Twenty Fifteen qui est dispo. (pour faire suite à ce j’avais évoqué, cf. lien post reflexions du team Automattic début 2014, misdans mon précédant commentaire)
Reste à bosser avec pour voir ce qu’il en est avec ces 2 possibles « frameworkWP » selon projet bien sûr et adaptabilité.
Enfin, pour en réponse à votre discussion, entre toi le team principal de CreativeJuiz, et BenM (voisin de commentaires ; je tiens à ajouter que s’il cherche à discuter Web Performance et WordPress. C’est ma spécialité. (voir lien de mon blog sur ces sujets sur mon prénom)
Et, à quand des prochaines publications sur le blog CreativJuiz !?
Bonjour,
vous avez l’air de bien connaître les technos web actuelles
J’ai essayé bootstrap, mais :
dès que l’on doit faire des écrans business avec beaucoup de champs, le résultat n’est jamais compact et on se retrouve vite avec des écrans de 3 kilomètres…
Qu’est-ce que vous conseillez comme framework ou css lorsque l’on doit créer et mettre en forme des gros formulaires remplis de champs multiplate-forme ?
ya t’il des tools ou des plugins ou des css conseillés ?
help
Bonjour à tous,
En réponse à Nico : les formulaires Bootstrap sont parfaitement adaptés à tout type de rendu ; si ta page contient un grand nombre de champs il te suffit d’adapter ta présentation : grouper les champs lorsque c’est possible, placer plusieurs champs par ligne dans certains cas, et personnaliser le css pour diminuer les paddings et marges verticales.
D’une façon plus générale sur l’utilisation de Bootstrap : il ne faut évidemment pas utiliser le framework en entier et tel quel.
Personnellement, j’ai pris le temps de mettre en place le nécessaire pour travailler directement avec les fichiers LESS, les compiler automatiquement avec GRUNT, qui permet aussi de compiler uniquement les fichiers javascripts nécessaires.
Il est de même parfaitement possible de personnaliser les grilles : nombre de colonnes et marges.
On obtient ainsi un framework qui comprend juste les fonctionnalités nécessaires, très malléable (la gestion du responsive est particulièrement bien pensée à mon sens), et adapté à la réalisation de (presque) n’importe quelle maquette originale.
L’utilisation sous wordpress parait en effet peu adaptée de prime abord, wordpress ne générant pas spontanément de « code Bootstrap », mais il existe des plugins capables de le faire, en particulier celui-ci : tiny-bootstrap-elements-light (plugin wordpress, lien direct), gratuit, et la version pro : http://codecanyon.net/item/tiny-bootstrap-elements-wordpress-plugin/10293837
On peut donc utiliser les grilles, boutons, images & autres éléments de Bootstrap sous WordPress, qui plus est sans avoir à en écrire le code.
Merci à toi pour ce complément 🙂
Bonjour geoffrey,
quel grid utilises-tu si tu n’utilises pas bootstrap ?
personnellement les grids ça m’insupporte, je préfère tout coder moi-même.
sinon peux-tu me joindre par mail j’ai deux trois questions non en rapport avec ton article et comme l’âne que je suis, je n’ai pas gardé ton mail ?
d’avance merci.
Bonsoir Yann,
J’utilise des grilles « maison », en tout cas c’est le cas sur ce blog, et parfois le framework CSS Knacss de Raphaël Goetter .
Je préfère avoir un système complètement adapté à la solution que je développe, sauf si une bibliothèque peut faire l’affaire. C’est vraiment en fonction des besoins.
Je te réponds par mail pour le reste 😉
Bonne soirée.
Je digresse un peu mais j’ai commencé (à peine) à utiliser Bones car il semble propre et clair. Mais je me pose une grosse question : pourquoi n’est-il pas « conçu » pour être un thème parent ? Partout, il est indiqué « modifiez ici, modifiez là ».
Bonjour Ben,
Effectivement ce n’est pas trop dans le sujet, mais c’est pas grave.
Bones est ce qu’on appelle un starter. Cela te permet de créer rapidement les bases d’un thème sans avoir à créer de child theme.
C’est un parti pris du créateur du thème d’avoir fait les choses simplement, sans optimisation particulière pour le rendre « child-theme-friendly ».
Bon courage pour la suite.
Bonjour
Je lis beaucoup et réagi peu mais là… Je me demande pourquoi certains se sentent constamment obligés de dénigrer les outils qui facilitent la vie aux développeurs ? Ça me fait d’autant plus rire quand ça vient de personnes qui utilisent massivement WordPress, outil qui a certes ses qualités mais qui a contribué à faire croire à bon nombre de gens qu’ils avaient un semblant de maîtrise dans la conception web.
Bootstrap est trop lourd ? Sass permet de charger que les modules nécessaires. Idem avec Bootstrap Js, on charge à la volée avec RequireJs.
Bonne journée.
Hello,
J’espère avoir une deuxième réaction de ta part lorsque tu auras relu et compris l’article 🙂
Bonne journée.
Bonjour,
ton article m’a interpellé car je compte réaliser un thème à partir de Bootstrap. Je comprend la problématique que tu soulève cependant je trouve l’article à charge, tu ne soulignes pas les aspects positifs de Bootstrap. Pour moi, il y en a quelques uns qui sont essentiels :
1 Je connais assez bien Bootstrap. ça me semble pas mal de se fixer sur un framework css, de bien le maîtriser, pour pouvoir l’utiliser dans diverses réalisations. Je pourrais aussi créer à chaque fois un css à partir de zéro, mais ça prend du temps, ou alors maîtriser plein de frameworks css différents pour pouvoir choisir celui parfaitement adapté, mais ça prend du temps aussi, et ça demande pas mal de compétences, et le truc aussi, c’est de gérer les compétences, il y a tant de choses à savoir quand on fait des sites web, tant de nouvelles choses qui sortent toutes les semaines, que la question est de savoir dans quoi on met son énergie, et sur quoi on fait l’impasse. Pour ma part, il m’a semblé un moment qu’il fallait que je me fixe sur un framework css, et ça a été bootstrap.
2 l’autre intérêt de Bootstrap pour ma par c’est le côté CDN. Tu linkes à partir du css hébergé chez twitter, et l’utilisateur a toutes les chance de ne pas avoir à charger le CSS qui sera déjà en cache, ou au pire qui sera ultra rapide à charger.
3 tu soulignes dans ton article qu’en gros, on Bootstrap fait trop de choses, donc qu’il y a du code qu’on utilise donc que c’est pas optimisé. Pour ma part, je n’utilise de base que le css de bootstrap, et je trouve qu’il y a ce qu’il faut, sans trop de superflux. Un système de grid, de quoi faire des tableaux et des boutons, des formulaires, deux trois autres trucs qu’on peut être amené à utiliser, genre des tabs ou autre, le tout en adaptatif. Bref, que de l’utile, et même si on n’utilise pas tout, faut aussi se dire qu’un site est évolutif, et que demain peut etre on sera bien content d’avoir tel ou tel objet prèt à l’emploi qu’il suffira d’activer, ne serait ce que dans un article.
4 la question des plug in. tape Bootstrap dans le repertoire des plugin sur le site de wordpress et tu te retrouves avec plein de plugins. L’interet, c’est que si t’as besoin d’un plug in, il y a des chance pour que tu trouves celui qui fait le taf en version bootstrap. Donc c’est pas mal si ton plug in utilise le même css que ton theme me semble t’il.
Voilà les bon côtés de bootstrap dans wordpress que je voulais souligner.
Bonne journée
Hello,
Merci pour ton intervention et la dé-diabolisation de Bootstrap 🙂
C’est vrai que je n’ai (presque) que souligner les aspects négatifs. Merci d’avoir pensé à ces quelques points positifs.
D’ailleurs dans chacun des points que tu abordes comme positif, il y a le contre-pied. Je détaille :
Le seul intérêt que je lis dans tout ça c’est « ça me fait gagner du temps et me permet d’abattre plus de travail ». Mais pour ma part je ne suis pas prêt à faire l’impasse sur mes connaissances et compétences.
Bon début de semaine à toi !
Tu soulèves un vaste débat sur l’organisation du travail. Pour moi, la question de l’utilisation du temps est le plus important. C’est pour ça que les framework existent, que les A P I existent, que les cms existent.
J’ai un planning à respecter, une mémoire normale et une capacité d’apprentissage normale aussi, et de multiples centres d’intérêts, alors comme je passe du temps pour apprendre à maîtriser des techniques, j’essaie de choisir des outils polyvalents que je pourrais utiliser souvent par la suite.
Je pense que si je devais me mettre à faire mes css en partant de zéro (chose que j’ai longtemps fait) ou alors en dégageant du temps pour maîtriser tel ou tel nouveau framework mieux adapté à un projet précis, alors je serais obligé de faire l’impasse sur quelque chose d’autre par manque de temps.
Bonne journée
@Geoffrey Crofte pour le CDN je suis d’accords (si je t’ai bien compris), et d’ailleurs pour tous ceux qui utilisent des css ou js en CDN sur des sites en production « DIABLE HO GRAND JAMAIS » faire cela. C’est déjà arrivé que les serveurs d’un tierce plante, et seulement un script ça peut rendre inutilisable votre propre site donc ne « JAMAIS » utiliser de script et css externe lorsque vous pouvez les héberger sur votre serveur.
@Geoffrey Crofte concernant le point 1 il ne faut pas se méprendre et trop partir à l’extrême. Ce n’est pas parce que tu restes avec un framework ui que pour autant le devfront ne fera plus de la veille ou ne cherchera pas à créer quelques choses.
On parle de framework UI, pas de framework ruby ou php ou de cms qui demande un apprentissage plus long et plus technique.
Là ce sont justes de bonnes pratiques à adopter et regarder et comprendre un peu le code des frameworks ui tel que bootstrap, semantic ui, ui kit etc…
Il faut bien comprendre que ce n’est pas parceque l’on ne sais pas comment comment développer tel chose que ce n’est pas pour autant que l’on ne développera rien.
Il suffit de voir dans l’open source et d’être dans les team de dev, perso y a certaines choses je ne sais pas comment cela est créé mais ce n’est pas pour autant que je n’ai pas créé des plugins jquery, package php, framework css etc…
« Si chaque scientifique apprenti devaient refaire, apprendre et passer par tous ce que ses prédécesseurs sont passé, la science n’aurait jamais évolué ».
Merci pour ton commentaire enrichissant 🙂
Tu as tout à fait raison, il n’y a pas à systématiquement tout refaire ou décortiquer pour améliorer ou proposer du code nouveau. Mais pour reprendre ton image sur la science, il te faut quand même des notions de base pour pouvoir avancer sans faire des erreurs monstrueuses. C’est plus dans cette mesure là que je voyais la chose. Hélas j’ai déjà repris du code Bootstrap où tu voyais clairement avec la combinaison de classes sur des éléments que le mec n’avait pas saisi le fonctionnement du framework ou cherché à savoir comment fonctionnait la bête sous le capot. Cas non isolé.
Au plaisir de tes commentaires 🙂
Moi je ne suis pas de cette avis de dire que Bootstrap n’encourage pas aux bon design.
Bootstrap ne fait que donner un aperçu de toute les fonctionnalités en css.
J’expliquerai plus en détails mes opinions un autre jour.
Hello.
Ce n’est pas ce que j’ai écris, mais c’est bien que tu comprennes cela.
Par contre le jour où Bootstrap intègre « toutes » les fonctionnalités de CSS n’est pas venu, ou alors tu te gâches un sacré plaisir de découvrir les nouveautés de CSS.
Bonne fin d’après-midi.
je suis tout à fait d’accord avec votre point de vue dans cet article et il concerne pas que wordpress.
bootstrap c’etait plutot pour du backend ou du site vite fait, et ca été détourné de son but initial.
sinon y’a plein de trucs à casser, surcharger. on peut pas faire du precis avec (désolé mais 12 cases par ligne, c’est peu) et c’est pour ca qu’on voit de plus en plus de siye ou le design est devenu pourri, sites de feignants qui font meme plus du mobile first (genre simplement des grs pavés empilé verticalement, comme ca pas à se casser la tete, c’est déjà compatible mobile), mais du mobile only (et tant pis pour cuex qui ont des ordi et ont des images et des boutons géants: horrible et quel place perdu), qui ne contiennent presque plus d’infios (12 cases tu mets quoi pour des sites évolués ?)
avec ces framework, on oublie que le but c’est d’avoir le truc le plus simple possible dans un smartphone, mais aussi le plus riche possible pour un grand écran (sans faire comme avant avec des tableaux de bord d’avions)
je pense qu’on va en revenir. de cette approche reductrice qui se répand depuis qq années. tous les sites se ressemble, ca devient triste à mourir et certains sont de mins en moins fonctionnel.. j’ai bossé dans les IHM logicielles et je peux vous dire qu’il y a une sacrée perte niveau fonctionnel et design. j’ai bossé par ex pour des applications de gestion d’hpitaux, je vois mal les prof de santé bosser sur applis avec des boutons géants. ils ont besoin d’avoir un max d’infos sur leur écran sans devoir scroller ne permanence ou faire 15 clic pour arriver au meme résultat qu’avant. mins on met d’info et de fonctionnalité sur un écran plus la personne doit scroller ou cliquer de page en page pour obtenir la meme chose qu’avant. c’est contraire aux principes d’ergonomie qui ont vu naitre la plupart des bons logiciels. (le moins de clic possible)
twitter c’est qd meme pas l’appli typique ou vous avez bcp d’infos à visualiser. imaginez facebook avec ca, ce serait impossible. donc ce framework css est adapté à certains sites. on doit l’utiliser betement parcequ’il est à la mode.
personne a essayé un bon framework css qui soit moins bourrin que bootsrap et plus tout terrain que qui ? (pas envie de chercher)
Tout à fait d’accord sur le manque d’originalité de sites de plus en plus construits à l’identique.
Mais bon. C’est la mode du parallaxe ? on voit le parallaxe fleurir de tous les côtés.
Site « one page », « flat design » ? idem.
etc.
Simplement beaucoup concepteurs se précipitent sur l’affaire du moment. Bootstrap n’est qu’un outil, excellent par sa souplesse et ses fonctionnalités. A chacun de l’utiliser à bon escient.
Tu veux un site à 256 colonnes ? des boutons triangles ? pas de problème, configure tes variables.
Un bon framework css en alternative à Bootstrap ? Il en existe des dizaines, du plus lèger au plus complet, ils seront tous construits sur un modèle de colonnes, incontournable si tu veux éviter le scroll horizontal sur smartphone.
j’ai vu par ex knacss qui l’air pas mal comme alternative. pas lourd, pas de truc contraigants ou https://github.com/zirafa/bootstrap-grid-only qui vire tout sauf al grille (et une grille sur 12 à 100 colonnes)
Même si l’article date de deux ans, il n’était pas dans le vrai il y a deux non plus.
Bootstrap pas adapté pour un theme wordpress ?
Non, je dirais plutôt seulement les composants de menu bootstrap qui ne sont pas adaptés pour la thématisation wordpress.
« Malheureusement, l’utilisation d’une grille prédéfinie est une mauvaise approche pour l’aboutissement d’un bon design » ???
Qu’est ce que l’on appelle un « bon design » ? Un bon design ce n’est pas que la qualité graphique, mais surtout une bonne logique de webdesigner qui a de l’expérience dans tout ce qui englobe les métiers du web. (Ce que l’on rencontre rarement en france notamment, il y a plus de bon intégrateur/webdesigner que de bon webdesigner).
Bien au contraire l’utilisation d’une grid c’est tout l’inverse, c’est du BON SENS et une LOGIQUE INFORMATICIENNE.
J’ai un peu sauté de ma chaise lorsque j’ai lu l’article, certes, un point de vue est une chose, mais le manque de bon sens en est un aussi.
Combien d’intégrateur ou développeur mal expérimenté préférez leur code (si géniale, tant de qualité, si propre, si logique…), mais au final non pas sur des sites ou theme oneshot, mais bien des sites à maintenir, tous ceux qui prônent ce jargon ont fait de la merde au final et n’ont pas su évolué.
Sur combien de projets et combien d’entreprises moi ainsi que bien d’autres avons pu le voir.
Au final avec l’expérience on vient à factoriser son css au lieu de refaire et refaire à chaque fois des choses.
Tout devient composant, il vous suffit de regarder partout sur le web la majorité des grosses app et website sont basés sur la philosophie du web component (je ne parle pas au sens technologique propre, mais conceptuel).
Même wordpress je vous ferait remarquer fait exactement pareil, mais mal car vieillissant au point de vue architecturale et du code.
« En résultent des modèles qui offrent un sentiment de rigidité et un aspect mécanique, sans proportions appropriées ou harmonie »
D’une le responsive n’est pas à prendre à la légère, après nous ne pouvons pas perdre de temps sur le développement d’une feuille de style pour adapter à tel mobile, à tel tablette etc…
Il ne faut pas oublier que l’évolution des résolutions sur les appareils mobiles évoluent vite, et beaucoup plus de support que seulement le smartphone, ou la tablette.
Je constate surtout des arguments très léger et carrément à l’inverse des besoins actuels.
Là où je pourrais être en partie d’accords, c’est que bootstrap était plus adapté à du theme backend que frontend. Il y a d’autres framework ui css plus adapté au front.
Après l’argument de la lourdeur des composants… Hum, on peut sélectionner les composants pour alléger bootstrap, après question lourdeur moi je me préoccupe surtout de la lourdeur du code de wordpress en lui même ainsi que sa gestion des inclusions css et javascript plutôt que bootstrap en lui même qui est loin d’être lourd.
Je réponds plus précisément à ce commentaire : attention oui, l’article à un peu de bouteille pour la critique de Bootstrap que je faisais à l’époque.
Cependant certaines choses n’ont pas changé, comme par exemple la grille, qui reste une solution générique.
Mais dans une ère où, comme tu le dis toi même, les terminaux et leurs dimensions d’écran se multiplient, tu ne peux pas cibler/tester pour tel ou tel matos, et tu es obligé de penser autrement que « juste grille ». Il faut penser module et réutilisabilité. Il faut penser patterns et breakpoints offerts par le contenu et pas le conteneur. En ça, Bootstrap ne peux qu’offrir un cadre global générique et pas toujours adapté.
Je t’invite à lire mon retour de lecture sur Responsive Design Patterns et éventuellement le bouquin s’il t’intéresse 🙂