Nouvelle CSS : Portal staille
Pfiou. P’tain, j’en ai marre. J’ai pas compté, mais j’ai passé suffisament de jours à bosser sur cette css pour avoir ma dose pour longtemps.
Avant, pour ceux qui ont du mal, c’était sur le thème de Team Fortress 2 et ça ressemblait à ça :
Donc voici la nouvelle gueule de mon blog, cette fois sur le thème de Portal.
Ouais, je sais, on me reprochera de me baser sur des univers existants au lieu de me créer mon propre style.
Mais j’ai franchement pas d’imagination à ce niveau-là. Je préfère faire plusieurs thèmes différents, ça change un peu. Que les éventuelles personnes qui aimaient ma css TF² se rassurent, elle est bien au chaud, et je la remettrai peut-être plus tard si j’ai envie. C’est aussi ça l’intérêt.
Vos avis, critiques et conseils sont of course les bienvenus. Rien n’est définitif et je ne demande qu’à améliorer tout ça pour coller un peu plus à l’ambiance du jeu - ça, c’est à vous de me dire si j’ai à peu près réussi ou pas. Vous êtes bien évidemment en droit de me dire que j’ai des goûts de chiottes. Que je devrais faire autre chose. Que je suis un Dieu. Et tout ça. Je n’ai jamais pris le temps d’étudier avec précision xhtml et css, donc j’ai fait comme j’ai pu.
Et, comme je suis certain que cette css est un gros bordel pas valide et tout, certains vont probablement avoir droit à de gros bugs. Il me semble que pour ceux qui ont encore IE 6, c’est assez psychédélique (menu au milieu qui décale tout). Merci donc de m’en faire part, screens à l’appui, en me précisant votre résolution et le navigateur utilisé. Là, j’en ai marre, mais je m’efforcerai d’étendre le plus possible la compatibilité de mon bordel.
Le background du bloc principal (effet ciment, là) est selon moi pas franchement beau. Je pense à le remplacer, mais je sais pas par quoi. À vous de me dire aussi.
Aussi, désolé pour le blanc momentané dû au chargement de l’image auquel vous aurez droit lorsque vous passerez le curseur sur le titre d’un article. Je peux pas faire autrement, faut faire appel au javascript pour corriger ça, ce qui est pas possible sur cette plate-forme.
Voilà voilà, merci, and may Obama win the elections.
PS : Merci à Xandar et à Nesquik pour l’aide qu’ils m’ont apporté.
PS2 : J’ai cherché, cherché et encore cherché pour tenter de bien centrer la pub Google qu’affichent certains navigateurs dans le menu de droite, mais rien à faire. C’est con, ça gâche tout l’alignement du truc. Mais j’arrive pas à régler ça. :/

5 novembre 2008 à 3:26 Citer
Il était cool ton design TF2.
C’était mieux avant §§§
Sinon, c’est cool mais y’a un je-ne-sais-quoi d’étrange. J’aurais bien mis de "bordures" sur chaque côté de la partie centrale car le blanc qui passe direct dans le mur métallique noir derrière ca tranche trop.
5 novembre 2008 à 3:30 Citer
Ouais, ben en fait y’en a une. Mais si c’est clair, ça se verra pas à cause du bloc principal, si c’est sombre, ça se verra pas à cause du fond. Je peux tenter d’augmenter l’épaisseur, mais je suis pas sûr que ça rendrait bien. Et une bordure image, c’est encore un rêve.
Le je-ne-sais-quoi étrange peut venir aussi du fait que les textures et le header sont prises sur la vue 3D de Hammer, plutôt qu’in-game (sauf pour le fond), car in-game, j’arrive pas à obtenir un éclairage correct, c’est toujours trop sombre. Évidemment, en vue 3D, c’est un peu spécial. Si j’ai la foi, j’essaierai de retoucher ça sous Toshop. Mais pas ce soir. :-°
5 novembre 2008 à 7:01 Citer
J’aime beaucoup, c’est vraiment très réussi.
Ca passe nickel en 1680*1050 sur Opera.
5 novembre 2008 à 7:41 Citer
Niquel en 1440×900 sous Firefox
5 novembre 2008 à 9:53 Citer
Ça roske. En revanche j’aurai p’tete vu le header un poil plus foncé.
5 novembre 2008 à 10:09 Citer
So Cute.
T’as utilisé quoi comme outil pour développer cette css ?
5 novembre 2008 à 10:24 Citer
Ca tape, si mon blog était pas magnifiquement beau je serais jaloux.
5 novembre 2008 à 11:04 Citer
Très sympa.
5 novembre 2008 à 11:12 Citer
Je comprends pas les pokeballs de chaque côté de "Retour au blog".
5 novembre 2008 à 13:52 Citer
xandar > Ouais, je retoucherai un peu ça.
d0H : Bloc-notes, Photoshop, et un poil de Hammer. =D
Anon > C’est une texture de Portal, hein, c’est le contour des vitres de surveillance dans les salles de test.
5 novembre 2008 à 15:09 Citer
C’est moche, c’est Portal style mais c’est moche.
5 novembre 2008 à 15:17 Citer
Plus sérieusement : j’ai rien contre les critiques négatives, mais il va falloir développer un peu si tu veux que j’en tienne compte. -.-
Parce qu’honnêtement, et je me répète, je suis pas du tout convaincu de la qualité de ma css, ni de sa fidélité à Portal, et je demande qu’à l’améliorer.
5 novembre 2008 à 21:41 Citer
Laisse tomber, ta CSS plaira jamais à tout le monde.
Mais pour développer un peu quand même :
Les colonnes de carrés gris foncé sur les côté, je trouve ça bien trop … présent. On a l’impression d’être entre deux murs.
Et au centre on a quoi ? Du gris béton …
Ta bannière est pas mal, mais elle sauve pas le reste.
5 novembre 2008 à 21:56 Citer
Mh, ouais, en fait ça m’étonne pas. Je crois que je vais revoir les backgrounds. Merci pour ta critique.
6 novembre 2008 à 11:40 Citer
Moi j’aime bien justement, ca fait étouffant un peu comme les salles de tests, mais le blog est quand même très lisible.
Je verrai bien un peu plus de caméras par contre.
6 novembre 2008 à 12:25 Citer
Les pokeballs comme dit l’Anonyme, je ne vois pas ce que c’est dans Portal, tu n’aurais pas un screenshot sous la main ? Je trouve que ça fait un peu trop rajouter.
Sinon le blanc de fond tranche trop avec les murs, voit pour mettre un gris très léger pour rappeler ta bannière et unifier le tout.
Le logo Aperture qui apparait quand tu rédiges un commentaire est vraiment bien trouvé, mais il me semble que ça couleur d’origine est le bleu, le orange c’est pour Black Mesa.
Dernière chose si tu veux pousser le trip Portal encore un peu plus loin, tu pourrais cacher des messages enigmatiques (ou images) à la manière du blog d’inso
6 novembre 2008 à 12:56 Citer
Thermostat : Ouais, j’y pensais justement, faudra que je fasse un peu de déco. ;)
G.UNIT : Si, il y a l’orange et le bleu. Si j’ai le temps ce soir je prendrai des screens pour tout ça. Quant aux messages, faut voir… j’ai des idées, je tenterai de mettre tout ça en oeuvre ce week-end. :]
EDIT: Screenz §!
Donc, voici les fameuses pokeballs qui vous inquiètent. Quant à la couleur orange du logo d’Aperture, on peut voir ça par exemple ici, ici ou encore ici. ;]
Ce serait aussi très joli en bleu, je sais pas. C’est peut-être bien aussi de varier un peu les couleurs, vu que j’ai déjà les surbrillances des liens en bleu, ainsi que les titres des articles.
Voilà, sinon j’ai ajouté un message "behind the scenes style". Je vous laisse le trouver, il est pas très loin. J’en ajouterai d’autres un peu partout dans le blog, ça sera marrant, et puis comme le dit G.UNIT, ça permet de pousser le trip un peu plus loin.
J’ai aussi suivi ton conseil par rapport au fond. C’est peut-être mieux comme ça en effet.
Merci beaucoup pour tous ces conseils en tout cas.
9 novembre 2008 à 18:23 Citer
Youhou ! Content de voir que le design soit terminé et que mon aide a été utile =)
Concernant les critiques (et les bons points aussi), voici une liste :
- La bannière demanderait à être un poil plus sombre.
- Une bordure entre le centre de la page et le fond serait effectivement pas mal, là ça tranche trop…
- J’adore le coup d’avoir mis un logo "Aperture Science" dans le textarea des commentaires !
- Et je ne veux pas qu’on vire les pokeballs sachant que c’est la seule partie où j’ai bossé dessus §
- Left 4 Dead cay le bieng §
- …
Nes’
9 novembre 2008 à 18:55 Citer
Beau boulot. Le header est mieux qu’avec le Spy :-’
Après la CSS TF² et la CCS Portal, on aura le droit à la CSS L4D ? :D
3 décembre 2008 à 15:38 Citer
Sympathique, mignon. MAIS Y A PAS DE COMPANION CUBE § Sinon, ça rosk beaucoup x) .