Etusivu Vinkit

Tietoturvaan liittyviä omakohtaisia kokemuksia

Websivuston osalta muutamia tietoturvaan liittyviä vinkkejä lähinnä omaan kokemukseen perustuen.

Sääntö nro 1

Älä pystytä sivustoa kokeilumielessä millään julkaisujärjestelmällä. Tai jos teet sen, hävitä se heti kokeilun jälkeen. Pahin on tilanne, jossa kokeilumielessä laitetaan sivusto pystyyn. Sitten se unohtuu ja saattaa olla siellä jopa vuosia. Sitten joku päivä julkaisujärjestelmä on hakkeroitu. Tietysti sillä voi lohduttautua, ettei siellä ollut mitään tärkeää. Tosin se on laiha lohtu siinä vaiheessa, kun sivuston kautta aletaan hyökkätä toisia palvelimia vastaan.

"Suomalaisiakin murrettuja www-palvelimia on käytetty palvelunestohyökkäyksissä. Hyökkääjät käyttävät hyväkseen haavoittuvia Joomla-julkaisujärjestelmän versioita käyttäviä palvelimia. Hyökkäysten kohteena ovat olleet esimerkiksi yhdysvaltalaiset pankit. Haavoittuvia Joomla-palvelimia on etsitty järjestelmällisesti eri puolilta maailmaa." (Cert-fi)

Sääntö nro 2

Huolehdi päivityksistä eli päivitä Joomla, Wordpress tai mikä julkaisujärjestelmä sinulla sitten onkin. Muista päivittää myös pluginit. Eli ei riitä, että jossain vaiheessa valitaan viimeisin versio. Julkaisujärjestelmä kaipaa ylläpitoa varsinkin tietoturvan osalta.

Sääntö nro 3

Muista varmuuskopioida usein eli tiedostot ja tietokanta talteen. Varmuuskopion avulla selviät pinteestä, kun kaikki on menetetty.

Ja ne omat kokemukset edelliseen liittyen. Kauan sitten laitoin sivuston pystyyn Joomlalla. Sitten yksi päivä se oli hakkeroitu. Syynä se, etten ollut päivittänyt Joomlaa. Samalla kertaa olin tehnyt toisen virheen eli varmuuskopioita ei ollut. Tein kaiken sitten uudestaan. Toisella kertaa eli tässä ihan vasta kävi niin, että kokeilumielessä olin pystyttänyt julkaisujärjestelmän. Siitä seurasi tietenkin hakkerointi eli kokeilu oli jäänyt päivittämättä. Tällä kertaa oli kuitenkin varmuuskopio, lisäksi siivosin kaikki kokeilut pois.

 

 

Last Updated (Wednesday, 23 January 2013 11:53)

 

Mozilla Popcorn Maker

Mozilla Popcorn Maker

Mozilla Popcorn Makerin idea on, ettei käyttäjän tarvitse olla tekninen nero rakentaakseen interaktiivisen videoesityksen. Lisäksi kaikki tapahtuu verkossa eli käyttäjän ei tarvitse asennella koneelleen kalliita ohjelmia.On myös huomattava, ettei Mozilla Popcorn Maker ole tavallinen videonleikkausohjelma verkossa kuten esim. seuraavat palvelut.

 

Mozilla Popcorn Makerin erikoisuus on siinä,että videot ovat interaktiivisia ja dynaamisia. Jos videossa on linkki, on se samanlainen kuin millä tahansa HTML-sivulla. Paina videossa pause ja napsauta linkkiä ja pian linkin osoittama sivu avautuu. Sekin on mahdollista, että videossa on upotettuna Googlen kartta. Jälleen voit käyttää kyseistä karttaa, vaikka se on videossa kiinni. Jos upotat Twitterin videoon, näkyy videossa aina uusin kyseisen Twitterkanavan viesti.

Miten se toimii?

Popcorn Maker ei käytä Flashiä lainkaan, vaan kaiken toiminnallisuuden mahdollistaa HTML 5. Siihen päälle tietysti vielä CSS:ää ja javascriptiä niin paketti on valmis. Omalle koneelle ei tarvitse asentaa mitään, myöskään selain ei kaipaa ylimääräisiä laajennuksia. Sein on erikoista, ettei online palvelussa ladata mitään palvelimelle eli raskasta tiedostojen siirtoa ei tarvita.

Popcorn Maker hyödyntää kaikkea mitä on netissä jo valmiina ja tekee siitä oman remixauksen. Videon voit linkittää Youtubesta, musiikin voit linkittää SoundCloudista ja kuvat saat tietysti Flickristä. Eikä siinä vielä kaikki, koska voit upottaa sivuille Twitterfeedejä ja Wikipedian artkkleita. Twitterifeedit ovat videossa täysin reaaliaikaisia ja Wikipediaa voit selailla normaalisti eli esim. vieritys toimii. Lisäksi Popcorn Maker tarjoaa vielä omat työkalut mm tekstin ja puhekuplien muodossa.

Huonot puolet

Popcorn Maker ei ole käytettävyyden osalta erityisen hyvä, ainakin siinä mene aikaa ennen kuin ymmärtää logiikan. Ja sitten se suurin heikkous eli videoita ei voi oikeasti editoida tai leikata eli kyseessä ei ole videoeditointiohjelma.Et voi esim. lyhentää videoleikettä tai tehdä siihen efektejä kuten esim. hidastusta. Eikä näköjään onnistu leikkeiden yhdistäminen eikä sekään onnistu, että leikkeet olisivat erillään esim. ääni ja kuva.

Ja tässä kokeilua, ks linkki alla.

http://popcorn.webmadecontent.org/9g3

Last Updated (Monday, 03 December 2012 00:10)

 

Vlogit ja Wordpress

Matskussa väärä linkki tässä oikea

http://www.avkymppi.net/blogit_ja_wordpress.pdf

 

Photoshop

http://www.avkymppi.net/ps-cs3.pdf

 

Get Simple ja alavalikko

HUOM!

 

GetSimplen materiaalissa pitää muuttaa CSS. jos käyttää pluginia nested menu. CSS esim näin:

/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Title : HC Crusaders
Author : Jari Sarja
URL : http://www.jarisarja.fi/
Created : September 2011
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
html{
height:100%;
margin-bottom:1px;
}

body{
font-family:verdana,arial,sans-serif;
font-size:90%;
margin:0;
padding:0;
background-color:#fff;
background-image: url('images/tausta.jpg');
background-repeat:repeat-x;
}

#kehys{
width:960px;
margin-left:auto;
margin-right:auto;
display:table;
}

#ylapalkki {
width:960px;
background-image: url('images/ylapalkki.jpg');
height:201px;
}

#navigaatio {
width:760px;
height:41px;
background-image: url('images/navigaatio.jpg');
padding: 0 0 0 200px;
}

#alaosa {
width:960px;
background-image: url('images/alaosa.jpg');
background-repeat:no-repeat;
background-position: top left;
min-height:645px;
}

#oikea {
width:340px;
padding: 5px 8px 0 20px;
min-height:640px;
float:right;
}

#vasen {
width:532px;
min-height:640px;
float:left;
padding: 5px 0 0 42px;
}


#alapalkki {
clear:both;
height:36px;
width:960px;
background-image: url('images/alapalkki.jpg');
background-repeat:no-repeat;
text-align:center;
padding: 6px 0 0 0;
}


#nav, #nav ul{
margin:0;
padding:0;
list-style-type:none;
list-style-position:outside;
position:relative;
line-height:1.5em;
}

#nav a{
display:block;
padding:0px 8px;
border:0px solid #333;
color:#000;
text-decoration:none;
background:transparent;
font-family:'Yanone Kaffeesatz';
font-size:22px;
}

#nav a:hover{
text-decoration:underline;
}

#nav li{
float:left;
position:relative;
}

#nav ul {
position:absolute;
display:none;
width:12em;
top:1.5em;
}

#nav li ul a{
width:12em;
height:auto;
float:left;
}

#nav ul ul{
top:auto;
}

#nav li ul ul {
left:12em;
margin:0px 0 0 10px;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul{
display:none;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul{
display:block;
}

.current {
text-decoration:underline;
}

 
More Articles...

Haku