Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
Comment: Migrated to Confluence 4.0

I. Getting started with mobile web development

1. Introduction to mobile web development
2. Set up your mobile web development environment

II. The syntax of mobile web

3. Mobile markup languages
4. Device awareness and content adaptation
5. Adding interactivity with javascript and ajax

III. Advanced mobile web development techniques

6. Mobile web usability
7. Enhancing mobile web pages for smartphone browsers

IV. Deploying into the mobile ecosystem

8. Optimizing mobile markup
9. Validating mobile markup
10. Testing a mobile web site
11. Deploying a mobile web site
12. How to play well in the mobile ecosystem
13. The future of the mobile web

Luin kirjasta lähinnä kuutosluvun, joka käsittelee mobiilin internetin käytettävyyttä ja esittelee muutamia esimerkkisivustoja mobiilisivuista. Kirja on ylipäätään erittäin kattava teos mobiilisivustojen tekijöille, kuitenkin ehkä enemmän suunnattu aloitteleville koodaajille ja tiettyyn asiaan apua kaipaaville. Esimerkiksi Javascriptistä ja AJAXista löytyy kattavasti koodiesimerkkejä.

Mobiilikäytettävyydellä mitataan sitä, kuinka helppoa (tai vaikeaa) käyttäjän on olla vuorovaikutuksessa internetin kanssa mobiilin päätelaitteen kanssa. Luku käsittelee muutamia esimerkkejä isoista sivustoista mobiiliversioina ja neuvoo käytäntöjä ja antaa vinkkejä hyvään mobiiliin käyttöliittymään.

Kun aletaan suunnittelemaan mobiilia sivustoa, on hyvä pitää mielessä päätelaitteen koko ja sen käyttötavat. Pieniä laitteita käytetään usein hyvin tiedossaolevaan toimintoon, esimerkiksi yrityksen yhteystietojen etsimiseen. Käyttöpaikat ovat usein tienpäällä, julkisissa liikennevälineissä tai töissä. Keskittyminen sivustoon on hyvin lyhyt aika.

Luvussa käsitellään esimerkkeinä Bank of American, CNN:n, Flickrin ja Wikipedian sivustoja. Näistä kaikista esitellään sekä työpöytäversio että mobiiliversio. Niistä käy hyvin ilmi, kuinka yksinkertaistettua informaatiota mobiilisivustoilla tulisi olla.

Mobiililaitteiden selaimet ovat keskenään hyvin erilaisia. Resoluutiot vaihtelevat aina 240x320 pikselistä 960x640 pikseliin. Luvussa esitellään myös monia erilaisia sivustopohjien esimerkkejä, kuinka ne voidaan näyttää selaimessa.

Neuvoja mobiilisivustojen tekemiseen:

  • Käyttäjälähtöisyys: tiedä miksi käyttäjät vierailevat sivustolla, ja rakenna mobiilin ominaisuudet tukemaan tätä syytä. 
  • Aloita perusversiosta vanhemmille puhelimille, jonka jälkeen lisää ominaisuuksia älypuhelimille ja uudemmille laitteille. 
  • Luo vain kaksi versiota mobiilista, toinen vanhemmille malleille ja toinen älypuhelimille. Älypuhelinversion voi optimoida suurelle skaalalle laitteita
  • Pidä navigaatio maksimissaan kolmessa tasossa. Käyttäjät vierailevat sivustoilla hyvin lyhyen aikaa, mahdollista nopeat navigoinnit
  • Käytä mobiiliversion osoitteena alidomainia "m", http://m.website.com/
  • Muista testata sivusto sekä pystyssä, että vaakatasossa ja oikeilla laitteilla. Myös latausnopeudet eri yhteyksillä kannattaa huomioida
  • Laita dynaamista sisältöä etusivulle, jotta etusivulle saapuminen on aina mielenkiintoista
  • Optimoi kaikki kuvat sivuston oikealle koolle
  • Laita näkyville linkki sivuston kokoversioon
  • Vältä seuraavia: pop-up -ikkunat, kursorin hover-menut, automaattiset sivun päivitykset, automaattiset uudelleensijoittamiset (redirect), linkit ulkopuolisille sivustoille, vaakasuuntainen vieritys ja kehykset