Archief - Portfolio online

Hey,

Heb gisteren mijn nieuw (klassieke) portfolio online geplaatst. Heb hem relatief snel gemaakt om te kunnen gebruiken bij stage sollicitatie.

Hier is de link:
Benoît Boucart - Webdesigner & Webdeveloper portfolio

Alvast bedankt voor de feedback

Mooie site!
Opmerkingen:
- ik dacht altijd dat het punt van nieuwe HTML5-elementen was dat je minder met IDs moet werken. Wat jij doet, houdt dus weinig steek: je werkt met aside en geeft het nog een ID? Dat is hier toch niet nodig, want je werkt maar met één aside. Hetzelfde met de header.
- Het gebruik van lege divs met class=clear begrijp ik niet. Zet die clear: both op de daaronder liggende div en verander de margin-top in padding-top?
- Waarom staat uw logo binnen een h1?
- Uw toTop is vreemd opgebouwd? Waarom niet gewoon een link?
- Ge laadt twee keer uw conditionals (in head en voor sluiten van body)

- Kleuren zijn OK, maar de kleur van .blue vind ik net ietsje te fel.
- Fancybox -> customize het aub. De laatste tijd zie je veel webdevs die een hele mooie website maken en daar dan een redelijk standaard fancybox/lightbox opgooien. Pas dat aan aan je website! (En niet gewoon de kleuren, maar alles!)
- Heel uw site is in het Engels, maar als je iets van het contactform niet invult krijg ge 'vul dit veld in', en dat dan nog in een hele lelijke tekstballon die totaal niet past bij de website.
- ik mis hoverstates op: uw logo, de toTop en uw contactform 'send' button
- ik mis een favicon
- de knoppen van de slider zijn lelijk (die zwart-wit). Pas die kleuren best aan aan die van je website
- de schaduw onder uw afbeeldingen is iets té, vooral omdat het bij de slider wat minder is. Bij de slider is de schaduw ook net niet breed genoeg. De schaduw op de hoverstate van uw hoofdmenu mag ook wat meer zijn.
- Bij uw slider, die groenachtige achtergrondkleur van 'featured' past niet, beter dat blauw nemen.
- Ik mis de 'next' functie bij fancybox. Nu moet ik telkens fancybox sluiten als ik een nieuw project wil zien.

Zeker geen lelijke site! (zeker niet tegenover uw allereerste HTML portfolio! Want die vind ik echt niet mooi )

Thanks voor de zeer uitgebreide en interessante feedback!

- ik dacht altijd dat het punt van nieuwe HTML5-elementen was dat je minder met IDs moet werken. Wat jij doet, houdt dus weinig steek: je werkt met aside en geeft het nog een ID? Dat is hier toch niet nodig, want je werkt maar met één aside. Hetzelfde met de header.

Klik om te vergroten...

> Je hebt gelijk. Achteraf (nu dus ) kan ik dit wijzigen, maar die IDs heb ik gegevens omdat ik toen nog niet wist of ik andere asides ging gebruiken. Dit is dus niet het geval en dus wijzig ik dit inderdaad best. Ook zo met header tag als ik me niet vergis

- Het gebruik van lege divs met class=clear begrijp ik niet. Zet die clear: both op de daaronder liggende div en verander de margin-top in padding-top?

Klik om te vergroten...

Good point. Ik dacht dat de padding-top toen niet werkte. Zal nog eens testen.

- Waarom staat uw logo binnen een h1?

Klik om te vergroten...

Ik las dit ergens, vond het ook raar. Maar indien ik het doet dan verander ik de titels best naar H2's. Maar die H1 van de logo is idd niet echt relevant.

- Ge laadt twee keer uw conditionals (in head en voor sluiten van body)

Klik om te vergroten...

Goed gezien. Ik weet niet hoe ze daarin terecht zijn gekomen.

- Kleuren zijn OK, maar de kleur van .blue vind ik net ietsje te fel.

Klik om te vergroten...

Is idd waar

Fancybox wordt aangepast.

- Heel uw site is in het Engels, maar als je iets van het contactform niet invult krijg ge 'vul dit veld in', en dat dan nog in een hele lelijke tekstballon die totaal niet past bij de website.

Klik om te vergroten...

Dit heeft te maken met de HTML5 required attribuut op de input tag. Kan er weinig aan doen. Dat het Nederlands is, heeft te maken met de taal van u browser. Ook het design van die tekstballon bepaalt dit. Kan er weinig aan doen, maar in Chrome is het inderdaad ERG lelijk.


Erg bedankt voor die nuttige analyse! Great job.

nog niet naar de code gekeken, maar de looks vind ik best wel nice, strak met een speelse toets, mooi!

BramVroy zei:

- ik dacht altijd dat het punt van nieuwe HTML5-elementen was dat je minder met IDs moet werken. Wat jij doet, houdt dus weinig steek: je werkt met aside en geeft het nog een ID? Dat is hier toch niet nodig, want je werkt maar met één aside. Hetzelfde met de header.

Klik om te vergroten...

Dat is niet de bedoeling van de nieuwe HTML5 elementen, de bedoeling is om semantischere code te kunnen schrijven. Niet overal dezelde div tag voor gebruiken, maar tags die aangeven wat het doel ervan is.

Zo'n aside-tag is dus niet noodzakelijk bedoeld om een sidebar te maken, en zelfs dan is dat niet enkel en alleen de bedoeling ervan.
Duidelijker is het misschien bij footer. Dat slaat terug op de footer van de pagina, maar evenzeer op de footer van elke post op een blog.

In dit geval, als de aside maar één keer gebruikt wordt kan een id misschien achterwege gelaten worden. Maar doorgaans zijn id's performanter dan gewone tags of classes, dus ik zou het zeker niet afraden.

Sorry voor de offtopic, maar ik wilde dit toch even vermelden.

http://html5doctor.com/aside-revisited/

Zero Grav zei:

Dat is niet de bedoeling van de nieuwe HTML5 elementen, de bedoeling is om semantischere code te kunnen schrijven. Niet overal dezelde div tag voor gebruiken, maar tags die aangeven wat het doel ervan is.

Zo'n aside-tag is dus niet noodzakelijk bedoeld om een sidebar te maken, en zelfs dan is dat niet enkel en alleen de bedoeling ervan.
Duidelijker is het misschien bij footer. Dat slaat terug op de footer van de pagina, maar evenzeer op de footer van elke post op een blog.

In dit geval, als de aside maar één keer gebruikt wordt kan een id misschien achterwege gelaten worden. Maar doorgaans zijn id's performanter dan gewone tags of classes, dus ik zou het zeker niet afraden.

Sorry voor de offtopic, maar ik wilde dit toch even vermelden.

http://html5doctor.com/aside-revisited/

Klik om te vergroten...

Ik had voor ik postte ook al eens opgezocht hoe de aside tag juist gebruikt moet worden, en daar las ik dat inderdaad. Toch lijkt het mij vrij nutteloos dat als je maar één element van een soort hebt op je webpagina, je daar dan een id gaat aangeven. Het kan nodig zijn en relevant (bij de aside kan ik het nog snappen, het is semantisch inderdaad wat duidelijker) maar soms vind ik het echt overbodig (zoals bij de header-tag in dit geval).

euhm, in HTML 5 kan een headertag meermaals in één pagina terugkomen

voorbeeld

Shaddix zei:

euhm, in HTML 5 kan een headertag meermaals in één pagina terugkomen

voorbeeld

Klik om te vergroten...

Ja, maar dat bedoel ik niet. Ik bedoel dat in dit voorbeeld het duidelijk is waar die header voor dient (afgeleid van de naam zelf). Dat heb je bij die 'aside' niet. Ik zou dus die header geen id hebben gegeven en die aside wel. Het gaat dus wel over DEZE website dan hé.

bangbang zei:

Ik las dit ergens, vond het ook raar. Maar indien ik het doet dan verander ik de titels best naar H2's. Maar die H1 van de logo is idd niet echt relevant.

Klik om te vergroten...

Even hier op terug komen. Wat je best in uw geval doet is het logo in tekst typen in de <h1> tag. Dan met behulp van CSS uw text wegdoen met text-indent en overflow op hidden zetten.

Mam zei:

Even hier op terug komen. Wat je best in uw geval doet is het logo in tekst typen in de <h1> tag. Dan met behulp van CSS uw text wegdoen met text-indent en overflow op hidden zetten.

Klik om te vergroten...

Inderdaad, dat is wel goed voor SEO dan, maar als je der enkel een afbeelding in gooit niet.