Comment créer son site web et le rentabiliser ? Annonces gratuites
Adsense - Astuces de Cuisine - Outils gratuits - Art Graphique - Recherche de voyage - Blog gratuit - Flux de blog

Créer un blog
 
Web www.lasbass.com
Bienvenue sur le forum d'aide à la création : Création de site, cuisine, musique...
Enregistrez vous pour pouvoir poster, et suivre plus facilement la vie du forum.

# Pub Google pour Rentabiliser son site - Service gratuit

# Hébergement
Nom de domaine
Outils pour créer son site internet

# Creer une boutique web gratuitement

# Forum création
# Javascript
# Kit graphique
# Partenaires
Des nouvelles du site ?




Adaptabilité à la résolution

 
Poster un nouveau sujet   Répondre au sujet    Forum d'aide à la création Index du Forum -> Mise en page
Voir le sujet précédent :: Voir le sujet suivant  
Auteur Message
dede-70



Inscrit le: 07 Fév 2006
Messages: 3
Localisation: Lure

MessagePosté le: Mar Fév 07, 2006 5:38 pm    Sujet du message: Adaptabilité à la résolution Répondre en citant

Bonjour à tous !

Je débute dans la création de site internet ! Le probleme courant lié à la résoution avec les pages HTML se pose devant moi. Comment faire pour que le site s'adapte à "toutes" les résolutions d'écrans ? Beaucoup de personnes parlent d'un technique avec les % ! Qu'en est il vraiment comment faut - il faire ? avec Frontpage ? Dreamweaver ? Pouvez vous m'indiquer la procédure à suivre ou un lien expliquant tout ça que je puisse étudier la chose.

Merci d'avance
Revenir en haut de page
Voir le profil de l'utilisateur Envoyer un message privé
claire
Administrateur - Site Admin


Inscrit le: 29 Avr 2004
Messages: 192

MessagePosté le: Mer Fév 08, 2006 11:40 am    Sujet du message: Répondre en citant

Salut Smile

je vais essayer d'expliquer simplement...

Pour que ton site soit élastique, il faut le construire avec des blocs div (me demande si ça marcherait avec des tableaux ?)

Donc dans ton code, entre les balises <body> </body> tu écris :
<div> </div>
ça te crée un grand bloc div général, tout le reste devra être compris entre ces deux balises div.

Ensuite tu vas vouloir mettre différents blocs en place, un bloc menu et un bloc texte par exemple. Dans mon exemple ci-dessous le bloc texte est à gauche et le menu à droite.

Code:
<div  id="texte" style="position:absolute; left:2%; top:3%; width:50%"> </div>

<div id="menu" style="position:absolute; left:53%; top:3%; width:22%"></div>


left:2%; top:3% définissent à quel endroit de la page ce bloc doit se placer, par rapport à la gauche et au haut de l'écran.
width:50% définit la largeur relative que le bloc texte doit occuper.
Il faut tatonner et faire beaucoup d'essais pour trouver le bon pourcentage.

Si tu as une bandeau image en haut de page, tu peux aussi rendre l'image élastique (attention qu'elle reste jolie même en grand format)

Code:
<div id="bandeau">
<img src="http://www.monsite.fr/bandeau.gif" width="100%"  border="0">
</div>



voilà en gros la marche à suivre. J'avais trouvé un bon tuto sur le sujet, mais impossible de remettre la main dessus.
Revenir en haut de page
Voir le profil de l'utilisateur Envoyer un message privé Visiter le site web de l'utilisateur
dede-70



Inscrit le: 07 Fév 2006
Messages: 3
Localisation: Lure

MessagePosté le: Mer Fév 08, 2006 2:05 pm    Sujet du message: Répondre en citant

Bon ben je vais déjà essayer avec tout ceci.

Merci Claire

Par contre si quelqu'un retrouve un bon tuto je suis toujours preneur !

Merci
Revenir en haut de page
Voir le profil de l'utilisateur Envoyer un message privé
dede-70



Inscrit le: 07 Fév 2006
Messages: 3
Localisation: Lure

MessagePosté le: Mer Fév 08, 2006 2:32 pm    Sujet du message: Répondre en citant

Bon je viens d'essayer et j'avoue que j'ai un peu de mal ! En clair. J'ai fait une image d'arriere plan pour le site ! La page d'entrée ( visible en 1024X768 à l'adresse suivante : http://oclean.free.fr ) Ne contiendra que cette image. Le probleme étant qu'avec mon PC Portable ( résolution 1280 et des boulettes ) j'ai apparition d'une mosaique de mon arriere plan et il n'est plus centré ! C'est ça que je veux résoudre. Le code de la page étant :

<html>

<head>
<meta http-equiv="Content-Language" content="fr">
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>OCLEAN</title>
</head>

<body bgproperties="fixed" background="index2.jpg">

<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
Touts droits sur logo et images réservés</p>

</body>

</html>

Voila le bazar. Merci d'avance pour votre aide.
Revenir en haut de page
Voir le profil de l'utilisateur Envoyer un message privé
Cain



Inscrit le: 23 Juil 2006
Messages: 3

MessagePosté le: Dim Juil 30, 2006 7:47 am    Sujet du message: Répondre en citant

Salut,

Je débute aussi en création de page html et tout comme toi j'ai tenté de mettre au point un site avec FRONTPAGE. Le problème c'est que ce soft ne permet pas ( ou alors l'option est très difficile à trouver ) d'adapter ta config de page a diverses dimensions et il accepte très mal qu'on vienne farfouiller sur ses pages html.

Suivant les conseils de certains, je me suis lancé dans la création de page html en tapant tout les codes ( avec Notepad ++ ) et avec un tutorial présent ici Arrow http://www.salemioche.net/ ( J'espére que l'on peut citer d'autre site de création Smile )

Il est certains que tu ne mettra pas en ligne rapidement mais tu appréhendera beaucoup mieux le langage html et surtout tes pages seront extensibles sans que tu ne fasse grand chose de plus Smile

Pour info, j'ai trouvé sur un de mes nombreux cd achetés avec des revues micro, un petit soft sympa qui répertorie tous les codes html, css et smiley Arrow Balistou, essai de voir si tu le trouve sur le net. C'est un freeware

Bon courage
Revenir en haut de page
Voir le profil de l'utilisateur Envoyer un message privé
Montrer les messages depuis:   
Poster un nouveau sujet   Répondre au sujet    Forum d'aide à la création Index du Forum -> Mise en page Toutes les heures sont au format GMT + 2 Heures
Page 1 sur 1

 
Sauter vers:  
Vous ne pouvez pas poster de nouveaux sujets dans ce forum
Vous ne pouvez pas répondre aux sujets dans ce forum
Vous ne pouvez pas éditer vos messages dans ce forum
Vous ne pouvez pas supprimer vos messages dans ce forum
Vous ne pouvez pas voter dans les sondages de ce forum
Annuaire d'aide à la création de site
Annuaire du graphisme

Editez très facilement vos javasrcripts. Trouvez des partenaires à votre site web.
Univers du gratuit
Séléction rigoureuse de sites gratuits et ressources gratuites
Jeux, logos et sonneries pour portable

Classement de sites - Inscrivez le v™tre!