Een webpagina ontwerpen, ontwikkelen en publiceren
A course by Javier Usobiaga Ferrerwebdesigner
A course by Javier Usobiaga Ferrer, webdesigner
Volg een complete rondleiding door het proces van het maken en publiceren van een website met HTML, CSS en JavaScript
In webdesign probeert een goede interface te behagen en te reageren op hoe het menselijk brein werkt. Dat betekent dat we allemaal een ontwerper in ons hebben, soms onbewust of slapend, die in staat is om iets te zien dat werkt, dat harmonieus is, ook al begrijpt hij niet waarom. Als je de principes van webdesign wilt leren en die ontwerper in je wilt laten ontwaken, ben je hier op de juiste plek.
In deze cursus zie je de twee kanten van het maken van een website: aan de ene kant zie je de basistechnieken om een website te plannen, informatie in wireframes te ordenen en een visuele grammatica te creëren met typografie, kleurenpaletten, spatiëring, compositie, illustratie. Vervolgens ga je in op de opbouw van die pagina met HTML, CSS en JavaScript, tot het moment van publicatie van de pagina op internet.
Je gids tijdens dit proces is Javier Usobiaga, webdesigner, oprichter van de Swwweet-studio en professor van andere cursussen bij Domestika zoals SVG-vectorafbeeldingen: illustreren en animeren met code , Weblay-out met CSS Grid, Flexbox en andere moderne technieken , Inleiding tot JavaScript-programmering e [Inleiding tot Responsive Web Development met HTML en CSS](Introducción al Desarrollo Web Responsive con HTML y CSS) , die kan dienen als aanvulling op wat in deze cursus wordt behandeld.
Wat leer je tijdens deze online cursus?
27 lessen & 33 aanvullende bronnen
Wat gaan we doen in de cursus?
1 minuut, 12 seconden
Ontwerpdoelen, kader en referenties
6 minuten, 50 seconden
Inhoud inventaris
6 minuten, 17 seconden
Informatie-architectuur
9 minuten, 56 seconden
Principes en hulpmiddelen
4 minuten, 9 seconden
Visueel onderzoek
6 minuten, 32 seconden
Wat is inbegrepen in deze cursus?
Je begint de cursus door Javier en enkele ontwerpers en ontwikkelaars te ontmoeten die artikelen schrijven en verschillende experimenten doen met webtechnologieën die de moeite waard zijn om bij te houden. Ook ontdek je de inhoud van de cursus.
Je leert de principes van visueel ontwerp en de elementen waaruit het bestaat, en je werkt vooral aan de meest fundamentele, zoals typografie, kleur, raster en illustratie.
U krijgt een eerste blik op een statische HTML-generator en zijn sjabloonsysteem, evenals het organiseren van bestanden en het maken van hoofdpagina's.
In de volgende eenheid begint u het voorgestelde ontwerpsysteem door te geven aan de code front-end : de typografie, de kleur, het raster en andere componenten.
U voegt meer interactie-elementen toe aan het project via verschillende bibliotheken en JavaScript-functies.
U zult zien hoe de codeversiebeheerders werken en ten slotte zult u een publicatieservice gebruiken om uw website aan de wereld bekend te maken.
Recommended software & tools for this course
What is this course's project?
Je maakt, ontwikkelt en publiceert een webpagina met je werkportfolio.
Projecten van studenten van de cursus
Who is this online course for?
Aan alle mensen die geïnteresseerd zijn in het leren van de principes van webdesign en die hun eigen webpagina willen publiceren.
Requirements and materials
Het is raadzaam om een basiskennis van HTML en CSS te hebben. Als je ze niet hebt, is het aan te raden om Javier's eerste cursus bij Domestika te voltooien: Inleiding tot responsieve webontwikkeling met HTML en CSS.
Je hebt een computer en een code-editor nodig (Javier zal je er enkele gratis aanbieden). Het kan ook interessant zijn om een visueel ontwerpprogramma zoals Sketch, Figma of Adobe XD te hebben, hoewel ze niet essentieel zijn.
Beoordelingen
- 3 maanden geleden
I really enjoyed this course. I already had a website I needed to build and I was able to apply this to improve it so much. It’s comprehensive and well structured.
- 4 maanden geleden
Muy buen curso y muy buena explicación del profesor, como siempre. Perfecto para iniciarse en la creación de webs
- 7 maanden geleden
Excelente curso para tener las bases de animación con css
- 7 maanden geleden
Me gustó
- 8 maanden geleden
Excelente curso, viene muy ordenado y armado. Es un muy buen profesor
Hij geniet ook van zijn rol als Web Design-leraar in gerenommeerde workshops en scholen zoals Elisava, IDEP.
Usobiaga begrijpt het web in zijn geheel, niet alleen hoe mooi het op het computerscherm kan zijn, maar ook de bruikbaarheid ervan in verschillende apparaten en omstandigheden.
In zijn woorden: "Ik denk dat net zo belangrijk als esthetiek is hoe snel het laadt of hoe goed het reageert, en het lijkt mij dat we dat in onze branche vaak vergeten".
Inhoud
- U1
Introductie
- Presentatie
- invloeden
- Wat gaan we doen in de cursus?
- U2
Ideatie van een web
- Ontwerpdoelen, kader en referenties
- Inhoud inventaris
- Informatie-architectuur
- U3
Visueel ontwerp
- Principes en hulpmiddelen
- Visueel onderzoek
- Typografische compositie
- Kleurenpalet in een interface
- Raster en verticaal ritme
- Illustratie en iconografie
- U4
Sjabloonsysteem
- Voorbereiding van de omgeving en code-editors
- Bestandsstructuur en werking
- Basispagina's en nieuwe pagina's maken
- Voorwaardelijk en gedeeltelijk
- U5
Frontend ontwikkeling
- Code organisatie
- Zetwerk en kleur
- Grid-systeem
- Interfacecomponenten
- De interface voltooien
- U6
Webinteractie
- Interactieve menu's en vervolgkeuzemenu's
- Een galerij implementeren
- De interactie voltooien
- U7
Een website publiceren
- Codeversiebeheer
- Uitgeverijdiensten
- Aanvullende bronnen
- EP
Eindproject
- Ontwerp, ontwikkeling en publicatie van een webpagina
Wat kan je verwachten van een cursus van Domestika
Leer in je eigen tempo
Geniet van thuis leren, zonder lesroosters en in je eigen tempo. Jij beslist wanneer je verder gaat met het volgende onderdeel.
Leer met de beste professionals
Leer de meest bruikbare methoden en technieken van de beste professionals in de creatieve industrie.
Ontmoet deskundige docenten
Iedere docent brengt kennis met passie over, biedt duidelijke uitleg en een professioneel perspectief bij elke les.
Certificates
PLUSIf you're a Plus member, get a persoonlijk certificaat signed by your teacher for every course. Share it on your portfolio, social media, or wherever you like.
Zorg dat je op de voorste rij zit
Dankzij de hoge kwaliteit van de video's mis je geen enkel detail. Dankzij de onbeperkte toegang kun je de lessen zo vaak bekijken als nodig is om je vaardigheden te perfectioneren.
Deel kennis en ideeën
Stel vragen, krijg feedback en bied oplossingen aan. Deel je leerervaringen met andere studenten in de community die net als jij een passie hebben voor creativiteit.
Maak contact met een wereldwijde creatieve community
Deze community heeft miljoenen gebruikers van over de hele wereld, nieuwsgierig en enthousiast om hun creativiteit te verkennen en te uiten.
Geef cursussen op een professionele manier
Domestika selecteert zorgvuldig haar docenten en produceert iedere cursus in eigen huis om een uitstekende online leerervaring te garanderen.
Veelgestelde vragen
The course is designed for people with basic HTML and CSS knowledge, but you don’t need to be an expert. It’s perfect for those wanting to deepen their skills in modern web design and front-end development techniques.
Basic knowledge of HTML and CSS is recommended. Advanced experience isn’t required, but it helps to understand basic webpage structure and code editing.
You’ll learn to build responsive layouts, CSS animations, accessible SVG graphics, information architecture, wireframing, prototyping, website publishing, and how to apply agile methodologies in digital projects.
You’ll need a code editor (like VS Code), Node.js, a terminal, an up-to-date web browser, and access to tools like Figma, Keynote, PowerPoint, or Notion for prototyping and organization.
You’ll learn how to use CSS variables to manage colors, fonts, and spacing, making it easier to keep a consistent look and quickly update your web projects globally.
Yes, you’ll practice using CSS Grid and other techniques to create adaptable web structures that look great on any device, enhancing the user experience.
Yes, you’ll be able to develop your own project, applying all the design, development, and publishing concepts to build a portfolio or client website.