Arhive lunare: decembrie 2011

Metode de promovare

Cum sa optimizezi site-ul tau pentru mobile

Exista doar cateva lucruri care trebuie sa le faceti, in scopul de a optimiza site-ul dvs. pentru vizualizarea pe mobil. Procesul este simplu, si implica doar adaugarea unui simplu cod HTML in site-ul dvs. Va trebui sa adaugati codul pentru (1) mobil CSS, (2) un meta tag viewport si (3) iconita apple.

Acest articol explica pe scurt fiecare element si cum sa adaugi codul HTML in pagina unui site.

Mobile CSS

Mobile CSS va permite sa schimbati modul in care site-ul dvs. este organizat si afisat pe dispozitive mobile. La fel cum poti avea o versiune prietenoasa pentru imprimanta a site-ului, puteti avea si o versiune CSS pentru mobil.

Daca site-ului ii lipseste Mobile CSS, trebuie sa adaugati urmatoarea linie de cod la sectiunea <head> din site-ul dumneavoastra.

<link rel=”stylesheet” href=”http://ipsum.ro/mobile.css&#8221; type=”text/css” media=”handheld” />

Meta Viewport Tag

Meta tag-ul viewport spune unui dispozitiv mobil cum sa orienteze pagina, atunci cand este incarcat. De asemenea, determina daca o pagina poate fi redimensionata mai mult sau mai putin sau in cazul in care ar trebui sa se roteasca atunci cand utilizatorul roteste dispozitivul mobil.

Daca site-ului dvs. ii lipseste un meta tag viewport, trebuie sa adaugati urmatoarea linie de cod la sectiunea <head> din site-ul dumneavoastra.

<meta name=”viewport” content=”width=device-width,initial-scale=1,user-scalable=no” />

Apple Icons

Daca site-ului ii lipseste iconita Apple iPhone si iconita iPad, va trebui sa se faca doua lucruri. In primul rand, proiectati o pictograma de 57×57 pixeli pe care sa o utilizati pentru iPhone-ul Apple si una pentru pictograma iPad si incarcatile in managerul de fisiere ale site-ul. In al doilea rand, se adauga LINK-ul catre pictograma nou creata in linia de cod de mai jos.

Daca site-ului dvs. ii lipseste iconita apple, trebuie sa adaugati urmatoarea linie de cod la sectiunea <head> din site-ul dumneavoastra.

<link rel=”apple-touch-icon” href=”/iconita-apple.png” />

Related post: