Maak webontwerp efficiënter Met Mudcu.be Gratis online tools

Als je ooit hebt geprobeerd om webdesign te maken en je bent niet echt een artistiek type persoon, dan weet je dat de feitelijke niet-programmering “ontwerp” een deel van de vergelijking kan een beetje uitdagend worden.

Voor sommige mensen, zoals bepaalde leden van mijn familie die te goedkoop zijn om software voor het maken van afbeeldingen te kopen, doet zich de moeilijkheid voor wanneer ze logo's of achtergronden op maat willen maken. Voor sommige programmeurs komt het probleem als CSS-code nodig is en ze niet helemaal op de hoogte zijn van de nieuwste CSS-standaarden.

U kunt veel tijd besteden aan het bijhouden van de nieuwste trends en standaarden voor webdesign. Met de komst van zoveel WYSIWYG-webontwerpprogramma's is het maken van websites tegenwoordig meer het domein van niet-programmeurs dan programmeurs. Het probleem is dat je bij het aanpassen van een ontwerp om te doen wat je echt wilt, moet teruggaan naar een programmeur, je kunt er niet omheen.

Gelukkig zijn er tal van hulpmiddelen die kunnen helpen voordat je naar een programmeur moet gaan voor hulp. Hier bij MUO houden we van webontwerp en behandelen we het onderwerp vaak, zoals Ann's Firebug-recensie Amateurgids voor aanpassen van websiteontwerp met FireBug Amateurgids voor het aanpassen van websiteontwerp met FireBug Read More, of Steve's lijst met geweldige webontwerpblogs om 6 te volgen Web Design Blogs om te volgen 6 Beste Web Design-blogs om te volgen Lees meer .

Eén specifieke site die een hele lijst met echt nuttige webontwerpprogramma's biedt die iedereen kan gebruiken, is Mudcu.be.

Mudcu.be Web Design Tools

Mudcu.be is wat ik zou noemen een toolbox van basishulpmiddelen voor een webdesigner die werkt aan een heel klein budget (of geen budget). De tools die u op deze site vindt, zijn erg gericht op afbeeldingen en ontwerpen en coördineren de kleuren van uw website. Uiteindelijk zijn kleuren echt wat een ontwerp kan maken of breken, dus dit zijn belangrijke hulpmiddelen om handig te zijn.

Als u een van die mensen bent die niet over het geld beschikt om kwaliteitslak- of beeldcreatiesoftware te maken, of misschien reist u met een kleine laptop of netbook en hebt u een webgebaseerde beeldbewerkingsoplossing nodig. Een hulpmiddel op Mudcu.be dat kan helpen, is het schetsblok.

Met de Sketchpad-tool kunt u vrijwel elke gewenste afbeelding fabriceren in een webgebaseerde tool die niet verschilt van Windows Paint. Na een tijdje gebruik te hebben gemaakt van Sketchpad, vond ik het echter een stuk gebruiksvriendelijker en veel flexibeler dan Windows Paint. Als u klaar bent, klikt u op de kleine schijfkopie bovenaan en kunt u de afbeelding die u zojuist hebt gemaakt opslaan op uw computer. Het is zo makkelijk.

Naar mijn mening zijn de coolste tools die Michael Deal op zijn site aanbiedt de COLRD-selectie van kleurverloopgereedschappen. Dit zijn een reeks hulpmiddelen voor kleurenpalet waarmee u de kleurelementen zorgvuldig kunt aanpassen om de exacte tint van elke gewenste kleur te vinden. U past de tint, verzadiging en helderheid aan en past de niveaus rood, groen en blauw aan, en u kunt gewoon kiezen uit het vak met vergelijkbare kleuren aan de rechterkant als u dat wilt. Wanneer u klaar bent, wordt de kleurcode van de schaduw die u hebt gemaakt direct boven de schuifregelaars weergegeven.

De reeks COLRD-tools bevatten vergelijkbare webapps als die hierboven. De “creëren” menu kunt u kiezen uit het hulpmiddel Kleur hierboven, of u kunt gaan met Palet, Verloop of Afbeelding-DNA.

De andere tools spreken voor zich, maar beeld-DNA is het vermelden waard. Met deze tool kunt u elke afbeelding op uw computer openen en vervolgens de tool gebruiken om de kleuren binnen de foto te identificeren.

Het mooie van een tool als deze is dat als u van plan bent om bepaalde beelden op uw webpagina te gebruiken, deze webapp u de kleuren laat identificeren die u op uw webpagina kunt gebruiken die perfect past bij de dominante kleuren in uw foto. Dit kan amateur-webontwerpers helpen om het veel voorkomende probleem van het botsen van kleuren op een webpagina te overwinnen - wat een fatsoenlijk ontwerp kan worden in een gruwelijke website.

Over gruwelijke websites gesproken, in deze tijd, waarom hebben mensen nog steeds nare achtergronden die eruitzien alsof ze uit de jaren negentig kwamen? Zodra u de kleuren en afbeeldingen van uw website allemaal gesorteerd hebt met de bovenstaande tools, kunt u doorgaan naar de achtergrondgenerator.

Met deze web-app kun je kiezen uit een lange lijst met “texturen” voor je achtergrond. Sommigen van hen kunnen er kaasachtig uitzien als je het niet goed opmaakt, maar veel ervan zien er heel goed uit als je de selectie Verloop gebruikt om de kleurschakering in te stellen, zodat deze er goed uitziet met je afbeeldingen en websitekleuren. Als u klaar bent, klikt u gewoon op “Genereer CSS” knop, en de CSS-code wordt voor u gegenereerd. Het wordt niet veel eenvoudiger dan dat.

De tool wordt zelfs geleverd met een “simulator” functie, waar u de achtergrond op uw webpagina kunt testen voordat u deze daadwerkelijk implementeert. Dit is hoe het eruitziet wanneer ik de simulator op Google.com gebruik.

Michael houdt van kleuren en geen enkele tool laat dit meer zien dan zijn Color Sphere. Zoals hij het op de website beschrijft, moet de kleurenbol je dat laten “visualiseer kleurharmonieën” formules gebruiken die hij bedacht. Het is eigenlijk best indrukwekkend, omdat je dan kunt beginnen met een bepaalde kleurselectie, bijvoorbeeld rood - en dan wordt je gekozen kleur onderverdeeld in een verloop van andere kleuren die binnenstromen “harmonie”. Dit zijn de kleuren die u op uw website wilt behouden om ervoor te zorgen dat alle kleuren goed samenwerken

Ik speel even met de Color Sphere, maar ik weet niet welke formules hij gebruikt, maar de kleurkeuzes werken echt goed samen.

Een andere van Michael's apps die het vermelden waard is, is eigenlijk een Appspot-aanbod genaamd Daltonize. Dit is echt een indrukwekkend hulpmiddel waarmee u het type kleurenblindheid kunt identificeren dat u hebt en vervolgens die selectie kunt gebruiken om uw browser in staat te stellen webpagina's aan u weer te geven in een indeling die rekening houdt met uw kleurenblindheid.

Nadat u de bladwijzer in uw browser heeft geïnstalleerd en de instructies hebt gevolgd, ziet u een wereldbolpictogram in uw werkbalk (althans in Chrome). Met Daltonize-instellingen kunt u de tekortkomingen in de kleurenweergave identificeren wanneer u de browser opent en u kunt de selectie voor kleurenblindheid op elk moment wijzigen.

Hier ziet u hoe de resulterende pagina eruitziet wanneer u het kleurenblindheidsfilter gebruikt. Als u niet kleurenblind bent, wordt in de afbeelding hieronder mijn blog weergegeven, die normaal een oranje tint heeft voor de kopzijden en de pictogramkleur, als een gloeiende paarse kleur. Het lijkt erop dat het ook enkele van de afbeeldingen op de site gekleurd heeft. Zeer indrukwekkend hulpmiddel!

Dit is geen lijst van alle ontwerptools die beschikbaar zijn op Mudcu.be, dus als kleur jouw ding is, of als je op zoek bent naar manieren om kleur beter in je webontwerp te integreren, dan is deze site een must-visit.

Heeft u ooit moeite met kleuren in uw inspanningen op het gebied van webontwerp? Welke hulpmiddelen of technieken gebruik je om dingen op elkaar af te stemmen? Deel uw mening en inzichten in de opmerkingen hieronder!

Image Credit: webdesign via Shutterstock

Meer informatie over: Webontwerp, Webontwikkeling, Webmasterhulpprogramma's.