Blog categories

Comments

Madeira Levadat

Paikointia Madeiran saarella

Levadat.com -sivusto on vuosien varrella muuntautunut useaan kertaan. Ensimmäiset versiot sivustoista tehtiin legendaarisella html4.01/CSS verkkojulkaisukielillä puhtaasti koodaamalla ja koodaustaitoni kehittyikin pitkälti tuona aikana. Viimeisin versio sivustoista on neljäs. Se on ensimmäinen versio, joka on tehty HTML5:llä. Sivustot eivät ole WordPress-alustalla, kuten tänä päivänä suurin osa sivustoista vaan rakennettu Adobe Dreamweaver bootstrap-teemaan: https://www.zign.nl/html-template-demo-61140.html.

Levadat sivuston sisältö on ollut laajempi vanhoilla sivustoilla mutta koska kaikki vanha kuvamateriaali on käsiteltävä uudelleen, on sivustojen sisällön tuotantoprosessi vielä kesken. Sivuja rakennetaan täysin ei-kaupallisesti ja talkootyönä kirjoittajan toimesta, joten niitä tehdään asiakasprojektien ohessa vapaa-ajalla. Niinpä sisältöä tupsahtelee pikkuhiljaa.

Levadat.com sivuston kaikki kuvasisältö on itse tuotettua vuosina 2007-2016, jona aikana kaikkiaan 10 vaelluslomaani suuntautuivat Madeiralle. Kuvamateriaali, samoin kuin videomateriaalin ottamiseen ei ole käytetty erityisen huippuluokan kalustoa. Materiaali on kuvattu tavallisella pokkarikameralla ja osin kännykkäkameralla. Kuvamaterialli on käsitelty tosin ammattitaidolla huippuluokan Adoben työkaluilla.

Valokuvausta

Pidän valokuvauksesta ja nautin erityisesti ikuistaa luonnon loputonta, äärettömän monimuotoista kauneutta. Itse julkaisemieni sivustojen kuvamateriaali onkin 98% itseottamaani kuvamateriaalia.

Kuvankäsittely on erityinen intohimoni, joskin luontokuvien ollessa kyseessä pyrin käyttämään tehosteita pääasiallisesti vain korostamaan tunnelmaa, joka kuvan ottohetkellä oli aistittavissa.

Valokuvausharrastukseni alkoi jo aikoinaan matkaillessani Pohjois-Englannissa 80-luvun loppupuolella, jolloin kuvaaminen tapahtui vielä perinteisin menetelmin filmille. Sittemmin olenkin digitoinut ja ohjelmallisesti parannellut skannattuja valokuvia uuteen uskoon. Lue lisää täältä.

Levadat.com

Teknisesti ottaen

Levadat.com sivustoa tehdessä brandille on luotu logo ja määritelty kolme pääväriä, joita elementeissä pääosin käytetään. Sivuston logo kuvastaa yhteistä matkaa kohti elämyksiä. Etupuolella oleva hahmo ikäänkuin johdattaa kädestä kumppaninsa seikkailuun näyttääkseen jotain erityistä. Logon sininen väri on veden ja taivaan väri. Vaalean ruskea kuvastaa taas maata.

Sivuston ulkoasulla halusin viestiä raikkautta, jossa kuvien vihertävä/rusehtava sävy tuo luonnollisuuden vivahteen. Vaeltaminen ja patikoiminen on kuitenkin yhdenlaista liikuntaa ja siksi sivuston tyyli on räväkkä ja ehkä jollain tapaa sporttinenkin.

Image
Image
marker
Suurenna

Sivustojen yhteydessä usein luodaan jotain liikkuvia elementtejä. Mahdollisesti on tarve luoda esimerkiksi animaatio  mainokseen tai banneriin sosiaalisessa mediassa. Hahmojen ja objektien animoinnissa käytän Adobe animate ohjelmistoa, jolla on esimerkiksi tehty oheinen gif-animaatio joulutervehdykseksi Facebookin seuraajille.

Videosisällön editoinnissa työkaluina ovat Adobe Premiere, Audition (äänet) sekä Adobe After Effects, jolla saa aikaan näyttäviä tekstianimaatioita ja muita tehosteita videosisältöön. Yleensä luon esimerkiksi lopputekstit After Effects-ohjelmistolla.

Sivustoilla olevat animaatiot ovat sopivia paikoittain mutta useasti pyrin käyttämään muuttuvia anomoituvia elementtejä harkitusti, jottei sivustosta  tulee lukijalle häiritsevä. Jokaisella sivulla pyrin kuitenkin käyttämään jotain liikkuvaa osaa, jotta sivuun saadaan jotain eloa.

Animaation hahmo on haettu verkosta ja käsitelty Adobe illustrator ohjelmalla ja tuotu Adobe Animate ohjelmistoon, jossa se on animoiden hetätetty eloon. Myös muut animaation elementit on luotu Illustratorilla osin kuvamateriaalista vektoroimalla, osin piirtämällä.

Tutustu sivuihin

Levadat.com sivuston tarinat odottavat vierailuasi

Madeira Levadat sivustolla kannattaa käydä vilkaisemassa. Sivut on luotu intohimosta Madeiran luontoon ja vaeltamiseen saaren vehreässä maastossa. Vuosien harrastuksena tehty työ on minulle teos, josta olen ylpeä ja tyytyväinen. Sivustolta voin myös nähdä mihin kaikkeen kykenen verkkosivujen koodia muokkaamalla. Bootstrap-pohja sinäänsä on todella massiivinen paketti verkkosivuiksi ja koodiin ja sen toimintaan tutustuminen vei toki aikansa mutta rakenne on tullut tekemisen kautta tutuksi.

DOWNHILL HTML5 -pohja on todella näyttävä vaihtoehto esimerkiksi sporttisen ja nuorekkaan yrityksen verkkosivuiksi. Vierailijan kommentit pohjaan tehtyjen sivujen tyylikkyydestä teemassa ovat taatusti muuta kuin: “Ihan kivat sivut”.

div#stuning-header .dfd-stuning-header-bg-container {background-image: url(https://aurinkoverkko.com/Grafitag/wp-content/uploads/2017/01/peruspaketti.jpg);background-size: contain;background-position: center center;background-attachment: scroll;background-repeat: no-repeat;}#stuning-header div.page-title-inner {min-height: 600px;}
WhatsApp Whatsup-viesti