World AIDS
VOTACI
DONAZIONE
AIUTACI A CRESCERE:
DONAZIONE LIBERÀ
DONAZIONE LIBERÀ
MENU
Flusso 
I postatori più attivi del mese
| Nessun utente |
GUIDA per Creare un sito web per l'iPhone
Pagina 1 di 1
GUIDA per Creare un sito web per l'iPhone
Da florin88 Mer Dic 08, 2010 11:08 pm
Così come ogni altro browser, Safari ha bisogno dell'usuale codice HTML e non c'è alcun pericolo nell'inserire alcune keyword nella pagina, poichè Google sarà perfettamente in grado di ispezionare la pagina. Inoltre ci sono alcuni meta tag specifici per l'iPhone che si possono usare per controllare il modo in cui la pagina viene resa. Ecco un esempio qui sotto.
Le linee 3-6 dicono a Safari che il viewport dovrebbe avere la stessa dimensione del display dell'iPhone (si veda questa pagina per maggiori informazioni sul viewport). Di solito il display dell'iPhone agisce come una finestra in cui la pagina web diventa il suo sfondo. Questo codice forza il contenuto ad adattarsi al display dell'iPhone.
La linea 4 serve per la creazione di icone utili per il bookmarking del sito. L'immagine dovrebbe essere in formato PNG di dimensioni pari a 57px per 57px. Non è necessario aggiungere luminosità o angoli poichè lo farà già per noi l'iPhone.
La linea 10 esegue una funzione javascript ogni qual volta si ruota il dispositivo. Se ne discuterà più in là nell'articolo.
Disposizione del contenuto
Prima di addentrarci nei mandri dei fogli di stile e di javascript abbiamo bisogno di predisporre i contenitori per i vari stati in cui si terrà il dispositivo.
Prima di tutto abbiamo bisogno di un contenitore che ingloberà tutto il contenuto della pagina. Questo servirà anche allo script javascript per cambiare dinamicamente la classe di questo contenitore.
In seguito si può mettere un logo, giusto per mostrare del contenuto che sarà visibile a prescindere dall'orientamento dell'iPhone.
Infine abbiamo i vari DIV che fungeranno a loro volta da contenitori. Sebbene al momento l'iPhone supporti solamente l'orientamento sinistro, destro e verticale, c'è l'opportunità che possa supportare il capovolgimento. Ogni area è unica in quanto ha un suo ID e avranno lo stile display:none e display:block. A parte ciò, probabilmente è meglio evitare qualsiasi altra cosa più sofisticata dell'utilizzo di sfondi colorati o con immagini e delle dimensioni.
LA GUIDA CONTINUA QUI
- Codice:
1: <head>2:<title>Engage Interactive</title>
3:<meta name="viewport" 4:content="width=device-width; 5:initial-scale=1.0; 6:maximum-scale=1.0;"> 7:<link rel="apple-touch-icon" 8: href="images/template/engage.png"/>9: </head>10: <body onorientationchange="updateOrientation();">11:</body>
Le linee 3-6 dicono a Safari che il viewport dovrebbe avere la stessa dimensione del display dell'iPhone (si veda questa pagina per maggiori informazioni sul viewport). Di solito il display dell'iPhone agisce come una finestra in cui la pagina web diventa il suo sfondo. Questo codice forza il contenuto ad adattarsi al display dell'iPhone.
La linea 4 serve per la creazione di icone utili per il bookmarking del sito. L'immagine dovrebbe essere in formato PNG di dimensioni pari a 57px per 57px. Non è necessario aggiungere luminosità o angoli poichè lo farà già per noi l'iPhone.
La linea 10 esegue una funzione javascript ogni qual volta si ruota il dispositivo. Se ne discuterà più in là nell'articolo.
Disposizione del contenuto
Prima di addentrarci nei mandri dei fogli di stile e di javascript abbiamo bisogno di predisporre i contenitori per i vari stati in cui si terrà il dispositivo.
- Codice:
01.<div id="page_wrapper">
02. <h1>Engage Interactive</h1>
03. <div id="content_left">
04. <p>You are now holding your phone to the left</p>
05. </div>
06. <div id="content_right">
07. <p>You are now holding your phone to the right</p>
08. </div>
09. <div id="content_normal">
10. <p>You are now holding your phone upright</p>
11. </div>
12. <div id="content_flipped">
13. <p>This doesn't work yet.</p>
14. </div>
15.</div>
Prima di tutto abbiamo bisogno di un contenitore che ingloberà tutto il contenuto della pagina. Questo servirà anche allo script javascript per cambiare dinamicamente la classe di questo contenitore.
In seguito si può mettere un logo, giusto per mostrare del contenuto che sarà visibile a prescindere dall'orientamento dell'iPhone.
Infine abbiamo i vari DIV che fungeranno a loro volta da contenitori. Sebbene al momento l'iPhone supporti solamente l'orientamento sinistro, destro e verticale, c'è l'opportunità che possa supportare il capovolgimento. Ogni area è unica in quanto ha un suo ID e avranno lo stile display:none e display:block. A parte ciò, probabilmente è meglio evitare qualsiasi altra cosa più sofisticata dell'utilizzo di sfondi colorati o con immagini e delle dimensioni.
LA GUIDA CONTINUA QUI
florin88- Admin
- Numero di messaggi : 7128
Data d'iscrizione : 18.12.08
Età : 36
Località : Ca' Savio bronx (VE) -
Argomenti simili» Come creare un sito web online gratis senza conoscere html???
» Guida per Creare VideoGame -VideoGiochi in FLASH
» Guida l'auto travestito da etilometro, polizia lo arresta per guida in stato di ebbrezza
» Suggerimenti per il sito
» Come creare le targhette con photoshop CS4???
» Guida per Creare VideoGame -VideoGiochi in FLASH
» Guida l'auto travestito da etilometro, polizia lo arresta per guida in stato di ebbrezza
» Suggerimenti per il sito
» Come creare le targhette con photoshop CS4???
Pagina 1 di 1
Permessi in questa sezione del forum:
Non puoi rispondere agli argomenti in questo forum.
