Seinäjokelaisen kehys- ja taidetarvikeliike Kehys-Artin sivuston uudistus pohjautui tarpeeseen korvata valmisteemalla toteutettu, aikaisemman omistajan alullepanema ulkoasu uudella, minimalistisella ilmeellä. Samalla vaihdettiin webhotellin palveluntarjoajaa, ja uusi koti löytyi jälleen Shellit.orgista.
Sivuston sisältö päätettiin toteuttaa yhden sivun turvin ja projektin budjetti pidettiin tarkoituksella niukkana. Tätä silmälläpitäen valitsin toteutustavaksi täysin WordPressin uuteen visuaaliseen lohkoeditoriin, Gutenbergiin, pohjautuvan toteutuksen. Kevyen perusteeman päälle toteutin Gutenbergin sisäänrakennetuilla lohkoilla eli visuaalisilla rakennuspalikoilla kevyen kokonaisuuden, johon nostettiin asiakkaan logosta korostusvärit.
Sivuston muokkauskokemus lohkoeditorissa on visuaalisesti yksi yhteen julkisen puolen kanssa; samat välistykset ja marginaalit, kirjasimet ja koot, värit yms. Näitä varten tein lohkoeditoriin räätälöidyt väripaletit ja kirjasinkokovalinnat. Lisäksi editoriin ladataan käyttöön sama tyylitiedosto kuin julkisellekin puolelle.
Sivuston suoristuskyvyn takaamiseksi tein muutaman perusratkaisun; logo on SVG-muodossa ja kirjasin on myös natiivi Arial, ei siis ulkoisia riippuvuuksia. Kuvat ladataan laiskasti (lazy loading), ja se onkin ainoa toiminnallinen lisäosa sivustolla. Sivusto onkin varsin nopea ja saa Google PageSpeed Insights -testissä täydet 100 pistettä. Kuvien kokoja en vielä osannut Gutenbergin osalta räätälöidä, tuossa ja muissa sen uusissa aspekteissa riittää opeteltavaa.
Instagram-kuvien automatisoituun hakemisteen toteutin kevyen rajapintaintegraation Instagram Basic Display APIa hyödyntäen. Sen avulla saadaan tuoreimmat Instagram-kuvat haettua sivulle automaattisesti.
Kiitos projektista ja onnea uusille sivuille, Eija-Tiina!
