02 — Smjernice

Smjernice i struktura redizajna

KSM · ksm.hr · 2026-04-10

1 Vizualni identitet

Identitet izgrađen na tri stupa: priroda (zelene površine kao core usluga), pouzdanost (50 god., ISO, INA) i modernost (clean, contemporary). Forest Green kao temelj, Amber Orange kao energija za CTA.

1.1 Paleta boja

Forest Green #1A4731 Primarna — header, footer, naslovi
Amber Orange #E8650A Akcent/CTA — gumbi, istaknuti elementi
Medium Green #306844 Sekundarna — hover, gradijenti
Pale Green #F3F7F5 Pozadina 2 — alternativne sekcije
Charcoal #1C1C1C Tekst — paragraf
White #FFFFFF Osnovna pozadina

Kontrast provjere (WCAG 2.1)

Bijeli tekst na #1A4731 10.2:1 — AAA ✅
#1C1C1C na bijeloj 18.5:1 — AAA ✅
Bijeli tekst na #E8650A 3.1:1 — samo za veliki tekst ⚠️ Koristiti samo za gumbe ≥16px bold
#1C1C1C na Pale Green 17.8:1 — AAA ✅

1.2 Tipografija

Plus Jakarta Sans za naslove (snažan, moderan) · Inter za body tekst (iznimna čitljivost)

Display H1
Plus Jakarta Sans 800 · clamp(2.5rem → 4.5rem) · lh 1.1
Heading One (H1)
Plus Jakarta Sans 700 · clamp(2rem → 3.5rem) · lh 1.2
Heading Two (H2)
Plus Jakarta Sans 700 · clamp(1.625rem → 2.75rem) · lh 1.3
Heading Three (H3)
Plus Jakarta Sans 600 · clamp(1.375rem → 2.25rem) · lh 1.4
Lead tekst — Komunalni servisi Marčec d.o.o. vodeća je tvrtka u Sisačko-moslavačkoj županiji za održavanje zelenih površina, higijenu objekata i manje građevinske radove.
Inter 400 · clamp(1.0625rem → 1.375rem) · lh 1.6
Body tekst — S 35 kvalificiranih zaposlenika i više od 50 godina iskustva, KSM pruža pouzdane usluge industrijskim tvrtkama, javnim institucijama i privatnim klijentima diljem Hrvatske. ISO 9001:2015 i ISO 14001:2015 certifikati jamče kvalitetu svakog angažmana.
Inter 400 · clamp(0.9375rem → 1.0625rem) · lh 1.7

2 Informacijska arhitektura

2.2 Struktura naslovne stranice

🔒 HEADER (sticky) — Logo · Usluge · Reference · O nama · Zatraži ponudu
🖼️ HERO (full-screen) — "50 GODINA PROFESIONALNIH USLUGA" · Lead tekst · [Zatraži ponudu] [Naše usluge ↓]
📊 TRUST BAR — 35 zaposlenika · ISO 9001 · ISO 14001 · CW AA+ · Od 1973. · INA od 1992.
🔧 NAŠE USLUGE — 6 kartica (3×2 grid) + [Sve usluge →]
📷 FEATURED — split 60/40 · Fotografija malčiranja | 50 god. priča + CTA
🤝 REFERENCE & KLIJENTI — Logo strip (INA, HEP…) + 2 testimonijala
🖼️ GALERIJA RADOVA — masonry grid (6–9 slika) + [Sve fotografije →]
📬 KONTAKT CTA — "Trebate ponudu? Javite se." · Inline forma (ime, email, usluga, poruka)
📰 AKTUALNOSTI — 3 najnovije objave
📋 FOOTER — Logo · Usluge · Tvrtka · Kontakt · Certifikati · © 2026 KSM

3 Opis stranica

Naslovnica

/
Svrha
Prva impresija, generiranje upita, overview svih usluga
CTA
"Zatraži ponudu" (primarni), "Naše usluge" (sekundarni)

Podstranice usluga (×6)

/usluge/{slug}/
Svrha
SEO + detaljna prezentacija svake usluge + konverzija
Sadržaj
Hero, opis, podkategorije, slike radova, relevantni klijenti, FAQ
CTA
"Zatraži ponudu za ovu uslugu"

⭐ Reference (nova stranica)

/reference/
Svrha
Najveća prodajna stranica — dokaz rada kroz 50+ godina
Sadržaj
Istaknute reference (INA 30+ god., HEP, Opća bolnica), logo grid 14 klijenata, testimonijali, case study format
CTA
"Postanite dio naše liste referenci"

O nama

/o-nama/
Svrha
Izgradnja povjerenja, priča tvrtke
Sadržaj
Povijest (1973→danas), Ivan Marčec, 35 zaposlenika, certifikati, bez državnih subvencija
CTA
"Kontaktirajte nas"

Kontakt

/kontakt/
Svrha
Konverzija — generiranje upita
Sadržaj
Forma (ime, tvrtka, email, tel, vrsta usluge, poruka), Google Maps, adresa, tel, email, radno vrijeme
Info
Strelečko 2, 44000 Sisak · 098 18 26 766 · info@ksm.hr · Pon–Pet 8–16

4 Tehničke preporuke

KomponentaRješenjeNapomena
PlatformaWordPress + Hello Elementor + Elementor ProNadogradnja postojećeg — nije migracija
PristupačnostOneTap AccessibilityJedini od konkurenata koji to implementira
SigurnostWPManageNinja ProFirewall, brute force, 2FA
AdminASE ProClean head, disable comments, hide WP version
SEOSlimSEO ProMeta, Schema.org LocalBusiness, 301, sitemap
CacheLiteSpeed CachePage + browser cache, image lazy load
SlikeWebP UploadsAutomatska konverzija u WebP
GDPRCookieYes ProZamjena za Cookie Notice
FormeElementor FormFluent Forms nije potreban
RedirectSlimSEO Pro 301komunalni-servisi-marcec.hr → ksm.hr
PageSpeed cilj85+ mobile, 95+ desktopLiteSpeed + Elementor optimizacija

5 UX poboljšanja

  1. CTA u hero-u — "Zatraži ponudu" vodi direktno na kontakt formu (sada ne postoji)
  2. Sticky header s naranžastim CTA gumbom — uvijek vidljiv pri scrollanju
  3. Trust bar — odmah ispod hero-a: 35 zaposlenika, ISO certifikati, 50 god., INA od 1992.
  4. Inline kontakt forma na naslovnoj — kratka forma bez odlaska na posebnu stranicu
  5. Stranica Reference — nova, kompletno — INA 30+ god. je referenca od zlatnog standarda
  6. Galerija radova — masonry grid s filtrima po kategoriji usluge
  7. Podstranice za svaku uslugu — SEO + B2B naručitelji trebaju detalje
  8. Terenski radovi u nav-u — rješavanje skrivene usluge
  9. Twitter → LinkedIn ili brisanje — Twitter placeholder narušava profesionalnost
  10. 301 redirect komunalni-servisi-marcec.hr → ksm.hr — eliminacija SEO duplikacije

6 Prioriteti implementacije

🟢 Visoki prioritet (obavezno)

  • Nova naslovnica s hero CTA i trust bar-om
  • Stranica Reference/Projekti (nova — ne postoji)
  • Kontakt forma (Elementor forma)
  • Podstranice za svih 6 usluga
  • SlimSEO Pro — meta, Schema.org LocalBusiness, sitemap
  • LiteSpeed Cache + WebP Uploads
  • CookieYes Pro (zamjena Cookie Notice)
  • WPManageNinja Pro (sigurnost)
  • OneTap Accessibility
  • 301 redirect komunalni-servisi-marcec.hr → ksm.hr

🟡 Srednji prioritet (preporučeno)

  • Galerija radova s filterima (Elementor Loop Grid)
  • Google Maps embed na kontakt stranici
  • Aktualnosti reaktivacija (min. 5 uvodnih objava)
  • LinkedIn profil (umjesto Twittera)
  • ASE Pro — čišćenje HTML head-a

⚪ Niski prioritet (opcijsko)

  • FAQ sekcije na podstranicama usluga
  • Višejezičnost HR/EN (kasnija faza)
  • Newsletter pretplata
  • WhatsApp gumb (live chat)