Een portfoliowebsite bouwen die je aan werk helpt

Om een portfoliowebsite te bouwen die je aan werk helpt, kies je je vier tot acht beste projecten voor het publiek dat je wilt bereiken, presenteer je elk als een kort verhaal — het probleem, wat je hebt gedaan, het resultaat — en maak je het op elke pagina makkelijk om contact op te nemen. Houd hem snel, vooral als hij veel beeld bevat, en zet hem op een domein met je naam. Het gereedschap is minder belangrijk dan de selectie en de teksten.

Begin met wie er kijkt

Een portfolio is een verkooppagina waarop je werk het product is. Bepaal voordat je een lay-out kiest wie je wilt laten inhuren en wat die moet zien:

Als je twee heel verschillende doelgroepen bedient — bijvoorbeeld productontwerpfuncties en freelance-illustratie — overweeg dan aparte secties of zelfs aparte sites, zodat niemand moet zoeken.

Wat erin hoort

Het werk

Kies minder, betere projecten. Verwijder alles waarvoor je niet nog eens ingehuurd zou willen worden. Zet je sterkste, meest relevante stuk vooraan; veel bezoekers scrollen nooit voorbij de eerste rij.

Voor ontwerpers en ontwikkelaars worden de beste projecten casestudy's. Een bruikbare structuur:

1. Het probleem — één of twee zinnen over de situatie en wie erdoor werd geraakt.
2. Jouw rol — wat jij hebt gedaan, en wat anderen deden. Wees precies; overdrijven valt in een sollicitatiegesprek snel op.
3. Het proces — een paar belangrijke beslissingen, met schetsen, wireframes of fragmenten code.
4. Het resultaat — wat er is opgeleverd, en elk resultaat dat je eerlijk kunt noemen. Als je geen cijfers kunt delen, beschrijf de verandering dan kwalitatief.

Voor fotografen en illustratoren doen de beelden het meeste werk. Groepeer ze in duidelijke sets (bruiloften, productfotografie, redactioneel), houd bijschriften kort, en laat het raster ademen.

Over en contact

De over-sectie moet zeggen wie je bent, wat je doet, voor wie je het doet, en waar je gevestigd bent of of je op afstand werkt. Een echte foto helpt. De manier om contact op te nemen moet van elke pagina duidelijk zijn: een kort formulier, een e-mailadres, of een link om een gesprek te boeken. Als je opdrachten aanneemt via boekingen, zeg dan hoe.

Optionele pagina's

• Diensten en tarieven — nuttig voor freelancers die aanvragen willen filteren die niet passen.
• Cv of resumé — nuttig voor werkzoekenden; een downloadbare pdf plus een versie op de pagina is gebruikelijk.
• Teksten of notities — alleen de moeite waard als je ze bijhoudt. Een verlaten blog van jaren terug schaadt meer dan geen blog.
• Getuigenissen — alleen echte, met toestemming.

Keuzes en afwegingen

Statische site of app? De meeste portfolio's zijn eenvoudige, op inhoud gerichte sites en hebben geen database nodig. Voeg er alleen een toe als er een reden is: een contactformulier dat aanvragen opslaat, een galerij die je vaak bijwerkt via een beheerpagina, of klantselectie waarbij mensen foto's kiezen.

Waar afbeeldingen staan. Grote afbeeldingen zijn de belangrijkste oorzaak van trage portfolio's. Verklein en comprimeer ze voordat je uploadt, lever moderne formaten en laad afbeeldingen lazy terwijl de bezoeker scrolt. Voor een grote of vaak wijzigende galerij sla je afbeeldingen op in goede bestandsopslag in plaats van ze in de code van de site te bundelen.

Hoe je hem bijwerkt. Wees eerlijk hierover. Als je elke maand werk toevoegt, wil je een makkelijke manier om dat te doen — een eenvoudige beheerpagina, een CMS, of een bouwer die je prettig vindt om te bewerken. Als je twee keer per jaar bijwerkt, is het prima om de site direct te bewerken.

Zichtbaarheid in zoekmachines. Als je wilt dat mensen je vinden door je naam plus je vak en stad te zoeken, heeft de pagina echte tekst nodig, goede koppen, unieke paginatitels en beschrijvingen, en beschrijvende alt-tekst bij afbeeldingen. Zie SEO voor met AI gebouwde websites.

Een eerste prompt voor een AI-bouwer

Een goede prompt noemt het publiek, de pagina's, het werk en de stijl:

Bouw een portfoliowebsite voor Lena Park, een productontwerper die op zoek is naar senior interne functies bij SaaS-bedrijven. Pagina's: Home met een korte intro en een raster van 5 casestudy's; een sjabloonpagina voor casestudy's met secties voor probleem, mijn rol, proces (met een afbeeldingengalerij) en resultaat; Over met foto, korte bio en cv-download; Contact met een eenvoudig formulier (naam, e-mail, bericht) dat opslaat in een database en een bedankbericht toont. Stijl: rustig en minimaal, veel witruimte, één accentkleur, grote leesbare letters. Werkt goed op telefoons. Gebruik duidelijk gemarkeerde tijdelijke projecten die ik één voor één kan vervangen.

Vervang daarna de tijdelijke projecten één project per keer, in plaats van al je inhoud in één bericht te plakken. Dat is makkelijker na te kijken, en de AI krijgt elke pagina dan goed.

Voor meer promptpatronen, zie hoe je prompts schrijft voor AI-appbouwers.

Bouwstappen

1. Kies het publiek en de projecten voordat je een tool aanraakt.
2. Schrijf de tekst voor elke casestudy eerst in een document: probleem, rol, proces, resultaat.
3. Bereid de afbeeldingen voor — bijsnijden, verkleinen en comprimeren. Geef de bestanden zinvolle namen.
4. Genereer of kies een startlay-out. Door portfoliosjablonen te bekijken zie je snel welke stijl bij je werk past.
5. Bouw eerst de homepage en één casestudy, maak die goed, en herhaal daarna het patroon.
6. Voeg over en contact toe. Test het contactformulier van begin tot eind.
7. Controleer op een telefoon. Portfolio's breken vaak op kleine schermen: krappe rasters, enorme afbeeldingen, minuscule bijschriften.
8. Voeg de basis van SEO en een deelafbeelding toe, zodat links er goed uitzien als je ze verstuurt.
9. Publiceer en koppel je domein. Zie hoe je een eigen domein koppelt.
10. Vraag twee mensen uit je doelgroep om het dertig seconden te bekijken en je te vertellen wat je doet. Kunnen ze dat niet, verbeter dan de homepage.

Veelgemaakte fouten

• Alles laten zien. Zwakke projecten verdunnen de sterke. Selecteer.
• Beelden zonder context. Bij ontwerp- en ontwikkelwerk vertelt een screenshot zonder probleem en jouw rol een recruiter erg weinig.
• Trage, zware pagina's. Niet-gecomprimeerde afbeeldingen op volledige resolutie laten de site op mobiele data kapot aanvoelen.
• Slimme navigatie. Ongebruikelijke menu's en scroll-effecten kunnen leuk zijn, maar niet als bezoekers je werk of je e-mail niet kunnen vinden.
• Verborgen contactgegevens. Zet een contactlink in de kop en voettekst van elke pagina.
• Klantwerk tonen waarvoor je geen toestemming hebt. Controleer contracten en geheimhoudingsverklaringen; maak het project anoniem of beschrijf het als dat nodig is.
• Nooit bijwerken. Verouderd werk en een "laatste project" van jaren geleden geven het verkeerde signaal af.

Kosten

De vaste kosten van een persoonlijk portfolio zijn meestal laag: een domeinnaam die jaarlijks wordt verlengd, en hosting. Sites met veel beeld kosten iets meer als je veel grote bestanden opslaat en serveert. Websitebouwers rekenen vaak een maandabonnement dat hosting omvat; zelf bouwen kan goedkoper zijn, maar dan onderhoud je het zelf. Controleer de actuele prijzen op de site van elke provider, want die veranderen.

Wanneer een kant-en-klaar product de betere keuze is

Portfolioplatforms en websitebouwers met portfolio-thema's passen goed als je snel een verzorgd resultaat wilt, een visuele editor prefereert, en niets op maat nodig hebt. Fotografen die prints verkopen of klantgalerijen leveren, zijn misschien beter af met een speciaal fotoplatform dat klantselectie en printverkoop al regelt. Bouw zelf als je een onderscheidend ontwerp wilt, een functie nodig hebt die de platforms niet bieden, code of interactief werk direct wilt tonen, of gewoon de site volledig wilt bezitten.

Bouwen met Mythex

Mythex kan een portfolio bouwen op basis van een beschrijving zoals de prompt hierboven. Je ziet hem in een live preview met een frame op telefoonformaat, je verfijnt lay-out en tekst in de chat, en je publiceert naar jouwnaam.mythex.app. Als je een contactformulier wilt dat aanvragen opslaat, voegt Mythex een database aan het project toe; voor afbeeldingengalerijen kan het de bestandsopslag van het project gebruiken, zodat foto's niet in de code worden gepropt. Op Pro kun je in Mythex een domein kopen of een domein koppelen dat je al hebt, en de code exporteren of synchroniseren met GitHub als je hem later elders wilt hosten.

De documentatie behandelt dit in de portfolio-use-case en legt bestandsopslag uit. Je kunt ook starten met de AI-portfoliowebsitebouwer of een specifieke stijl, zoals het ontwikkelaarsportfolio of het fotografieportfolio.

Veelgestelde vragen