How to make a portfolio website with AI and publish it
A portfolio stands or falls on two things: the work you choose and how fast it opens. An AI agent handles the layout. The choosing and the image preparation are up to you, and this guide helps with both.
Choose the work
- Ten to twenty strong pieces beat a hundred average ones.
- Group them by type of work or by client.
- For each project: a title, a sentence of context — the task, your role, the result — and a few images.
Plan the pages
A typical structure:
- Home: your name, what you do and a grid of projects.
- A page for each project: the images in large size and the description.
- About: a short bio and a photo.
- Contact: email, messengers, social profiles.
For a small portfolio, one page with sections works just as well.
Prepare the images
Images are almost all of a portfolio's weight, and weight is what makes a site slow on a phone. Before you hand the photos to the agent:
- Size. 2000 pixels on the long side is plenty for a full screen. The thumbnails in the grid need much less — ask for separate smaller versions.
- Format. WebP files are noticeably smaller than JPEG at similar quality.
- Weight. Aim for a few hundred kilobytes per image.
An agent that runs on your computer, such as Claude Code, Codex or Cursor, can do this itself:
Resize all images in the photos folder to 2000 px on the long side, make 600 px thumbnails, and convert everything to WebP.
aiput.site accepts up to 1000 files per publication, 10 MB per file and 50 MB in total. A prepared portfolio fits easily; a folder straight out of the camera does not.
The request
For example:
Build a portfolio website from the folder
work. Each subfolder is a project: the folder name is the title, andabout.txtholds the description. Home page: my name, "Interior photographer, Lisbon", and a grid with one cover image per project. Each project gets its own page with all its images in large size, loading as the visitor scrolls, and links to the next and previous project. Minimal design, white background, lots of space. Add an About page fromabout-me.txtand a Contact page with my email and Instagram. Write alt texts for the images from the project descriptions.
Alt texts describe each image in words. Screen readers read them aloud, and search engines use them to understand what is in the picture.
Publish
Publish this website.
The agent uploads the site and gives you a link to put in your profiles and applications.
Adding new work
Add the new project folder next to the others and say "add the new project and update the website". The previous version stays, so if the new layout breaks something, ask the agent to roll back.