En samling av fantastiska illustrerade webbplatser
Illustrerade tillägg till webbplatser kan till och med ge det enklaste temat en extra nivå av visuellt intresse och komplexitet.
Illustrationer varierar mycket från en plats till en annan. Vissa ser handritade (oavsett om de är eller inte) medan andra uppenbarligen är digitalt gjorda.
Nedan finns mer än trettio bra webbdesigner som innehåller illustrationer.
Mest vanliga är illustrationer i rubriker och bakgrunder, ofta av mascots eller karaktärer.
Men illustrationer används också på andra sätt. Om du har en favorit illustrerad webbplats som inte nämns här, vänligen meddela oss i kommentarerna.
Sidor med digitala illustrationer
Dessa platser har uppenbarligen digitala illustrationer. Smidiga linjer och ljusa färger är kännetecken för denna stil, men inte allt som anges nedan överensstämmer med dessa standarder.
F5
F5-webbplatsen använder en nyckfull digital illustration för sin bakgrund. De ljusa färgerna och tecknade karaktärerna är typiska för digitala illustrationer. Det som inte syns här är att illustrationen fortsätter ner på sidan, vilket visar olika lager.
Wireframe Plus
Wireframe Plus använder en monokromatisk bakgrunds illustration för sin webbplats. Det är subtilt, men lägger verkligen till lite extra visuell oomph och gör webbplatsen skön trots att färgschemat och typografi är ganska standard.
Tom Bradshaw Design
Tom Bradshaw Design använder illustrerad stil typografi över hela webbplatsen, liksom en tecknad karaktär maskot, som visas på varje avsnitt av sidan (det är en sida på en sida).
mediocore
Glänsande digitala illustrationer som den här ses inte så ofta och sticker ut från andra platser. Den här står ut ännu mer eftersom den placeras mot en svart bakgrund och använder de enda ljusa färgerna på sidan.
htmlMafia
Illustrationerna här är en blandning mellan digitala och handritade stilar, även om de använda gradienterna sätter dem mer fast i den digitala kategorin. Detta är ett utmärkt exempel på hur illustrationer lever upp en webbplats och ger ett mer dramatiskt intryck.
CreativeSwitch
Roboten som illustreras här är faktiskt animerad på webbplatsen själv, om än subtilt. Ytterligare illustrationer används på hela webbplatsen.
690 Design
Att binda bilder i kopian av en webbplats är en fantastisk strategi. Här diskuterar tagline-texten harmoni, och en orkesterleder används för illustrationen.
Kipu
Enkla illustrationer i vektorstil gör en väldigt djärv inverkan. Genom att använda en mer dämpad färgpalett för dem, som ovan, får de blandas mer sömlöst till resten av webbplatsen.
Siringa 1
Dessa tecken är ett annat exempel på digitala illustrationer som har en handritad känsla för dem. I kombination med färgschemat ger dessa illustrationer webbplatsen en avslappnad och vänlig känsla.
PixelBaecker
Det finns mycket på denna vektorstilstil, från killarna som arbetar i hålet under jorden till fågeln uppe i trädet. Stylistically är det en ganska typisk vektor illustration, men exekveringen är underbar.
Pieoneers
Använda illustrationer för att prata om fördelar eller erbjuda upplysningar, utan att göra det till en info-grafik, är en bra strategi. Det är ett roligt och intressant sätt att förmedla information som är mer benägna att engagera dina besökare. Dessutom är kombinationen av en paj och en flygande tallrik här bara enastående!
Jacob Lee
Pingvinen som illustreras här ser nästan ut som handdragen, men den är bara lite förpolerad och slät. Den starka vita färgen (eller bristen på den) står verkligen mot den färgglada bakgrunden.
Treehouse Editing
Den illustrerade bakgrunden ändras här från sida till sida och har subtila animeringar. Men det är en vacker bit av konstverk, värt ett andra utseende.
Kod Crunchers
De vanligaste digitala illustrationerna är enkla tecken eller monster som den här. Och som maskot fungerar det perfekt med webbplatsens namn.
Forrst
Illustrerade bakgrunder som denna blir vanligare. Den fullständiga integrationen mellan innehållet och bakgrunden är det som verkligen gör att den här ser ut.
Coo / Coo Core
Mer abstrakta illustrationer som detta ger en webbplats en mer modern känsla. Den här är bara abstrakt nog att göra det, samtidigt som den är igenkännlig som ett träd.
Joystick Generals
Upprepningen av den grundläggande karaktären i bakgrunden av huvudet lägger till ett extra lager av visuellt intresse för vad som är en relativt enkel illustration. Färgschemat som används här är enkelt, men i kombination med grungy bakgrunden ser det fantastiskt ut.
Gör filmarbete
Illustrationer ses mindre ofta på platser i grunge stil, förmodligen för att det finns risk för att skapa visuell rodnad. Men den enkla illustrationen här, med sitt dämpade färgschema och subtila konsistens, fungerar bra i en mer minimalistisk grungedesign.
Solid Studios
Ett annat bra exempel på enkla digitala monster som används i en design. Dessa killar är avslappnade och roliga, och gör webbplatsen känns densamma.
Olive Crush
Headers är ett av de mest idiotsäkra områdena för att använda illustrationer. Genom kreativ användning av droppskuggor ser denna huvudillustration nästan 3D ut.
Sara Tusar
Ett annat bra exempel på monster, den här gången i en toppdesign. De är subtila, echoing färger från resten av webbplatsen, men låter en mer personlig touch.
Arbel-Designs
Arbel-Designs hemsida använder en mångsidig illustrerad bakgrund som börjar i rymden högst upp på sidan och går djupt under vattnet. Denna stil med illustrerad bakgrund fungerar bra på enkeltsidor.
Minding Monsters
Det här är några av de enklaste vektorns tecken i det här inlägget. De är dock väldigt söta och är helt integrerade i webbplatsens design. Faktum är att de är hela punkten på webbplatsen.
Platser med handdragen illustrationer
Handritade illustrationer är mindre vanliga i webbdesign, men det finns fortfarande några fantastiska exempel där ute. De sträcker sig från fina teckningar till doodles och allt däremellan.
Steve Schoger
Enkla skisser som den här fungerar bra för alla platser, men speciellt när de ersätter ett typiskt formgivare (eller något professionellt) foto. De är också ett bra alternativ för dem som är kamera-blygta! Att låta bakgrundsstrukturen visa igenom för att ge en hudton är en fin touch.
Kenny Meyers
En illustration av en superhjälte på vad som annars är en ganska minimal webbplats kan hjälpa till att fördjupa förtroendet för dina besökare utan att tillgripa en "corporate" -fejlingsdesign. Echoing färger från någon annanstans på platsen säkerställer att illustrationen smälter in sömlöst.
Andy Ward
Det är bara meningsfullt för en illustratör att inkludera illustrationer på deras webbplats. Andy Ward använder ett bildspel av sina illustrationer i hans rubrik, men de är införlivade på ett sådant sätt att de blir en del av själva designen.
Kilian Muster
En mer formell, finartad stilteckning som den här erbjuder en nod till traditionen; i det här fallet: traditionella typesetting metoder. Det är enkelt men djärvt nog att verkligen göra en inverkan.
DNA till Darwin
Ett annat bra exempel på en webbplats som använder formella linjeteckningar för att skapa en känsla av historia. De skiktade illustrationerna gör det allt mer intressant.
Fluga
En mer avslappnad handritad webbplats, komplett med handritade monster (eller är det en utlänning?). Webbplatsen använder en bakgrundsbild med flera lager, som börjar i rymden och hamnar i havet.
xhtmlCafe
En handritad illustration kombinerad med akvareller skapar en fantastisk och informativ rubrik på xhtmlCafe-webbplatsen. De skisserade elementen i målningen ger den en mer stiliserad känsla än en rak akvarell skulle ha.
Attack of the Web
Vad skulle ett inlägg på illustrerade webbplatser vara utan ett exempel på tecknadstilstil illustration? Allt från linjetyckorna till den texturerade färgen påminner om din favorit komiska eller grafiska roman.
Janko vid Warp Speed
En enkel illustration i rubriken här är subtil och diskret men lägger till en stor mängd estetisk vädjan till webbplatsens design.
Skriven uteslutande för WDD av Cameron Chapman .
Om du har andra favoriter illustrerade webbplatser, snälla dela dem i kommentarerna!