Hemax Pro Wash — prodavnica hemije za perionice i tepih servise
Distributer profesionalne hemije iz Leskovca prodaje isti proizvod u nekoliko pakovanja, a svako pakovanje ima svoju cenu, svoju šifru i svoje stanje. Trebao je katalog koji to podnosi bez kopiranja proizvoda, prodavnica u kojoj se poručuje bez otvaranja naloga i panel u kom vlasnik sam menja cene. Sve u sopstvenom kodu, bez platforme i bez mesečne pretplate.
- Klijent
- Hemax Pro Wash
- Delatnost
- Profesionalna hemija za perionice, tepih servise i kamione
- Područje
- Cela Srbija, sedište u Leskovcu
- Tip
- Web prodavnica sa katalogom i admin panelom
- Tehnologije
- PHP 8.3 · SQLite · vanilla JS · WebP derivati
- Sajt
- hemaxprowash.com
- Status
- Živ sajt, u aktivnom održavanju
U ovom tekstu
- Čime se Hemax Pro Wash bavi
- Šta je trebalo rešiti
- Katalog i proizvod koji stoji na više mesta
- Veličina nije poseban proizvod
- Korpa, porudžbina i račun
- Tehnička izvedba
- Slike: 39 MB fotografija u kartice od 260 piksela
- Brzina, mereno a ne procenjeno
- Selidba na svoj domen, SEO i vidljivost
- Panel: sve što stigne i sve što se menja
- Šta je puklo i šta klijent na kraju ima
Čime se Hemax Pro Wash bavi
Hemax Pro Wash je distributer profesionalne hemije za pranje. Snabdeva samouslužne i klasične autoperionice, tepih servise i firme koje peru kamione. Sedište i magacin su u Leskovcu, a roba ide kurirskom službom u celoj Srbiji.
U ponudi su tri brenda — Golden Chimigal, Raysick i Cristal Finish: aktivne pene i šamponi za beskontaktno pranje, šamponi za mašinsko pranje tepiha, sredstva za plastiku i kožu, čistači felni, mirisi, mikrofiber pribor i roto četke. Isti proizvod obično dolazi u nekoliko pakovanja, od flašice za kućnu upotrebu do kanistera od 25 kilograma.
Kupac nije samo perionica. Deo asortimana ide hobistima i ljudima koji jednom mesečno operu svoj auto, pa je katalog morao da progovori sa oba: profesionalcu koji zna šifru proizvoda i računa cenu po kilogramu, i čoveku koji prvi put kupuje aktivnu penu i ne zna razliku između pretpranja i šampona.
Na sajtu klijent navodi da je na KupujemProdajem prodavac od 2017. godine, sa 354 pozitivne i nijednom negativnom ocenom. To je bio i najjači adut koji je do tada stajao svuda osim na sopstvenom sajtu.
Šta je trebalo rešiti
Prodavnica hemije izgleda jednostavno dok se ne pogleda šta sve stoji iza jedne cene:
- Jedan proizvod, više pakovanja. Aktivna pena ide u 1, 10 i 20 kg. To nisu tri proizvoda nego tri veličine iste stvari, svaka sa svojom šifrom, cenom i stanjem.
- Isti proizvod, više namena. Skidač fleka je i tepih servis, i dubinsko pranje enterijera, i hobi polica. Ako mora da se izabere jedna kategorija, katalog laže.
- Cene se menjaju češće od koda. Klijent pošalje nov cenovnik kad mu se promeni nabavka — to ne sme da bude izmena u kodu i novo objavljivanje sajta.
- Poručivanje bez registracije. Perioničar neće da otvara nalog da bi naručio dva kanistera.
- Papir koji ide uz robu. Uz porudžbinu treba račun sa šiframa iz fiskalne kase, u obliku na koji je klijent navikao.
Uz to je išlo i ono što ide uz svaku srpsku prodavnicu: uslovi prodaje, reklamacije, pravo na odustanak u roku od 14 dana i politika privatnosti, napisani za ovaj posao a ne prekopirani sa tuđeg sajta.
U prvoj verziji je postojao i B2B deo sa posebnim cenovnikom i nalozima za firme. Posle nekoliko nedelja je izbačen, na zahtev klijenta: iste cene za sve, a dogovor sa firmama ide telefonom. Bolje je obrisati sistem koji niko ne koristi nego ga održavati zauvek.
Katalog i proizvod koji stoji na više mesta
Katalog danas ima pedeset proizvoda raspoređenih u šest programa: samouslužne perionice, klasične perionice, tepih servis, dubinska pranja, pranje kamiona i hobi varijanta. Ispod toga idu podnivoi — eksterijer, enterijer, mirisi, oprema i pribor — a unutar njih grupe kao što su čistači felni ili sredstva za kožu.
Veza proizvoda i kategorije je namerno više prema više. Proizvod ima jednu primarnu kategoriju i koliko god dodatnih treba, pa se isti skidač fleka pojavljuje i u Tepih servisu, i u dubinskim pranjima, i u hobi polici — bez dupliranja zapisa. Kategorija koja ima decu prikazuje podkategorije, kategorija bez dece prikazuje proizvode, i vadi ih iz celog podstabla ispod sebe, ne samo one direktno svoje.
Redosled je bio posebna priča. Vlasnik ima svoj redosled kataloga i drugačiji redosled unutar pojedinačne kategorije — u tepih servisu prvo idu šamponi za mašinsko pranje, u beskontaktnom pranju prvo pene. Zato postoje dva redosleda, globalni i po kategoriji, i oba se u panelu prevlače mišem. Sortiranje koje kupac vidi na sajtu (preporučeno, cena, naziv, najnovije) polazi od tog ručnog redosleda.
Veličina nije poseban proizvod
Pakovanja su rešena kao varijante jednog zapisa. Svaka varijanta nosi svoju oznaku (1 kg, 10 kg, 20 kg), svoju šifru, cenu, podatak da li je na stanju i šifru za fiskalnu kasu. Zato na kartici u katalogu piše „od" pa najniža cena, a na stranici proizvoda kupac bira pakovanje i cena se menja pod prstom.
Korpa pamti proizvod i izabranu veličinu, pa dva pakovanja istog artikla stoje kao dva odvojena reda i ne sabiraju se u jedno.
Najkorisniji detalj je stigao kasnije, iz pogona. Klijent je hteo da ugasi samo jednu veličinu kad je nestane, a da ostale ostanu u prodaji — deaktiviranje celog proizvoda bi sakrilo i onih pet kilograma kojih ima na lageru. Sada se u panelu ta veličina prebaci na „nije na stanju": na sajtu se prikazuje precrtano i ne može da se izabere, prva dostupna postaje podrazumevana, cena „od" gleda samo dostupna pakovanja, a ako su sve veličine ugašene proizvod se javlja kao trenutno nedostupan. Korpa odbija ugašenu varijantu i onda kada neko pokuša da je doda zaobilazno.
Korpa, porudžbina i račun
Poručuje se bez registracije. Kupac popuni podatke, izabere plaćanje pouzećem ili uplatom na račun i pošalje porudžbinu — u jednom koraku, bez naloga i bez kartice na sajtu.
Cena se računa na serveru. Ono što stigne iz brauzera se ne gleda: iznos, dostava i prag za besplatnu dostavu ponovo se izvode iz baze pre nego što se porudžbina upiše. U korpi stoji traka koja pokazuje koliko fali do besplatne dostave, jer je to pitanje koje kupac ionako postavlja.
Kada porudžbina prođe, kupac dobija potvrdu na mejl, a vlasnik obaveštenje sa svim stavkama. Iz panela se za svaku porudžbinu štampa A4 račun: logo, podaci izdavaoca, tekući račun, stavke sa šiframa iz kase, ukupan iznos i iznos ispisan slovima. Broj računa se dodeljuje pri prvom otvaranju i posle se ne menja.
Šifre iz kase su bile zadatak za sebe. Klijent ih je poslao kao fotografiju liste sa šezdesetak stavki; upisane su i po proizvodu i po pakovanju, zamrzavaju se u porudžbini u trenutku kupovine i izlaze na račun. Tri šifre sa te liste nisu imale svoj proizvod na sajtu — to je prijavljeno klijentu umesto da se pogađa čemu pripadaju.
Tehnička izvedba
Sajt je PHP 8.3 i SQLite, bez WordPress-a i bez ijednog dodatka koji treba ažurirati. Front je običan JavaScript, bez okvira.
Adrese su čiste — /katalog, /kategorija/tepih-servis, /proizvod/blue-beast. Jedan detalj tu vredi zapisati: uobičajen način da se to postigne, try_files $uri $uri.php, servira izvorni PHP kod kao običan fajl čim traženi fajl postoji. Prodavnica je jedno vreme umela da izda sopstveni kod umesto stranice. Rešeno je imenovanim fallback-om koji uradi rewrite na .php i vrati zahtev u obradu, pa se izvor nikada ne servira statički.
Baza je namerno van repozitorijuma. Proizvodi, cene i porudžbine žive na serveru, a kod se objavljuje odvojeno. Migracija kataloga radi upiši-ili-ažuriraj po slugu, nikad brisanje, i pri tome čuva ono što postoji samo u živoj bazi — dostupnost pojedinačnih pakovanja i šifre za kasu. Bez tog čuvanja bi jedno osvežavanje kataloga pobrisalo nedelju dana rada u panelu.
Jedan kvar se pokazao tek pod paralelnim opterećenjem. Brojač pregleda proizvoda upisivao je u bazu bez čekanja na zaključavanje, pa je pri istovremenim posetama stranica proizvoda umela da vrati grešku 500. Dodato je čekanje na zaključavanje, a brojač je izdvojen tako da njegov neuspeh ne obara stranicu: dvanaest paralelnih zahteva pre popravke davalo je pet grešaka, posle nijednu.
Slike: 39 MB fotografija u kartice od 260 piksela
Klijent je fotografije proizvoda slao mejlom, u punoj rezoluciji, uz izričit zahtev da se ne obrađuju. Zahtev je razuman — to su njegove fotke i on zna kako želi da mu roba izgleda. Problem je bio što je katalog vukao oko 39 MB slika da bi ih prikazao u karticama širokim 260 piksela.
Rešenje ne dira originale. Pored svake fotke stoje manje WebP verzije od 320, 640 i 960 piksela, a stranica ih nudi kroz <picture> i srcset, tako da brauzer sam bira po širini ekrana i gustini piksela. Original ostaje kao rezerva za sve što nema svoj derivat. Praktično: fotografija od 829 KB se u kartici učitava kao fajl od 9 KB, a pozadinska slika naslovne je sa 1,2 MB spuštena na 62 KB.
Na stranici proizvoda je zadržana lupa: prelaz mišem uveličava deo slike, a klik otvara punu verziju sa zumiranjem i prevlačenjem. Za to postoji posebna, veća kopija slike — jedina koja se namerno ne smanjuje.
Brzina, mereno a ne procenjeno
Kada su slike sređene, ostalo je ono što obično koči prvi prikaz: fontovi i stilovi.
Fontovi su skinuti sa Google-ovih servera i hostuju se sa istog domena, u izdanju koje nosi samo latinicu sa našim slovima — jedan od njih je sa 352 KB spao na 208 KB. Stilovi se ubacuju direktno u zaglavlje stranice, pa prvi prikaz ne čeka nijedan dodatni fajl. Pozadinska slika naslovne ima posebnu, manju verziju za telefone i najavljuje se brauzeru unapred.
Mereno kroz PageSpeed Insights u junu 2026: desktop 100/100/100/100 — performanse, pristupačnost, dobre prakse, SEO — i mobilni 90/100/100/100. Tih 90 na mobilnom je realan plafon za sajt sa velikom fotografijom iznad pregiba, jer se mobilni test vrti sa četvorostruko usporenim procesorom i sporom mrežom. Na pravom telefonu preko dobre veze to nije ista slika.
Tu je i pravilo koje se lako previdi: sadržaj iznad pregiba ne sme da čeka animacije pri skrolu. Naslov i dugmad na vrhu su izuzeti iz tog sistema, jer bi inače najveći element stranice čekao da se izvrši JavaScript.
Selidba na svoj domen, SEO i vidljivost
Prodavnica je prvo živela na našem poddomenu, dok klijent nije registrovao svoj domen. Selidba na hemaxprowash.com urađena je kao jedan skok: stare adrese trajno preusmeravaju na nove uz očuvanu putanju, kanonske adrese i sitemap prebačeni su na novi domen, a domen je dodat i potvrđen u Google Search Console-u preko DNS zapisa. Namerno nije korišćena Google-ova opcija za promenu adrese, jer bi ona pomerila ceo naš domen sa kog je poddomen bio — trajno preusmerenje i nova stavka u Search Console-u odrade posao bez te štete.
Sadržajni deo su četiri stranice po vrsti posla, van kataloga: hemija za perionice, za samouslužne perionice, za tepih servise i za pranje kamiona. Svaka ima svoj tekst, probleme koje rešava, izbor proizvoda iz baze i svoja pitanja i odgovore. To su stranice koje hvataju pretragu po poslu, dok kategorije hvataju pretragu po proizvodu.
Strukturirani podaci su povezani u jedan graf: firma sa adresom, radnim vremenom i koordinatama, sajt sa pretragom, prodavnica, pitanja i odgovori, mrvice na svim stranama i podaci o proizvodu sa rokom isporuke i pravom na povraćaj. Kod proizvoda sa više pakovanja ide raspon cena, a kod onih bez cene se cena jednostavno izostavlja umesto da se izmisli. Sitemap nosi oko osamdeset adresa, a robots.txt namerno pušta i pretraživače veštačke inteligencije.
Panel: sve što stigne i sve što se menja
Vlasnik radi iz sopstvenog panela koji stoji na zasebnom poddomenu i može da se instalira na telefon kao aplikacija.
U njemu su proizvodi sa varijantama, šiframa, kategorijama i redosledom koji se prevlači; porudžbine sa svim podacima kupca ispisanim odmah u listi, gde su telefon i mejl klikabilni; poruke sa kontakt forme; računi; podešavanja kao što je prag za besplatnu dostavu; i pregled saobraćaja.
Statistika posete je rešena bez Google Analytics-a i bez kolačića: beleže se putanja, izvor i nepovratan otisak posetioca koji se svakog dana menja, tako da isti čovek u toku dana broji jednom, a posle toga se ne može povezati ni sa čim. Nema banera za pristanak na praćenje jer nema šta da se traži — sajt koristi samo tehničke kolačiće za korpu.
Svako veče stiže kratak izveštaj na mejl: koliko je bilo porudžbina, koliki je promet, koliko upita, koliko poseta i šta čeka obradu. To je jedini izveštaj koji vlasnik zaista pročita, jer stiže tamo gde ionako gleda.
Šta je puklo i šta klijent na kraju ima
Dve stvari vredi zapisati jer su bile prave greške, ne kozmetika.
Prva: porudžbine jedno vreme uopšte nisu prolazile. Upis u bazu odbijao se zbog veze ka tabeli koja je obrisana zajedno sa B2B sistemom — baza je odbijala svaki upis porudžbine, tiho, sa greškom na samom kraju procesa. Nijedna porudžbina nije mogla da prođe dok tabela nije vraćena. Prva prava porudžbina stigla je istog dana po popravci.
Druga: kupac je u svoju adresu ukucao gamil.com umesto gmail.com, potvrda porudžbine se odbila, a odbijeni mejl je pao u sanduče vlasnika kao „nedostavljeno". Od tada je pošiljalac razdvojen — automatske poruke idu sa adrese koja ne prima odgovore i tamo se skupljaju odbijeni mejlovi, dok odgovor kupca i dalje stiže na radnu adresu. Vlasnikovo sanduče je ostalo čisto.
Ono što danas ima: prodavnicu koja je njegova, sa kodom i bazom na serveru koji se prekopiraju i presele. Bez mesečne pretplate platformi, bez provizije po prodaji, bez dodataka koji se raspadnu na sledećem ažuriranju. Cene i pakovanja menja sam, porudžbina stiže i na mejl i u panel, račun se štampa sa istog mesta, a kupci ga nalaze preko kontakt strane i telefona koji stoji na svakoj stranici.
Sajt u slikama
Hemax Pro Wash
Pedeset proizvoda u šest programa, isporuka u celoj Srbiji i savet pri izboru pre porudžbine.
hemaxprowash.comČesto postavljana pitanja
Zašto custom PHP, a ne WooCommerce ili Shopify?
Može li vlasnik sam da menja cene, pakovanja i redosled?
Kako se prikazuje proizvod koji ima više pakovanja?
Šta se dešava kada jedna veličina nestane sa stanja?
Mora li kupac da otvori nalog da bi poručio?
Ima li ovakva prodavnica mesečne troškove?
Treba vam ovakav sajt?
Recite mi čime se bavite i šta sajt treba da uradi za vas — dobijate fiksnu ponudu i rok, u pisanoj formi.