Het volledig vernieuwde ontwerp van Divi 5 biedt ongeëvenaarde snelheid, prestaties en gebruiksgemak. Met een vereenvoudigde Visual Builder en een volledig herbouwde back-end is het bouwen van websites met Divi 5 sneller en eenvoudiger dan ooit. Divi 5 stelt u in staat, ongeacht uw ervaringsniveau, om geweldige sites te ontwikkelen in recordtijd zonder tijd of creativiteit op te offeren.
Kom de nieuwe Divi 5 UI bekijken tijdens deze Public Alpha-periode. Vergeet niet dat deze iteratie nog steeds in actieve ontwikkeling is. Hoewel u bepaalde gebreken kunt vinden, kunt u met het onderstaande advies uw productiviteit maximaliseren terwijl u test en ontwikkelt met Divi 5.
10 beste manieren om een snellere website te maken met Divi 5
Sinds de release van Divi 5 Public Alpha zijn er veel aanpassingen en verbeteringen doorgevoerd.
1. Maak gebruik van bewerken met één klik
In Divi 4 moet u op het instellingenpictogram klikken om secties, rijen en modules te wijzigen. Met Divi 5 heeft one-click editing dat allemaal geëlimineerd. De module kan worden bewerkt door ergens in te klikken, wat het ontwerpproces versnelt en de frustratie ervan vermindert.
Maak geweldige websites
Met de beste gratis paginabuilder Elementor
Begin nuAls u bijvoorbeeld een tekstmodule wilt wijzigen, hoeft u slechts op een willekeurige plek in de module te klikken om direct toegang te krijgen tot de instellingen.
2. Om snel actie te ondernemen, klikt u met de rechtermuisknop
Het contextmenu met de rechtermuisknop in Divi 5 biedt u een waardevolle nieuwe snelkoppeling voor uw ontwerpproces. U kunt met de rechtermuisknop op elke module, sectie of rij klikken om een snel actiemenu te maken met een paar vaak gebruikte activiteiten. Met deze tool kunt u snel bewerkingen voltooien zonder meerdere panelen te openen of door opties te spitten, of u nu modulestijlen wilt kopiëren, instellingen wilt dupliceren of ze wilt verwijderen.
Stel bijvoorbeeld dat u een knop met een unieke stijl hebt gemaakt. Met de optie snelle acties kunt u met de rechtermuisknop klikken, de stijl van de knop kopiëren en deze toepassen op alle knopmodules waarop u dezelfde stijl wilt hebben.
3. Meerdere tabbladen koppelen voor verschillende taken
Multi-panel docking, waarmee u meerdere panelen tegelijk kunt openen en bedienen, is een andere fantastische nieuwe functie van Divi 5. U kon in eerdere versies veel panelen bekijken (lagen + module-instellingen, bijvoorbeeld), maar u kon ze alleen over het canvas verplaatsen zonder uw zicht te belemmeren. Om het canvas vrij te houden van rommel, kunt u panelen in Divi 5 tabben.
Wanneer u meerdere panelen naast elkaar kunt documenteren, is het eenvoudig om meerdere aspecten van uw ontwerp in één keer te wijzigen. Met de interface van Divi 5 kunt u panelen op het canvas rangschikken zoals u wilt, waardoor u de ideale werkruimte voor uw vereisten creëert. Stel bijvoorbeeld dat u liever elk paneel aan de linkerkant van het canvas wilt hebben. Om een werkruimte te creëren die bij u past, kunt u panelen loskoppelen en naar links verplaatsen en vervolgens andere panelen tabben.
4. Gebruik Canvas-schaalbaarheid in uw voordeel bij responsief ontwerp
Divi 5 biedt een compleet nieuwe benadering van responsieve webpagina-creatie. Dankzij canvas-schaling kunt u uw werkruimte snel schalen en zien hoe uw website op verschillende schermen zal verschijnen zonder ooit de Visual Builder te verlaten. U kunt ook snel het ontwerpcanvas aanpassen, waarmee u de lay-out, opvulling en marges kunt wijzigen.
Denk aan het volgende scenario: u werkt aan een mobiele lay-out en wilt de afstand tussen onderdelen wijzigen. Om de canvas-schaal aan te passen, klikt u op de rand van het canvas en sleept u deze naar de gewenste grootte. Vanaf daar kunt u snel de marges en opvulling aanpassen om ervoor te zorgen dat uw ontwerp scherp is op kleine beeldschermen.
5. Pas Hover & Sticky Effecten direct toe
Het toevoegen van hover- en sticky-effecten aan uw ontwerpen is nu eenvoudiger dan ooit met Divi 5. In eerdere versies van Divi moesten gebruikers naar het ontwerptabblad van de module gaan en de instellingen invoeren. Toch kunt u met Divi 5 deze effecten rechtstreeks vanuit het instellingenmenu toepassen. Dankzij deze innovatieve methode is het nu eenvoudiger dan ooit om dynamische, boeiende ontwerpen te maken zonder uw workflow te verstoren.
Divi 5 maakt het eenvoudig en snel om hover-effecten toe te passen op knoppen en uw header bovenaan het scherm te houden terwijl gebruikers navigeren. Stel bijvoorbeeld dat u een andere kleur wilt toevoegen aan hover bij het maken van een call-to-action. Om wijzigingen in een kwestie van seconden toe te passen, kiest u de hover-status uit een dropdownmenu in de instellingen.
6. Gebruik breadcrumbs voor effectievere navigatie
Een nieuwe breadcrumb-functie in Divi 5 maakt het voor gebruikers gemakkelijker en sneller om toegang te krijgen tot modules en instellingen. Dankzij breadcrumbs kunt u navigeren tussen lay-outs zonder te verdwalen. Ze dienen als een visuele gids die uw exacte locatie binnen de instellingen aangeeft.
Wanneer u binnen een sectie werkt, hoeft u niet terug te gaan via menu's of uw plaats te verliezen. Om het ontwerpproces te versnellen, biedt elke breadcrumb een klikbare link waarmee u snel terug kunt keren naar een eerdere preset.
7. Kopieer en plak stijlen over modules heen om tijd te besparen
Divi 5 maakt het kopiëren en plakken van modulestijlen tussen verschillende onderdelen eenvoudig. Dit bespaart tijd en zorgt voor consistentie op uw site door u in staat te stellen dezelfde ontwerpinstellingen snel toe te passen op verschillende modules. Divi 5 vereenvoudigt stijlen van elke module, rij of sectie en gebruikt ze vervolgens overal in uw ontwerp.
Stel bijvoorbeeld dat u wilt dat alle knoppen op een webpagina hetzelfde ontwerp hebben. U kunt de stijl toepassen door met de rechtermuisknop te klikken om het menu Snelle acties te openen, de stijl te kopiëren en vervolgens met de rechtermuisknop te klikken om deze op elke knop op de pagina te plakken.
8. Gebruik Wireframe View bij het maken van complexe lay-outs
De wireframeweergave in Divi 5 elimineert de visuele ontwerpcomponenten van een pagina, waardoor een duidelijke, ongecompliceerde lay-outblauwdruk zichtbaar wordt. In deze weergave kunt u zich volledig concentreren op de structuur, vrij van visuele afleidingen zoals kleuren en lettertypen. Het is handig voor ingewikkelde lay-outs wanneer u snel structurele aanpassingen moet maken.
Met deze vereenvoudigde versie kunt u zich concentreren op het ordenen van secties, rijen en modules. Met de wireframeweergave kunt u de structuur van een complex project beheren zonder u zorgen te maken over de esthetiek.
9. Gebruik lange inhoud in de lagenweergave
De Layers View bakent de secties, rijen en modules van uw pagina af. Dit maakt het eenvoudiger om de hele structuur van uw lay-out snel te bekijken. U kunt eenvoudig een bepaald stuk of module vinden in het Layers-paneel in plaats van door de Visual Builder te navigeren.
Elk element in de lay-out kan direct worden geselecteerd en bewerkt in de Layers View zonder dat u erop hoeft te klikken in de Builder. Dit is vooral handig voor onderdelen die diep in andere modules zijn genest of verborgen zijn, zoals rijen in verschillende lagen van secties.
10. Sta open voor het leren van nieuwe dingen
Divi 5 biedt een compleet andere benadering van het gebruik van de Visual Builder. Er is een leercurve verbonden aan al deze belangrijke upgrades. In het begin is het normaal om je een beetje overweldigd te voelen, vooral als je gewend bent aan eerdere versies van Divi. Het goede nieuws is dat elke aanpassing die we aan de Builder hebben gemaakt, eenvoudig te gebruiken is, dus vertrouwd raken met de gebruikersinterface zal je helpen om sneller en effectiever websites te maken met Divi.
Afronden
De interface van Divi 5 is ontworpen om de productiviteit te verbeteren, maar gebruikers kunnen er het beste mee experimenteren door meerdere panelen te koppelen, snelkoppelingen met de rechtermuisknop te gebruiken en bestaande ontwerpen opnieuw te bekijken.
De Divi 5 Migrator kan helpen bij het verfijnen van ontwerpen. Het begint met eenvoudige functies zoals canvas scaling en hover en sticky effects tools. Naarmate u meer vertrouwd raakt met Divi 5, zult u op natuurlijke wijze meer functies in uw ontwerpproces opnemen. Experimenteer met verschillende instellingen, speel met de nieuwe interface en verfijn technieken om uw workflow soepeler en efficiënter te maken.
