Le fil d'actu GC
Accéder au site
Accéder au site

Partagez
Voir le sujet précédentAller en basVoir le sujet suivant
avatar
vallamir
Membre Émérite
3
Messages : 10867

http://vallamir-and-co.blogspot.fr/
Création de site, le Mer 12 Sep 2018 - 23:38
Hello hello !!!
J'ai parcouru cette section pour voir si on avait déjà abordé le sujet, mais j'ai pas trouvé grand chose ...
Bref voici un topic pour parler de la création de site web.
Je sais que certain y touchent un peu que ce soit via des éditeurs tel que Wix ou en mode plus "hardcore" comme les personnes qui gèrent le site du monde GC et du forum.

Étant moi même "webmaster" à mes heures perdus, je pense qu'il serait intéressant de partager l'expérience de chacun.

Voici la mienne pour commencer ^^
Alors, j'ai quelques notions en html, quelques notions en css, mais ça va pas plus loin. Tout ce qui php, javascript ça je connais pas et je n'ai pas encore trouvé vraiment le moyen d'intégrer du code python sur une page web, parce que ça, python je maitrise.
Note : Python est un langage de programmation pour ceux qui ne connaitraient pas, et ... c'est cool !

Il y a quelques mois je me suis lancé dans la refonte du site d'une association que je gère. Je n'étais pas pleinement satisfait des éditeurs wix ou autre et surtout l'ancien site bénéficiait d'un très bon référencement dans les moteurs de recherche (une petite 10aine d'année derrière lui et pas mal de travail de mes prédécesseur sur cet aspect). Il était donc inconcevable d'utiliser wix ou un autre éditeur similaire pour faire le site. Du coup j'ai fait la méthode bourrin ... partir d'une page blanche et tout code :aie: ... enfin presque... fort heureusement le web est une mine d'or de ressources en tout genre et avec les menus connaissance que j'avais j'ai pu adapter des templates, ajouter des scripts ou encore modifier le style sans trop de difficultés (ça prend juste beaucoup de temps).

Voici donc le résultat, avec un site fonctionnel mais toujours en construction : http://site.esb.judo.free.fr/index.php

J'en profite pour partager deux trois autres liens pour ceux que ça intéresse.

La template de base vient d'ici : https://html5up.net/, la licence est en creative common donc c'est plutôt cool !
L'avantage des templates proposées sur ce site c'est que les site web conçus sont compatibles avec tous les appareils : ordinateur, tablette ou smartphone et si vous faites les choses bien, c'est mieux que la génération automatique de wix ^^

Un petit script là aussi assez cool pour agrandir les images lorsqu'on clique dessus : https://www.lokeshdhakar.com/projects/lightbox2/#download

Hésitez pas à partager vos créations, vos conseils, vos "trucs et astuces", etc.


Un petit Timelaps sur Cities Skylines ?
Clique ici ! Ou ici !
avatar
Yeskiomach
Membre Chevronné

Messages : 868

Re: Création de site, le Jeu 13 Sep 2018 - 10:44
Topic qui m’intéresse énormément, j'ai déjà un peu "touché à tout" mais sans jamais passer par du codage pur et dur (j'ai appris, mais je trouve ça moins efficace, certes c'est plus "personnalisable" qu'avec un éditeur déjà tout prêt, mais le ratio temps/productivité est extrêmement mauvais je trouve, dans le cas où il y a des délais à tenir, comme dans une entreprise par exemple)

Je devrai d'ici quelques jours lancer la création d'un site (pour un projet IRL) donc j'espère que ce topic évoluera et qu'on aura quelques retours d’expérience Smile
avatar
Myname
Directeur de l'Institut d'Économie
Ville hôte des Jeux Olympiques de Galax2018 Nombre d Eiffel remportés Arrivé 2e des Jeux Olympiques d Hinvernia 2013
Messages : 10246

http://squirrel.romukulot.fr/
Re: Création de site, le Jeu 13 Sep 2018 - 12:04
Bon, pour ma part ça ne va pas trop vous étonner je pense mais je ne jure que par Wix
C'est un éditeur intégré donc aucunement besoin de savoir coder, et malgré tout les possibilités de créations sont juste infinies tout en étant très simple mais très complet et surtout complètement personnalisable dans le sens où on peut vraiment partir d'une page blanche et faire ce que l'on veut. En bonus c'est gratuit, on peut y héberger énormément d'images et ils ont un blog génial sur le webdesign et marketing... Enfin bref je pense que vous l'aurez compris, je ne jure que par Wix  king

En tout cas chapeau à tout ceux qui développent et codent leurs créations, c'est bien quelque chose où je n'aurai ni la patience ni les compétences pour :aie:


avatar
Exalight
Modérateur
4 4
Messages : 11388

Re: Création de site, le Jeu 13 Sep 2018 - 12:28
Hello Wink

J'ai pas pour habitude de parler de ma vie privée et de ce que je fais au quotidien car j'ai pour règle de séparer ma vie privée de mes hobbys.

Bref, je suis développeur front-end. Mes technos : les indispensables HTML, CSS (j'utilise SASS pour le CSS), Javascript (Vanilla / AngularJS / ReactJS) et parfois avec les librairies jQuery. Niveau frameworks CSS, j'utilise bootstrap ou materialize.css et je touche un peu à MongoDB et à nodeJS, mais le développement back-end c'est pas mon truc.

@Vallamir : pour ta question du python dans les pages webs, tu as le framework Django qui peut t'être utile : https://www.djangoproject.com/

J'ai regardé un peu ton CSS. Même si c'est du caca pour moi, c'est pas mal pour un débutant Wink

Quelques conseils qui peuvent t'aider :
- https://caniuse.com/ (pratiques pour voir quelles sont les css rules supportées par tout les navigateurs pour une bonne maintenabilité de ton site)
- Lâche les display : block/inline-block/inline et les floats. C'est has been maintenant. Tout bon dev front utilise les flexbox ( https://css-tricks.com/snippets/css/a-guide-to-flexbox/ )
- Pense mobile first. Beaucoup de nouveaux devs qui s'y mettent pensent d'abord à adapter leur design en version desktop, puis tablette, puis mobile... C'est l'inverse qu'il faut faire. Ton code n'en sera que plus maintenable et tu utiliseras beaucoup moins de medias queries.
- sépare tes fichiers ! je vois que ton main.css fait quelques 3000 lignes. Comment veux-tu qu'un dev qui reprenne ton boulot s'y retrouve ? Crée un fichier global.css dans lequel tu mets les styles globales (menu/footer/fontfaces/fontfamily/background) Et tu crées ensuite un fichier css par page. Tu verras, c'est beaucoup plus maintenable comme ça et tu n'es pas obligé de scroller 10 000 lignes pour changer un pointer:cursor; en pointer:none. par exemple :aie:
(Dans mon travail on sépare chaque bloc en composant, chaque composant ayant son html/css/javascript attitré. Merci Angular/React !)
- d'une certaine manière, si tu peux utiliser le moins possible jquery, c'est mieux. Evite de passer tes breakpoints responsives en variables javascript, ça sert à rien. des frameworks comme bootstrap le font en CSS, c'est beaucoup plus léger.
- Réduis ton code Razz
Par exemple :
Code:

 background-image: url("images/bg02.png"), url("images/bg02.png"), url("images/bg01.png");
 background-position: top left, top left, top left;
 background-size: 100% 6em, 100% 6em, auto;
 background-repeat: no-repeat, no-repeat, repeat;

se transforme en

Code:

background : url("images/bg02.png") top left no-repeat 100% 100%,  url("images/bg01.png") top left no-repeat 100% 100%;

(Pourquoi tu fais "100% 6em" ? Ca n'a aucun sens.

Em est basée sur la valeur par défaut de font-size du body, et si tu l'as pas définie, c'est inutile.



Je vais m'arrêter là car j'ai des choses à faire mais si tu as des questions n'hésite pas, j'y répondrai avec plaisir Wink


Dernière édition par Exalight le Sam 15 Sep 2018 - 1:08, édité 1 fois



Toi là ! Oui, toi Invité ! Tu as posté 108 messages sur ce forum, mais arrête de flooder, viens sur la Chatbox !

●2006 - 2018●
avatar
vallamir
Membre Émérite
3
Messages : 10867

http://vallamir-and-co.blogspot.fr/
Re: Création de site, le Ven 14 Sep 2018 - 15:47
Merci Exa pour tes suggestions et remarques !!
Je regarderais ça avec beaucoup d'attention !


Un petit Timelaps sur Cities Skylines ?
Clique ici ! Ou ici !
Contenu sponsorisé
Voir le sujet précédentRevenir en hautVoir le sujet suivant
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum