"Dark Mode" på organisationens websted: bare en smuk tendens eller påvirker virkelig UX og brandopfattelsen?

Det virkelige problem i livet
Mange ledere og marketingteam står over for vigtige spørgsmål på mærket eller virksomhedens websted. Er det "Skal vi lave mørk tilstand?" Den ene side ser det som bare "skønhedstrend" i fortiden og passerede det er et projekt, der ser godt ud, men ikke ved, hvordan man måler forretningsresultaterne, mens den anden side presses af designteamet og opkaldet fra brugere, der er bekendt med den mørke tilstand i applikationen som Spotify, Netflix eller endda i det mobile operationssystem. Den forkerte beslutning kan betyde en spildt investering. Eller mangler en vigtig mulighed for at opgradere brugeroplevelsen og billedet af mærket desværre
---
Spørgsmål om illustrationer: Mødelokalebilleder med ledere og marketingteam diskuteres alvorligt med mockup. Webstedet Light Mode og Dark Mode vises på en stor projektorskærm. Formidler konflikter i beslutningstagningen
Hvorfor skete dette problem?
Tøven med brugen af den mørke tilstand, organisationsweb er forårsaget af uklar. Den sande "værdi" for mange virksomheder, som Dark Mode er bare et spørgsmål om personlig præference (aessetik), men i virkeligheden har det at vælge et mørkt eller lyst tema en direkte indflydelse i 3 hoveddimensioner, som ledere skal være opmærksomme på:
- Brugeroplevelse (brugeroplevelse (UX): mørk tilstand hjælper
- Adgang for alle (tilgængelighed): Selvom mørk tilstand hjælper mennesker med følsomme over for lys (fotofobi), men for dem, der har en lav vision, kan det være mere udfordrende at læse lyse farver på den mørke baggrund. Hvilket dette problem er direkte relateret til webstedsadgangsstandarder (webtilgængelighed), at moderne organisationer skal være opmærksomme på
- Brandopfattelse: Farver, der påvirker psykologi og opmærksomhed. Dark Mode er ofte knyttet til moderne luksus (moderne) og præmie. Valget af Dark Mode kan være et værktøj til at kommunikere nye mærker. Men på den anden side kan det gøre det brand, der ønsker at kommunikere lyst, let at få adgang til eller venligt.
---
Spørgsmål om illustrationer: Infografisk opdelt i 3 klare dele (UX, tilgængelighed, brandopfattelse). Hver del har korte ikoner og nøgleord. Forklar virkningen af mørk tilstand, såsom et fokalt billede, et billede af en kørestol og det brandlogo, der ser mere luksuriøst ud.
Hvis det er tilbage, hvordan vil det påvirke?
Dark Mode forsømmer alvorligt overvejelsen af den mørke tilstand eller træffer en beslutning om kun at bruge, fordi "det ser smukt ud" af manglende forståelse. Kan skabe mere negative virkninger end forventet, hvis du vælger at "ikke gøre", selvom din hovedmålgruppe tager mest tid på skærmen om natten, kan du skabe en dårlig oplevelse og skubbe dem til at vende sig til mere opmærksomme konkurrenter. Men hvis du vælger at "gøre" uden en god plan, kan resultatet være lige så dårligt, såsom:
- Konverteringsfrekvensen faldt: Hvis den mørke tilstand designet gør det vanskeligt at læse. Knappen Call-to-Action (CTA) er ikke enestående eller udfylder oplysningerne. Uundgåeligt får brugerne til at opgive den pågældende rækkefølge eller kontakt
- Mistede forretningsmuligheder fra specialiserede brugere: vanskelige at læse websteder for ældre eller mennesker med øjenproblemer. Kan få din organisation til at blive betragtet som manglende opmærksomhed og ikke dække alle brugere.
- Beskadiget brand image: Brug af mørk tilstand med upassende mærker, såsom et websted for børnehospital, der har brug for lyse eller organisationer, der fokuserer på gennemsigtighed og venlige, kan skabe modstridende følelser og reducere brandets troværdighed. Som betragtes som en af indvirkningen på mærket forårsaget af designet på det websted, der skal være forsigtige.
- Restens udgifter: Dark Mode, der beder om at gå og skal vende tilbage og ordne det hele senere. Fordi det ikke er praktisk eller ødelægger UX, kan spilde budget og tid snarere end at planlægge godt fra starten.
---
Spørg om illustrationer: Konverteringsfrekvensgraf, der er faldet med ansigtet på brugeren, der ser frustreret ud, mens han prøver at læse meddelelsen på Dark Mode -webstedet med lav kontrast.
Er der nogen løsning? Og hvor skal det starte?
Beslutninger om den mørke tilstand, organisationens websted er ikke et spørgsmål om "gør" eller "ikke gør", men det er et spørgsmål om "hvordan man skal være korrekt og passende." Den bedste løsning er at lade brugeren vælge sig selv. (Bruger-togled mulighed) med en knap for at skifte mellem lys og mørk tilstand, men selv da er den standardtilstand, du vælger, stadig vigtig. Og dette er en måde at starte:
- Analyser først din bruger og brand (analyser først):
- Hvem er målgruppen? Hvilken branche fungerer de? Er der en vigtig internetbrugsadfærd?
- Hvad er brandets personlighed (brand persona)? Vil du kommunikere troværdighed, modernitet, venlighed eller luksus?
- Undersøgelseskonkurrenter og tendenser (forskningskonkurrence og tendenser): Se, hvordan konkurrenter i den samme branche gør, og studere de nyeste UI -designtrends for at finde inspiration og forholdsregler.
- Designet baseret på tilgængelighed (design med tilgængelighed i tankerne): Uanset tilstanden skal kontrasten mellem tegn og baggrund være høj nok i henhold til kriterierne for W3C -tilgængelighedsretningslinjerne (WCAG), som er en international standard, som alle skal følge.
- Opret prototype og test (Prototype & Test): Inden du skriver en reel kode, skal både prototype bygges og derefter testes med prøvebrugerne for at indsamle reel feedback.
- Tilvejebringelse af brugere ( angiv er at have en knap, så brugerne kan skifte tilstand selv efter behov Eksperterne fra Nielsen Norman Group antyder, at det er den bedste måde.
At forstå fordelen ved den mørke tilstand til UX dybt er det vigtigste udgangspunkt i denne proces.
---
Spørgsmål om illustrationer: Flowchart -diagram viser, at 5 -trin -beslutningstagningen fra "Analyser" for at "give skift" ikoner i hvert trin for at være let at forstå.
Eksempler fra den rigtige ting, der plejede at få succes
World -Class Technology -mærket som Apple er det mest indlysende eksempel på at bruge Dark Mode smart. De ændrer ikke bare baggrunden til sort. Men designet alle nye elementer fra macOS til iOS, så brugerne kan vælge den ønskede tilstand eller indstilles til automatisk at ændre sig i henhold til dagens dage
Problem: Mange brugere, især udviklerne og indholdsskaberen, skal arbejde på computerskærmen i lang tid om natten. Forårsager øjenvipper og øjesmerter fra lystilstand
Metode: Apple har udviklet en mørk tilstand, der ikke kun er farveskift. Men er en fin "farvepalet" -justering. Teksten justeres til at være tyk og passende. Ikon og forskellige elementer, der er redesignet til at være tydeligt synlige på den mørke baggrund. Mens du stadig opretholder skønheden og venligheden til brugerne fuldstændigt, og det vigtigste er "Lad brugeren kontrollere" gennem switch -knappen
Resultat: Dark Mode blev en af de mest værdsatte funktioner. Hjælper med at reducere øjet (øjenbelastning) skaber fremragende oplevelse. Og understreger billedet af Apple som et brand, der giver brugere betydning og vær opmærksom på enhver detalje i designet, der direkte påvirker virkningerne af Dark Mode på UX på webstedet som helhed og får mærket til at se moderne ud og en leder i forbrugernes øjne.
---
Spørg om illustrationer: Sammenlign billeder af Apples interface -skærm mellem lystilstand og mørk tilstand, der er smuk og praktisk. Med et tilfredsstillende smil, mens du bruger svagt lys
Hvis du vil følge, hvad skal jeg gøre? (Kan bruges med det samme)
For en organisation, der beslutter at tilføje en Dark Mode -funktion til webstedet, er dette den tjekliste, du kan bruge med det samme. Uanset om du gør det selv eller videresendes til udviklingsteamet:
- [] Definer farvesættet til mørk tilstand (Definer Dark Mode Color Palette): Ikke bare ved hjælp af helt sort ( #000000). Overvej mørkegrå (såsom #121212), som vil være mere behagelig. Og indstil farven til bogstaver, links og CTA -knapper for at have passende kontrast
- [] Design status for den nye knap og link (redesignkomponent angiver): knapper eller links, når musen (HOVE), når du klikker (aktiv), og når de deaktiveres (deaktiveres), skal det være tydeligt synligt i den mørke tilstand.
- [] Kontroller billeder og ikoner (revisionsbilleder og ikoner): Billeder med gennemsigtig baggrund (gennemsigtig) kan muligvis justeres, såsom at bære let grænse for at blive set på den mørke baggrund
- [] Glem ikke skyggen (overvej skygger): Boksskygge, der bruges i lystilstand, ses muligvis ikke i den mørke tilstand. Du skal muligvis skifte til andre teknikker, såsom grænse ved hjælp af en lidt lysere farve for at skabe en dimension.
- [] Implementering af Toggle Switch: Opret en knap, der giver brugerne mulighed for let at skifte mellem to tilstande. Og skal gøre webstedet "Husk" brugerindstillingerne til det næste besøg
- [] Test på alle enheder (test, test og test igen): Kontroller displayet og den faktiske brug på desktop, tablet og mobil både lodret og vandret. For at sikre, at oplevelsen vil være glat i enhver situation
Hvis du har brug for eksperter i udviklingen af disse funktioner, virksomhedsudviklingstjenesten for virksomhedens webstedsudvikling klar til at give råd og få dine ideer til at gå i opfyldelse.
---
Spørg om illustrationer: Smukt og moderne tjeklistebillede, der viser 6 varer ovenfor med ikoner i hvert emne. For at få det til at se interessant og let at bruge
Spørgsmål, som folk har en tendens til at undre sig, og de svar, der er ryddet
Spørgsmål: Dark Mode hjælper med at gemme batterier, ikke?
Svar: Sandt, kun med OLED- eller AMOLED -skærmen (som bruges i de fleste nye smartphones), fordi denne type skærm vil "lukke" pixels i en helt sort del. At forårsage ikke at bruge energi, men til LCD -skærmen eller IPS (brugt i computeren og de fleste notesbøger) vil ikke hjælpe med at gemme batterier. Fordi skærmen stadig skal tænde baggrundslyset hele tiden
SPØRGSMÅL: Mellem mørk tilstand og lystilstand, hvilken er bedre for øjnene?
Svar: Der er ikke noget fast svar. Afhængig af den lette og individuelle mørke tilstand, velegnet til mørke miljøer. Hjælper med at reducere blænding og håndflade, men lystilstand (mørke karakterer på lysfarvet baggrund) gør ofte at læse en lang tekst. Bedre under normale lysforhold for de fleste mennesker er den bedste løsning at lade brugeren vælge sig selv.
Spørgsmål: Dark Mode påvirker SEO?
Svar: Direkte, ingen Google giver ikke et websted med et websted med højere mørk tilstand, men "indirekte" er bestemt, hvis din mørke tilstand hjælper med at forbedre brugeroplevelsen, reducere afvisningshastigheden og øge tiden på brugeren på websiden (tid på side).
Spørgsmål: Skal vi designe alle nye websteder for at lave mørk tilstand?
Svar: Ingen grund til at gøre alt igen. Men skal have en systematisk plan og design "mere", hvis den originale webstedsstruktur allerede er god, er det at tilføje den mørke tilstand at oprette et andet CSS -stilark til denne tilstand. Men hvis de ønsker de bedste resultater at have eksperter til at hjælpe i denne proces, vil du sikre, at dit UX/UI -design
---
Spørg om illustrationer: Stort spørgsmål Mark Icon og har spørgsmål-små svar omgivet af en interessant grafik og let at læse
Resume for at være let at forstå + vil prøve at gøre
I sammendraget, mørk tilstand, er organisationens websted ikke kun en overfladisk skønhedstrend, men det er en "kraftfuld" at forbedre brugeroplevelsen (UX) og brandets koncept (brandopfattelse). Nøglen er ikke at vælge, om man skal bruge en mørk eller lys tilstand, men det er "at forstå brugere" og "give alternativer" til dem.
Investering er korrekt til at udføre den mørke tilstand ved at tage hensyn til anvendeligheden, tilgængeligheden. Og mærkets mål er at vise opmærksomhed i detaljer, der kan gøre en forskel og få dit brand til at skille sig ud over konkurrenterne ikke lader tøven blokere muligheden for at skabe en god oplevelse for dine kunder.
Det er tid til at udforske og anvende denne idé på din organisationswebsted i dag. At virkelig have fordelen og understrege ledelsen i den digitale tidsalder!
---
Spørgsmål om illustrationer: Kraftigt sidste billede viser smartphone og bærbar skærm, der åbner din organisationswebsted, med knappen Toggle Switching the Light/Dark Mode, som er klar og med en konverteringsgraf. Formidler et håndgribeligt forretningsresultat
Seneste blog

Superior Technology JavaScript? Lær webasemble (WASM) at kende, der hjælper webapplikationen, der kræver en høj ydeevne (f.eks. Spil, designprogrammer), der fungerer så hurtigt som den oprindelige app.

Reducer misforståelser og spar tid! Lær hvordan du skriver en god hjemmeside -brief for at kommunikere målet, kunderne og hvad du vil have, at agenturet skal forstå det samme fra starten.

Gamle artikler, der plejede at være stille? Lær hvordan du registrerer og rehabiliterer indholdsfald med dataopdateringer, forbedrer nøgleordet og øger det interne link til at vende tilbage til rang.