Nouveau thème pour le Sphinx

Cela fait longtemps que j’avais délaissé le thème de ce blog : la première version était bancale, tant en design qu’en code, j’étais encore trop peu expérimentée. Les suivantes étaient essentiellement le thème par défaut de WordPress, par flemme. Maintenant, on passe à un vrai travail ! J’ai plus ou moins renié la v1 (je n’ai même plus les fichiers), mais appelons celle-ci v2 tout de même !

Base

Je suis partie du thème Inpixelitrust Responsive blank theme (vous pouvez reprendre votre souffle), de Stéphanie Walter. C’est un thème « blank », c’est-à-dire sans véritable design, juste une bonne base solide pour développer un thème.

Ambiance

Le processus créatif autour de ça… est difficile à expliquer. En effet, je ne suis pas designeuse, ni graphiste, mon travail et mes talents sont plus le développement et l’intégration ; mais j’arrive souvent à un visuel qui me plaît après de nombreuses itérations. Je code, et je vois si ça me va, si oui on continue, si non, on modifie ^^’

L’idée était de rester sur la couleur violette. En effet, j’ai plusieurs blogs, chacun avec un sujet différent, un « animal totémique » (mythologique, pour ne rien gâcher), et une couleur d’ambiance. Le Codex sphinxial est violet depuis le début, et il va le rester (jusqu’à ce que je change d’avis, évidemment).

En cherchant des infos sur des directives de Compass, je suis tombée sur cette page : https://coderwall.com/p/o4sbng, et j’ai eu un coup de foudre pour le design de la page. Oui, c’est un peu bateau comme visuel, un fond flou et un objet « flottant » par dessus, mais… ça m’a plu et j’ai voulu m’en inspirer. Une autre source d’inspiration a été le site OhMyGame (qui d’ailleurs a bien d’autres attraits que son apparence : si des visions pertinentes, variées et féministes sur les jeux vidéo vous intéressent, foncez !), pour l’aspect « petites cartes » sur la page d’accueil.

Au niveau polices, une Open Sans toute simple pour le texte, et la superbe SciFly pour la titraille – j’ai fait pas mal d’essais mais celle-ci m’a tapé dans l’œil.

Responsive design

De nos jours, il est important d’avoir un design qui s’adapte proprement suivant les tailles d’écran. J’ai essayé ici de me baser non pas sur les périphériques, mais sur des points de rupture intermédiaires, en m’inspirant de cet article : Définir ses points de rupture.

Écriture et code

Je me suis mise au markdown ! Assez semblable à la syntaxe wiki, il permet de se concentrer sur le texte, en retenant quelques symboles et commandes pour mettre en forme : >, #, `, et des espaces. J’ai utilisé le plugin WP-Markdown, qui a comme particularité sympathique d’intégrer une coloration syntaxique !

Il reste tant à faire…

Et pourtant, rien n’est vraiment fini. Bon, ce thème va évoluer, un peu, comme toujours, mais il y encore de petites choses de ci de là – des choses que je suis peut-être seule à voir 😀

Mais dès maintenant, bienvenue chez le Sphinx ! Essuyez-vous les pattes en entrant, ne dites pas de gros mots, puissiez-vous apprécier votre séjour.

Laisser une réponse

Your email address will not be published. Required fields are marked *

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four 
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax