Website voor mijn voetbalclub
Op dit moment ben ik bezig met een nieuwe website voor mijn voetbalclub.
Neem hier een kijkje:
http://www.oudewater-ovs.nl/testing
Dus kom maar op met de keiharde kritiek! ;)
Alvast bedankt!
Edit:
Oja, ik heb nog niet de beschikking over het logo waardoor de header nog kaal is. Dit komt later nog! En alleen de home pagina is nog gemaakt. Links op de pagina werken dus niet.
Gewijzigd op 03/09/2010 06:28:55 door Tieme Vierbergen
Ten eerst valideerd je HTML niet:
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.oudewater-ovs.nl%2Ftesting%2F
Verdiep je in HTML en je zult zien dat je webpagina in alle browsers goed weergegeven word.
Gebruik je serieus een DIV element voor om ieder nieuws link?
Zet dat eens gauw tussen een paar : <p> </p> (paragraaf)
- De Layout:
Die zijkanten die van zwart naar wit gaan zien er heel erg fout uit maar dat kan ook een kwestie van smaak zijn.
Kleur gebruik vind ik trouwens ook slecht.
- Zoekfunctie:
Die leid je gewoon naar google :S
Nah, dus dat.
De fouten die de validator aangeeft heb ik weggewerkt. (Het is trouwens vreemd dat een aantal grote websites die er (ik neem aan) mensen in dienst hebben die er echt verstand van moeten hebben nog aardig wat fouten laten zien maar dat terzijde).
De nieuwslinks heb ik aangepast met <br /> is dat ook goed? Met de <p> krijg ik te veel witruimte tussen de regels in. Of is dit op te lossen?
Wat betreft de opmerkingen over de layout ben ik het ook wel eens eigenlijk. Soms ben je ergens te lang mee bezig dat je niet meer goed ziet waar je mee bezig bent. Ik ga er wat aan doen dus!
En wat raad jij aan als zoekfunctie? Hoe deze op te bouwen?
Nieuwslinks zijn een opsomming, en geen paragraaf. Dus een lijst komt meer tot zijn recht hierin.
<ul>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 1</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 2</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 3</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 4</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 5</a></li>
</ul>
Verder valt hier een hoop mee te stylen
Code (php)
1
2
3
4
5
6
2
3
4
5
6
ul{
list-style: square url("bullet.gif");
list-style-type: none;
padding: 0px;
margin: 0px;
}
list-style: square url("bullet.gif");
list-style-type: none;
padding: 0px;
margin: 0px;
}
Gewijzigd op 03/09/2010 10:01:50 door - Ariën -
Hoe de website er nu uit ziet, vind ik ze niet echt geslaagd. Dit heeft vooral 2 redenen, denk ik (afgezien dat ze niet valideert op w3).
Ten eerste, je kleurgebruik is echt niet OK. 't Is zelfs niet goed. Je kleuren hangen niet echt samen en die gradiënten van rood naar wit en zwart naar wit zijn nogal gedateerd. Dat je in de kleuren van je voetbalploeg wilt blijven bedrijp ik, maar probeer ze dan op een betere manier met elkaar te laten omgaan. Een tool die je kan helpen met het kiezen van je kleuren is kuler. Na een beetje prullen met die tool heb je hem helemaal door. Je kan daar twee kleuren opgeven die je absoluut wilt gebruiken, de andere kleuren geeft hij dan terug.
Ten tweede lijkt de samenhang van alle verschillende kopjes in je website zoek. De essentie staat er nu wel op, maar er lijkt geen relatie tussen al die puntjes te zijn. Dit komt waarschijnlijk deels omdat je kopjes er niet echt goed uit zien (door die zwart->wit-gradiënten). Er staat ook zo veel informatie op je voorpagina alleen al. Spreidt dat een beetje en je website wordt direct minder 'druk'.
Potentieel zit er dus wel in, maar je hebt nog wat werk!
Jens
(Dit was enkel de layout die ik reviewde. Over de inhoud heb ik het nu niet :))
Gewijzigd op 03/09/2010 11:36:47 door Jens V
Aar anoniem op 03/09/2010 09:58:22:
Paragrafen? Fout, fout hardstikke fout....
Nieuwslinks zijn een opsomming, en geen paragraaf. Dus een lijst komt meer tot zijn recht hierin.
<ul>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 1</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 2</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 3</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 4</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 5</a></li>
</ul>
Verder valt hier een hoop mee te stylen
Nieuwslinks zijn een opsomming, en geen paragraaf. Dus een lijst komt meer tot zijn recht hierin.
<ul>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 1</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 2</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 3</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 4</a></li>
<li><a href="#">19-09-2010 - Hier komt nieuwstitel van nieuwtje nummer 5</a></li>
</ul>
Verder valt hier een hoop mee te stylen
Code (php)
1
2
3
4
5
6
2
3
4
5
6
ul{
list-style: square url("bullet.gif");
list-style-type: none;
padding: 0px;
margin: 0px;
}
list-style: square url("bullet.gif");
list-style-type: none;
padding: 0px;
margin: 0px;
}
Mee eens. :)
Edit: Inmiddels heb ik de website aangepast.
Gewijzigd op 04/09/2010 09:13:58 door Tieme Vierbergen
Gewijzigd op 04/09/2010 13:00:28 door Tieme Vierbergen
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<div style="cursor: pointer;" onclick="javascript: window.location = 'nieuws.php?id=4932';" class="headline">
<div class="headlinefoto"><img height="200" border="0" width="200" alt="Danny Muys Schiet in laatste minuut OVS 1 naar de 3e klasse" src="images/nieuws/dannyjordjuichen.jpg"></div>
<div class="headlinetekst">
<div class="headlinetitel">Danny Muys schiet in de laaste minuut OVS 1 naar de 3e klasse</div>
<div class="headlinetekst2">Een lange tijd leek het er naar uit te zien dat de promotie wedstrijd tussen Oudewater OVS en Schoonhoven zou eindigen in een gelijkspel. Echter werd dit voorkomen door een prachtig doelpunt in de laatste minuut door Danny Muys. De wedstrijd startte aanvankelijk erg rommelig en het was duidelijk te merken dat er deze wedstrijd veel op het spel stond. Door het veelal slordige spel... Lees verder...</div>
</div>
</div>
<div class="headlinefoto"><img height="200" border="0" width="200" alt="Danny Muys Schiet in laatste minuut OVS 1 naar de 3e klasse" src="images/nieuws/dannyjordjuichen.jpg"></div>
<div class="headlinetekst">
<div class="headlinetitel">Danny Muys schiet in de laaste minuut OVS 1 naar de 3e klasse</div>
<div class="headlinetekst2">Een lange tijd leek het er naar uit te zien dat de promotie wedstrijd tussen Oudewater OVS en Schoonhoven zou eindigen in een gelijkspel. Echter werd dit voorkomen door een prachtig doelpunt in de laatste minuut door Danny Muys. De wedstrijd startte aanvankelijk erg rommelig en het was duidelijk te merken dat er deze wedstrijd veel op het spel stond. Door het veelal slordige spel... Lees verder...</div>
</div>
</div>
Je kunt namelijk ook heel makkelijk een a element hiervoor gebruiker. Maak van het a element een block en je hebt hetzelfde resultaat alleen dan puur met een linkje ipv een onclick.
Is in mijn ogen wat netter.
Code (php)
1
2
3
2
3
a.Headline {
display: block;
}
display: block;
}
Dus in dit gedeelte:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<div class="headline">
<div class="headlinefoto"><img height="200" border="0" width="200" alt="Danny Muys Schiet in laatste minuut OVS 1 naar de 3e klasse" src="images/nieuws/dannyjordjuichen.jpg"></div>
<div class="headlinetekst">
<div class="headlinetitel">Danny Muys schiet in de laaste minuut OVS 1 naar de 3e klasse</div>
<div class="headlinetekst2">Een lange tijd leek het er naar uit te zien dat de promotie wedstrijd tussen Oudewater OVS en Schoonhoven zou eindigen in een gelijkspel. Echter werd dit voorkomen door een prachtig doelpunt in de laatste minuut door Danny Muys. De wedstrijd startte aanvankelijk erg rommelig en het was duidelijk te merken dat er deze wedstrijd veel op het spel stond. Door het veelal slordige spel... Lees verder...</div>
</div>
</div>
<div class="headlinefoto"><img height="200" border="0" width="200" alt="Danny Muys Schiet in laatste minuut OVS 1 naar de 3e klasse" src="images/nieuws/dannyjordjuichen.jpg"></div>
<div class="headlinetekst">
<div class="headlinetitel">Danny Muys schiet in de laaste minuut OVS 1 naar de 3e klasse</div>
<div class="headlinetekst2">Een lange tijd leek het er naar uit te zien dat de promotie wedstrijd tussen Oudewater OVS en Schoonhoven zou eindigen in een gelijkspel. Echter werd dit voorkomen door een prachtig doelpunt in de laatste minuut door Danny Muys. De wedstrijd startte aanvankelijk erg rommelig en het was duidelijk te merken dat er deze wedstrijd veel op het spel stond. Door het veelal slordige spel... Lees verder...</div>
</div>
</div>
Gewijzigd op 05/09/2010 07:22:24 door Tieme Vierbergen