Geweldige JQuery-plug-ins voor nieuwe websites
Je kunt je alleen maar voorstellen hoe moeilijk het was om webdesign te oefenen toen alles zo nieuw leek - tijdens de dagen van Netscape Navigator en Microsoft FrontPage. Achteraf gezien lijkt het zo'n archaïsch tijdperk in de geschiedenis van webdesign. Het was bijna onmogelijk om iets van opperste en intelligente creativiteit te ontwerpen. Toen werd je als creatief gezien als je een vreselijk knipperende achtergrond of gekleurde schuifbalken had.
Er was niet echt veel flexibiliteit als het ging om de technische details. Veel van de lay-outs waren hetzelfde en imiteerden wat in tijdschriften en kranten werd gezien. Ik bedoel, denk er maar eens over na: niet zo lang geleden konden we eindelijk een manier bedenken om decoratieve lettertypen online te gebruiken. Van tevoren was het allemaal Arial, alles Verdana en alle tijden New Roman - kun je je voorstellen in 2012 dat leven te leven?
Tafels waren de norm en die waren niet al te flexibel. Over flexibiliteit gesproken, hoe hebben we ooit geleefd zonder responsiviteit? Als je een tijdje geleden een website wilde ontwerpen, was je vrijwel ingesloten om te werken met wat je had. Niemand klaagde toen, maar godzijdank voor vooruitstrevende technologie.
Nu…
Snel vooruit naar nu, en we kunnen zo ongeveer alles ontwerpen zoals we willen, in wat we maar willen. Dit soort dingen moeten niet als vanzelfsprekend worden beschouwd, maar als nieuwe generaties van ontwerpers en ontwikkelaars dit rijk binnengaan, is het dat eigenlijk. Ik bedoel, een paar maanden geleden waren we eindelijk in staat stijlvellen te gebruiken om afgeronde hoeken te maken - hoe snel vergeten we het?
De vooruitgang in webdesign kan worden bijgedragen aan de voortdurende evolutie van verschillende codeertalen. Je kunt geen geweldig webontwerp hebben zonder een geweldige webontwikkeling (en omgekeerd). En je zou denken, de zaken zijn misschien ingewikkelder geworden voor zover het gaat om de ontwikkeling, maar het is vrij voor de hand liggend dat dingen gemakkelijker zijn geworden. Kijk bijvoorbeeld eens naar HTML4 versus HTML5.
Een van de grootste ontwikkelingen in, nou ja, ontwikkeling en ontwerp is het gebruik van jQuery. Het is waarschijnlijk een van de gemakkelijkste JavaScript-bibliotheken om te leren en te coderen, en het doet ook wat aardige dingen. Als je vrijuit ontwerpt en / of een aantal echt geweldige interacties tussen je ontwerp en je publiek wenst, zul je waarschijnlijk jQuery gebruiken.
De plug-ins
jQuery is niet alleen de ante van je eigenlijke ontwerp, maar het zorgt ook voor soepelere gebruikerservaringen. Wanneer websites gemaakt moeten worden om uw publiek te verwelkomen en het gemakkelijk voor hen maken om zich te verplaatsen, is dit belangrijk. Het ontwerp is ook belangrijk als u veel creativiteit gebruikt met uw ontwerp. Kortom, er mogen geen limieten zijn als het gaat om het maken van websites, en jQuery is uiterst nuttig om ervoor te zorgen dat je niet gevangen zit in vakjes. Dus wat kan jQuery voor u doen? Hieronder staan enkele geweldige plug-ins waarmee u zo creatief en fris kunt zijn in webontwikkeling als mogelijk is.
jQuery grid mobiel
Sommige ontwerpers willen graag het programma van hun keuze openen en ontwerpen wat ze willen zonder scrupules. Er zijn anderen die graag een methode hebben voor hun gekte. Webontwerpstandaarden suggereren dat we rasters moeten gebruiken om ons te helpen geweldige en effectieve websites te ontwerpen, vooral als je een blog of nieuwssite ontwerpt. Een tweede onderdeel van dat idee is dat het netwerk flexibel en responsief moet zijn. Met deze plug-in kunt u meerdere kolommen maken met (en zonder) reactievermogen.
ArcText.js
Nog maar een paar jaar geleden, als je echt geweldige lettertypen en typografische effecten op je website wilde hebben, moest je je gewenste ontwerpprogramma openen en een afbeelding maken met wat je maar wilde. Het was een goede techniek totdat mensen zich realiseerden dat dit niet het meest flexibele was, en dat het ook niet goed ging met zoekmachine-optimalisatie. Met vorderingen en technologie zijn we echter in staat geweest om decoratieve lettertypen online te gebruiken. Niet alleen dat, maar met deze plug-in kunnen we wat styling toevoegen die anders niet beschikbaar zou zijn buiten Photoshop.
Fancy Moves
Een algemene trend in modern webdesign is het vermogen om dingen te laten bewegen. Het is bijna onmogelijk om een website te bezoeken en getuige te zijn van statische afbeeldingen - bijna iedereen gebruikt een afbeeldingschuif in welke vorm dan ook. Veel van deze schuifregelaars zijn automatisch en veranderen foto's binnen een bepaald tijdsbestek. Daar is niets mis mee, maar hoe kun je zo'n concept nemen en het groter maken voor de gebruikerservaring? Deze Fancy Movies-plug-in lijkt dat te hebben ontdekt door kijkers de dia te laten besturen, niet alleen door op de volgende pijl te klikken, maar ook door op de toetsen op de toetsen te drukken.
FitText
Typografie in ontwerp is uiterst belangrijk. Webontwerpers hebben de vaardigheid nodig om de lettertypen te gebruiken die ze willen en deze op elke gewenste manier samen te stellen. Door dingen als Cufon en CSS is dat mogelijk, maar de laatste tijd is het reactievermogen van een website van groot belang. Als uw ontwerp niet flexibel kan zijn, is het bijna nutteloos en een van de belangrijkste delen van sites die responsief moet zijn, is de typografie. Met FitText kunnen uw headers en filler-tekst geweldig zijn, ongeacht de grootte van het venster of het apparaat dat wordt gebruikt om uw website te controleren.
Hover Zoom
De manier waarop bepaalde elementen reageren op interacties op een site, kan (negatief en positief) de manier beïnvloeden waarop kijkers erop reageren. Een eenvoudige interactie die altijd wordt gespeeld, is de zweeffunctie. Wanneer je je muis over een afbeelding of zelfs een link beweegt, is het bijna normaal dat dat element iets doet; en hoe beter de reactie, hoe beter mensen zullen reageren. Deze plug-in is voor foto's die, wanneer ze zweven, inzoomen of uitzoomen en biedt ook aanvullende informatie. Als dit correct wordt gebruikt, kan dit buitengewoon effectief zijn. Om nog maar te zwijgen, het ontwerp zal goed verlopen.
jRumble
Wat ontwerpers moeten realiseren, is dat we bij het maken van websites veel macht hebben. We kunnen mensen laten zien wat we willen dat ze zien en niet zien wat we niet willen dat ze zien. Fundamentele ontwerpprincipes, zoals balans en hiërarchie, kunnen helpen om de focus en interesse van kijkers te beïnvloeden. Er zijn subtiele manieren om dit te doen. jRumble is meer gepassioneerd over het zien en zien van dingen op een meer krachtige, flagrante manier. Het is een leuke plug-in en bij spaarzaam gebruik kan het effectief zijn voor welk doel dan ook. Vergeet niet om het niet te veel te doen.
jQSlickWrap
Het maken van lay-outs voor uw tekst kan een moeilijk ding zijn. Het gaat niet alleen om de lettertypen die u kiest, maar ook om de manier waarop u deze presenteert die deze effectief maakt. Als u een site ontwerpt die van plan is om grote blokken tekst te hebben, kan het onjuist instellen van uw site ervoor zorgen dat uw lezers totaal ongeïnteresseerd zijn in wat u zegt. Veel ontwerpers hebben problemen wanneer ze proberen afbeeldingen en tekst goed met elkaar te laten communiceren. Als je niet extreem in de tekstblokken zit of als je merkt dat je tekst en afbeeldingen meer met elkaar willen interageren, is dit misschien de plug-in voor jou. Geen krant-achtige metingen meer, maar meer creatieve vrijheid.
jQuery Offset-animatie
Zoals eerder vermeld, zijn statische websites tegenwoordig niet meer zo gebruikelijk als in voorgaande jaren. Veel dingen hebben een steentje bijgedragen aan het creëren van dynamische websites die goed bewegen en communiceren met hun kijkers. Een ding dat jQuery aan dat gesprek had toegevoegd, is de mogelijkheid om geweldige animaties en overgangen van element naar element te creëren. Deze plug-in creëert een vloeiende overgang van het ene element naar het volgende. Het zorgt voor een zeer plezierige website.
Scroll-O-Rama
Met een naam als 'Scroll-O-Rama' kun je deze plug-in doorgeven, maar ik zou je aanraden dat niet te doen. Hoe leuk en geweldig deze plug-in ook is, ik geloof dat hij populair kan worden gemaakt in de trendy niche van websites met één pagina. Terwijl je scrolt rond websites met één pagina, verwacht je dat er iets gebeurt. Met deze plug-in kunnen koppen en tekst bijna dansen als je er langs loopt. Het is een andere plug-in die voornamelijk voor decoratieve doeleinden wordt gebruikt, maar als u hem over uw site kunt sprenkelen en deze op de juiste plaatsen kunt gebruiken, kunt u deze plug-in voor meer sterkte gebruiken.
jQuery Shadow Plugin
Om een beetje diepte aan afbeeldingen of elementen toe te voegen, gebruiken ontwerpers graag slagschaduwen. Er zijn twee populaire manieren waarop ontwerpers schaduwen maken en dat is via CSS of het maken van de schaduw in hun ontwerpprogramma en meestal opslaan als een soort transparant bestand. Meestal werkt dit en soms kunnen er wat problemen zijn, maar het leuke aan deze plug-in is dat je verschillende schaduwtypen kunt toevoegen aan alle elementen die je leuk vindt, zonder dat je ze hoeft te ontwerpen, en het werkt cross-browser.
Slitslide
Goede overgangen in websites zorgen voor een leuke en verleidelijke ervaring. We hebben je al een geweldige plug-in gegeven voor overgangen van element naar element, maar deze plug-in is geweldig voor overgangen van pagina naar pagina. Met deze Slitslide-plug-in splitst, schuift en introduceert de pagina nieuwe pagina's er direct achter. Dit is een extreem dynamische tool die wat opwinding en smaak toevoegt aan sites die dat extra niveau mogelijk nodig hebben.
getipt
Tooltips zijn een element dat om verschillende redenen wordt gebruikt; om aandacht te trekken, informatie toe te voegen of wat je maar kunt passen. Het werkt net als een hover-effect, waar het, als het op de juiste manier wordt gebruikt, buitengewoon effectief kan zijn. Er zijn een heleboel jQuery-plug-ins die inspelen op de ontwikkeling en het gebruik van tooltips. Getipt is een plug-in die werkt en veel functies heeft, waarvan de meeste kunnen worden aangepast door HTML5 en CSS, wat zorgt voor een eenvoudige en soepele build.
Buisvormig
We zijn het er allemaal over eens dat een flitsende achtergrond niet is waar creativiteit ligt. Er kunnen echter nog andere dingen aan uw achtergrond worden toegevoegd om uw website een beetje vonk te maken. Misschien gaat u alleen over design en wilt u een goed samengesteld patroon, maar misschien wilt u iets dynamischers. Tubular is een plug-in waarmee je YouTube-video's kunt gebruiken als achtergrond. Denk aan de leuke en creatieve mogelijkheden waarmee je hiermee kunt scoren.
jmpress
jQuery-knop
3d Thumbnail Hover
We hebben het al gehad over het effect van de afbeelding-zweeftekst en over hoe het effectief kan zijn voor websites. Welnu, wat als je een beetje meer pit wilt voor je afbeeldingen? Deze plug-in geeft je een beeld-hovereffect dat informatie met een beetje van een 3D-draai onthult.
blur.js
Een goed ontwerp kan echt het verschil zijn tussen een goede en een slechte website. Vaak gaat het bij de beslissing niet om het ontwerp als geheel, maar om de kleine details; daarom gebruiken we tooltips en geweldige headline-teksten. Deze plug-in voegt een beetje meer detail toe aan uw site, als u dat wenst. Deze plug-in creëert psuedo-transparante vervaagde elementen over andere elementen. Dit is een decoratieve plug-in, maar kan worden gebruikt om hiervan te profiteren.
Conclusie
Er zijn veel manieren om uw webontwerp te verbeteren om het fris en aantrekkelijk te maken voor uw bezoekers. Houd in gedachten dat je iets wilt maken dat niet alleen creatief, maar ook creatief en effectief is. De tools die we nu hebben zijn geweldig en wat nog beter is, is dat technologie nog steeds toeneemt en dat er betere dingen voor het maken van websites op ons wachten.