Web Design Critique # 96 SuccessInc Drupal Theme

Varje vecka tittar vi på en ny webbplats och analyserar designen. Vi pekar på båda områdena som görs bra förutom de som kan använda lite arbete. Slutligen avslutar vi genom att be dig att ge din egen feedback.

Dagens webbplats är SuccessInc, ett Drupal-tema från mer än (bara) teman. Låt oss hoppa in och se vad vi tycker!

Om du vill skicka din webbplats till en framtida designkritik tar det bara några minuter. Vi tar ut $ 49 för att kritisera din design - betydligt mindre än du skulle betala för en konsult för att kolla på din webbplats! Du kan läsa mer här.

Om SuccessInc

? De flesta teman är byggda för att se enkla, rena, minimala. Den här är byggd för att hjälpa dig att imponera. På både skrivbord och mobil. Succes Inc. anpassas optimalt till bredden på webbläsaren den visas på. Som ett resultat ser det bra ut, oavsett om det är en stationär dator, smartphone eller surfplatta som dina besökare använder.?

Här är en skärmdump av hemsidan:

Första intrycket

Mitt första intryck av SuccessInc är ganska positivt. Det är ett mycket attraktivt tema som ser ut att ha gott om toppklassfunktioner och anpassningsbara innehållsområden. Jag älskar att det är lyhört och uppskattar alla lätt anpassningsbara alternativ som är inbyggda. Låt oss ta en titt på varje sektion individuellt och se vad vi tycker!

Färgschema

En av mina favoritaspekter av detta tema är det djärva färgschemat. De ljusa höjdpunkterna är starkt kontrasterade mot den svarta, vilket ger en iögonfallande upplevelse som känns elegant och modern. Orange som du ser ovan är helt enkelt standard färgschema, du kan enkelt byta upp det i inställningarna.

Att ändra färgschemat är lika enkelt som att klicka på en rullgardinsmeny och välja det alternativ du vill ha. Du kan välja ett av sju system: orange, cyan, grön, röd, grädde, lila och grå. Bara slå på? Spara? knappen och det nya systemet kommer omedelbart att tillämpas.

Alla de färgval som de har inkluderat ser bra ut, vilket gör temat ganska dummy-bevis när det gäller visuell estetik.

Kontakt / Sök bar

Högst upp på webbplatsen finns en liten stapel som innehåller en del grundläggande kontaktuppgifter tillsammans med en sökfält. Här är en närbild av vad det här ser ut:

Det finns ett antal olika typer av webbplatser där användarens främsta orsak till att stoppa är att hitta någon form av kontaktinformation. För dessa typer av webbplatser är detta ett utmärkt litet designelement. Användare behöver inte jaga efter en kontaktsida eller formulär. De uppgifter som de verkligen efterfrågar är en av de första sakerna som de ser.

Som du kan se i bilden ovan finns också ett sökfält i den här fältet. Fältet i sig är osynligt, men betecknas med en del platsinnehåll följt av en liten sökikon. När du klickar på den här texten blir det mer av ett traditionellt sökfält.

Det här är en cool design, men jag skulle vara intresserad av att se om användarna verkligen svarar på det så bra. Vi brukar leta efter visuella signaler innan vi läser, så det kan ta någon tid att ta reda på hur man kör en sökning. En snabb rutt som en användare kan ta är att se förstoringsglasikonen och klicka på den, som helt enkelt driver en värdelös tom sökning.

Vidare säger ledtråden till? Ange villkoren och klicka Sök? ? men det finns ingen knapp som säger? Sök? så igen är det lätt att se hur detta kan förvirra en användare. Självklart är det någon som är halvvägs kompetent med webben att räkna ut det tillräckligt snabbt, men det är fortfarande en bra idé att identifiera potentiella användarvägar och frustrationer.

Navigering

Navigationen tillhandahålls av en rockfast Superfish-meny. Det fungerar perfekt, har jämna animeringar och flera nivåer, och ser ganska smidig ut. Senare tittar vi på vad som händer när du sänker det för mobila enheter.

Bildspel

Flytta ner sidan, nästa upp är bildspelet. Det är ett fint, stort och animerat innehållsområde som ger något intresse överst på sidan. Det finns några funktioner här som jag också vill påpeka att du bör överväga när du skapar ett bildspel.

För det första finns det flera navigeringspunkter. Både pilarna och prickarna längst ner tjänar för att avancera bildspelet eller hoppa till en viss punkt. Vidare ger punkterna en referenspunkt till var du är och hur många bilder som finns. Slutligen finns det bildtexter som låter dig lägga till anpassade meddelanden.

I slutändan är det inte bara trevliga funktioner. De ökar effektiviteten och användbarheten hos denna del av användargränssnittet, vilket gör det mer än enkelt ögonsocker. Om du handlar om alternativ, kan du till och med gå in i inställningarna och ändra övergångar eller bildtid.

Innehåll och sidfot

Resten av sidan är ganska grundläggande. Det börjar med ett sekundärt innehållsområde och flyttar ner till en sidfot, som båda är upplagda i tre kolumner.

Först har du tre innehållsområden, som alla innehåller en bild med en beskrivning och en knapp. Jag gillar särskilt skuggan på miniatyrerna här. Det är en fin illusion som ger djupet till designen.

Om kontaktinformationen i rubriken inte räckte, ger sidfoten några riktigt fina funktioner. Det finns en plats för en karta, ett Twitter-flöde och en kontaktformulär. Detta förutom en slags sekundär sidfot som innehåller olika sociala ikoner. Dessa tenderar att vara en rörig röra som kastas in i en design som en eftertanke så jag uppskattar verkligen hur väl integrerat i designen som dessa är.

responsiv layout

Layouten för webbplatsen börjar som statisk, då när visningsporten sänks till en viss bredd blir den flytande. Här är en titt på några av stegen för designen när visningsporten ändras:

Jag älskar att det här temat är lyhörd, jag tycker att det här har blivit en nödvändighet snarare än en nischhet. Saken som de verkligen slår ut ur parken är att de layout verkar vara ganska enhets-agnostisk. Försök som jag kanske, jag kunde inte bryta layouten på något väsentligt sätt när jag upplever med olika bredder. Allt, helt ner till sökfältet, formateras snyggt oavsett vilken skärmstorlek du slänger på den.

På mobila enheter blir navigeringen en valruta. Detta är lätt att använda, bekant och håller alla de ursprungliga alternativen på plats. Det finns några bra alternativ till denna strategi, men det här är en av de mer funktionella lösningarna.

Slutsatser

Vi har sett det innan Mer än (bara) teman gör bra jobb. Mitt huvudsakliga klagomål förra gången var att temat inte var mottagligt, men de har definitivt tagit upp den bekymringen med SuccessInc. Sammantaget är det ett bra tema och jag kan se att det fungerar riktigt bra för många olika typer av webbplatser.

Din tur!

Nu när du har läst mina kommentarer lägger du in och hjälper till med att ge designern ytterligare råd. Låt oss veta vad du tycker är bra om designen och vad du tycker kan vara starkare. Som alltid ber vi att du också respekterar webbplatsens designer och erbjuder tydliga konstruktiva råd, utan att det blir några svåra förolämpningar.