Ridizajnimi i një faqeje 13-vjeçare: si të përtërihet gjithçka pa prishur asgjë
28 shtator 2026
Shumë kompani kanë një faqe interneti që dikur ishte krenaria e tyre dhe tani duket si një kartolinë e dekadës së kaluar. Rindërtimi i saj duket i rrezikshëm: ka vite përmbajtje, renditje kërkimi të fituara me mundim, zakone të përdoruesve — dhe kod që askush nuk dëshiron ta prekë. Sapo përfunduam pikërisht këtë lloj projekti — një ridizajnim i plotë i komunitetit të fotografisë SuperSnimki.ru — dhe ja si shkoi.
Nga ku filloi gjithçka
E nisëm SuperSnimki në vitin 2013. Që atëherë faqja ka grumbulluar më shumë se 200,000 fotografi nga mbi 4,700 fotografë, plus mijëra artikuj dhe tema forumi. Platforma funksiononte në mënyrë të besueshme, por ndërfaqja kishte mbetur në epokën e vet:
stilet përpiloheshin direkt në server nga një mjet i vjetëruar;
ikonat ndodheshin në tre fonte të ndryshme ikonash;
skedari kryesor JavaScript peshonte 674 KB — dhe afërsisht gjysma e tij ishte biblioteka që nuk ishin përdorur prej vitesh;
nuk kishte modalitet të errët dhe as navigim të përshtatshëm për celularin;
disa probleme ishin të padukshme: RSS-i ishte prishur që nga fundi i vitit 2024, dhe fotografitë e fshira ktheheshin me ridrejtim në vend të një 404 të sinqertë.
Vendimi kyç: mos e rishkruaj platformën
Rruga më e shtrenjtë dhe më e rrezikshme është "le të rishkruajmë gjithçka në një stack të ri". Ne e refuzuam. Motori Perl, bazat e të dhënave MongoDB dhe MySQL, struktura e URL-ve dhe të dhënat mbetën pikërisht ashtu siç ishin. Ne ndryshuam atë që shohin përdoruesit — dhe gjithçka që e pengonte faqen të ishte e shpejtë.
Kjo është arsyeja pse ridizajnimi nuk u kthye kurrë në një migrim: asnjë lidhje nuk u prish, renditjet e kërkimit nuk u dëmtuan, dhe përdoruesit thjesht hapën një ditë një faqe të njohur që ishte transformuar.
Një sistem dizajni mbi kod të vjetër
Së pari e përcaktuam sistemin e dizajnit si tokena: ngjyrat për temat e dritës dhe të errët, një shkallë tipografike, hapësirën në një rrjet 4 px, rrezet e kthesave dhe kohëzgjatjet e animacioneve. Të 183 shablllonet e faqes u zhvendosën mbi këto tokena — prandaj modaliteti i errët funksionoi kudo njëherësh, jo vetëm në faqen kryesore.
Një hile e vogël kurseu shumë kohë: 130 ikonat e reja SVG morën të njëjtat emra klasash si glifet e vjetra të fontit të ikonave. Nuk na u desh të rishkruanim asnjë shabllon për ikonat — ato thjesht filluan të dukeshin të reja.
Një përvojë për celularin që ndihet si aplikacion
Sot shumica e audiencës shfletonte fotografi nga telefonat. Prandaj shtuam një shirit navigimi në fund me një buton ngarkimi në qendër, një menu që hapet anash dhe një shfaqës të ri në ekran të plotë me zmadhim me gishta, lëvizje me prekje dhe prekje të dyfishtë. Faqja mund të shtohet në ekranin kryesor, ashtu si një aplikacion.
Shpejtësia: hiq më shumë se sa shton
Ridizajnimet shpesh e rëndojnë faqen. E jona bëri të kundërtën:
paketa kryesore JS humbi 68% — nga 674 KB në 213 KB;
u hoqën 51 biblioteka të vjetra, ndërsa redaktuesi, hartat dhe grafikët tani ngarkohen vetëm kur nevojiten;
telefonat marrin fotografi me madhësi të mesme, dhe ndërsa ngarkohet një imazh, ngjyra e tij mesatare mban vendin e vet;
kërkimi i artikujve, që dikur zgjaste deri në 30 sekonda për fjalët e zakonshme, tani funksionon si një pyetje e vetme e shpejtë.
Rezultati: kodi bazë është 27,000 rreshta më i vogël — edhe pse fitoi veçori.
Arsye të reja për t'u kthyer
Një ridizajnim i mirë nuk ka të bëjë vetëm me pamjen. Së bashku me të shtuam gjërat për të cilat njerëzit kthehen:
një revistë e moderuar me panel autorësh dhe një përvojë të rehatshme leximi — me tabelë përmbajtjeje dhe shirit progresi;
një katalog pajisjesh fotografike i lidhur me fotografi reale përmes EXIF: mund të shihni me çfarë fotografojnë në të vërtetë fotografët e faqes;
Përmbledhja e vitit — një faqe me statistikat dhe fotografitë më të mira të një fotografi, që ftoh për t'u ndarë;
mjete AI: analizë fotografish, përkthim artikujsh, karta produktesh të plotësuara automatikisht në dyqan dhe importim kamerash të reja.
Siguria dhe SEO gjatë rrugës
Kur kalon nëpër çdo shabllon, sheh edhe atë që ka mbetur e pavërejtur për vite. Mbyllëm cenueshmëritë XSS në kërkim, komente dhe forum, mbrojtëm fshirjet me tokena CSRF, rikthyem 404-të e duhura, rregulluam RSS-in, zgjeruam markupin JSON-LD dhe shtuam imazhe në harta e faqes.
Çfarë mund të marrë projekti juaj nga kjo
1.
Një ridizajnim nuk është arsye për të rishkruar gjithçka. Nëse platforma funksionon, përtërini ndërfaqen mbi të: më shpejt, më lirë dhe pa rrezik për SEO-n tuaj.
2.
Filloni me një sistem dizajni. Tokenat e bëjnë modalitetin e errët, stilin e qëndrueshëm dhe ndryshimet e ardhshme pothuajse falas.
3.
Fshini pa frikë. Bibliotekat e vjetra dhe kodi i papërdorur janë mënyra më e lehtë për ta shpejtuar një faqe.
4.
Përdorni ridizajnimin si auditim. Është momenti më i mirë për të gjetur cenueshmëri dhe veçori që janë prishur pa zhurmë.
5.
Jepini njerëzve arsye për t'u kthyer. Pamja e re tërheq vëmendjen; veçoritë e reja e mbajnë atë.
Studimi i plotë i rastit me pamje ekrani është në portofolin tonë, dhe faqen e përditësuar mund ta shikoni drejtpërdrejt në supersnimki.ru.
Nëse faqja juaj ka nevojë për përtëritje dhe prekja e saj ju duket e frikshme, na tregoni për projektin tuaj dhe do të përgatisim një plan ridizajnimi ku asgjë nuk humbet.
Shkruani faqen tuaj — AI ynë kontrollon shpejtësinë, SEO, faqet ligjore zvicerane, besueshmërinë dhe konvertimin dhe tregon çfarë të rregulloni së pari.
Si një shërbim për postime automatike në Telegram u bë një redaksi lajmesh me AI, me video, autopilot dhe 10 platforma brenda tetë muajve —…
Webula AI
Përgjigjet brenda sekondash · themeluesi sheh çdo bisedë
Përshëndetje! Jam asistenti IA i Webula. Më pyesni për faqe interneti, IA, automatizim ose video — çmime, afate, çfarë i përshtatet biznesit tuaj. Në çdo gjuhë.
Përdorim cookie-t e domosdoshëm për ta funksionuar këtë faqe. Me pëlqimin tuaj përdorim edhe Google Analytics për të parë cilat faqe ndihmojnë vizitorët tanë. Zgjedhjen mund ta ndryshoni në çdo kohë. Politika e privatësisë