How to create a professional website, step by stepHow to create a professional website, step by step

Creating a professional website is not picking a template and filling in boxes. It is a series of decisions, in an order that matters. When the order is respected, the site ships on time, gets found on Google and actually does its job. When it isn't, the design gets redone three times and the content is forgotten. Here are the seven steps I follow on every project as a freelance developer, whether the site is custom-coded or built on WordPress.Creating aa professional website is notnot picking a template andand filling in boxes. ItIt is a series ofof decisions, in an orderorder that matters. When thethe order is respected, thethe site ships on time,time, gets found on GoogleGoogle and actually does itsits job. When it isn't,isn't, the design gets redoneredone three times and thethe content is forgotten. HereHere are the seven stepssteps I follow on everyevery project as a freelancefreelance developer, whether the sitesite is custom-coded oror built on WordPress.

A professional website has one main goal. Getting called. Receiving quote requests. Selling online. Booking appointments. Everything else is secondary and must serve that goal. When nobody decides, the homepage turns into a catalogue where every block shouts as loud as the next, and the visitor no longer knows what to do.A professionalprofessional website has one mainmain goal. Getting called. ReceivingReceiving quote requests. Selling online.online. Booking appointments. Everything elseelse is secondary and mustmust serve that goal. WhenWhen nobody decides, the homepagehomepage turns into a cataloguecatalogue where every block shoutsshouts as loud as thethe next, and the visitorvisitor no longer knows whatwhat to do.

Ask yourself three questions before opening any tool: who visits this site, what they are looking for when they arrive, and what you want them to do before they leave. The answers decide which pages to create, the tone of the copy and where the contact button goes. If the goal is selling, the project becomes an online store and changes nature from this very first step.Ask yourselfyourself three questions before openingopening any tool: who visitsvisits this site, what theythey are looking for whenwhen they arrive, and whatwhat you want them toto do before they leave.leave. The answers decide whichwhich pages to create, thethe tone of the copycopy and where the contactcontact button goes. If thethe goal is selling, thethe project becomes an onlineonline store and changes naturenature from this very firstfirst step.

This is the step everyone wants to skip, and the one that saves the most time. Content means your copy, your photos, your services, your customer reviews, your contact details. A design made without real content is an empty shell: as soon as the real text arrives, blocks overflow, headings are too long and everything has to be redone.This isis the step everyone wantswants to skip, and thethe one that saves thethe most time. Content meansmeans your copy, your photos,photos, your services, your customercustomer reviews, your contact details.details. A design made withoutwithout real content is anan empty shell: as soonsoon as the real texttext arrives, blocks overflow, headingsheadings are too long andand everything has to bebe redone.

Start from the goal and list the pages you need, not one more. For most businesses, a homepage, one page per important service, a page presenting the team or the person, a reviews page and a contact page are enough. A blog gets added when you genuinely have something to publish regularly, not for show.Start fromfrom the goal and listlist the pages you need,need, not one more. ForFor most businesses, a homepage,homepage, one page per importantimportant service, a page presentingpresenting the team or thethe person, a reviews pagepage and a contact pagepage are enough. A blogblog gets added when youyou genuinely have something toto publish regularly, not forfor show.

First write the way you would talk to a customer on the phone: what you do, for whom, how it goes, how long it takes. Only then check that the words your customers type into Google appear in your headings and first paragraphs. I detail this logic in my article on how organic search works. Google's own SEO Starter Guide remains the best foundation for understanding what the search engine expects.First writewrite the way you wouldwould talk to a customercustomer on the phone: whatwhat you do, for whom,whom, how it goes, howhow long it takes. OnlyOnly then check that thethe words your customers typetype into Google appear inin your headings and firstfirst paragraphs. I detail thisthis logic in my articlearticle on how organic searchsearch works. Google's own SEO Starter Guide remains the best foundationfoundation for understanding what thethe search engine expects.

Real photos of you, your premises or your work always beat stock imagery. Add your customer reviews exactly as they were written, your certifications, your references. This proof is what reassures people, far more than a slogan.Real photosphotos of you, your premisespremises or your work alwaysalways beat stock imagery. AddAdd your customer reviews exactlyexactly as they were written,written, your certifications, your references.references. This proof is whatwhat reassures people, far moremore than a slogan.

The right question is not "which technology is best" but "who will run this site". If you want to edit your copy, publish articles and add pages yourself, a WordPress website is the sensible choice: the interface is familiar, plugins are plentiful and any professional can take over the site later. I cover the pitfalls in create a WordPress website.The rightright question is not "which"which technology is best" butbut "who will run thisthis site". If you wantwant to edit your copy,copy, publish articles and addadd pages yourself, a WordPress website is the sensible choice:choice: the interface is familiar,familiar, plugins are plentiful andand any professional can taketake over the site later.later. I cover the pitfallspitfalls in create a WordPressWordPress website.

If the site rarely changes, needs to be very fast, very particular in its design, or needs interactions no theme offers, a custom-coded website is the better fit. There are no plugins to update and no theme to work around: the code does exactly what it's asked, and nothing else. That's the route I take for immersive or highly graphic sites.If thethe site rarely changes, needsneeds to be very fast,fast, very particular in itsits design, or needs interactionsinteractions no theme offers, aa custom-coded website is the betterbetter fit. There are nono plugins to update andand no theme to workwork around: the code doesdoes exactly what it's asked,asked, and nothing else. That'sThat's the route I taketake for immersive or highlyhighly graphic sites.

• You publish often and want to be independent: WordPress.You publishpublish often and want toto be independent: WordPress.
• You sell products: an online store, whose platform depends on the catalogue and the needs.You sellsell products: an online store,store, whose platform depends onon the catalogue and thethe needs.
• You want a unique design, maximum speed or 3D: custom build.You wantwant a unique design, maximummaximum speed or 3D: customcustom build.
• You're unsure: the answer is almost always in the question "who updates the site".You're unsure:unsure: the answer is almostalmost always in the questionquestion "who updates the site".site".

Then comes the question of who builds the site: you with an online builder, a freelancer or an agency. Each option has a cost and a trade-off, which I compare in freelance, agency or website builder.Then comescomes the question of whowho builds the site: youyou with an online builder,builder, a freelancer or anan agency. Each option hashas a cost and aa trade-off, which I comparecompare in freelance, agency oror website builder.

Design starts with the structure of each page, in black and white: where the heading goes, where the button goes, in what order the arguments arrive. This is called a wireframe. It can be discussed and corrected in minutes, whereas a finished design takes hours to correct. Only once the structure is approved do colours, typefaces and images come in.Design startsstarts with the structure ofof each page, in blackblack and white: where thethe heading goes, where thethe button goes, in whatwhat order the arguments arrive.arrive. This is called aa wireframe. It can bebe discussed and corrected inin minutes, whereas a finishedfinished design takes hours toto correct. Only once thethe structure is approved dodo colours, typefaces and imagesimages come in.

• A contact button visible on the first screen, on every page.A contactcontact button visible on thethe first screen, on everyevery page.
• A single main heading per page, saying what you do and for whom.A singlesingle main heading per page,page, saying what you dodo and for whom.
• Readable copy: comfortable size, short lines, enough contrast between text and background.Readable copy:copy: comfortable size, short lines,lines, enough contrast between texttext and background.
• A site designed for the phone first, because that's where most visits come from.A sitesite designed for the phonephone first, because that's wherewhere most visits come from.from.
• A consistent identity: the same colours, typefaces and tone as your other materials.A consistentconsistent identity: the same colours,colours, typefaces and tone asas your other materials.

Accessibility is part of design, not a separate step. The French RGAA and the international WCAG describe what a site must respect to be usable by everyone: contrast, keyboard navigation, alternative text on images. An accessible site is also a site Google understands better.Accessibility isis part of design, notnot a separate step. TheThe French RGAA and thethe international WCAG describe whatwhat a site must respectrespect to be usable byby everyone: contrast, keyboard navigation,navigation, alternative text on images.images. An accessible site isis also a site GoogleGoogle understands better.

Search ranking isn't "added" once the site is live. It is prepared during the build: one clear, stable address per page; a title and description for every page; light images with alternative text; a sitemap; structured data telling Google who you are and what you offer. This is the heart of my SEO optimisation service, and I list it all in the technical SEO checklist before launch.Search rankingranking isn't "added" once thethe site is live. ItIt is prepared during thethe build: one clear, stablestable address per page; aa title and description forfor every page; light imagesimages with alternative text; aa sitemap; structured data tellingtelling Google who you areare and what you offer.offer. This is the heartheart of my SEO optimisation service,service, and I list itit all in the technicaltechnical SEO checklist before launch.launch.

Speed counts twice: for the visitor who waits, and for Google which measures it. The indicators to watch are described by Google in the Core Web Vitals. In practice, the gains come from well-compressed images, code without excess and good hosting.Speed countscounts twice: for the visitorvisitor who waits, and forfor Google which measures it.it. The indicators to watchwatch are described by GoogleGoogle in the Core Web Vitals.. In practice, the gainsgains come from well-compressed images,images, code without excess andand good hosting.

A site nobody can find doesn't exist. Search ranking is decided at build time.A sitesite nobody can find doesn'tdoesn't exist. Search ranking isis decided at build time.time.

Going live is a checklist, not a button. The domain name points to the right hosting, the security certificate is active and the address starts with https, old addresses redirect to new ones if the site replaces a previous one, the contact form actually sends messages, and the legal notice page is in place.Going livelive is a checklist, notnot a button. The domaindomain name points to thethe right hosting, the securitysecurity certificate is active andand the address starts withwith https, old addresses redirectredirect to new ones ifif the site replaces aa previous one, the contactcontact form actually sends messages,messages, and the legal noticenotice page is in place.place.

If the site uses cookies that aren't strictly necessary, for statistics for instance, the visitor's consent must be requested before they are set. In France the CNIL describes precisely what is expected. A site without trackers, or with exempt audience measurement, does without and gains in simplicity.If thethe site uses cookies thatthat aren't strictly necessary, forfor statistics for instance, thethe visitor's consent must bebe requested before they areare set. In France thethe CNIL describes precisely whatwhat is expected. A sitesite without trackers, or withwith exempt audience measurement, doesdoes without and gains inin simplicity.

1. Check every page on phone and desktop, in at least two browsers.Check everyevery page on phone andand desktop, in at leastleast two browsers.
2. Test the contact form and the delivery of messages.Test thethe contact form and thethe delivery of messages.
3. Register the site in Google Search Console and submit the sitemap.Register thethe site in Google SearchSearch Console and submit thethe sitemap.
4. Update the company's Google Business Profile with the new site address.Update thethe company's Google Business ProfileProfile with the new sitesite address.
5. Keep a full backup of the site exactly as it went live.Keep aa full backup of thethe site exactly as itit went live.

A finished website doesn't exist. In the first weeks, Search Console shows which searches bring visitors and which pages deserve improvement. After that, the pace is up to you: a customer review added, a service page clarified, an article published when there is something to say. On WordPress, maintenance comes on top: updates, backups and monitoring, otherwise the site eventually breaks or gets hacked.A finishedfinished website doesn't exist. InIn the first weeks, SearchSearch Console shows which searchessearches bring visitors and whichwhich pages deserve improvement. AfterAfter that, the pace isis up to you: aa customer review added, aa service page clarified, anan article published when therethere is something to say.say. On WordPress, maintenance comescomes on top: updates, backupsbackups and monitoring, otherwise thethe site eventually breaks oror gets hacked.

The budget follows from these seven steps, not the other way round. The number of pages, the technology, the content to produce and the level of design all move the price of a showcase website, and a serious quote details them one by one. I explain how to read and compare a website quote and what drives the cost of a showcase website in two dedicated articles.The budgetbudget follows from these sevenseven steps, not the otherother way round. The numbernumber of pages, the technology,technology, the content to produceproduce and the level ofof design all move thethe price of a showcaseshowcase website, and a seriousserious quote details them oneone by one. I explainexplain how to read andand compare a website quotequote and what drives thethe cost of a showcaseshowcase website in two dedicateddedicated articles.

With step 1, always. One sentence saying what the site is for, then the list of pages, then the copy. Once those three things exist, the rest of the project moves fast and without backtracking. If you want to see what it looks like once built, my projects show custom-coded and WordPress sites delivered to real businesses.With stepstep 1, always. One sentencesentence saying what the sitesite is for, then thethe list of pages, thenthen the copy. Once thosethose three things exist, thethe rest of the projectproject moves fast and withoutwithout backtracking. If you wantwant to see what itit looks like once built,built, my projects show customcustom-coded and WordPress sitessites delivered to real businesses.businesses.