XHTML/CSS-opas 2008-01-26 14:24

(X)HTML-merkkauskieli ja CSS-tyylit ovat internet-julkaisemisen perustekniikoita, ja lähes jokainen avaamasi sivu välitetään selaimellesi näillä kielillä kerrotussa muodossa. Näistä XHTML-kieltä käytetään verkkosivun rakenteen merkkaamiseen (otsikot, kappaleet, linkit...), CSS-tyylejä taas sivun ulkoasun muotoilemiseen (lihavoinnit, väritykset...).

Vaikka nykyiset julkaisujärjestelmät (kuten WordPress) mahdollistavat helpon sivustojen pystyttämisen ilman koodaustaitoja (ne siis kirjoittavat koodia käyttäjän puolesta), on niissäkin XHTML- ja CSS-taidoilla mahdollista tehdä omia, julkaisujärjestelmän valmiista toiminnoista poikkeavia ratkaisuja. Lisäksi sivujen koodailu on aika hauskaa ja helppoa – jos tietokoneella haluaa tehdä teknisessä mielessä jotain peruskäyttöä syvempää, tästä on hyvä alkaa.

Tässä XHTML/CSS-oppaassa opetellaan verkkosivun tekeminen alusta alkaen, sivuston julkaisuun asti. Löydät aiheet sivupalkin valikosta. Alussa yleisesti web-standardeista, työkaluista ja työskentelystä. Tämän jälkeen omissa osioissaan yksityiskohtaisemmin XHTML-merkkausta ja CSS-tyylejä. Ohjeet-kohdassa syventävää tietoa ja käyttöesimerkkejä, ja lopuksi tietoa julkaisemiseen liittyvistä asioista.

Tarvittaessa voit edetä yksinkertaisten harjoitusten mukaan. Katso myös HY:n Valtiotieteellisen tiedekunnan kevään 2007 harjoitusohjelma luentoesimerkkeineen.

Uusimmat verkkojulkaisulinkit

Sekalainen kokoelma viimeisimpiä vastaan tulleita verkkosivujen tekemiseen liittyviä sivuja.

#8678 Google Font Directory 22.5.2010 via

http://code.google.com/webfonts

Google hostaa web-fontteja CSS3:n @font-face-ominaisuudelle.

web design CSS CSS3 font font-face typografia Google

#8534 Top 25 Most Dangerous Programming Errors 18.2.2010

http://cwe.mitre.org/top25/

Ohjelmointivirheiden teknistä esittelyä.

web tvt ohjelmointi tietoturva vianmääritys bugi development

#8521 The Definitive Guide To Styling Web Links 13.2.2010

http://www.smashingmagazine.com/2010/02/13/the-definitive-guide-to-styling-web-links/

Linkkien CSS-määrittelyn perusteita

web CSS linkki

#8507 Vector Social Media Icons 8.2.2010

http://icondock.com/free/vector-social-media-icons

Sosiaalisen median kuvakkeita vektorigrafiikoina.

web sosiaalinen media web2.0 vektori grafiikka kuvake

#8493 H.264 video codec stays royalty-free for HTML5 testers 4.2.2010

http://www.theregister.co.uk/2010/02/04/mpeg_la_h_264_codec_licence/

web video codec H.264 patentti HTML5

#8492 Color Theory For Designers, Part 2: Understanding Concepts And Terminology 2.2.2010

http://www.smashingmagazine.com/2010/02/02/color-theory-for-designers-part-2-understanding-concepts-and-terminology/

web design väri

#8433 The Case Against Vertical Navigation 11.1.2010

http://www.smashingmagazine.com/2010/01/11/the-case-against-vertical-navigation/

web navigointi

#8428 Techniques for Mastering cURL 9.1.2010

http://net.tutsplus.com/tutorials/php/techniques-and-resources-for-mastering-curl/

web PHP cURL HTTP

#8425 Lahjoita 5.1.2010

http://oikeusjakohtuus.blogspot.com/2010/01/lahjoita.html

web lahjoitus lupa

#8392 How to produce XHTML 1.0 Strict markup with TinyMCE 28.12.2009

http://www.newmediacampaigns.com/page/how-to-produce-xhtml-10-strict-markup-with-tinymce

Oikeaa ja siistiä XHTML:ää TinyMCE:llä! (Jostain syystä br tulee silti html-tyyliin..?)

web TinyMCE hack WYSIWYG editor XHTML CMS Word bugi

Lisää linkkejä haulla web