thème wallpapers

bg62 · février 2013

bonjour

- on manque de thèmes !
- je relance un nouveau p'tit PluXml
alors besoin de pas d'aide .... de conseils et d'avis ...

site de test (basé sur le thème par défaut 1.5.7):
http://refok.p.ht/ ( 1 )
plus simple : http://refok.p.ht/hd4/ ( 2 )

( le super brouillon de départ étant toujours ici :
http://refok.p.ht/hd2/ )

- une fois le nettoyage, les corrections et autres améliorations faîtes, le thème de base en lui-même ( 2 )sera mis à disposition
- utilisation du plugin, modifié, "artGalerie", (http://forum.pluxml.org/viewtopic.php?id=2877) en cours, avec l'aide de "rockyhorror" qui fait un très bon boulot là-dessus

- que pensez-vous de l'allure générale ?

- comment améliorer la "css" ?

- des erreurs de code ? (ne pas faire attention aux liens HS ...)

- des idées au niveau graphisme, look, lettrage, etc etc .... ?

- reste aussi un gros problème au niveau du plugin "plxMyCoinSlider" ( qui me pose ce problème : http://forum.pluxml.org/viewtopic.php?pid=30372#p30372)

- et bien d'autres choses ... il y a du boulot !

alors grand merci à l'avance

k610i · février 2013

Plop,

Déjà tu as compris un point essentiel : une femme dénudée, ça fait vendre ! Haha.

Sérieusement, déjà un premier avis général sur le design après avoir regardé 5 sec': ça fait très site des années 2000 (à cause du fond fumée et de ton visuel dans ton carrousel qui fait google 98).
On a du mal à savoir où regarder parce que c'est très chargé avec les couleurs foncés et les marges étroites. Les largeurs de site de 1000px et moins, ça fait également très 2012 (faut désormais penser aux larges écrans... mais en même temps au petit !).

Si tu veux spécialiser ton thème pour montrer des visuels (wallpaper), tu devrais plus orienter ton site vers un style portfolio où on verrait en premier lieu les différents wallpapers (avec des femmes nues, pour vendre

).
Tu peux par exemple utiliser le chapo des articles pour y mettre un visuel. Du coup, sur ta home, on ne verrait que ton image et éventuellement son titre. Au clic sur ce visuel (ou sur un bouton ou sur le titre), ça renvoie vers l'article avec du texte et ton wallpaper avec plusieurs tailles possibles.

Wouala, mes premières impressions,

KaySix

Jerry Wham · février 2013

C'est sûr que ce n'est pas la sobriété qui caractérise bg62. Mais il faut quand même reconnaître que c'est beaucoup moins chargé que l'ancien...

danielsan · février 2013

1/ le diapo en haut : les images se superposent
2/ les titres de la sidebar sont surlignée comme les liens, ça prête à confusion
3/ la footerbar n'a pas d'arrière plan unie, on a du mal à lire
4/ le fil d’Ariane collé à gauche alors que le site est centré
5/ manque d'aération
6/ je ne vois pas le rapport avec un thème qui s'appelle "Wallpaper" et sa composition.

M'enfin, dans tout ça ce qui me gène n'est ni l'esthétique ni l'ergonomie mais le site en lui même : je ne sais pas si c'est une ferme ou une décharge de contenu. A quoi te servent-ils réellement ? Désolé.
C'est plus une production de liens dans le seul but d'être référencé. Je ne comprends pas le délire.

En tout cas on ne peut que remercier ta participation pour l'élaboration d'un nouveau thème.

Cordialement,

bg62 · février 2013

k610i a écrit:

Plop,

Les largeurs de site de 1000px et moins, ça fait également très 2012 (faut désormais penser aux larges écrans... mais en même temps au petit !).

KaySix

merci

ok pour tout ça et sur ce point précis, comment faire pour être en '20 ....36' ?
au niveau 'adaptation' aux tailles d'écran ...

bg62 · février 2013

Jerry Wham a écrit:

C'est sûr que ce n'est pas la sobriété qui caractérise bg62. Mais il faut quand même reconnaître que c'est beaucoup moins chargé que l'ancien...

'ancien' ? si c'est la blog, il n'est toujours pas modifié ... là c'est pour une autre partie

bg62 · février 2013

danielsan a écrit:

1/ le diapo en haut : les images se superposent
2/ les titres de la sidebar sont surlignée comme les liens, ça prête à confusion
3/ la footerbar n'a pas d'arrière plan unie, on a du mal à lire
4/ le fil d’Ariane collé à gauche alors que le site est centré
5/ manque d'aération
6/ je ne vois pas le rapport avec un thème qui s'appelle "Wallpaper" et sa composition.

M'enfin, dans tout ça ce qui me gène n'est ni l'esthétique ni l'ergonomie mais le site en lui même : je ne sais pas si c'est une ferme ou une décharge de contenu. A quoi te servent-ils réellement ? Désolé.
C'est plus une production de liens dans le seul but d'être référencé. Je ne comprends pas le délire.

En tout cas on ne peut que remercier ta participation pour l'élaboration d'un nouveau thème.

Cordialement,

merci :
1 - vois dans le premier post : bug sur le plugin et là pour le codage .... ?
2 - bonne question : effectivement il y a besoin de pas mal d'épuration dans la css >> cherche spécialiste

3 - ça pas grave, ... brouillon
4 - ok : solution avec la css ???
5 - va falloir en faire effectivement
6 - le nom du thème : bof ... pour des fonds d'écran, s'il faut le changer ce n'est qu'un détails
- 'si c'est une ferme' : tu dois parler des liens en bas ? ça aussi ... le bas est encore au broullion (ps : les liens ne sont que 'internes' mais pas là sur la demo, protégée des moteurs de toutes façons ..)

@+

danielsan · février 2013

ah ben si c'est un site démo, excuse-moi alors

Fais plutôt un LoremIpsum qui mettra plus en valeur ton thème alors ...
Si ce qui est en bleu sont des liens et en blanc le texte, alors il y a plus de liens que d'image que de texte.
Du coup, avec ce contenu, il faudrait repenser la structure de tes liens, les ordonner car cela ne donne pas envie de cliquer ]:D

Jos · février 2013

Si tu as besoin d'un coup de main en css, je peux t'aider. Fais moi une liste de ce que tu veux modifier.

bg62 · février 2013

Jos a écrit:

Si tu as besoin d'un coup de main en css, je peux t'aider. Fais moi une liste de ce que tu veux modifier.

merci, sympa

1 - déjà nettoyer un peu tout le binz que j'ai fait dedans
2 - mettre en conformité
3 - faire un codage propre

en plus, pour l'instant:
- centrer les beadcrumbs dans la css par exemple
- un moyen de donner des bords 'arrondis' au images présentées dans le chapô
- également bords arrondis pour tous les boutons : recherche, contact,commentaires
- modifier un peu la hauteur du champ de 'rechercher'
- pour tout ce qui est "actuellement" encore surligné : bleu + surligné, pouvoir avoir :
--normal : bleu
- hover : rouge
- cliqué : bleu + surligné
ensuite ....

Jos · février 2013

Je regarderai çà dés que je peu. Parcontre, ou puis-je télécharger le thème?

bg62 · mars 2013

Jos a écrit:

Je regarderai çà dés que je peu. Parcontre, ou puis-je télécharger le thème?

il est en cours ... mais si tu le veux : mp et je t'envoie un zip

@+

bg62 · mars 2013

les deux liens ont été modifiés ... mais ... help me !

Jos · mars 2013

Ok je vais t'envoyer un mail pour que tu me l'envoi et que je regarde un peu.

bg62 · mars 2013

Jos a écrit:

Ok je vais t'envoyer un mail pour que tu me l'envoi et que je regarde un peu.

ok donc : @+
ps : envoyés

Jos · mars 2013

Oh le chantier

...

Bon je t'ai modifié l'un de tes thème, je pense que çà devrai aller et que tu devrai te débrouiller mieux maintenant. Si tu as d'autres questions dans ce genre, n'hésite pas à me les poser sur ce fil.

bg62 · mars 2013

Jos a écrit:

Oh le chantier ...

Bon je t'ai modifié l'un de tes thème, je pense que çà devrai aller et que tu devrai te débrouiller mieux maintenant. Si tu as d'autres questions dans ce genre, n'hésite pas à me les poser sur ce fil.

ça pour le 'chantier' tu n'as pas du être déçu

...
- en tous cas, grand merci et ça avance maintenant
j'ai fait quand même un bon nettoyage, plus quelques 'images' perso ...

-- donc en premier sur le thème de " base "
ici : http://refok.p.ht/hd3/

-- 5 erreurs W3C pour la css !!!
-- 11 Errors, 2 warning(s) pour le html5

- comment 'ajuster' les breadcrumbs à la largeur : pour l'instant ils sont à 100% , la largeur étant à 96% ?
- pour le 'plugin' " MyCoinSlider" en haut : serait-il possible de ne mettre les bords arrondis QUE autour des images et non globalement comme actuellement ?
- comment augmenter un peu la largeur du champ de recherche du moteur (en haut de la sidebar) ?
- les 'images' ajoutées dans le thème pour agrémenter le 'look' ne sont pas prises par les moteurs (donc pas de title ni d'alt) ...

petit à petit on va finir pas le terminer ce thème ...

et il serait bien d'avoir des avis pour progresser

@+

Madrileño · mars 2013

Sympa comme thème, préférait celui avec les pates d'animal (que j'ai remarqué il y a quelques heures lors de la nouvelle visite sur le site).

Jos · mars 2013

Suite à ton mail, j'ai un peu regardé. Personnellement, j'aèrerai un peu le site. Niveau css; voici ce qui ressort, rien de bien grave car les erreurs principales viennent d'un de tesplugin :

URI : http://refok.p.ht/hd3/themes/joss/style.css
11 Erreur lors de l'analyse grammaticale. { margin : 0; padding : 0; border : 0; font-family : arial, helvetica, sans-serif; font-size : 1em; font-weight : normal; font-style : normal; text-decoration : none; }
URI : http://refok.p.ht/hd3/plugins/plxMyCoinSlider/coin-slider/coin-slider-styles.css
8 .coin-slider La propriété zoom n'existe pas : 1
16 .element La propriété zoom n'existe pas : 1
67 .cs-buttons a Propriété erronée : background top n'est pas une valeur de color )
75 a.cs-active Propriété erronée : background top n'est pas une valeur de color )

bg62 · mars 2013

grand merci

dans ce cas
- peut-on corriger ?
- ou simplement faire 'sauter' les erreurs signalées ?
et quand tu dis " aérer " tu le sens comment ton 'bol d'air' ?
@+

Jos · mars 2013

Pour l'erreur dans ton thème, à mon avis çà vient de ton background-size. Les autres erreurs viennent du plugin PlxCoinSlider.

Dans aérer je disai, mettre plus d'espace entre les articles par exemple.

bg62 · mars 2013

Jos a écrit:

Pour l'erreur dans ton thème, à mon avis çà vient de ton background-size. Les autres erreurs viennent du plugin PlxCoinSlider.

Dans aérer je disai, mettre plus d'espace entre les articles par exemple.

ok , pour le plugin, pas trop grave je verrai après
pour "espacer", je vais voir ça ...
pour "background-size" j'ai ceci:

body {
margin : 0;
padding : 0;
background : url(img/fond25555.jpg) center no-repeat fixed;
background-color : #444444;
  -webkit-background-size: cover; /* pour Chrome et Safari */
  -moz-background-size: cover; /* pour Firefox */
  -o-background-size: cover; /* pour Opera */
  background-size: cover; /* version standardisée */
font-family : arial, helvetica, sans-serif;
color : #ffffff;
font-size : 0.9em;
line-height : 1.2em;
letter-spacing : 0.05em;
}

un peu comme le modèle sur alsacréations:

html { 
  margin:0;
  padding:0;
  background: url(image/bg.jpg) no-repeat center fixed; 
  -webkit-background-size: cover; /* pour Chrome et Safari */
  -moz-background-size: cover; /* pour Firefox */
  -o-background-size: cover; /* pour Opera */
  background-size: cover; /* version standardisée */
}

donc ... vois pas trop ce qui peut clocher ...
d'autant que cette partie est valide W3C

danielsan · mars 2013

1/ l'image en arrière plan met 10 plombe à s'afficher
2/ ce blanc sur ce gris fatigue les yeux. Idem pour ce bleu
3/ l'ombre des H1 gêne la lecture. faudrait soit la réduire soit agrandir la taille du texte
4/ pas de distinction entre chaque article
5/ longueur de ligne trop importante, gêne la lecture.
6/ je mettrais le "lire la suite" en bout de ligne
7/ menu en footer illisible (manque un fond adéquat)
8/ pourquoi une div class="line" au lieu d'un HR ???
9/ formulaire commentaire n'exploite pas la grande largeur
10/ change ton diapo, toutes les images s'affichent à la suite puis se remettent en place
11/ d'une manière générale : manque de profondeur dans la répartition des bloc. Rien n'est mis plus en avant que les autres ...

Courage.

Cordialement,

Jos · mars 2013

C'est bon je vois d'où vient l'erreur : au début de ton css à mon avis tu as du vouloir faire un reset css mais il manque quelque chose.

Remplace çà :

{
margin : 0;
padding : 0;
border : 0;
font-family : arial, helvetica, sans-serif;
font-size : 1em;
font-weight : normal;
font-style : normal;
text-decoration : none;
}

Par çà

* {
margin : 0;
padding : 0;
border : 0;
font-family : arial, helvetica, sans-serif;
font-size : 1em;
font-weight : normal;
font-style : normal;
text-decoration : none;
}

Les conseils de Danielsan sont très juste, ya encore du boulot

bg62 · mars 2013

merci à tous les deux

je suis dessus ... ça va "viendre" :8 ....

voila où j'en suis pour le thème de base:
http://refok.p.ht/hd4/

@danielsan : j'en ai fait pas mal, mais pour modifier 'lire la suite' ... je pense qu'il faut toucher au 'core' ...
@joss : effectivement, mais je l'ai passée à la moulinette et la css est maintenant valide

les anciennes versions sont ici :
http://refok.p.ht/hd2/
http://refok.p.ht/hd3/
(pour voir la progression .... )

qu'en pensez-vous ?

bg62 · avril 2013

nouvelle "version" presqu'aboutie .... :
http://refok.p.ht/
mais qui râme à mort et surtout, je pense à cause de " plxMyCoinSlider " ...
un p'tit coup de main pour optimiser tout ça serait le bienvenu, ensuite je mets en ligne, et pour les thèmes je ferai un bon nettoyage pour les partager

@+
un autre petit dossier en ligne, mais qui connait quand même un peu le même genre de problème :

marilyn monroe
ça finit même par donner envie de le désactiver à force, mais ce serait dommage ... :mad:

i M@N · avril 2013

pour ton souci de plxMyCoinSlider :
http://refok.p.ht/ themes/wall/style.css ligne 111 :

[== CSS ==]
header {
    margin-top: 25px;
/*    overflow: hidden;*/
    padding: 20px 0 10px;
}

http://www.unesourisetmoi.info/minimal/ themes/ma/style.css line 100 :

[== CSS ==]
header {
    margin-top: 25px;
/*    overflow: hidden;*/
    padding: 20px 0 10px;
}

Voilà ça fait 100€. Merci.

Stéphane · avril 2013

au passage corrige ton code html, tu as des erreurs.
il ne faut pas de code html entre </head> et <body>

bg62 · avril 2013

@i M@N :
viens d'essayer pour le premier en local, mais je ne vois aucune différence ...
l'annulation de cette ligne est censée faire quoi ?

bg62 · avril 2013

Stéphane a écrit:

au passage corrige ton code html, tu as des erreurs.
il ne faut pas de code html entre </head> et <body>

j'ai ceci :

</head>
	<div id="menu">
		<ul class="menu_left">
			<li class="home"><a href="http://www.unesourisetmoi.info" title="fonds d'écran">Fonds d'écran</a></li>
			<li class="wiki"><a href="http://www.unesourisetmoi.info/bgmenu/depart.php" title="fonds d'écran gratuits">Fonds d'écran gratuits</a></li>
			<li class="ressource"><a href="http://www.unesourisetmoi.info/bgmenu/creations.php" title="créations numériques">Créations numériques</a></li>
			<li class="forum"><a href="http://www.unesourisetmoi.info/bgmenu/webmaster.php" title="webmastering">Webmastering</a></li>
			<li class="blog"><a href="http://blog.unesourisetmoi.info/" title="référencement efficace">Référencement efficace</a></li>
		</ul>
	
	</div><!-- menu -->
	<br />
<body id="top">

	<header role="banner">

		<div class="content">

			<div id="header-title">
				<?php $plxShow->mainTitle('link'); ?>
			</div>
			<?php eval($plxShow->callHook("MyCoinSlider")) ?>
			<p>
				<?php $plxShow->subTitle(); ?>
			</p>

		</div>

	</header>

comment puis-je corriger alors ?

Stéphane · avril 2013

supprime

<div id="menu">
		<ul class="menu_left">
			<li class="home"><a href="http://www.unesourisetmoi.info" title="fonds d'écran">Fonds d'écran</a></li>
			<li class="wiki"><a href="http://www.unesourisetmoi.info/bgmenu/depart.php" title="fonds d'écran gratuits">Fonds d'écran gratuits</a></li>
			<li class="ressource"><a href="http://www.unesourisetmoi.info/bgmenu/creations.php" title="créations numériques">Créations numériques</a></li>
			<li class="forum"><a href="http://www.unesourisetmoi.info/bgmenu/webmaster.php" title="webmastering">Webmastering</a></li>
			<li class="blog"><a href="http://blog.unesourisetmoi.info/" title="référencement efficace">Référencement efficace</a></li>
		</ul>
	
	</div><!-- menu -->
	<br />

et apres </header> rajoute

<nav role="navigation">	
		<ul class="menu_left">
			<li class="home"><a href="http://www.unesourisetmoi.info" title="fonds d'écran">Fonds d'écran</a></li>
			<li class="wiki"><a href="http://www.unesourisetmoi.info/bgmenu/depart.php" title="fonds d'écran gratuits">Fonds d'écran gratuits</a></li>
			<li class="ressource"><a href="http://www.unesourisetmoi.info/bgmenu/creations.php" title="créations numériques">Créations numériques</a></li>
			<li class="forum"><a href="http://www.unesourisetmoi.info/bgmenu/webmaster.php" title="webmastering">Webmastering</a></li>
			<li class="blog"><a href="http://blog.unesourisetmoi.info/" title="référencement efficace">Référencement efficace</a></li>
		</ul>
	
</nav>

tant qu'à faire du html5 autant bien le faire.
si tu as du code css associé à ta div menu dans ton fichier css (#menu), reporte le sur la balise nav

nav[role=navigation] {
....
}

thème wallpapers

Réponses