Mo ti lo diẹ sii ju ọdun meji lọ ni awọn yàrà ti apẹrẹ iriri olumulo. Mo ranti iyipada lati awọn ipilẹ ti o da lori tabili si CSS, pivot si apẹrẹ idahun nigbati iPhone ṣe ifilọlẹ, ati igbega ti “aje akiyesi.” Ṣugbọn bi a ṣe nlọ kiri ni ọdun 2026, ile-iṣẹ n dojukọ iyipada pataki julọ rẹ sibẹsibẹ. A n lọ kọja akoko ti “apẹrẹ ni eyikeyi idiyele” sinu akoko UX Sustainable. Kii ṣe nkan ti ọpọlọpọ awọn apẹẹrẹ n ronu nipa, pẹlu ara mi, titi ti Emi yoo fi fa mi nipasẹ gbigbọ nipa eyi bi imọran. Fun awọn ọdun, a ti tọju intanẹẹti bi ethereal, awọsanma ti ko ni iwuwo. A ti ro pe awọn ọja oni-nọmba jẹ “alawọ ewe” lasan nitori wọn ko tẹjade lori iwe. Mo ti lo lati ro wipe ju, ati ki o to awọn Erongba ti iyipada afefe emerged, o jẹ diẹ ẹ sii nipa fifipamọ awọn igi. A ṣe aṣiṣe. Awọsanma jẹ amayederun ti ara, nẹtiwọọki ti ntan ti awọn ile-iṣẹ data, awọn kebulu abẹlẹ, ati awọn eto itutu agbaiye ti o hum 24/7. Lakoko ti awọn ile-iṣẹ data ti o dojukọ AI baramu agbara agbara ti awọn alumọni alumini nla, iwuwo agbegbe giga wọn ṣẹda paapaa lile ati igara ayika agbegbe. Gẹgẹbi awọn apẹẹrẹ UX, awa jẹ awọn ayaworan ti agbara agbara yii. Gbogbo aworan akọni ti o ga-giga, gbogbo fidio isale adaṣe adaṣe, ati gbogbo iwara JavaScript eka ti a fọwọsi jẹ itọnisọna taara si ero isise kan lati jẹ agbara. Ti a ba fẹ kọ ọjọ iwaju ti o duro, a gbọdọ da apẹrẹ fun “Iro ohun” ati bẹrẹ apẹrẹ fun ṣiṣe. Ipo Dudu Ni awọn tete 2000s, funfun backgrounds wà bošewa nitori won mimicked awọn faramọ ti iwe. Sibẹsibẹ, ohun elo ti wa, ati pe imoye apẹrẹ wa gbọdọ tẹle. Iyipada lati LCD si imọ-ẹrọ OLED (Organic Light Emitting Diode) ti yipada ni ipilẹ bi awọ ṣe ni ipa agbara.
The Logic Ko dabi awọn iboju LCD ti aṣa, eyiti o nilo ina ẹhin ti o wa ni titan nigbagbogbo (paapaa nigbati o ba nfihan dudu), Awọn iboju OLED tan imọlẹ ẹbun kọọkan ni ẹyọkan. Nigbati piksẹli ba ṣeto si dudu otitọ (#000000), diode kan pato ti wa ni pipa patapata. It draws zero power. Nipa sisọ awọn atọkun ti o ṣe ojurere awọn paleti dudu, a ko kan tẹle aṣa kan; a n dinku awọn ibeere agbara ti ẹrọ olumulo ni ti ara. Data naa Awọn ifowopamọ agbara jina lati aifiyesi. Iwadi ala-ilẹ nipasẹ Ile-ẹkọ giga Purdue ni ọdun 2021, eyiti o ti di iwọn goolu fun ijiroro yii, ṣafihan pe ni 100% imọlẹ, yiyipada lati ipo ina si ipo dudu le fipamọ aropin ti 39% si 47% ti agbara batiri. Ni iwọn agbaye kan, ti gbogbo ohun elo pataki ba jẹ aiyipada si ipo dudu, idinku ninu ibeere grid yoo jẹ astronomical. The Design ìlépa Ni ọdun 2026, Ipo Dudu ko yẹ ki o jẹ “akori” Atẹle mọ kuro ninu akojọ awọn eto. A yẹ ki o ṣe apẹrẹ pẹlu iṣaro “Dark-First”. Eyi ko tumọ si pe gbogbo aaye gbọdọ dabi The Matrix, ṣugbọn o tumọ si iṣaju iṣaju awọn akori dudu-itansan giga bi ipo ti o fẹ eto aiyipada. Eyi fa igbesi aye ohun elo ti ẹrọ naa pọ si ati dinku ifẹsẹtẹ erogba ti gbogbo ibaraenisepo. Emi tikalararẹ fẹ Ipo Imọlẹ fun kika, nitorinaa o jẹ oye lati ni ina mejeeji ati awọn aṣayan ipo dudu wa. Awọn ero iraye si tun wa pẹlu ipese awọn aṣayan mejeeji. Aworan Ati Fidio Ti o dara ju A ti di ọlẹ onise. Pẹlu 5G iyara-giga ati awọn opiti okun, a ti da aibalẹ nipa awọn iwọn faili duro. Iwọn oju-iwe alagbeeka apapọ ti pọ si nipasẹ 500% ni ọdun mẹwa to kọja, ni pataki nitori awọn ohun-ini wiwo ti ko dara julọ. The Logic “Ọra oni-nọmba” ti oju opo wẹẹbu kan (awọn fọto Unsplash 4MB yẹn ati awọn fidio abẹlẹ 15MB) jẹ oluranlọwọ ti o tobi julọ si agbara fifuye oju-iwe. Gbogbo megabyte ti o gbe lati ọdọ olupin si alabara nilo ina fun gbigbe, sisẹ olupin, ati ẹrọ ṣiṣe olumulo. Nigba ti a ba lo awọn faili nla, a jẹ agbara "sisun" ni pataki lati ṣe afihan aworan kan ti o le ti ni imunadoko ni ida kan ti iwọn. Lai mẹnuba, o tun n pese iriri olumulo ti o dara julọ pẹlu oju-iwe kan ti o gbe iyara pupọ.
Data naa Gẹgẹbi Ile-ipamọ HTTP, awọn aworan ati fidio ṣe iṣiro nigbagbogbo fun ipin kiniun ti iwuwo lapapọ oju-iwe kan. Sibẹsibẹ, iyipada si awọn ọna kika ode oni bi AVIF ati WebP le dinku iwuwo aworan nipasẹ to 50% ni akawe si JPEG, laisi eyikeyi pipadanu ti o ni oye ni didara. Botilẹjẹpe awọn ọna kika wọnyi ko faramọ si mi bi JPG ati PNG, dajudaju Mo n nireti lati lo wọn lati dinku iwọn oju-iwe. AwọnApẹrẹ Apẹrẹ Laipẹ Mo ṣe itọsọna atunṣe kan fun iru ẹrọ cybersecurity kan. Nipa imuse iṣayẹwo “Ṣaaju ati Lẹhin”, a ṣe awari pe oju-iwe akọọkan wọn n ṣe ikojọpọ 5.5MB ti data. By replacing high-res photography with SVG (Scalable Vector Graphics) art and using clever CSS gradients instead of image assets, we dropped the load to 1.2MB. Iyẹn jẹ idinku 78% ni fifuye agbara! Gẹgẹbi onise apẹẹrẹ, ibeere akọkọ rẹ yẹ ki o jẹ nigbagbogbo: “Ṣe Mo nilo fọto kan fun eyi, tabi ṣe MO le ṣaṣeyọri isọdọtun ẹdun kanna pẹlu koodu?”
Išipopada imomose: Gige awọn ohun idanilaraya “Ipariwo”. A n gbe ni ohun akoko ti "yi lọ-jacking" ati eka 3D Parallax ipa. Lakoko ti iwọnyi le ṣẹgun awọn ẹbun lori Awwwards.com, wọn jẹ awọn ajalu ilolupo nigbagbogbo. The Logic Idaraya kii ṣe ọfẹ. To render a complex animation, the device’s GPU (Graphics Processing Unit) must work at high capacity. Eyi mu iwọn otutu Sipiyu pọ si, nfa awọn onijakidijagan itutu agbaiye (ni awọn kọnputa agbeka), ati fa batiri kuro ni iyara. Awọn ohun idanilaraya “Ipariwo” ti o nṣiṣẹ nigbagbogbo ni abẹlẹ tabi nfa awọn kikun awọn kikun ti ẹrọ aṣawakiri jẹ agbara deede ti fifi ọkọ ayọkẹlẹ rẹ silẹ laišišẹ ni opopona.
Data naa Awọn itọsona Apẹrẹ Ohun elo Google tẹnu mọ “Iṣipopada Itumọ.” Wọn jiyan pe ere idaraya yẹ ki o lo nikan lati ṣe itọsọna olumulo tabi pese esi. And using WebP instead of JPEG can save 25-50% of data on a page. The Design ìlépa A gbọdọ gba išipopada Itumọ. Ti ere idaraya ko ba ṣe iranlọwọ fun olumulo kan lati pari iṣẹ-ṣiṣe kan tabi loye ipo-iṣe, o jẹ asan. A yẹ ki o ṣe ojurere fun awọn iyipada CSS lori awọn ile-ikawe JavaScript ti o wuwo bii GSAP tabi Lottie nibiti o ti ṣee ṣe, nitori CSS jẹ iyara-ẹrọ ati ṣiṣe daradara siwaju sii fun ẹrọ aṣawakiri lati ṣe iṣiro. Gẹgẹbi oluṣeto UX, Emi ko le jiyan ọna yii. Eyi kii ṣe iranlọwọ nikan lati dinku egbin data ṣugbọn tun ṣe ilọsiwaju UX fun awọn olumulo wa. Ṣiṣeto “Isuna data” Fun Gbogbo Ise agbese Ni awọn ọdun 20+ mi ti UX, awọn iṣẹ akanṣe aṣeyọri julọ ni gbogbogbo jẹ awọn ti o ni awọn ihamọ ti o muna julọ. Gẹgẹ bi iṣẹ akanṣe kan ti ni isuna inawo, o yẹ ki o tun ni erogba ati isuna data. The Logic Isuna Data jẹ fila lile lori iwọn lapapọ ti oju-iwe kan (fun apẹẹrẹ, “Oju-iwe ibalẹ yii ko le kọja 1MB”). Eyi fi agbara mu ẹgbẹ apẹrẹ lati ṣe awọn yiyan ti o nira, ipinnu. Ti o ba fẹ ṣafikun iwe afọwọkọ ipasẹ tuntun tabi iwuwo fonti ti o wuyi, o ni lati “sanwo” fun rẹ nipa mimujuto tabi yiyọ nkan miiran kuro. Eyi ṣe idiwọ fun “rako ti ẹya” lati yi pada si “irako erogba.” Data naa Awoṣe Apẹrẹ Wẹẹbu Alagbero, ti dagbasoke nipasẹ awọn aṣaaju-ọna bii Wholegrain Digital, pese agbekalẹ kan lati ṣe iṣiro CO2 fun wiwo oju-iwe kan. Oju opo wẹẹbu apapọ n ṣe agbejade nipa 0.5 giramu ti CO2 fun wiwo. Fun aaye kan pẹlu awọn iwo oṣooṣu miliọnu kan, iyẹn jẹ awọn toonu metric 6 ti CO2 ni ọdun kan, deede si wiwakọ ọkọ ayọkẹlẹ kan 15,000 miles. The Design ìlépa Atokọ Ayẹwo UX Alagbero
Dinku Awọn ibeere Aworan dinku iwulo ti gbogbo wiwo ati lo ipinnu ti o kere julọ ati awọn ọna kika faili ti o munadoko julọ (bii AVIF) lati dinku gbigbe data. Mu fidio pọ si Imukuro media ti nṣire-laifọwọyi ki o ṣe pataki fisinuirindigbindigbin giga, awọn losiwajulosehin kukuru lati rii daju pe agbara lo lori akoonu nikan ti olumulo pinnu lati wo. Lo Fonts ni opin Lo iwọn awọn iwọn fonti wẹẹbu meji ti o pọju tabi duro si awọn nkọwe eto Ayebaye lati yọkuro awọn ibeere olupin ti ko ṣe pataki ati fifun bloat. Tunlo Awọn Dukia Tunṣe aworan kan tabi fidio ni ọpọlọpọ igba ni lilo awọn asẹ CSS ati awọn agbekọja lati ṣẹda oniruuru wiwo laisi jijẹ iwuwo oju-iwe lapapọ. Yan Green HostingHost awọn ọja oni-nọmba rẹ lori awọn olupin ti o jẹri nipasẹ The Green Web Foundation lati rii daju pe wọn ni agbara nipasẹ awọn orisun agbara isọdọtun. Din Data DistanceSyan awọn ipo olupin ni agbegbe agbegbe ti o sunmọ awọn olugbo akọkọ rẹ lati dinku agbara ti o nilo fun data lati rin irin-ajo nipasẹ awọn amayederun ti ara.
Ọran Iṣowo Fun Apẹrẹ Eco-friendly Diẹ ninu awọn le jiyan wipe "Green UX" dun bi a aropin lori didara. Ni ilodi si, o jẹ anfani ifigagbaga. Apẹrẹ alagbero jẹ apẹrẹ iṣẹ. Nigbati o ba dinku iwuwo oju-iwe, awọn ẹru aaye rẹ yarayara. Nigbati oju opo wẹẹbu rẹ ba nyara yiyara, Core Web Vitals rẹ ni ilọsiwaju. Nigbati Awọn oju opo wẹẹbu Core rẹ dara si, ipo SEO rẹ lọ soke. Pẹlupẹlu, awọn olumulo lori awọn ẹrọ agbalagba tabi awọn ero data ti o lọra (paapaa ni awọn ọja ti n jade) le wọle si ọja rẹ gangan. Eyi ni itumọ ti “Apẹrẹ Iṣọkan.” Nipa gige “ọra oni-nọmba,” a ṣẹda leaner, yiyara, ati oju opo wẹẹbu wiwọle diẹ sii. A ti wa ni gbigbe kuro lati "isọnu oniru" ti awọn 2010 si ọna adiẹ yẹ, ọwọ oni faaji. Ipari: Ojo iwaju ti “Mọ” Apẹrẹ Ni awọn ọdun meji ti apẹrẹ mi, Mo ti rii ọpọlọpọ awọn aṣa wa ati lọ. Skeuomorphism, Apẹrẹ Alapin, Neumorphism - gbogbo wọn jẹ awọn yiyan ẹwa. Ṣugbọn UX alagbero kii ṣe aṣa; o jẹ dandan ni bayi. A jẹ iran akọkọ ti awọn apẹẹrẹ ti o ni lati ṣe iṣiro pẹlu awọn abajade ti ara ti iṣẹ oni-nọmba wa. UX alagbero jẹ “win-win-win.” O dara julọ fun aye nitori pe o dinku agbara agbara. O dara julọ fun olumulo nitori pe o ni abajade yiyara, awọn atọkun idahun diẹ sii. Ati pe o dara julọ fun iṣowo naa nitori pe o dinku awọn idiyele alejo gbigba ATI ilọsiwaju awọn oṣuwọn iyipada. Akoko ti “awọn piksẹli ailopin” ti pari. Ni ọdun 2026, apẹrẹ ti o ga julọ ni ọkan ti o fi ẹsẹ ti o kere ju silẹ. A wa ni ko gun o kan apẹẹrẹ; a jẹ olutọju ti batiri olumulo, ero data wọn, ati nikẹhin, ayika. Ipe To Ise Mo koju ọ lati ṣayẹwo oju-iwe kan ti iṣẹ akanṣe lọwọlọwọ rẹ loni. Lo ohun elo kan bii Ẹrọ iṣiro Erogba Oju opo wẹẹbu lati rii ipa rẹ. Lẹhinna, wa “egbin ti a ko le rii.” Njẹ aworan yẹn le jẹ SVG? Njẹ fidio yẹn le jẹ akọni aimi bi? Njẹ ere idaraya “ti pariwo” yẹn le parẹ? Bẹrẹ kekere. Ojutu ti o yangan julọ nigbagbogbo jẹ ọkan pẹlu awọn baiti to kere julọ.