Découper et intégrer une maquette de blog
Ce tutoriel a été réalisé en collaboration avec Grafikart. Nous allons créer un blog, avec une partie portfolio, sous la plateforme wordpress. En ce qui me concerne, j'ai réalisé la partie design/découpage et intégration HTML/CSS. La partie Wordpress est disponible chez Grafikart. Les fichiers sources sont disponibles (PSD + HTML / CSS ), il suffit juste de créer un compte et de devenir premium. Les pages sont valides w3c.





Le taulier du coin !
Un projet, une collaboration ?
Mes derniers projets !
vous avez l'air de savoir exactement ce que les gens veulent
Je l'ai réalisé, car il n'y a pas vraiment de tutoriel concernant ce sujet-là, soit ce sont des articles, soit des tutoriels vidéos, mais payant^^. Ici c'est gratuit :)
Mémo technique qui marche toujours
Merci pour le conseil :)
Quant au CSS, je suis agréablement surpris de voir que tu développes tout en .class et non en #id ? Est-ce volontaire ? Pour ma part les éléments comme wrap header content footer sont toujours en #id et les mise en forme internes en .class.... Bref, chacun son style mais ta façon me paraît vraiment plus ergonomique
Yes j'utilise que les .class, et les #id pour du Javascript/jQuery, une question d'habitude.
En ce qui concerne la partie Wordpress de Grafikart, elle arrive d'ici la fin de la semaine prochaine, un article est prévu sur son blog :)
Bonne contination et je vais voir cette partie N°2 ce soir ^^
Surtout que l'enregistrement n'a pas été préparer (from sratch) et les erreurs même les meilleurs ne sont pas à l’abri, comme tu dis :)
merci
Juste en dessous de la vidéo sur la droite, FICHIERS SOURCES, lorsque tu es connecté sur le site.
sur tutoriel je choisi celui-ci et la
quand je clique à droite sur télécharger les sources
j'arrive tjs sur devenez membre
y acomme un défaut ?
Vraiment bizarre, tu es le seul à avoir ce problème... sous quelle navigateur es-tu ?
Vraiment bizarre ...
si tel était le cas je pense que le menu en bas de la video
changerait
?
là j"essai avec internet explorer
?
Il n'y a pas de compte Croque dans la BDD. Crées toi un compte ^^
Petite question : quelqu'un aurait une idée du raccourcis équivalent sur Mac de "alt+clic droit" pour sélectionner directement un calque selon l'élément sur lequel on a cliqué ?
Par avance merci.
Tu as la réponse dans ta question -> alt + clic droit, pareil que sur Windows :)
Oui car chez moi cela marche bien ^^
Excellent cette collaboration avec Grafikart, cela ma permis de découvrir ton blog.
Pour les background avec des repeat, je travaille souvent avec des images de 1px de haut (ou de large pour les repeat-x) les images sont plus légères surtout pour les gros sites.
Sinon, impeccable !
PS : quel éditeur HTML/CCS ... utilisez-vous? Merci d'avance
J'utilise Netbeans .
- Google donne des explications sur l'optimisation de ses pages qui sont très intéressantes :
http://code.google.com/intl/fr/speed/articles/optimizing-images.html
http://code.google.com/intl/fr/speed/articles/reflow.html
http://code.google.com/intl/fr/speed/articles/optimizing-css.html
- Pixel Perfect est un addons à firebug très intéressant pour régler précisément des distances comme son psd
;)
Merci pour tes suggestions ^^
Mais voilà, je me retrouve confronté à un problème que je n'ai encore jamais rencontré. C'est au sujet de mon menu. Il se trouve quand fait sur ma page , l'ordre de mon menu est inversé :
"contact, liens, archives, a propos, artistes, news"
au lieu d'avoir :
"news, artistes, a propos, archives, liens, contact"...
Je me demande bien d'où peut venir ma faute.
Voici mon code html:
<div class="menu">
<ul>
<li><a href="#">News</a></li>
<li><a href="#">Artistes</a></li>
<li><a href="#">A propos</a></li>
<li><a href="#">Archives</a></li>
<li><a href="#">Liens</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
CSS:
.menu{float:right; width:461px; height:50;}
.menu ul li{float:right; padding-right:15px;}
.menu ul li a {font-family: 'CargoTwoSFRegular'; font-size:25px; color:#cccccc; line-height:50px; text-decoration:none;}
Si quelqu'un pouvait éclairer ma lanterne, ça m'enlèverai une belle épine du pied...
Merci beaucoup ;-)
Mon .menu ul li était en float right et non en float left...
Désolé
;-)
comment obtenir le fichier psd ainsi
que le fichier sources pour intégrer
cordialement
Il suffit de t'inscrire sur CreatiQ;
Je viens de débuter votre tuto j'en suis a 35min et ça laisse déjà présager d'une excellente formation.
Ça change des vidéos payantes avec des qualités sonores et didactiques misérables que l'on peut trouver sur certain sites que je ne citerait pas.
Alors même si je vous donnerais un avis plus complet une foi le tuto terminé, je tiens déjà à vous remercier pour cette 1ere 1/2 heure
Rodleg
résultat...
Excellent !!!
Comme dit dans le précèdent message (désolé du doublon) les tutos d'une telle qualité sont rares et certain acteurs du secteur du tutoriels qui vendent des formations (soit-disant a petit prix +/-5euros), de qualité déplorable, devrait prendre exemple sur vous
Pour conclure je n'aurais qu'une seul chose à dire MERCI
RodLeg
Merci beaucoup :)
Il suffit d'être premium pour avoir accès au sources des tutoriels .
Très bon tuto :)
La ou j'en suis il y a un problème, en étant attentif au background (bkg-body) on voit que c'est décalé. Peut-on régler cela ? (et avec un zoom on voit nettement que c'est décalé).
Par contre j'ai une petite question : j'ai utilisé la police Lobster comme dans le tuto et sous Chrome, elle n'est pas lisse comme sous IE ou FF. Est-ce que tu saurais d'où ça vient ? (J'ai également utilisé FontSquirel)
Merci.
svp le fichier psd