Next level · 3/5 Advanced
JavaScript: make a website come alive and interactive
A specialty you can bill for
An interactive catalog with a cart and WhatsApp ordering, coded in JavaScript by you
75,000 FCFA 16 h
View the next levelHTML and CSS: build and lay out a real website
A small business's complete website, coded by you and live on mobile
- 12 h of training
- 5 modules · 25 lessons
- 61 exercises
- 2 projects
- Certificate included
What you will be able to do
- Semantic, accessible HTML5 (structure, forms, basic ARIA attributes)
- Modern CSS (cascade, box model, relative units, variables)
- Flexbox and CSS Grid layout
- Mobile-first responsive development
- Image optimization and performance on mobile connections
- Publishing a static website (Netlify, GitHub Pages)
What you will produce
- A semantic HTML home page that passes the W3C validator
- An accessible contact and booking form
- An organized stylesheet with color and typography variables
- A responsive landing page for a small business, tested on three screen sizes
- The complete 4-page website of a small business, live online
- A Lighthouse report for your site, with your fixes
- A portfolio project sheet with link, screenshots and technical choices
Possible earnings
A beginner HTML and CSS developer can charge 75,000 to 150,000 FCFA (about $125 to $250) for a landing page and 150,000 to 300,000 FCFA (about $250 to $500) for a simple 4 to 5 page business website in Dakar or Abidjan in 2026; entry-level freelance offers start around 150,000 FCFA (about $250), while agencies charge 400,000 to 1,500,000 FCFA (about $670 to $2,500). Websites with payments or an admin back office require the next levels.
Indicative estimate, depending on your market, pace and work. No income is guaranteed.
Tools used
- VS Code
- Google Chrome and Chrome DevTools
- HTML5
- CSS3
- W3C Validator
- Lighthouse
- Squoosh
- Netlify
- GitHub Pages
What you'll learn
- Structure a multi-page website in semantic HTML (header, nav, main, section, footer)
- Build accessible, clearly labeled contact and booking forms
- Master the cascade, specificity, the box model, units and typography in CSS
- Lay out interfaces with Flexbox and CSS Grid
- Make a website responsive with a mobile-first approach and media queries
- Organize maintainable CSS with variables and reusable components
- Optimize images and publish a website on Netlify or GitHub Pages
Prerequisites
- Level 1 of the track (Discover code: understand how a website works) recommended, or the ability to write a simple HTML page with headings, links and images
- A computer with VS Code and Google Chrome installed
- 3 to 4 hours a week for 3 to 4 weeks
About this course
## Build a real website, not a practice page
In Dakar and Abidjan alike, hundreds of small businesses are looking for a simple website that loads fast and reads well on a phone: a restaurant, a clinic, a private school, a professional firm. That work always starts from the same foundation: well-structured HTML and CSS that holds up on every screen. That foundation is what you will master here.
### Who this course is for
- You have completed level 1 (Discover code) or you can already write a simple HTML page.
- You want to move from a practice page to a multi-page website you can show people.
- You are a graphic designer or community manager and want to build your own mockups yourself.
### What you do during the course
- You structure a website in semantic HTML, with forms and solid accessibility.
- You master the cascade, the box model, units and typography in CSS.
- You lay out pages with Flexbox and CSS Grid, then make everything responsive, starting from mobile.
- You organize your CSS with variables, optimize your images and put your site online.
### What you leave with
A responsive landing page, then the complete 4-page website of a small business (fictional or real), live online, fast on a 3G connection and ready for your portfolio.
### Where it fits in the Web development track
This is level 2: after level 1 (Discover code) and before level 3 (JavaScript: make a website lively and interactive). Level 5, Full-stack developer, covers HTML and CSS in two modules; here you spend twelve hours on them.
Who it is for: Beginners who have written their first HTML tags, students, graphic designers, community managers and future developers in Dakar, Abidjan, Bamako, Cotonou or the diaspora who want to hand-code a clean, responsive business website.
Curriculum
A module-by-module path: lessons, exercises, quizzes and projects to submit.
Module 1· 12 exercises
Semantic HTML: structuring a website
You break a website down into pages and semantic areas, and write clean HTML that browsers, Google and screen readers understand.
- Planning a business website: pages, content and file structureFree preview3 exercises15 min
- Semantic tags: header, nav, main, section, article and footerFree preview3 exercises18 min
- Links between pages, anchors and main navigationFree preview3 exercises15 min
- Images, figures and media: formats, alt text and file sizeFree preview3 exercises15 min
- Module handout (PDF)Free preview5 min
- Quiz: semantic HTMLModule quiz
Module 2· 12 exercises
Forms and accessibility
You build the forms a small business needs and check that everyone can use them, by keyboard and with a screen reader.
- Anatomy of a form: label, input, select and textarea3 exercises18 min
- Input types and built-in validation: email, tel, date and required3 exercises15 min
- Accessibility: contrast, keyboard navigation and useful ARIA attributes3 exercises18 min
- Metadata and basic SEO: title, description and WhatsApp previews3 exercises15 min
- Module handout (PDF)5 min
- Quiz: forms and accessibilityModule quiz
Module 3· 12 exercises
CSS: the fundamentals
You understand why a CSS rule applies or not, and you master boxes, units, colors and typography.
- Selectors, cascade, inheritance and specificity3 exercises18 min
- The box model: margin, border, padding and box-sizing3 exercises15 min
- Units and sizing: px, rem, %, vw and max-width3 exercises15 min
- Colors, fonts and typography that reads well on a phone3 exercises15 min
- Module handout (PDF)5 min
- Quiz: CSS fundamentalsModule quiz
- Landing page for a Dakar restaurantProject to submit
Module 4· 12 exercises
Layout: Flexbox, Grid and responsive design
You lay out any mockup with Flexbox and Grid, and make it work from a small Android phone to a large screen.
- Flexbox: aligning a navigation bar and cards3 exercises20 min
- CSS Grid: service grids, galleries and full page layouts3 exercises20 min
- Mobile-first and media queries: start from the phone3 exercises18 min
- Mobile menu and responsive images without JavaScript3 exercises15 min
- Module handout (PDF)5 min
- Quiz: Flexbox, Grid and responsive designModule quiz
Module 5· 13 exercises
Maintainable CSS, performance and going live
You organize your CSS so it stays clean across several pages, make your site fast on 3G and publish it.
- CSS variables and reusable components: buttons, cards and sections3 exercises18 min
- Lightweight transitions and animations that don't slow the page3 exercises15 min
- Performance: image weight, WebP and lazy loading3 exercises15 min
- Publishing on Netlify or GitHub Pages and checking with Lighthouse4 exercises15 min
- Module handout (PDF)5 min
- Quiz: Maintainable CSS and going liveModule quiz
- Final project: a small business's responsive websiteCapstone
Certificate included
Your certificate at the end
A numbered certificate with your validated skills, a public page and a verification QR code. Add it to LinkedIn in one click.
Kolonell Academy
Verified by Kolonell AcademyCertificate of skills
Your name
has completed and validated the course
HTML and CSS: build and lay out a real website
Certified skills
- Semantic, accessible HTML5 (structure, forms, basic ARIA attributes)
- Modern CSS (cascade, box model, relative units, variables)
- Flexbox and CSS Grid layout
- Mobile-first responsive development
- Image optimization and performance on mobile connections
- Publishing a static website (Netlify, GitHub Pages)
Number KOL-CERT-2026-XXXXX
Mohamed Bah
Founder, Kolonell Academy
Course poster
Download the poster to print it, send it to your employer or share it with colleagues. The full programme details every module.
Your instructor
Mohamed Bah
PhD in computer science and founder of Kolonell, a digital agency and platform based in Dakar. He designs and deploys websites and web applications for SMEs in Senegal, Côte d'Ivoire and the diaspora, using the tools taught in this track.
Questions about this course
Do I need to have completed level 1?
It is recommended but not required. If you can already create an HTML file, write headings, paragraphs, links and images, and open your page in the browser, you can start here directly.
Why not use WordPress or a website builder?
Those tools have their place, but they all produce HTML and CSS. Knowing how to write it yourself lets you fix what the tools break, turn a mockup into a pixel-perfect page and prepare for JavaScript and React, which are built on these foundations.
Do we use Bootstrap or Tailwind?
No, not at this level. You write CSS by hand so you understand what those tools do. Tailwind comes in at level 4 (React and Next.js), once you know exactly what it generates.
Will my website really be online?
Yes. Module 5 has you publish your site on Netlify or GitHub Pages for free. You can then connect it to a domain name if you wish (6,300 to 8,600 FCFA, about $10 to $14, a year for a .com; 15,000 to 25,000 FCFA, about $25 to $42, for a .sn, as of September 2026).
How much time should I plan?
About 12 hours: lessons, auto-graded coding exercises and two projects. At 3 or 4 hours a week, allow 3 to 4 weeks.
Can I start offering websites to clients after this level?
You can offer landing pages and simple static business websites. As soon as a client wants a form that saves data, a Wave payment or an admin area, you need the next levels or a developer partner.
How do I pay?
Via Wave or Orange Money. After enrolling you receive a pro forma invoice by email with the number to pay. Send the proof on WhatsApp: your access is activated within 24 business hours.
How long do I keep access?
For life, updates included. Learn at your own pace and revisit lessons as often as you need.
How do I get the certificate?
Complete the lessons and pass each module quiz with at least 70%. The certificate is generated automatically, with a unique number and a public verification page.
Our commitments
- Lifetime access, updates included
- Publicly verifiable certificate
- Wave / Orange Money payment, activation within 24 business hours
- WhatsApp support
50,000 FCFA · 76 €
Practical