Specialisatie in het maken van websites met een code

Introductie

Vergeet alles wat je dacht nodig te hebben om een website te bouwen. Wat voorheen complexe code vereiste, heb je nu zelf in handen: intuïtief, visueel en voor iedereen toegankelijk. Duik in de creatieve vrijheid van no-code tools en ontdek hoe design, strategie en storytelling samenkomen om betekenisvolle digitale ervaringen helemaal vanaf nul te creëren.

2m

Invloeden | Juan Mora

Hier vind je de ontwerpers die mijn werk hebben beïnvloed en ik zal uitleggen waarom en hoe ze dat hebben gedaan.

2m

Invloeden | Filip Felbar

Nu wil ik het hebben over mijn grootste invloeden en hoe ze mij als creatief hebben beïnvloed.

7m

Invloeden | Jan Losert

Ik wil dat je kijkt naar vijf mensen die mijn stijl hebben gevormd of me gedreven hebben in mijn werk. En ik zal je vertellen waarom ik van hun werk geniet.

11m

Invloeden | Mónica Durán

In deze les wil ik enkele van de webdesigners die gespecialiseerd zijn in Squarespace met u delen en die ik nauwlettend volg. Ik zal je ook enkele boeken en blogs laten zien over design en webdesign in het algemeen die erg nuttig zijn geweest in mijn trainingsproces en die ik regelmatig blijf raadplegen.

10m

Invloeden | Isa Macías

Voor mij is het super belangrijk om creatieve referenties te hebben waarmee ik mezelf dagelijks kan inspireren en constant kan leren. In deze les laat ik je zien van welke studio's en ontwerpers ik vandaag het meest bang ben.

2m

Soorten bestemmingspagina's

In deze les leer je over verschillende soorten landingspagina's en leer ik je hoe je kunt bepalen welke het meest geschikt is voor het project dat je gaat uitvoeren.

7m

Wat is een goede landingspagina?

Nu ga ik aan de hand van verschillende voorbeelden uitleggen hoe je de elementen van een effectieve website kunt identificeren.

8m

Wat is hiërarchie in inhoud?

In deze les zal ik je vertellen hoe je inhoud kunt prioriteren en hoe belangrijk deze is bij het vertellen van een bestemmingspagina.

5m

Contrast, visuele balans en de 3 seconden regel

Ten slotte gaan we de rol analyseren die contrast en balans spelen bij de navigatie van een bestemmingspagina. We zullen ook zien hoe we de 3-secondenregel in ons voordeel kunnen gebruiken.

4m

De opdracht en hoe te onderzoeken

De opdracht is het document dat ons helpt de behoeften van de klant te begrijpen. In deze les leer ik je onderzoeken vanuit de interpretatie van een opdracht.

11m

Inhoudsstructuur voor een landingspagina

Nu zal ik je leren hoe je de inhoud kunt ordenen om een verhaal te vertellen op basis van het eerdere onderzoek.

4m

Hoe maak je een moodboard

In deze les gaan we zien hoe je een moodboard kunt maken als hulpmiddel voor analyse, inspiratie en foutopsporing.

6m

De juiste typografie

Ten slotte ga ik je vertellen over het belang van typografie en ik zal uitleggen hoe je het op de juiste manier kunt selecteren, zodat het het beste past bij het project dat je onder handen hebt.

4m

Verhaal creatie

In deze les leer je rekening te houden met het gedrag van mensen wanneer ze interactie hebben met een product, systeem of dienst. Ook hoe u deze informatie kunt gebruiken als basis voor de organisatie van uw verhaal samen met de voorgestelde structuur in de planning.

7m

Zet al het materiaal op het canvas!

Het is tijd om alle elementen die je tijdens de cursus hebt verzameld op het canvas te plaatsen om te beginnen met het ontwerp van je landingspagina. In deze les leg ik uit hoe je dat doet.

11m

Creëer de middelen die u nodig heeft voor uw bestemmingspagina

Ten slotte ga ik je vertellen hoe je je eigen middelen kunt creëren met het materiaal dat je op internet vindt. Ik zal ook aanbevelen waar ze te zoeken.

10m

Ontwerpdefinitie

In deze les leer ik je hoe je de stijlgids maakt om je landingspagina vorm te geven. We zullen grafische en typografische elementen moeten definiëren om consistentie en eenheid aan het ontwerp te geven.

10m

Poets je ontwerp op: feedback

Het is tijd om feedback te vragen over wat we tot nu toe hebben gedaan. Op deze manier kunnen we de nodige details aanpassen om tot het definitieve ontwerp van het cursusproject te komen.

5m

Presentatie aan de opdrachtgever

In deze les laat ik je zien hoe je je project presenteert aan je klant en waar je rekening mee moet houden bij het uitleggen van de beslissingen die je hebt genomen om te laten zien wat je hebt gedaan.

4m

Inleiding tot ontwerpsystemen

In deze les zal ik een kort overzicht geven van wat ontwerpsystemen zijn en hoe ze doorgaans worden gebruikt. Ik zal ook ingaan op hoe mijn exacte proces werkt en waarom het gunstig voor mij is geweest.

6m

Hoe ontwerpsystemen u kunnen helpen uw workflow te versnellen

Vervolgens zal ik u enkele snelle voorbeelden geven van hoe ontwerpsystemen u kunnen helpen uw efficiëntie te verhogen, en ga ik na hoe globale stijlen en componenten nuttig zijn.

8m

Inleiding tot het project en de aanpak

Laten we nu eens kijken naar het project waaraan we gaan werken! Ik zal een algemeen overzicht maken van wat we nodig hebben om een succesvolle start te hebben.

6m

Het Figma-bestand opzetten en de eerste verkenningen beginnen 1

Eerst zal ik bespreken hoe ontwerpsystemen kunnen worden gemaakt in Figma. Daarna zal ik beginnen met de eerste verkenningen en enkele eerste componenten verzamelen.

18m

Het Figma-bestand opzetten en beginnen met de eerste verkenningen 2

Met deze eerste ontwerpverkenningen kunnen we spelen met alle ideeën die in ons opkomen. Laten we wat meer zien!

16m

Het verkennings- en ontwerpsysteem uitbreiden 1

Ik zal doorgaan met het uitbreiden van mijn ontwerpen en lay-outs, evenals het ontwerpsysteem zelf. Je zult zien hoe ik componenten en automatische lay-outs gebruik, zodat je een beetje een idee krijgt van hoe het werkt.

19m

Uitbreiding van het verkennings- en ontwerpsysteem 2

Zodra we een duidelijker idee hebben van welke richting we het project het liefst inslaan, herzien we enkele van onze aanvankelijke keuzes en werken we onze globale stijlen in de lay-outs bij. Laten we eens kijken hoe mijn project evolueert!

20m

De ontwerpsysteempagina's ordenen 1

In deze les ga ik de componenten en stijlen die ik heb gemaakt doornemen en begin ik ze op speciale pagina's te plaatsen om een eerste idee van de structuur te krijgen.

14m

De ontwerpsysteempagina's ordenen 2

Ik zal doorgaan met het verfijnen van mijn ontwerpsysteembestanden. Vergeet niet dat het verfijnen van een ontwerpsysteembibliotheek in deze eerdere stadia de tijd kan verkorten die aan het einde van het project nodig is wanneer we alles voorbereiden voor de uiteindelijke overdracht.

11m

Varianten verkennen bij het maken van componenten

In deze les gaan we wat dieper in op componenten; je zult begrijpen hoe we varianten kunnen gebruiken om onze toolkit nog verder te laten groeien. U krijgt ook een beter idee van hoe de naamgevingsconventies een rol spelen binnen Figma en waar u kunt verkennen om te zien welke functies u wilt benadrukken en waartoe u gemakkelijk toegang wilt hebben.

14m

Het ontwerpsysteem verfijnen met een samengestelde pagina 1

In deze les gaan we in op een doorontwikkeld ontwerp. Nu, in dit stadium, heb ik een paar iteraties doorlopen in mijn verkenningen en ben ik in een richting beland waar ik best tevreden mee ben. Vanaf hier gaan we dieper in op het maken van componenten en automatische lay-outs. We zullen ook bekijken hoe het combineren van deze tools ons kan helpen meer dynamische stromen en lay-outs te creëren.

20m

Het ontwerpsysteem verfijnen met een samengestelde pagina 2

Ik zal doorgaan met het verfijnen van het ontwerpsysteem. Bij het werken met websites die veel herhalende inhoud, inhoudsindexen of archieven in het algemeen hebben, vind ik het buitengewoon nuttig om meerdere automatische lay-outs, componenten en instanties in elkaar te nesten.

19m

Het ontwerpsysteem verfijnen met een samengestelde pagina 3

Als u wat meer tijd besteedt aan het bouwen van een enkele lay-out met componenten en automatische lay-out, kunt u zien hoe verschillende inhoudsindelingen in verschillende gevallen kunnen werken. Als we ons na een paar aanpassingen realiseren dat de inhoud waarmee we werken eigenlijk niet overeenkomt met onze oorspronkelijke visie, kunnen we meerdere exemplaren van verschillende inhoudsstukken tegelijkertijd aanpassen om een beter idee te krijgen van hoe ons concept kan worden gebruikt in een real-world omgeving. Laten we eens kijken hoe dit ontwerpsysteem en deze website worden gestructureerd.

15m

Nieuwe pagina's opzetten met het complete ontwerpsysteem 1

Nu ga ik de webdesigns uitbreiden met enkele nieuwe pagina's: een blogarchief, een contactpagina en een productgalerij. De volgende stap is het testen van het ontwerpsysteem en kijken welke elementen werken, wat er moet worden gewijzigd en wat er moet worden toegevoegd.

19m

Nieuwe pagina's opzetten met het complete ontwerpsysteem 2

Na het maken van een blogarchief en een blogpost, laat ik je zien hoe je een contactpagina opbouwt. Hierdoor kunnen we zien hoe het ontwerpsysteem dat we hebben gemaakt ons kan helpen om snel deze nieuwe elementen te creëren.

20m

Nieuwe pagina's opzetten met het complete ontwerpsysteem 3

Hier zie je hoe ik de laatste extra pagina maak, de winkelpagina of productgalerij.

20m

Hoe te benaderen Het maken van documentatie voor het ontwerpsysteem

In deze les zal ik twee voorbeelden bespreken van het maken van documentatie voor een ontwerpsysteem, met behulp van Notion en zeroheight.

9m

Opschonen en gebruiken van een automatische lay-out

We zullen in deze laatste fasen wat tijd nemen om de website en het ontwerpsysteem door te nemen en ervoor te zorgen dat alles correct is ingesteld en onze standaardnotities gebruikt.

12m

Het ontwerp gebruiken voor verdere merkelementen

Ons ontwerpsysteem hoeft niet te stoppen bij een website. In deze les laat ik je een paar voorbeelden zien van het gebruik van het ontwerpsysteem dat ik heb gebouwd als uitgangspunt bij het creëren van aanvullende merkelementen, zoals posts op sociale media en briefpapier.

13m

Laatste gedachten

Klaar is kees! In deze les zal ik een paar aanvullende gedachten over dit hele proces bespreken.

2m

Inleiding tot No-Code

In deze les bespreek ik hoe websites worden gemaakt en verken je Webflow en de bronnenbibliotheek op Webflow University.

10m

Kernfuncties van Webflow

Laten we alle panelen en functies die Webflow biedt bekijken en een leeg project maken om de creatieve reis van deze cursus te beginnen.

17m

Ontwerp

We bekijken het ontwerp en bespreken waar we ons op moeten focussen voordat het project van start gaat. Vervolgens zal ik bespreken waar u royaltyvrije afbeeldingen voor uw project kunt krijgen.

7m

Stijlgids

In deze les zal ik bespreken waarom je aan het begin van elk project een fundering moet opzetten en lettertypen aan het lege project moet toevoegen.

11m

Stijlgids maken 1

In deze les gaan we aan de slag! Eerst zullen we alle initiële elementen instellen, zoals knoppen en typografie.

18m

Stijlgids maken 2

Nu gaan we verder met het verkennen van enkele knoppen en comboklassen.

16m

Heldensectie

Laten we beginnen met het maken van het bovenste gedeelte van onze website met een telefoon en een rij afbeeldingen.

18m

Navigatie

In deze les zal ik je door het bouwen van het navigatiemenu voor de website vertellen en hoe je het responsief kunt maken. We zullen de component met de naam Navbar stylen.

20m

Casestudy Secties 1

Nu gaan we fotokaarten maken met casestudy's van de studio en secties met statistieken van een bedrijf.

16m

Casestudy Secties 2

We zullen doorgaan met het toevoegen van elementen aan het case study-blok.

20m

Collage Sectie 1

In deze les leer ik je hoe je een collagesectie met foto's en getuigenissen kunt maken.

11m

Collage Sectie 2

We zullen de sectie met drie kolommen hergebruiken om een blok te maken met de belangrijkste waarden van het bedrijf.

10m

Klantensectie en eenvoudig nieuwsbriefformulier

In deze les wordt gekeken naar het maken van een klantensectie 'we hebben gewerkt met'.

14m

voettekst

Tijd om het laatste gedeelte van de site te bouwen - de voettekst.

20m

Tablet-viewport

In deze les bereiden we de site voor op kleinere viewports, te beginnen met de tabletweergave. Ik zal ook enkele tips delen om uw leven gemakkelijker te maken door strengere regels te hanteren voor de breedte van onze container- en wikkelklasse.

20m

Mobiele liggende en staande weergavepoort

We zullen alles nog smaller maken en ervoor zorgen dat de site er geweldig uitziet op mobiel, staand en liggend.

13m

Formulieren testen

We zullen vormen nog verder onderzoeken en succes- en foutstatussen stylen. En dan laat ik je zien waar je de formulierinzendingen kunt vinden en wat je ermee kunt doen.

7m

Interacties

Laten we tot slot de site speelser maken door subtiele interacties toe te voegen voor de heldensectie. Vervolgens zal ik het verschil bespreken tussen interacties tussen "Pagina laden" en "Scroll in View".

13m

SEO-optimalisatie en hosting

In deze les zullen we kijken naar het instellen van uw SEO-tags favicon en vervolgens onze site live brengen met een Webflow-hostingplan.

10m

Paneel Onderhoud, Editor en Activa

Laten we het hebben over onderhoud. Ik zal je laten zien hoe je de site kunt voorbereiden als je in de toekomst met meer mensen wilt werken en je project netjes en georganiseerd wilt houden.

9m

Verken CMS

Op een simpele blog laat ik je zien hoe CMS werkt in de Webflow toolkit. Vervolgens zal ik bespreken hoe u collecties kunt bouwen en de dynamische gegevens op statische pagina's versus collectiesjablonen kunt gebruiken.

12m

Het doel en de structuur van onze website definiëren P1

Om een functionele website (evenals aantrekkelijk) te ontwerpen, is het belangrijk om heel duidelijk te zijn over welk doel we willen dat deze ons helpt te bereiken, omdat we op basis hiervan de structuur van de website en elk van de pagina's zullen organiseren .

12m

Het doel en de structuur van onze P2-website definiëren

In deze les gaan we voorbeelden zien van hoe deze doelstellingen overeenkomen met ontwerpbeslissingen binnen het web en de elementen die we besluiten op te nemen in ons ontwerp (welke en hoe).

10m

De algemene stijl van onze site

Nu we de structuur van het web hebben gecreëerd, gaan we in grote lijnen de visuele stijl definiëren die we willen dat het heeft. We gaan op een heel eenvoudige manier zien hoe je lettertypen en kleuren kunt combineren, en ik ga je voorbeelden geven van hoe je ze kunt gebruiken om een visuele stijl voor je website te creëren. Ik ga je ook enkele bronnen geven waar je inspiratie kunt zoeken.

14m

Creatie, organisatie en voorbereiding van grafische bestanden

We hebben al alle grafische bronnen die we op onze website zullen gebruiken en een algemeen overzicht van het ontwerp van elke pagina ... nu moeten we alle bestanden voorbereiden die we zullen gebruiken, zodat ze zijn geoptimaliseerd voor gebruik op internet , en zo georganiseerd dat we ze gemakkelijk kunnen vinden wanneer we ontwerpen in Squarespace.

7m

Wijzigingen in de interface van Squarespace-inhoudsblokken

In deze les leg ik kort enkele recente wijzigingen aan Squarespce uit, zodat u de verschillen kent tussen wat u in de interface van de volgende lessen zult zien en de interface die u op uw Squarespace-site zult zien wanneer u deze maakt.

3m

Hoe u de sjabloon voor uw website kiest

In deze les gaan we een rondleiding volgen langs de verschillende sjablonen die we in Squarespace vinden wanneer we een nieuwe website gaan maken. We zullen zien welke kenmerken ze hebben en waar u rekening mee moet houden bij het kiezen van de juiste voor uw project.

9m

Begininstellingen in Squarespace

Met het aangemaakte account nemen we een rondleiding door het hele Squarespace-beheerpaneel, zodat u vertrouwd raakt met de verschillende secties: Pages, Design, Commerce, Marketing, Analytics, Comments, Settings en Help. [textbox type=alert]Belangrijke opmerking: Na het opnemen van de lessen voor deze cursus, heeft Squarespace een nieuwe sectie uitgebracht in het admin panel, genaamd Profiles of Profiles . Dit gedeelte is niet bijzonder relevant voor de inhoud van de cursus, maar het is de moeite waard om het een beetje te verkennen, aangezien u vanaf hier de profielen kunt bekijken en beheren van: - Klanten: mensen die op je website hebben gekocht, als je een online winkel hebt opgezet (en dat zien we niet in de cursus). - Abonnees: mensen die zich abonneren op uw mailinglijst als u de native Squarespace-optie gebruikt. Als u een externe e-mailmarketingtool gebruikt (zoals Mailchimp of Mailerlite), kunt u deze hier niet beheren. U kunt meer informatie vinden over dit nieuwe gedeelte van het Squarespace-beheerpaneel via deze link.[/textbox]

12m

Pagina's maken in Squarespace: hun eigenschappen en instellingen

In deze les ga ik de verschillende soorten elementen uitleggen die we in Squarespace hebben om de "architectuur" van de website te creëren: pagina's, verzamelingen (of verzamelingspagina's), mappen en links, aangezien elk andere functies en kenmerken heeft.

18m

De inhoudsblokken in Squarespace

Nu je weet hoe de algemene structuur van een website werkt in Squarespace, gaan we kijken hoe de structuur van elk van de pagina's wordt gemaakt en om het beter uit te leggen gaan we een pagina maken waaraan we verschillende inhoudsblokken zullen toevoegen, dat zijn de elementen waaruit het ontwerp van elke pagina in Squarespace bestaat.

8m

De paginasecties in Squarespace

Nu we weten wat de inhoudsblokken zijn die we in Squarespace hebben, laten we eens kijken hoe we ze kunnen integreren met paginasecties om het ontwerp van elk van de webpagina's te maken.

17m

Ontwerp en configuratie van de pagina's Home, Services, Over mij en Contact P1

Van de schetsen die we in Unit 2 hebben gemaakt en de inhoud die we in ons werkboek hebben toegevoegd, gaan we de pagina's Home, Over mij, Services en Contact maken, met al hun secties, teksten en afbeeldingen.

17m

Ontwerp en configuratie van de pagina's Home, Services, Over mij en Contact P2

Maak je voorlopig geen zorgen over kleuren of lettertypen, want dat zullen we later aanpassen: het belangrijkste is nu om de structuur van de pagina's te creëren.

16m

Ontwerp en configuratie van de pagina's Home, Services, Over mij en Contact P3

Op de contactpagina leer ik je hoe je een formulier toevoegt en wat je moet doen om de tekst en het benodigde vak op te nemen om te voldoen aan de RGPD (Algemene Verordening Gegevensbescherming).

16m

Portfolio P1 Pagina-instellingen

In deze les zullen we zien hoe u een portfolio met projecten aan het web kunt toevoegen. Ik laat je de verschillende ontwerpopties zien die je hebt voor je hoofdportfoliopagina, hoe je nieuwe projecten kunt toevoegen en de verschillende aanpassingen die je aan bepaalde projecten kunt maken.

12m

Portfolio P2 Pagina-instellingen

16m

Blog-instellingen P1

Nu zullen we zien hoe u een blog voor uw website kunt configureren. Ik zal je de verschillende ontwerpopties laten zien die je hebt voor de hoofdblogpagina, hoe je nieuwe berichten kunt toevoegen en de verschillende algemene aanpassingen die je aan elk bericht moet maken voordat je het publiceert.

16m

P2 Blog-instellingen

18m

P3 Blog-instellingen

11m

Aanmaken van voetteksten en hoofdnavigatie-aanpassingen

In deze les ga ik je leren om de voettekst van de webpagina (voettekst) te configureren om alles op te nemen dat we in Unit 2 hebben gedefinieerd. Je zult zien dat het heel eenvoudig en zeer flexibel is om wijzigingen aan te brengen in de voettekst van je site , nu je al goed thuis bent in de secties en inhoudsblokken van Squarespace.

18m

De lettertypen en kleuren van de site instellen P1

In deze les laat ik je de verschillende opties zien die je hebt om de stijl van de titels, ondertitels en hoofdtekst van de site te definiëren. U leert de lettertypen die de sjabloon standaard bevat, te wijzigen en enkele aanvullende aanpassingen aan te brengen om stijlen anders aan te passen dan de standaard.

20m

De lettertypen en kleuren van de P2-site instellen

12m

Afbeeldingsinstellingen en andere instellingen

Met kleuren en lettertypen klaar, gaan we nu zorgen voor beeldaanpassingen en andere details zoals algemene site-animaties, spatiëring, knoppen, browserpictogram (favicon), afbeelding voor sociale netwerken, speciale paginastijlen, onder andere.

13m

Bonus: webstijlen in Squarespace 7.0

Deze les is alleen voor degenen die Squarespace versie 7.0 hebben. Hier leest u hoe u lettertypen, kleuren en andere webelementen kunt aanpassen op een site die is ontworpen in de oude versie van Squarespace.

10m

Marketinginstellingen

We gaan de elementen bekijken die we hebben in het Squarespace Marketing-paneel en ik zal je laten zien hoe je een advertentiebalk voor het web configureert, evenals een pop-upvenster dat je kunt gebruiken om wat informatie te promoten of abonnees aan te trekken.

13m

Algemene privacy-instellingen

In deze les leer ik je hoe je de juridische pagina's van de site maakt en deze linkt in de footer. Ik zal je ook laten zien hoe je de cookie-advertentiebalk configureert en de instellingen die je ervoor moet maken, en ik zal je een alternatieve optie geven voor het geval je een meer geavanceerde cookiebalk nodig hebt als je extra cookies op je website gaat laden.

8m

Laten we de P1 openbare site maken

Ten slotte zullen we de nodige stappen bekijken om uw website openbaar te maken: de verschillende betalingsplannen die Squarespace heeft, hun kenmerken en welke ik aanbeveel voor een website zoals degene die we in de cursus zullen doen.

16m

Laten we de P2 openbare site maken

6m

Site-analyse bijhouden

Ten slotte zullen we het Analytics-paneel van de site verkennen: ik zal u een rondleiding geven door de secties en ik zal u mijn aanbevelingen geven om er het beste uit te halen.

10m

Visuele referenties: waar te zoeken naar inspiratie

In deze les wil ik je vertellen hoe belangrijk het voor mij is om te zoeken naar visuele referenties die mij inspireren bij het ontwikkelen van een webdesignproject. Ik zal je ook vertellen waar ik die referenties kan vinden en bewaren om ze altijd in gedachten te houden tijdens het hele ontwerpproces van de site.

6m

Sitemap en stijlgids

Nu ga ik je leren hoe je de route kunt traceren die de gebruiker aflegt zodra ze op je website zijn beland, zodat je een duidelijker beeld krijgt van welke pagina's je moet ontwerpen en hoe ze met elkaar zijn verbonden. We zullen ook zien hoe we een kleine stijlgids kunnen maken waarin we de algemene elementen en stijlen kunnen verzamelen die we voor het web willen.

6m

Voorbereiding van het ontwerpvoorstel 1

Zodra we het volledige visuele concept van het web hebben gemaakt, gaan we het ontwerpvoorstel voorbereiden.Dit is een van de meest opwindende onderdelen van het proces! Ik begin met het ontwerpen van de koptekst, voettekst en mijn startpagina.

16m

Voorbereiding van het ontwerpvoorstel 2

Ik blijf in Figma de rest van de secties ontwerpen die ik in de websitekaart heb gedefinieerd. Denk er tijdens dit proces aan om uw referenties in gedachten te houden!

10m

Eerste stappen in WordPress

In deze les ga ik je leren hoe je WordPress installeert en wat de basiswerking ervan is. Op deze manier kunt u vertrouwd raken met het volledige potentieel van deze software.

10m

Elementor installeren

Nu gaan we Elementor installeren, de tool waarmee we al het webdesign gaan bouwen zonder dat we een enkele regel code hoeven te schrijven.

9m

Elementor 1 kennen

We gaan alle elementen en algemene stijlen die we in de stijlgids hebben gedefinieerd, overbrengen naar Elementor. Aangezien we alles al hebben uitgedacht en gedefinieerd in onze gids, zal het proces heel eenvoudig zijn!

8m

Elementor 2 kennen

Nu ga ik een korte samenvatting maken van de configuraties die ik je in de vorige video heb laten zien. Daarna gaan we verder met het configureren en aanpassen van andere opties, zoals de lettertypeset.

17m

Kop- en voettekst 1

In deze les ga ik uitleggen wat de Elementor theme builder is en waarom ik er zo'n fan van ben. Ik zal je ook leren hoe je het kunt gebruiken om de koptekst van je website te ontwerpen.

19m

Kop- en voettekst 2

Nu ga ik je laten zien hoe ik de footer van mijn website bouw met Elementor. Zie je hoe snel het is om met dit programma te werken?

10m

Startpagina

Het is tijd om het eerste deel van het web te ontwerpen. De startpagina is waarschijnlijk de eerste pagina die ze op uw site zien, dus hier ben ik altijd het liefst creatief en visueel bezig.

10m

Sjabloon voor projecten 1

In deze les gaan we werken met de sjabloonopties van Elementor om de individuele projectpaginalay-out te maken. En overigens zal ik ook alle projecten in mijn portfolio opnemen.

19m

Sjabloon voor projecten 2

Nu ga ik je laten zien hoe ik aan de slag ga met de responsive versie van mijn projecttemplate.

10m

Project archief

Het volgende dat ik je ga leren ontwerpen, is de hoofdpagina van de portfolio, waar alle projecten die we naar het web uploaden, worden gearchiveerd.

6m

"Over" en "Contact"

Ten slotte gaan we werken aan twee essentiële secties op elke website: de "Over" -pagina en de "Contact" -pagina.

15m

Secundaire pagina's: privacy, 404 en onderhoud

In deze les ga ik het hebben over enkele secundaire gedeelten van uw site, die a priori niet zichtbaar zijn, maar er wel zijn. En ik leer je ook hoe je je website in onderhoudsmodus zet.

13m

Test en start de website

Voordat we het web naar de wereld lanceren, gaan we het testen om te controleren of alles werkt en eruitziet zoals we willen. Ik leer je hoe het moet!

8m

Site-update

In deze laatste les wil ik je laten zien hoe belangrijk het is om back-ups te maken voordat je je website gaat updaten.

3m