Yhteystiedot:
Tukitiimin sähköposti:
verkko-opetus@cs.helsinki.fi |
(X)HTML editorit
(X)HTML-dokumenttien tuottaminenPeriaatteessa (X)HTML-dokumentteja voi kirjoittaa melkein millä tahansa tekstieditorilla. Varsinaisia, eri ominaisuuksilla varustettuja editoreja verkkosivujen luomiseen ja hallintaan on kuitenkin kehitetty varsin mittava määrä. Usein ns. ammattikäyttöön soveltuviksi mainitaan Macromedian Dreamweaver ja Aboben GoLive. Edellä esitellyt soveltuvatkin graafikkojen ja multimediasuunnittelijoiden yleistyövälineiksi, niiden sisältämien monipuolisten ominaisuuksien vuoksi. Kyseisten editorien etuna on se, että ne mahdollistavat eri mediaelementtien ja niiden eri formaattien monipuolisen käsittelyn ja hallinnan. Kuitenkin nämä ns. WYSIWYG-editorit saattavat aiheuttaa monenlaisia ongelmia eri selaimilla ja kirjoitettaessa XHTML-dokumentteja. Useimmissa editoreissa on sisäänrakennettu validaattori, mutta se ei aina toimi niin kuin pitäisi. Tuotetut sivut onkin hyvä käyttää jonkin ulkopuolisen validaattorin läpi (alla lista) ja tarkastaa, että ne on kirjoitettu rakenteellisesti oikein. Esimerkiksi nämä sivut on toteutettu noudattaen XHTML 1.0 transitionalia. Monet uusimmat tekstinkäsittelyyn tarkoitetut ohjelmat osaavat muuttaa tuotetun dokumentin suoraan HTML-muotoon. Tosin tuotettu koodi ei välttämättä ole kovin hyvää. Lisäksi on tarjolla myös monia ohjelmia HTML-kielisen dokumentin muuttamiseen XHTML-kieliseksi. WYSIWYG-editoritDreamweawerMacromedian Dreamweawer MX2004 on ns. WYSIWYG-editori. Dreamweawer MX2004 on varsin helppokäyttöinen ja monipuolinen. Siinä on kolme erillistä sivujen muokkaustilaa. Pelkkä koodinäkymä, suunnittelunäkymä ja näiden yhdistelmä. Dreamweaverissa on myös sisäänrakennettu FTP-asiakas. Helsingin yliopiston Dreamweaver MX-opetussivusto (huom. MX2004 sisältää paljon uudistuksia MX-versioon) GoLiveAdobe GoLive CS on Adoben vastine Macromedian Dreamweaverille. ilmaiset (X)HTML editoritMozillan sisäänrakennettu editori Composer (Ctrl + 4) HTML - Kit on ilmainen, helppo ja varsin monipuolinen tekstieditori sivujen luomiseen. ValidaattoritW3C:n validaattori W3C Markup Validation Service Kotimainen LeHTori validaattori Web Design Groupin validaattorilista WDG Kattava lista eri validaattoreista Muita työkalujaW3C:n Css validaattori CSS Validation Service W3C:n (rikkinäisten) linkkien tarkistaja Link Checker Lynx Viewer tarjoaa näkymän, siitä miltä sivusto näyttää tekstipohjaisella Lynx-selaimella Writer2LaTeX on ohjelma, jolla voi muuttaa OpenOffice-dokumentin XHTML- tai LaTex muotoon. Ohjelma löytyy OpenOffice projektilistalta HTML-tidy on ohjelma koodin siistimiseen esim. tekstinkäsittelyohjelmasta HTML-muotoon käännöksissä. Watchfiren Bobby esteettömyyden tarkistukseen Muutamia vinkkejä XHTML-dokumenttien laadintaanElementtien nimet aina pienellä esim. <p> oikein <P> väärin
Elementit on aina myös suljettava tyyliin aloittava tagi <p> tekstiä </p> lopettava tagi Sisäkkäisten elementtien on oltava rakenteeltaan hyvinmuodostettuja <p><i>kappale ja kursiivi </i></p> oikein <p><i>kappale ja kursiivi </p></i> väärin
LinkkejäDigitaalisen median tekniikat -kurssin materiaalit (Harri Laine, kevät 2004) W3Schools HTML Tutorial ja XHTML Tutorial HTML Dog on hyvä ja kattava opas HTML:n ja CSS:n saloihin. Ohjeet on jaoteltu eri taitotasoille. ZenGarden - The Beauty of CSS Design Verkkosivujen saavutettavuudestaVerkkosivut jokaiselle sopiviksi - esteettömien Web-sivujen tekemisenopas (Tieke) Käytettävyysasiantuntija Jakob Nielsenin kotisivut (artikkeleja, ohjeita ja suosituksia) Web-saavutettavuuden 1-2-3 (W3C Suomen toimisto) Essi - Esteetön sisällöntuotanto on erittäin kattava sivusto, jonka tuottamisessa on ollut mukana suuri tekijätiimi (Jyu) |