Layout pentru notițele ipad novice

În unul dintre proiecte am avut un TK: un aspect adaptabil pentru iPad. Firește, nu știam cum să încep, nici cum să abordăm această problemă.

Layout pentru notițele ipad novice

Primul pas a fost intervievat Yandex, dar nici un rezultat de căutare (Yandex - o Yandex, mi-a pus o mulțime de sugestii cu privire la aspectul, ci despre cum să fl odelat proprii -. Nu este un cuvânt). Google ma ajutat. el a dat aproape imediat o mulțime de informații utile, dar faptul că toate informațiile necesare au fost colectate într-un singur articol dintr-o dată, pe care mi se pare că nu am găsit (poate, desigur, inestetice). Deci informațiile trebuiau colectate în bucăți, aici și acolo. Prin urmare, sa născut ideea de a scrie un articol în care s-ar descrie toate dificultățile pe care le-am întâlnit în procesul de lucru. Nu-i sfaturi chiar si pentru incepatori, ci mai degrabă pachete în prezent pe payamti în primul rând, dintr-o dată, dacă încă rula în această problemă în viitor.







Primii pași

Mai întâi de toate, scriem următoarele metaetichete (pentru afișarea corectă pe ipad, într-adevăr nevoie):

De asemenea, am avut de a stabili lățimea conținutului prin stilurile din , altfel nu a funcționat :(

În fișierul de stil (chiar la sfârșit), scriem stiluri pentru iPad:

Cu stiluri portret, trebuie să fii mai atent, pentru că de exemplu, iPhone-ul recunoaște exact dispozitivul cu o lățime maximă: 768 de pixeli și, prin urmare, chiar și în poziție orizontală prezintă versiunea descendentă a site-ului. A trebuit să elimin aceste stiluri, pentru că era rău.







Ce trebuie să testez?

Pe ipad :) Este clar să o verificați (este convenabil să faceți clic pe link-uri cu degetul și să vedeți dacă toate elementele sunt vizibile în mod clar)

Dar ce să faceți dacă nu este la îndemână (și prietenii nu pot împrumuta)?

Am curățat internetul pentru emularea emulatorului, aici sunt cele mai comune soluții.

Personal, am încercat să lucrez cu versiunea gratuită a programului Electric Mobile Simulator (de la Electric Plum). Convenabil, frumos, funcționează cu localhost. Dar. rezultatul pe aipad nu a fost așa, din păcate.

Ca rezultat, am decis o variantă de lucru în Safari sub Windows în mediul dezvoltatorului. Foarte, foarte convenabil, și există un program de depanare a codului (nu firebug, desigur, dar și puternic). Aici, în acest articol, "Safari Web Inspector" descrie în detaliu modul în care acest mod de dezvoltare este inclus și testat. de la mine voi adăuga doar pentru a vedea rezultatul real pe monik mare, este necesar să "stoarce" fereastra browser-ului la dimensiunea dorită - și, ura! totul este frumos vizibil. Și cel mai important, totul pe iPad real este afișat.

Layout pentru notițele ipad novice

Mai multe sfaturi practice:

Latimea ferestrei la aypad este de 1024x768 pixeli, dar prin experienta se arata ca este necesar sa se faca 1019 pixeli (latura scroll). Dacă încerci pe un computer obișnuit, cu un safari obișnuit, atunci, din păcate, are o derulare normală de 17 pixeli. Acest lucru trebuie amintit și faceți o marjă de 5 pixeli, atunci totul va fi frumos.

Layout pentru notițele ipad novice

Nu uita colțurile rotunjite (ele nu trebuie sa, propria lor safari „retezate off“, trebuie doar să le amintesc și nu a pus înapoi textul sau ceva atât de ovazhnoe).







Articole similare

Trimiteți-le prietenilor: