MiMaVe.Design.Photo -sivustosta on tullut uusi versio. Muutokset ovat kohtuullisen suuria siksi versiosta 1.3 siirryttiin suoraan versioon 2.0.
Aika paljon on tapahtunut taustalla ja tämän päivityksen yhteydessä siirrytään jo Gutenbergiin editorina. Gutenbergin pitäisi tulla tämän vuoden puolella WordPressin peruspalikaksi ja tämä on pieni ”varaslähtö”.
Lue lisää alta.
Sivuston versiomuutoksessa työkalupakissa oli Html, css, php, JS ja Svg. Näillä ja näiden erilaisilla yhdistelmillä saa jo aikalailla aikaiseksi ja mitä enemmän oppii sen enemmän voi tehdä erilaisia asioita ja luovia ratkaisuja.
Svg:llä yhdistettynä css:ään, JS:ään ja sivujen rakenteisiin on hienot mahdollisuudet edessä ja vain taivas on rajana. Mutta mitä nopeammat netit meiltä löytyy, sitä enemmän voidaan myös ääni ja video tuoda keskeisiksi elementeiksi sivuille. Videoelementtejä ja äänikikkoja vielä odotellessa katsellaan vähän tilanteita tässä ja nyt.
Sivuilla ei vielä ole mitään Gutengergisoitua muuta kuin tämä postaus, mutta tarkoitus on Gutenbergisoida suurin osa materiaalista: ainakin pääsivut, osa poustauksista ja ainakin uudet poustaukset. Alla on myös muutaman Gutenbergiläisen elementin esimerkkejä sivulle tuunattuina.
Tämä on Gutenberg verse elementti, jota on tuunattu JavaSriptillä, jotta se scrollaantuu mukana kapeilla laitteilla...
Pitää nyt vaan löytää oikea tasapaino, layout- /grafiikka- /kuvakikkailujen ja asian suhteen. Riskinä Gutenbergissä voi olla se, että sivuista tulee liian visuaalisesti ”ärsyttäviä”. Tämä on otettava huomioon, kuten myös sivujen tyylit yms.
Kultainen keskitiekö?
Gutenberg quote elementti
Gutenberg cover elementti
toiseksi leveimpänä
Sivuston versiopäivitykseen kuuluu myös paljon muuta: kaikenlaisia pieniä parannuksia ja tyylillisiä kehittelyjä vähän kaikkialle. Näkyvin muutos on varmaan loaderin tekeminen. Loaderi toimii niin, että se täyttää sivun sen ajaksi kun sivusto latautuu ja poistuu sitten kun sivu on valmiiksi latautunut. Loaderissa seikkailee kukapa muukaan kuin WedesignBoy. Pyörimisessä on pieniä ongelmia joillakin laitteilla. Iosseilla WebdesignBoyn pään hyrrääminen vähän jumittaa välillä, mutta muilla testatuilla toimii kohtuu hyvin.
Testailtu:
Mukavana yllätyksenä tuli Edgeen tullut muutos svg:n rotate -animaation (css) käsittelyssä, hyvä Edge edistystä! Tämä animaatiomuoto ei siis aikaisemmin ole toiminut, mutta nyt toimii niin scrollaukseen sidottu WebdesignBoy kuin myös loaderi…
Nyt näyttäisi siis olevan niin, että svg:n animaatiokomentaminen css:llä toimii pääosin kaikilla perusselaimilla ja alustoilla, mikä on aivan mahtavaa, sillä svg, css ja javascript -kombinaatiot mahdollistavat vaikka ja mitä!!!
Toinen keskeinen muutos on teemojen tai aihepiirien tuominen kuvineen ja kuvauksineen jokaiseen niihin sidotun postauksen footeriin. Siis näet kuvat ja voit lukea poustaukseen kuuluvien teemojen kuvauksen poustauksen alapuolelta, jopa lyhennetyn poustauksen. Kuvia klikkaamalla pääset myös teeman arkistoon suoraan. Tämä on mielestäni aika iso muutos toiminnallisuuteen ja visuaalisuuteen. Teemojen/aiheiden/tägien kuvat saivat myös oman paikkansa teemasivujen valikkonappulaan (oikea yläkulma). Kehitys kehittyy ???? …
Kolmas iso muutos on pyrkimys luopua slaideri- ja galleria -plugariesta. Jatkuvat päivitykset ja kustomointien mahdollisuuden vähäisyys veivät tähän ratkaisuun. Nyt on tehty Gutenbergin tuomia mahdollisuuksia käyttäen enemmän sivuille niiden tyylien mukaiset galleriat. Pohjana on siis wp:n oma galleria (Gutenberg blocks). Gallerioihin ja slaidereihin liittyen on myös tehty omat sivut täyskokoisille kuville (image attachment page). Nämä sivut korvaavat tavallaan lightboxit ja slaiderit. Sivulle (slaideri/galleriaan) pääsee galleriakuvia sitten klikkailemalla, kun näin pitkälle päästään. Siirtymisessä pois plugareista menee kyllä aikaa, kun muutettavia gallerioita on monia kymmeniä ja kuvia satoja… Mutta päätyminen wp:n vakiogalleriaan on kuitenkin sen arvoista, enemmän muunneltavuutta ja vähemmän yllätyksiä/päivityksiä…
Yksi käyttöön vaikuttava muutos on siirtyminen arkiiveissa ja blogeissa lyhennyksiin koko artikkeleiden sijasta. Tulevaisuudessa poustauksissa pitää siis painaa ”more -linkkiä” tai poustauksen otsikkoa nähdäkseen koko poustauksen. Tämä on tarkoitus tehdä kaikille poustauksille, mutta tässäkin menee aikaa ennenkuin kaikki ovat oikeassa muodossaan. Tarkoitus on nopeuttaa mielenkiintoisten artikkeleiden etsimistä. Ei siis tarvitse scrollata jokaista artikkelia läpi, vain pieni alku. Ja jos haluaa lukea lisää tai katsella enemmän kuvia niin klikkaa artikkeliin vain…
Graafisista muutosista voi mainita Ars Graphica -sivun uuden logon ja stilleben- ja varjo- aihe/teema/tägi -kuvat saivat pikaisen parannuksen. Kaikille sivuille tuli joitakin muutoksia. Suurimmat muutokset ehkä Ars Graphica ja Multimedia -sivuille. Mutta kaikkiin tulee selkeitä muutoksia kunhan sivut Gutenbergisoidaan…
Gutenberg
Siis se iso muutos, eli siirtyminen Gutenbergiin. Tässä vähän sen lähtökohtia ja taustaa. Tämä muutos vaati aikalailla tekemistä MiMaVe.Design.Photo -teeman puolella. Gutenberg -muutoksesta pyrittiin ottamaan mahdollisimman paljon irti, hyödyntämällä Gutenbergin mahdollisuuksia teeman avulla. Gutenberg on saanut aika lailla arvosteluakin, mutta itse näen sen hyvänä kehityksenä ja tarjoavan paljon mahdollisuuksia, kyse on vain siitä että mitä mahdollisuuksia siitä hyödyntää… Tämä on yksi MiMaVe.Design.Photo -web 2.0 version päätavoitteista. Sivuilla ei siis ole vielä Gutenbergisoitua, muutakuin osittain tämä postaus, mutta ajan mittaan enemmän ja enemmän materiaalia Gutenbergisoidaan. Pitää kuitenkin pitää mielessä, että jokaisella sivuston sivulla on vähän eri tyylit ja olen huomioinut tämän myös Gutenbergin suhteen. Eli Gutenbergisoiminen eri sivuilla voi näyttää vähän erilaiselta…
Käykää siis klikkailemassa ja katselemassa. Gutenbergisoitua materiaalia ei ole vielä paljoa tämän julkaisuhetkellä, mutta tarkoitus on saada kohtuu vauhdilla asioita eteenpäin…
Webbisuunnittelun mahdollisuudet kutkuttavat mieltä oikein todella: svg, JS, animaatio, video ja ääni.
Vain mielikuvistus on rajana…
