Volledige versie bekijken : Verbeteren van een site van een kennis



Roelof
22 July 2009, 18:22
Hoi,

Een kennis vrieg mij of ik de fouten uit deze [url=http://home.hetnet.nl/~j.scheeringa1/] site wilde halen.

De code is een puinhoop en ik vroeg me af of de div en daarna de tabellen op een andere manier gemaakt kunnen worden.

Groetjes,

Roelof

Spoorzoeker
22 July 2009, 18:43
Als eerste is natuurlijk bepalend hoe ver jouw kennis reikt.
Ben je goed thuis in HTML of ben je beginner ?

Wat doet dit in de header ?:
www.sipro.myweb.nl (http://www.sipro.myweb.nl) (pagina niet gevonden)

Ik zie heel veel zwart, maar geen enkel menu, wel veel scrollen.
Klik ik op de link, dan zie ik weer geen menu en ook geen back-button.



background="E:\WEBSIT~1\lijn.gif"

Dit zal niet gaan werken, de link verwijst naar de pc van de maker.

De site is gemaakt met Frontpage, niet te doen om die handmatig aan te passen.
Beter is om gewoon vanaf nul te beginnen en de site na te bouwen.
CSS alleen gebruiken als je weet hoƩ je het moet gebruiken, anders achterwege laten.

carl
22 July 2009, 18:58
De gehele opmaak is door middel van een tabel gedaan, en daar dan nog eens de stijlcode allemaal in de body bijgeschreven :damn:
Er is een pak werk aan, en het is volgens mij inderdaad ook het best om hem volledig vanaf 0 op te bouwen, het gaat je een pak minder werk en frustratie kosten.

Roelof
22 July 2009, 19:22
Hoi,

Ik weet wel wat van html af.
Mijn idee was ook om op punt 0 te beginnen.
Ben alleen niet zo thuis in div en plaatsing.
Mijn idee is dus om de hele site alleen met div en css op te bouwen.
Maar zoals ik al heb gezegd is div en de plaatsing mij niet zo duidelijk.
Hoop dat een van jullie mij kan helpen met een soort van geraamte. dan red ik het wel.

Roelof

carl
22 July 2009, 21:08
Ik ben er niet echt zo een krak in maar ik geloof dat je voor dit resultaat het makkelijkst volgende vorm hanteert:
<html>
<head>
...
<style>
</style>
</head>
<body>

<div class="rand">
<div class="rand">
...
</div>
</div>
</body>
</html>
(niet letterlijk overnemen want er kunnen gerust fouten inzitten ;))

Het idee is dat de klasse "rand" voor een padding en/of margin zorgt (evenals een border) om die lay out te verkrijgen en dan binnenin nog eens de inhoud. Om divisions te plaatsen op een pagina moet je wat spelen met margin, padding, align en display eigenschappen. Misschien dat iemand hier wat degelijke literatuur over kent, want zo een krak ben ik er niet in.

Spoorzoeker
22 July 2009, 22:27
Madding ?, ik denk dat je padding bedoeld. :lol:

Ik heb zelf ontdekt (vooral het stuk positioneren) dat het kwartje gewoon moet vallen. Daarna is het een stuk makkelijker/duidelijker.

Tot die tijd zou ik geen css gebruiken maar gewoon opbouwen met tabellen. Zodra je dan op je gemak css geleerd hebt kun je de site overzetten.

ultddave
22 July 2009, 22:35
<?xml version = "1.0" encoding = "utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">


<!-- Homepage -->
<html xmlns = "http://www.w3.org/1999/xhtml" xml:lang="dut">
<head>
<title> Regen</title>
<link rel="stylesheet" type="text/css" href="sipro.css"/>
<meta name="discription" content="Schrijf hier waarover de site gaat. (Gebruik zinnen)"/>
<meta name="keywords" content="som, hier, de, keywords, op, door, ze, te scheiden, met, een, komma"/>
</head>
<body>
<div id="wrapper">
.
.
.
</div>
</body>

</html>



In uw CSS moet ge dan uw wrapper definieren zoals hieronder bijvoorbeeld:
Wat spelen met de margin, padding, background images. :)



/* CSS FILE */
#wrapper {
text-align: center;
background-color: black;
}

Als je "class" wilt gebruiken ipv "id" zoals Carl. Moet je in de CSS dit doen:

/* CSS FILE */
div.wrapper {
text-align: center;
background-color: black;
}

en dan kan je <div class="wrapper"> gebruiken.

Greetz,
Dave

PS: De code boven de html tag zorgt ervoor dat je de file kunt checken op correcte code op http://validator.w3.org/ . (Via file upload bijvoorbeeld - opslaan als .html file)

carl
22 July 2009, 23:04
Het voordeel aan een klasse is dat je hem voor meerdere elementen kan gebruiken, tegenover een ID dat maar aan 1 element mag toegewezen zijn (dat dacht ik tenminste toch :) maar het zit ver). Dat zou het makkelijker maken om 2-3 randen te maken op die manier (moet je maar 1 keer de stijlcode ingeven)

Roelof
23 July 2009, 09:22
Hoi,

Iedereen dank.
Ga er eens mee stoeien.

Roelof

ultddave
23 July 2009, 12:04
@Carl; Yep, een "ID" is uniek. Maar aangezien je maar 1 wrapper hebt meestal, maakt het niet zoveel uit ;).
Voor de andere divs gebruik je zoiezo best classes.

Mvg,
Dave