Veebikujunduse kriitika # 71: armsam käpp
Igal nädalal vaatame uut veebisaiti ja analüüsime kujundust. Toome välja mõlemad valdkonnad, mida on hästi tehtud, lisaks neile, kus saaks mõnda tööd kasutada. Lõpuks küsime teilt enda tagasiside.
Tänane sait on ülemaailmne loomade pildigalerii Cutest Paw. Hüppame sisse ja vaatame, mida arvame!
Uurige Envato elemente
Kui soovite oma veebisaidi edaspidises disainikriitikas kajastada, võtab see vaid paar minutit. Teie kujunduse kritiseerimise eest võtame 49 dollarit - tunduvalt vähem kui maksaksite konsultandil teie saidi vaatamise eest! Lisateavet saate siit.
Umbes armsam käpp
See sait võtab kindlasti auhinna meie kõigi aegade kõige „awwww” -teemalisema kriitika esilekutsumise eest. See sait pole sõna otseses mõttes midagi muud kui lõputu fotode voog armastest ja naljakatest loomadest. Kuidas me suudame sellist asja vaadata ja ikkagi pakkuda konstruktiivset tagasisidet magamata kutsikaid segamata? Õnneks oleme 100% pühendunud reklaamide aitamisele nende veebidisainilahenduste täiustamisel. Hoidke kutsikad alles, meil on tööd teha.
Siin on kodulehe ekraanipilt:
Esmamulje
Kujunduse hindamisel lähen esteetikast kaugemale ja küsin, mis on tüki eesmärk ja kas valminud kujundus vastab sellele eesmärgile või mitte. Siin on kasutaja eesmärk lihtne: vaadata palju ja palju fotosid. Tundub, et Cutest Paw sait täidab oma eesmärki üsna hästi. Paigutus on optimeeritud ruumi maksimaalseks kasutamiseks ega raiska liiga palju piksleid mittekriitilistele üleliigsetele silmailudele.
Nagu eelmise nädala disainikriitika, on ka see lühike. Cutest Paw veebisait on väga lihtne, nii et pole palju kritiseerida. Kuid nagu alati, on mul tagasisidet, mis minu arvates aitab disaineril saiti parendada. Hüppame sisse ja alustame.
Paigutus
See sait on hea näide jQuery Masonry - vinge paigutuse pistikprogrammi - kasulikkusest, mis muudab muidu võimatute paigutuste loomise imelihtne. Müüritise ilu seisneb selles, et see loobub enne sisu vertikaalset levitamist CSS-i käitumisest, mis loob horisontaalse paigutuse. Selle asemel loob kena tiheda vertikaalse virna, mis sarnaneb telliste laotamisega.
Tulemuseks on sel juhul uskumatult tihe pildivõrk, mis, nagu juba eespool mainisin, maksimeerib tõesti väikeses ruumis vaadatavate fotode arvu. Sait kasutab ka lõpmatut kerimistehnikat, mis jätkab sisu laadimist lehe liikumisel.
Müürsepa stiilis paigutuste ja lõpmatu kerimise kombinatsiooni muutis Pinterest hiljuti üsna populaarseks, millele te ei saa selle saidi kasutamisel mõelda. Nende kahe tehnika kombinatsioon muudab sirvimise enneolematult lihtsaks. Võrdluseks: lehtimine nõuab kasutajalt nii palju pingutusi. Siin kerite ja kerige lihtsalt seni, kuni olete kõik nähtavat näinud või otsustanud midagi muud edasi liikuda.
Külgriba
Kuna sisu kerib igavesti, on vaja pisut fikseeritud navigeerimist. Pinterest kasutab riba üleval nende saidi ülaosas, Cutest Paw läheb oma teed ja rakendab mahajäänud külgriba, mis kiirelt järele jõuab, kui lehe alt alla liigute. See on üsna tõhus, kuid pean tunnistama, et alguses mõnevõrra võluv animatsioon muutub kiiresti segavaks ja mõnevõrra tüütuks.
Külgriba on kenasti kujundatud ja selgelt korraldatud, kasutatavuse vaatenurgast (kui animatsioon kõrvale jätta) on see üsna hästi tehtud. Tore on näha siin rakendatud nuppu Tagasi üles. Niipea kui kerima hakkasin, otsisin kohe ühe neist üles ja leidsin selle hõlpsalt üles. Siiski võib see osutuda tõhusamaks, kuna mingisugune paigutus fotokomplekti paremasse serva ülemisse või alumisse ossa paigutab selle sinna, kuhu kasutaja tähelepanu on tõenäoliselt suunatud, ja vähendaks vajadust seda jahtida.
Teema
Lehe üldine esteetika väärib arutamist, tegelikult võib see olla üks silmapaistvamaid aspekte, mida kaaluda. Ühest küljest on leht ahvatlev. Must taust on klanitud, stiilne ja aitab fotodel tõesti silma paista. Teisest küljest tundub taust ja isegi need omadussõnad, mida ma lihtsalt kasutasin, selle veebisaidi puhul valed.
Inimesed kirjeldaksid sisu, nagu sõnad “armas” ja “hägune”, ning saidi visuaalne teema on musta grunge tekstuur. Need kaks mõistet näivad olevat polaarsed vastandid ja loovad omamoodi visuaalse dissonantsi. Nagu ma juba ütlesin, olen disaini tohutu pooldaja, mitte lihtsalt silmailu pakkuv, vaid eesmärgi ja sõnumi tugevdamiseks. Teie lehe kujundus edastab isiksuse ja kui see isiksus eksib, vähendab see projekti mõju ja edukust. Selle disainilahenduse kontseptsioonide kõrvutamine on palju nagu nähes 300 naela nahkkattega tätoveeringuga bikerit õpetamas koolieelset klassi, näivad need kaks lihtsalt üksteisega vastuolus olevat.
Kujundaja on naelutanud paigutuse, mis on ausalt öeldes sageli kõige keerulisem osa sellisel saidil. Nüüd on aeg saidi ilme täielikult ümber kujundada, säilitades selle põhistruktuuri. Alustage sõbralikuma värvilahendusega ja / või kasutage palju vähem teravat tekstuuri. Võib-olla midagi, mis annab edasi pehmet tunnet (ilma et oleks kole ja juustune). Vaadake suurepäraseid ressursse peene mustri kohta.
Logo
Logo kuvatakse eelmises ekraanipildis. See on ilmselgelt saidile väga sobiv, käpp on koheselt ümberpaigutatav sümbol. Logol on sellel siiski suur puudus selles, et see on nii üldine. See on ring käpaga, võib-olla kõige esimene asi, mis 99-le 100-st mittekujundajast tuli välja, käsuga luua käpa logo.
Selle probleem on see, et te ei saa seda tegelikult omada. Kui vaatate piisavalt kõvasti, võite tõenäoliselt leida midagi sarnast paljude ettevõtete ja veebisaitide jaoks. Võib-olla ei soovi te ülemaailmse kaubamärgi loomist, kuid logo mõte on ikkagi see, et sellel oleks midagi, mis annaks teie brändile näo (olgu see siis väike) ja muudaks selle tuvastatavaks. See pole prioriteetide loendis kõrgel kohal, kuid pikas perspektiivis soovitaksin uurida midagi pisut ainulaadsemat.
Esita leht
Nagu ma selle artikli alguses mainisin, on see sait üsna lihtne, nii et teeme selle peatselt lahti. Viimane asi, mida tahaksin arutada, on leht, kus kasutajad saavad minna oma fotosid esitama:
Probleem, mis mul selle lehega seotud on, on omamoodi algusefekt, mis toimub. Teil on veebilehele visatud ekraanipilt, mis näeb välja väga sarnane. See on kallutatud, nii et see paistab pisut silma, kuid see on siiski segav kombinatsioon. Siin on probleemiks see, et lehe taust ja pilt on põhimõtteliselt samad, nii et pilti ei eraldata tegelikult märkimisväärselt. Soovitan ehk uurida löögiefekti ja kärpida seda pildivõrku veelgi suuremas vaates. Kerge väljapääsuna võiksite siia lihtsalt panna suure armsa looma, kes kuidagi edastab mõtte jagada, üles laadida jne.
Järeldus
Kokkuvõtteks võib öelda, et siin on minu kontrollide üle lühike kontrollnimekiri.
Hea küll
- Paigutus: see sobib suurepäraselt jQuery müüritise jaoks
- Lõpmatu kerimine: teeb sirvimise hõlpsaks
- Lihtne, kuid tõhus navigeerimine
Vajab tööd
- Üldine esteetiline: liiga tume ja rõve
- Logo: liiga üldine
- Registreerimisleht: ekraanipilt ei tööta
Sinu kord!
Nüüd, kui olete minu kommentaare lugenud, astuge sisse ja aidake, andes disainerile täiendavaid nõuandeid. Andke meile teada, mis on teie arvates disainilahenduses suurepärane ja mis võiks teie arvates olla tugevam. Nagu alati, palume teil ka saidi kujundajat austada ja pakkuda selgeid konstruktiivseid nõuandeid, mis ei võimalda ränki solvanguid.
