De PHPhulp kroeg
Portfolio feedback graag
Op het moment is alleen de voorpagina af, maar ik zou hier graag wat feedback op krijgen. Vooral het design.
Over het lettertype
- Het is veel te speels, kies een strak sans-serif font
- zowel letterspace als wordspace is te klein. Dit kun je aanpassen met CSS
- Het contrast is veel te klein
Zodra ik naar beneden scroll en bij de content kom vind ik het allemaal wat vaag worden. De echte mooie kleuren zijn er uit, contrast is verre van ideaal en het ziet er minder afgewerkt uit.
Ook het patroon in de titels komt zomaar uit het niet opsteken en is nergens anders op het design te vinden. Maak de contrast in deze titel patronen wat minder en plaats in het zwarte gedeelte ook zo'n heel klein patroontje. Dan staat het al stukken beter.
Over de code:
- Plaats altijd na <head> een charset meta tag. Deze is:
Code (php)
1
<meta charset="utf-8">
- Naar mijn mening heb je veel te veel divs in de header. Naar mijn mening is de header van de pagina het zwarte stuk. Deze heeft een .init element in zich zodat je het makkelijk kan uitlijnen. En het logo zou ik toewijzen aan het .init element als achtergrond en niet speciaal een div voor gebruiken.
- Een menu is een lijst van menuitems, dit moet je dus in een list stoppen
- In de slider zitten foto's, deze moeten ook in een list. Wat jij nu hebt is dat je de afbeelding als achtergrond instelt, dat moet je niet doen. Het is een afbeelding die deel uit maakt van de content van je site en niet van het design. Plaatst dit dus in een img tag
- Body tag is niet voor het doel waar jij hem voor gebruikt. Een normaal HTML document heeft 2 onderdelen: head, de plaats waar alle informatie over de pagina staat; body, de plaatst waar alles staat wat de gebruiker ziet. Plaats dus alles vanaf de header totaan de footer in de body tag en gebruik voor de main pagina iets als <section id="main-page">
- Schrijf in HTML altijd alles gewoon met hoofdletter aan het eind en daarna kleine letters. Zoals jij je titel hebt geschreven is dus niet goed. Doormiddel van text-transform kun je het dan allemaal hoofdletters maken, of misschien nog mooier met font-variant: small-caps; alles small caps maken.
- Die break elementen in de footer zijn niet goed, los dit op met CSS margin/padding
- <div class="balk"> is overbodig. Maak de h1 tag gewoon op, is goed te doen
- Zet elk stukje in de content, dus 'welkom op mijn portfolio' en 'laatste werk' in een <section> tag, dat maakt het meer semantischer en dan kun je het beter stijlen.
- gebruik de <footer> tag i.p.v. <div id="footer"> ook dit is semantischer.
- gebruik ook <nav> i.p.v. <div id="navigatie">
Paar vragen:
- Heb de tekst veranderd, de contrast is beter nu, vind het resultaat minder "artistiek", maar het is beter leesbaar, ja. Is dit al een verbetering?
- Wat houdt <meta charset="utf-8"> in?
- Ik snap de feedback bij de balkjes niet helemaal, wat moet ik plaatsen in het zwarte gedeelte :P?
Nogmaals bedankt, dit helpt me beter te worden :).
Wel vind ik de titelbalken te zwaar.
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<?php
<ul>
<li></li>
<li></li>
</lu>
?>
<ul>
<li></li>
<li></li>
</lu>
?>
maar als ik de site bezoek, krijg ik bij projecten en Design een Not Found error?
en hij zegt de rest is niet af ;) alleen de home pagina
>> - Heb de tekst veranderd, de contrast is beter nu, vind het resultaat minder "artistiek", maar het is beter leesbaar, ja. Is dit al een verbetering?
Ja het is al wat beter, maar nog steeds een laag contrast. Een site, en vooral een portfolio, moet goed leesbaar zijn. Ik zou het contrast nog wat verhogen, ook de afbeeldingen mogen wat scherper. Breng wat meer kleur in de onderkant, ik vind het nu allemaal zo dofjes, alsof ik mijn laptopscherm even moet afstoffen omdat hij vol met stof zit.
>> - Wat houdt <meta charset="utf-8"> in?
Een pagina is in een bepaald character set geschreven. Dit is hoe de characters, dus letters en cijfers en alles wat je op je toetsenbord hebt, worden weergegeven op de pagina. Tekens als é zijn speciaal en kunnen via verschillende charactersets worden weergegeven. Vandaar dat je een standaard meta tag moet maken waarbij je instelt in wat voor soort character set je pagina is.
Plaats deze tag gewoon na <head> en je zult geen problemen krijgen met speciale tekens, mocht je ze juist coderen.
- Ik snap de feedback bij de balkjes niet helemaal, wat moet ik plaatsen in het zwarte gedeelte :P?
Je hebt in je balkjes bepaalde diagonale strepen, die ook in je footer voorkomen. Plaats deze ook in lichtere mate in de header, want dan komt zoiets wat vaker terug op een site en ziet het er meer uit als 1 geheel.
Tevens heb je voor elke titel dit geschreven:
Code (php)
1
<div class="balk"><h1>Welkom op mijn pagina</h1></div>
Dit kan je veel beter aanpassen naar:
Code (php)
1
<h1 class="balk">Welkom op mijn pagina</h1>
Ook dit kun je even goed stijlen.
Tevens als ik zeg in een list bedoel ik natuurlijk niet tussen <list> en </list>, maar via een goed opgemaakt list met <ul> eromheen (unordered list) en elk item in een <li> element (list item)
Gewijzigd op 15/02/2012 16:50:16 door Wouter J