Võrgurakendused I: ülesanne 1

Ülesandeks on valmistada põhjalikud isiklikud koduleheküljed.

Sisu nõuded

• Juttu ja võimaluse korral (ei ole kohustuslik) pilte enda kohta.
• Valik vähemalt viiest hästistruktureeritud ja mugavast saidist, mida tasuks ise tegemisel eeskujuks võtta (lingid).
• Valik vähemalt viiest paremast html- ja javaskripti-õppematerjalist võrgus. Valige ainult neid, mis teile endale tundusid praktilised ja head (lingid).
• Kaks pikemat teksti, mis on css-i abil viisakalt kujundatud (mh vasak ja parem äär) ning mis on varustatud kogu aeg nähtavate linkide või nuppudega teksti suuremaks/väikemaks muutmiseks: The Garden of Forking Paths ning The Hollow Men

Tehnilised nõuded

• Fondid, vahed, suurused jne tuleb määrata CSS-ga, mitte font tagidega!
• Pealkirja, menüüde jne fondid olgu sans tüüpi, pikemad tekstid serifiga.
• Kasutatud fondid peavad olema varustatud nn fall-back fondiga (sans, sans-serif, monospace).
• Ei kasutata platvormispetsiifilisi fonte (näiteks Times New Roman).
• Kasutada võib ainult utf-8 kooditabelit (charset).
• Leheküljed peavad olema varustatud kooditabeli definitsiooniga.
• Elemendid tuleb paigutada CSS-iga, mitte tabelitega ega center tagiga.
• Vähemalt ühes kohas peab olema kasutatud tabelit.
• Vähemalt ühes kohas peab olema kasutatatud lehekülje jaotamist CSS-iga.
• Vähemalt ühes kohas peab olema javascriptiga dünaamiliselt muudetav pilt.
• Kõik kasutatavad värvid peavad olema piisavalt kontrastsed, et läbida WCAG2.0 nõuded. Praktikas tähendab see seda, et kõik tausta ja teksti värvide kombinatsioonid peavad siia kalkulaatorisse (http://juicystudio.com/services/luminositycontrastratio.php) toksides andma tulemuseks AAA. Terve CSSi korraga läbi närimiseks võib kasutada ka seda tööriista: http://juicystudio.com/services/csstest.php . Viisakate värvipaaride leidmisel aitab ka see leht: http://snook.ca/technical/colour_contrast/colour.html
• Menüüd peavad olema tehtud CSS-iga kujundatud listidest, vt http://www.seoconsultants.com/css/menus/tutorial/, http://css.maxdesign.com.au/listamatic/ ja http://www.webcredible.co.uk/user-friendly-resources/css/css-navigation-menu.shtml
• Lehekülje kujundus peab olema dünaamiline (nn liquid layout):
  • Fondi suuruse muutmine (mõistlikkuse piires) ei tohi lehte koledaks või kasutamatuks teha
  • Brauseri akna suuruse muutmine (mõistlikkuse piires) ei tohi lehte koledaks või kasutamatuks teha
  • Akna suuruse muutmisel peab muutuma (kaasa venima) lehekülje "kasulik osa", mitte tühjad servad.
  • Vaata:
    • http://www.maxdesign.com.au/presentation/liquid/
    • http://www.oswd.org/files/designs/2839/lazydays/
    • http://www.cssliquid.com/
• Kõik html ja css failid peavad läbima puhtalt W3C validaatori (http://validator.w3.org).
• Lehekülg peab töötama korralikult vähemalt Firefoxi ja Internet Exploreri, soovitatavalt ka Opera ja Safari (või Konquerori) uusimate versioonidega. Iganenud brauserite tugi ei ole kohustuslik.

Visuaalse stiili/tekstide juures arvesta hetkel in olevate stiilipõhimõtete ja klassikaliste teksti-struktuuri soovitustega. Visuaalseid ideid saab võtta ka põhjade (templates) kogumikest http://www.openwebdesign.org/ ja http://www.oswd.org/ või isegi zen garden'st.

NB! Ole ettevaatlik, nendes saitides leidub ka vanemat tüüpi mitte-skaleeruvaid lahendusi.

Kui tõesti endast ei oska kirjutada, siis tee kodulehekülg oma kassist, koerast või mis iganes lemmikloomast järgides kõiki siin lehel toodud sisu ja tehnilisi nõudeid. Mingid suvalised "kunagi kellelegi tehtud" koduleheküljed arvesse EI LÄHE.