The Portfolio Website

Be clear about the job before you build, because it stops you over-building. A portfolio website has four jobs, and only four:

1. Be findable. When someone searches your name - after an interview, before a meeting, when your CV crosses their desk - your site should be what they find, not a stranger with the same name or an abandoned social profile. Your site is how you control your own first search result. 2. Show your best work, well. It is a home for the same curated argument as your PDF, presented cleanly, and - unlike a PDF - it can also hold the fuller body of work for the reader who wants to dig. 3. Make you reachable. A clear way to contact you and a clear statement of who you are and what you are looking for. 4. Always be current. The version that never goes stale, that you update as work resolves, so you always have a live link to send.

Notice what is not on the list: being impressive as a website. This is the trap that sinks designers' personal sites. Because you are a designer, you feel the site itself must be a dazzling piece of web design - a custom animation, an experimental navigation, a clever scroll. Resist it hard. The work is the star; the site is the gallery. A restless, over-designed, slow-loading site fights your projects for attention and, worse, signals that you do not know when to stop - the same fatal over-design error as in print, now with loading spinners. The best portfolio sites are quiet, fast and almost boring in their clarity: you land, you immediately see strong work, you can tell in a second what this person does, and you can reach them. Everything else is decoration you will regret maintaining.

One honest caveat about scope: a website is a commitment, not a one-off. A stale site - last project three years old, a broken link, a 'coming soon' page that never arrived - is worse than none, because it actively signals neglect. So build something you can realistically keep current. For many people that means something simple and templated they can update in ten minutes, not a bespoke build they will never touch again.

Readers arrive with a mental map of how a portfolio site works, and fighting that map only loses you people. Give them the conventional structure - it is conventional because it works - and spend your creativity on the work, not on reinventing navigation.

A complete, effective portfolio site is usually just a handful of pages:

- Home / Work. The most important page, and often the only one people see. It should land the reader straight into your work: a clean grid or list of your projects, each with a strong thumbnail and a one-line label of what it is, newest or strongest first. Do not open with a full-screen photo of yourself and a slow fade, or a splash page they must click through. Land them on the work. - Project pages. One page per project, each telling that project as a story (the skills from Module 1): a hero image, a short paragraph on the problem and idea, then a well-sequenced set of images, drawings and process, with informative captions and honest credits. This is where depth lives. - About. A short, human page: a real photo, a few sentences on who you are, your focus and what you are looking for, your education and key experience, and - importantly - a downloadable CV. - Contact. Dead simple: an email address (as clickable text, not a form that may silently fail), and links to your relevant profiles - LinkedIn, Instagram if it is professional, and where to see more.

Three structural rules earn their keep. First, keep navigation obvious and shallow - a reader should reach any project in one or two clicks, from a menu that is always visible. Second, make every project reachable and every link work; a dead link or a project that 404s reads as carelessness. Third, put contact everywhere - in the menu, in the footer, on the About page - because the whole point is to be reachable. If you want to go further, a lightweight site can carry the same identity as your PDF and print - the same typeface, the same restraint, the same one or two accent colours (the Colour course helps here) - so a reader who meets you across formats feels one coherent person.

You do not need to be a web developer, and you should not spend months on this. There is a spectrum of ways to get a portfolio online, and the right one is the simplest one you will actually keep current.

- Portfolio platforms and site builders. Services designed for creative portfolios, and general website builders, let you pick a template and drop in your work with no code. This is the fastest route for most people and produces a clean, responsive result. Studio Matrx offers free website tools for architects and designers at `/sites` - a builder, a showcase and a set of templates - so you can put a real portfolio online without paying a subscription; use your own domain and hosting, and you own the result. - A personal domain. Whatever you build on, put it on your own domain name - ashamenon.in, asha-menon.com - not a free .something.platform.com subdomain. A custom domain costs very little per year, is far more memorable and professional on a CV, makes you findable, and means you can move hosts later without changing your link. It is the single highest-return spend in this whole module. - Custom-built. If you code, a hand-built or static site gives total control - but only choose this if maintaining it is genuinely easy for you, because the goal is a site that stays current, not a project that eats your evenings.

Whatever you choose, mind a few fundamentals that decide whether the site helps or hurts. Speed: compress images the same way you did for the PDF (screen resolution, sensible JPEG) so pages load in a second or two, because a slow site loses readers before they see anything - and a designer's slow site is doubly damning. Findability (SEO basics): put your real name in the page titles and text, write a plain descriptive page title and description, and add alt text to images (which also makes the site accessible). Reliability: test every link, and check it on a real phone and a real laptop, not just your design machine. And keep the ownership clear in your head: your work is yours, and hosting it publicly does not surrender copyright - but do credit collaborators and studios honestly (the authorship lesson in Module 7), which matters more online, where work travels.

Here is the constraint that should shape every decision: most people will open your site on a phone. A recruiter checking you on the train, a client googling you between meetings, someone tapping the link in your Instagram bio - they are on a small, vertical, touch screen, often on a patchy connection. If your site was designed on a wide laptop and never checked on a phone, it is probably failing the majority of its real visitors right now.

Designing for the mobile reader is not a nice-to-have; it is the main event. In practice:

- Use a responsive site that reflows to a single column on a narrow screen. Every serious site builder and template does this by default - but you must actually test it, because reflow can break layouts, crop images badly, or shrink text to unreadable. - Make text legible without pinching to zoom. Body text and captions must be comfortably readable at phone size; the elegant tiny type that looked refined on your laptop is a wall of grey mush on a phone. - Design for the thumb. Menus, links and buttons must be big enough to tap accurately; a hover-only navigation that works with a mouse can be unusable on touch. - Lead with the work, vertically. On a phone the reader scrolls; your strongest project and a clear sense of who you are must land in the first screen or two, before you lose them. Do not bury the work under a full-height hero image they have to scroll past. - Keep it light. Heavy images and animations that stutter on a mid-range phone on mobile data are worse than no animation at all. Fast and plain beats slow and fancy every time.

The test is simple and you should do it before you send the link to anyone: open your own site on your phone, on mobile data, as a stranger would. Can you tell within seconds who this is and what they do? Can you reach the work, read the captions, and find how to contact them, all with your thumb? If any answer is no, fix that before you fix anything a laptop shows. The mobile reader is not the edge case - they are the reader.