Alku
Aloitat sivujen teon. mietit missä voisit tehdä sivusi. Onhan niitä maksullisia, mutta sivujen teon alkuvaiheessa ei kannata aloittaa maksullisella palvelulla. Ensimmäinen hyvä vaihtoehto on webbisivu.com Nämä asiat sinun on opittava webbisivu.com palvelulla: fontin vaihto, kuvan lisääminen sivuille ja linkittäminen. Lisäksi sinun täytyy osata luoda sivuillesi uusia sivuja. Kun taidat nämä taidot voit siirtyä vaikeampaan tasoon. Suntuubi.com palvelulla alkaa sivujen tyylikkyys jo näkyä. Opettele luomaan foorumin ja muokkaamaan sen ulkoasua. Lisäksi vaihtele sivujen ulkoasua usein, että opit senkin. Kun olet tuon kaiken oppinut, voit jo olla ylpeä itsestäsi! Olet oppinut paljon! Fontin vaihdon, kuvan lisäämisen, linkityksen, foorumin luonnin ja ulkoasun vaihtelun. Paljon on kuitenkin vielä opittavaa. Seuraavaksi tarvitset englantia. koulun pulpetilla mietit ehkä, että mihin englantia tarvitaan. Esim kotisivujen teossa se on tarpeellista. Menet sivuille freewebs.com Opettelet käyttämään englanninkielistä palvelua. Foorumia yms sinun ei tarvitse sivuille laittaa, sillä eihän meidän suomalaisten tarvitse englanninkielisillä sivuilla kaikkea osata! ;) Kun olet oppinut käyttämään freewebsiä oikein, niin siirry käyttämään vuodatus.net palvelua. Aluksi luo uusia sivuja, laatikoita yms. Sitten voitkin alkaa käyttämään html-koodeja! Vaihda ensin editorisi koodinäkymään ja syötä sitten koodit editoriisi.
TEKSTI
Alleviivattu teksti
<u> Tähän teksti, jonka haluat alleviivata </u>
Yliviivattu teksti
<s>Tähän teksti, jonka haluat yliviivata</s>
Lihavoitu teksti
<b>Tähän teksti, jonka haluat lihavoida </b>
Kursivoitu teksti
<i>Tähän teksti, jonka haluat kursivoida</i>
Teksti taustavärillä
<SPAN STYLE=BACKROUND:Tekstin taustaväri>Tähän teksti, jonka taustan haluat värilliseksi</SPAN>
Teksti joka vaihtaa väriä
<font size="fontin koko"> <script> // ********** MAKE YOUR CHANGES HERE var text=" TÄHÄN TEKSTISI " // YOUR TEXT var speed=80 // SPEED OF FADE // ********** LEAVE THE NEXT BIT ALONE! if (document.all||document.getElementById){ document.write('<span id="highlight">' + text + '</span>') var storetext=document.getElementById? document.getElementById("highlight") : document.all.highlight } else document.write(text) var hex=new Array("00","14","28","3C","50","64","78","8C","A0","B4","C8","DC","F0") var r=1 var g=1 var b=1 var seq=1 function changetext(){ rainbow="#"+hex[r]+hex[g]+hex[b] storetext.style.color=rainbow } function change(){ if (seq==6){ b-- if (b==0) seq=1 } if (seq==5){ r++ if (r==12) seq=6 } if (seq==4){ g-- if (g==0) seq=5 } if (seq==3){ b++ if (b==12) seq=4 } if (seq==2){ r-- if (r==0) seq=3 } if (seq==1){ g++ if (g==12) seq=2 } changetext() } function starteffect(){ if (document.all||document.getElementById) flash=setInterval("change()",speed) } starteffect() </script> </font>
Reunasta reunaan liikkuva teksti taustavärillä:
<MARQUEE SCROLLDELAY=1 SCROLLAMOUNT=10 BEHAVIOR=ALTERNATE BGCOLOR="taustaväri"> Tähän teksti, jonka haluat liikkuvan reunasta reunaan </marquee>
KUVAT
Muistathan aluksi copyrightin. Eli siis et voi vain lyödä googleen hakusanoja ja kopioida kuvia. Kuvat on kuvannut joku joka ei välttämättä halua sinun kopioivan niitä ilman lupaa. Netissä liikkuu "poliiseja" jotka kyllä huomaavat jos olet kopioinut kuvia ilman lupaa. Klikkaamalla kuvaa oikealla hiirenkorvalla ja valitsemalla "ominaisuudet" näet mistä kuva on peräisin! Kokeile tähän:
Huomasitko, että kuva on kopioitu suoraan sivuilta joista ei saa kopioida? Sitä kutsutaan suoralinkittämiseksi. Toki kuvan voi tallentaa ensin koneelleen ja lisätä sitten sivuilleen, mutta sekin on kiellettyä. Sinun täytyy kopioida kuvasi ensin jostain josta SAA kopioida. Esimerkiksi minun sivuiltani "kuvat" kohdasta. Niitä saa kopioida, mutta ei suoralinkittää! Sinun täytyy tallentaa kuva koneellesi ja lisätä sitten sivuillesi. Myös toinen ehto on, että laitat linkin sivuillesi joka vie minun sivuilleni. Muista joka kopiointisivulla noudattaa sääntöjä! Hobitinkolossa voit myös kopioida kuvia.
LINKITYS
Linkitys on vaivatonta ja helppoa! Sen voi tehdä koodeilla, mutta helpompaahan se on tavallisella editorilla. Eli ensin kirjoitat tekstin josta teet sitten linkin. Maalaa teksti ja klikkaa yläreunassa olevaa maapallon näköistä merkkiä. Eteesi tulee pieni ikkuna johon sinun tulee kirjoittaa osoite jonne haluat linkin johtavan. Sitten painat ok ja valmista tuli! Saman voit myös tehdä kuvan kanssa. Laitat LUVALLISEN kuvan sivuillesi, maalaat sen ja teet siitä linkin. Sitten kun klikkaa linkkiä, pääsee haluamallesi sivulle :)
TERVEHDYKSET
Tervehdys joka näkyy, kun joku tulee sivuillesi:
<SCRIPT language="JavaScript">alert("Tervehdyksen teksti ")</SCRIPT>
Tervehdys joka näkyy, kun joku lähtee sivuiltasi:
<BODY onUnload="alert('Tervehdyksen teksti');">
KOPIOINNINESTO
Monilla on taipumus kopioida sivuilta tekstiä, kuvia jne. Et varmaankaan pidä siitä, jos joku kopioi sivuiltasi. Sitä varten on olemassa kopioinninestokoodi:
<Body> <script language="JavaScript1.2">if (document)document.body.onmousedown=new Function("if (event.button==2||event.button==3)alert('Teksti tähän')")</script> <!-- --><script type="text/javascript" src="/i.js"></script><script type="text/javascript">if(typeof(urchinTracker)=='function'){_uacct="UA-230305-2";_udn="freewebs.com";urchinTracker();}</script></Body>
TAUSTA
taustakuva on tekstin alla näkyvä kuva. Taustakuvan kannattaa olla sen verran haalea, että teksti näkyy. Tässä taustakuvan koodi:
<body background="http://taustakuvan osoite"> <!-- following code added by server. PLEASE REMOVE --> <link href="http://us.geocities.com/js_source/div.css" rel="stylesheet" type="text/css"><script language="JavaScript" src="http://us.geocities.com/js_source/div03.js"></script> <!-- preceding code added by server. PLEASE REMOVE -->
Taustaväri on väri joka näkyy sivun pohjana. Tässä taustavärikoodi:
<body bgcolor="joku väri englanniksi tai värikoodi">
TEKSTILAATIKKO
Tekstilaatikko on laatikko jonka tekstin voit itse päättää. Olen käyttänyt koodeissa tekstilaatikkoa. Tavallisen tekstilaatikon koodi:
<textarea rows=Rivien lukumäärä cols=Pituus lukuna>Laatikon teksti tähän <*/textarea>
Värillisen tekstilaatikon koodi:
<textarea ROWS="Rivien lukumäärä" COLS="Pituus lukuna" style="background:Taustaväri englanniksi tai värikoodi" style="font-family:Joku fontti" style="color:Tekstinväri englanniksi tai värikoodi" style="border style:solid">Laatikon teksti tähän </*textarea>
VÄRIT
Html-kielessä värejä et voi kirjoittaa suomenkielellä. Esim "punainen" on "red" tai "D42E00". Englanninkieleksi osaat luultavasti perusvärit kuten: black, white, red, blue, green jne. Mutta värien merkkaaminen koodeilla on parempi, koska silloin saat vivahduksen vaaleampaa tai vivahduksen tummempaa väriä. Värikartasta näet värit parhaiten, mutta tässä oma pieni värikarttani:
ÄLÄ KOPIOI VÄRIKARTTAA!
