Espace-Temps 6 :: Consulter le sujet - Design pour mon site

Espace-Temps 6 http://et6.free.fr/

Design pour mon site http://et6.free.fr/viewtopic.php?f=19&t=959	Page 1 sur 2

Auteur :	Arkthus [ Dim 06 Nov 2005 04:16:45 ]
Sujet du message :	Design pour mon site
Voilà un fake screen que j'ai réalisé pour donner une idée du nouveau design que je veux donner à mon site : http://fantasygate.free.fr/DIdizpreview.png Le truc c'est que je ne sais mettre en page que de la façon dont j'ai procédé pour le design actuel, de simples tableaux Donc j'aimerais savoir comment créer ce genre de design, si le HTML suffit... Mais quelques précisions : je souhaite lorsque ma souris survole les écritures "Livre d'or", "Forum", ou "Liens", que ça fasse une lueur externe Les rubriques qui sont sur la barre bleue affichent un menu déroulant (designé en bleu avec des scanlines je pense) avec les rubriques prévues dedans. La zone blanche n'a pas une taille fixe bien entendu, et j'ai besoin de pouvoir mettre des tableaux dedans, pour conserver la mise en page acteulle dans cette zone (à savoir les petites images d'un côté et les textes de l'autre) Quelqu'un saurait faire et m'expliquer comment ?

Auteur :	UnknownX [ Dim 06 Nov 2005 14:05:36 ]
Sujet du message :
La mise en page général ne devrait pas être trop compliqué à faire en simple HTML avec des tableaux, je peux d'aider pour ça. Le problème sera pour le menu déroulant et la lueur au servol que je ne peux faire qu'en Javascript donc je peux peut m'occuper de la mise en page mais il faudrait que quelqu'un se propose pour faire un systeme plus sympa que le javascript...

Auteur :	Arkthus [ Dim 06 Nov 2005 16:20:19 ]
Sujet du message :
pour la mise en pages avec tableux j'imagine que je devrai partager l'image de Xeric en plusieurs morceaux qui seront assemblés grâce aux tableux, je me trompe ? pour le menu j'ai trouvé quelque chose je crois ^^ http://pompage.net/pompe/deroulants/ Sauf que je comprends pas tout :/

Auteur :	UnknownX [ Dim 06 Nov 2005 16:29:27 ]
Sujet du message :
Pas forcement. Tu fais un grosse image représentant toute la partie suppérieur et avec un commande, on peut choisir les coordonée de la zone de lien, tout ça en HTML. Pour le menu déroulant, j'étudis ça. Edit : Et bien...Comme c'est du CSS je suppose qu'il faut présenté les ligne de commande non HTML dans head sous cette forme par exemple : • Code <style type="text/css"> <!-- body { background-image:url("background.png"); background-repeat:repeat-x; background-position:0% 100%; } a.lien1 { color:#FFFFFF; text-decoration:none; font-weight:bold; } a.lien1:hover { color:#F8E850; text-decoration:none; font-weight:bold; } a.lien2 { color:#000000; text-decoration:underline; font-weight:bold; } a.lien2:hover { color:#000000; text-decoration:none; font-weight:bold; } --> </style>

Auteur :	Arkthus [ Dim 06 Nov 2005 17:14:59 ]
Sujet du message :
pour le survol, j'avais pensé faire 4 versions de l'image de titre : une sans survol, une quand on survole "Livre d'or", une quand on survole "Forum", une quand on survole "Liens" Je vais tenter quelque chose sous WebExpert, voir si j'y arrive ou pas (après tout j'ai tâtonné la première fois, je tâtonnerai ici aussi lol) Je donne des nouvelles après (et je vais bosser directement sur la base de l'ancien design en changeant des valeurs et tout ça, de façon à conserver les contenus) EDIT > Je progresse, ça commence à ressembler à ce que j'ai ! Bon par contre les menus déroulants ne sont pas réalisés (et les rubriques ne sont pas sous forme de texte sur la page, mais sous forme d'image, il va donc falloir faire une zone sur l'image, qui au survol donnera le menu) Autre chose : le survol ne fonctionne pas, j'ai fait le tuto avec le javascript, mais au lieu d'appliquer sur un simple href, j'ai fait sur une zone d'image, et bien entendu, ça ne marche pas... Sous Fofox la souris survole, on peut cliquer, ça amène vers le lien sans prob, mais pas de lueur externe. Sous IE, on ne peut même pas cliquer ! Voici un screen, sous firefox : http://fantasygate.free.fr/screen.gif Ca y est !!! Les liens marchent au survol ! Problème : je ne peux les survoler que sous Firefox, je ne pige pas pourquoi mais IE ne veut pas que je clique sur ces liens... il déconne :p

Auteur :	SuperSeb [ Dim 06 Nov 2005 22:23:37 ]
Sujet du message :
T'as quoi contre le Javascript, UnknownX ?

Auteur :	UnknownX [ Dim 06 Nov 2005 22:31:27 ]
Sujet du message :
• SuperSeb T'as quoi contre le Javascript, UnknownX ? Manque de stabilité sur certaine version de navigateur. je préfère faire un site ou je suis assuré qu'il fonctionnera partout. Je n'utilise le javascript que lorsqu'il est utilisé que dans un but estétique, en gros pour que si le navigateur ne le prend pas en compte, le site soit tout de même visitable. Sans doute suis-je un peu parano de penser qu'il en existe encore qui on de vieilles versions de navigateur mais il arrive que certaines personnes pas très doué en PC active toutes les protections possible sur leur navigateur, ce qui bloque le javascript (c'est le cas sur les PC de mon lycée).

Auteur :	Arkthus [ Lun 07 Nov 2005 00:31:36 ]
Sujet du message :
Bon : http://pompage.net/pompe/deroulants/ C'est bien ce genre de chose que je voudrais faire, mais à la place des textes de la liste, je voudrais une zone cliquable... ai-je donc le droit de mettre tout ça entre la balise map et au lieu de mettre un texte mettre le <area ...> comme premier élément de la liste ? Ca marche mais les menus apparaissent pas au bon endroit, mais tout en haut de la page... vais-je un jour arriver à faire ce design ? groumpf ! Bon allez, j'abandonne les menus déroulant, j'ai une alternative plus sympa : Au lieu d'avoir une multitude de pages web, je n'aurai que les 5 présentes (+des pages connexes comme le disclaimer, le contact, les liens et l'historique du site), où toutes les créations de chaque catégorie seront entreposées, et hiérarchisées avec des étiquettes, ainsi on pourra naviguer dans la page par liens hypertextes (avec une invitation à retourner en haut de page sous chaque création [écrit en petit bien entendu]). Ca me simplifie la tâche, et ça évite la surenchère de javascript, tout en conservant un design plus sobre que l'ancien. Qu'en pensez-vous ?

Auteur :	Arkthus [ Mar 08 Nov 2005 02:30:14 ]
Sujet du message :
excusez le double post, mais tadaaa : En avant première, ce qui sera le futur design de mon site ! Actuellement, voilà à quoi il ressemble (actualisez si la colonne de gauche vous ennuie avec IE) : http://fantasygate.free.fr Voici à quoi il ressemblera (seuls les liens Livre d'Or, Forum, Liens et Haut de page marchent, le reste a été mis en prévision de la création des nouvelles pages) d'ici quelques jours : http://fantasygate.free.fr/index2.htm J'en ai bien chié pour le faire, mais j'ai réussi ! (attention, testé uniquement sous IE et Firefox, donc si ça marche pas sur les autres, j'y peux pas grand chose... et normalement ça tient sur une résolution de 1024x768)

Auteur :	Lynx Aenslade [ Mar 08 Nov 2005 09:46:51 ]
Sujet du message :
j'ai firefox, je suis en 1204*768 et c'est super ^^ bravo Xeric

Auteur :	Arkthus [ Mar 08 Nov 2005 13:54:01 ]
Sujet du message :
pas de décalage de l'image du bas de la page ? (parce que ça décale rien en 1280*1024 mais comme c'est un système de tableaux qui m'a servi pour la caler correctement, je me posais la question si c'est pas décalé en 1024)

Auteur :	UnknownX [ Mar 08 Nov 2005 21:43:54 ]
Sujet du message :
Il y a un décalage de 2 pixels en bas vers la gauche avec firefox. Par contre, je te déconseil de prendre pour résolution 1024 car la plupart des PC sont configuré par default en 800 pixels de largeur (notemment des les établissements scolaires...). A la rigueur, tu devrais proposer les deux résolutions aux visiteurs sur une page d'acceuil et trouver un systeme pour que les deux partie du site utilise le même fichier pour trouver le contenu de la page. Pour cela, tu as le choix entre le CSS ou le PHP. Je ne me suis pas encore bien approfondi sur le CSS pour te dire comment faire mais en PHP, il suffit d'utiliser la commande "include" qui est la seul que je maitrise =p Si ça t'interesse, je peux te faire un petit tutorial pour t'apprendre le fonctionnement.

Auteur :	Arkthus [ Mer 09 Nov 2005 02:06:55 ]
Sujet du message :
il y a un décalage de deux pixels vers lagauche sous firefox en 1024 ? grrr j'espère qu'il y a un code javascript qui cherche la résolution utilisée sinon je m'en sortirai pas quant aux PC en 800, je suis pas d'accord, d'un part les particuliers qui sont en 800 ne sont pas légion sur mon site (puisque ce sont souvent des gens qui n'ont pas envie de se faire chier) pour les établissement scolaires, pardon de l'expression, mais eux je m'en bats les couilles... En plus quand je vois comment sont configurés les PC de ma fac, ça me fait bien rire, c'est une fac d'informatique et les PC tournent mal, plantent etc.. à croire que les profs d'infos avaient pas envie de se soûler... Bre,fl es étabilssements scolaires, tant pis pour eux, je vais pas m'adapter au techos faignant qui n'est pas foutu d'adapter els PC de l'établissement aux résolutions actuelles... quant aux particuliers en 800, je doute qu'ils soient si nombreux bref, je m'adapte aux 1024 parce que je pense au contraire que la plupart des utilisateurs sont passés en 1024, à moins d'avoir un très vieux PC par contre va falloir que je corrige cette misère de barre du bas... (et t'es sûr que c'est pas plutôt 1 pixel de décalage)

Auteur :	UnknownX [ Mer 09 Nov 2005 18:59:06 ]
Sujet du message :
Plus de décalage à signaler. Par contre, je pense que ça serait mieux si tu laissais quelque pixel supplementaire dans la parti verte inferieur (tout en bas) de façon à marquer la fin de la page.

Auteur :	Arkthus [ Mer 09 Nov 2005 19:48:48 ]
Sujet du message :
c'est bizarre ce décalage... chez certains sous IE pas de décalage en 1024, mais sur le Pc de mon père, sous IE en 1024 : décalage c'est une histoire de fous cette barre

Auteur :	Fuokusu [ Mer 09 Nov 2005 19:58:33 ]
Sujet du message :
IE en 1440*900 : rien de tout cela,à part un petit décalage en bas de la page. En tout cas sur mon portable.

Auteur :	SuperSeb [ Mer 09 Nov 2005 20:09:22 ]
Sujet du message :
Faut jouer avec le fait que certains navicateur sur certains pc ont été réglés afin de ne pas afficher la barre d'état, voir afin d'avoir des petites icônes... C'est peut-être ça qui change...

Auteur :	UnknownX [ Mer 09 Nov 2005 21:40:24 ]
Sujet du message :
Pour rêgler ce problème tu devrais un peu ordoner ton code source, yen a partout et plein de balise que se ferme tout à la fin.Tu devrais composer de tout d'une façon plus simple : Un tableau général aligner au center de largeur égale à la tail de l'image suppéroieur, dans ce tableau, la première ligne avec un colspan="3" (représentera 3 colonnes) puis à la ligne suisvant, une colonne pour la partie centrale gauche (vide vert), une colonne pour la partie centrale (contenu de la page) et une dernière pour le vide droite vert, et enfin une dernière ligne en colspan="3" pour l'image inférieur. Ainsi, toute la page sera dans un grand tableau général qui respectera chaque largeurs et donc, une stabilité optimale.

Auteur :	Arkthus [ Mer 09 Nov 2005 23:30:30 ]
Sujet du message :
je tenterai ça ce week end alors ^^ j'ai besoin de respecter juste la taille de l'image du haut ou faut aussi que je spécifie les tailles pour le reste ?

Auteur :	UnknownX [ Mer 09 Nov 2005 23:45:25 ]
Sujet du message :
Précise le plus possible les taille mais sache une chose : Internet explorer supporte mal une image de la taille de la cellule qui la contient et risque de mettre un espace en conséquence. Il faudra donc trouver une alternative...

Auteur :	Arkthus [ Ven 11 Nov 2005 01:39:37 ]
Sujet du message :
ils sont chiants chez Microsoft quand même !

Auteur :	UnknownX [ Ven 11 Nov 2005 01:47:22 ]
Sujet du message :
Tu peux toujours éviter ce problème en méttant toute ton image en background et en placant tes liens avec une image transparente par dessus.

Auteur :	Arkthus [ Ven 11 Nov 2005 01:51:52 ]
Sujet du message :
mes liens se highlightent au passage de la souris... donc en background je peux pas le faire

Auteur :	Arkthus [ Dim 13 Nov 2005 17:02:43 ]
Sujet du message :
avec cette solution, je suis obligé d'utiliser du javascript parce que selon qu'on est sous IE ou firefox, l'image du haut n'est pas alignée avec le fond, ce qui fait que pour mes liens qui changent, je suis pas dans la mouise... et en plus quoi que je fasse, l'image du bas est décalée de 2 pixels... tout ça parce que IE ne gère pas la transparence du PNG, sinon je m'emmerderais pas je ferai une image en PNG de la même taille que celle du titre, et normalement elle serait alignée, mais non... IE ne gère pas la transparence... Bon finalement j'ai fait un gif, l'image ne perd rien en qualité... EDIT > tout compte fait plus de problème, j'ai mis ma balise map en dehors du script, et j'y ai fait appel dans le script et ça fonctionne sans problème. voilà le résultat, j'ai gagné 2 Ko par rapport à la taille originale : http://fantasygate.free.fr/index3.htm

Auteur :	darksonic [ Dim 13 Nov 2005 18:03:32 ]
Sujet du message :
J'te conseillerais de faire passer ton xeric derriere le mot dessin et centrer l'avant plan parce qu'à gauche ça fait un peu vide comme il y a rien.

Page 1 sur 2	Le fuseau horaire est UTC+1 heure [Heure d’été]
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group http://www.phpbb.com/