Optimizați site-urile web pentru utilizare cu smartphone-uri și tablete

Pe măsură ce tot mai mulți utilizatori accesează online și navighează pe site-uri web pe smartphone-uri și tablete, devine din ce în ce mai important să-și optimizeze propria pagină de pornire pentru utilizare cu smartphone-uri și tablete. Vă oferim câteva informații și linkuri care vă pot ajuta să vă adaptați site-ul existent (dacă acesta nu este deja optimizat pentru utilizarea mobilă). Există, de asemenea, sfaturi pentru noii veniți la acest subiect.

Implementarea unei pagini de pornire pentru computerele desktop, precum și pentru smartphone-uri și tablete este asociată cu unele dificultăți:

site-urile

Motorul de căutare Google are un articol interesant pe tema internetului mobil și modul în care utilizarea smartphone-urilor și tabletelor ne schimbă viața sub tema „Momente de decizie sau, în engleză, micro-momente”. În esență este vorba despre faptul că Internetul ne ajută de sute de ori pe zi în momente foarte mici, de ex. când căutăm ceva pe smartphone-ul nostru, în timp ce ne uităm la televizor, urmărim postările de pe Twitter cu hashtagul corespunzător sau căutăm rapid un preț pe Amazon într-un magazin de vânzare cu amănuntul pentru o comparație imediată a prețurilor. Aceste micro-momente schimbă complet modul în care acționăm.

Dacă doriți să testați dacă site-ul dvs. web este optimizat pentru tablete și smartphone-uri, puteți face acest lucru pe Google: google.com/webmasters/tools/mobile-friendly/?hl=de. Google oferă un alt test la testmysite.withgoogle.com/intl/de-de - acesta este puțin mai detaliat decât primul test.

La atelierul de proiectare web, vă puteți testa site-ul web pentru afișare pe smartphone-uri, tablete și PC-uri desktop: web-designwerkstatt.de/url_test.html. La cerere, atelierul de proiectare web va pregăti o ofertă gratuită pentru adaptarea site-urilor web la dispozitivele mobile. Numai fișierele CSS sunt modificate, conținutul rămâne neafectat.

În cele ce urmează, vă vom arăta diverse soluții posibile pentru optimizarea site-urilor web pentru dispozitive mobile:

Exemplu de pagină de pornire HTML5 receptivă simplă

Ca exemplu pentru o pagină de pornire HTML5 receptivă, am dezvoltat un șablon mic care ar trebui să îndeplinească aproape toate cerințele pentru un site web modern, ușor de utilizat și receptiv. Vedem site-ul ca un „obiect de învățare” și așteptăm cu nerăbdare sfaturi și sugestii de îmbunătățire în următorul fir al forumului: homepage-forum.de/showthread.php?t=60227. Puteți găsi starea actuală a șablonului paginii de pornire HTML5 aici: Meine-erste-homepage.com/html5_webseitenvorlage/index.php. Șablonul de site web HTML5 receptiv poate fi descărcat și ca fișier zip: Meine-erste-homepage.com/html5_webseitenvorlage/responsive-html5-webseiten-vorlage.zip

Utilizarea unui kit de construcție a site-ului web, care este, de asemenea, optimizat pentru dispozitivele mobile

Cea mai simplă modalitate de a crea un site web optimizat pentru smartphone-uri, tablete și computere desktop este cu siguranță utilizarea unui kit de construcție a site-ului care include această optimizare în mod implicit. Puteți întreține cu ușurință conținutul site-ului web, de ex. pe computerul desktop din browser, utilizatorii pot accesa oricând tot conținutul cu ușurință și ușor cu smartphone, tabletă și desktop PC. O astfel de platformă oferă de ex. Jimdo, Alfahosting sau 1 & 1 cu pagina de pornire DO-IT-YOURSELF:

  • www.jimdo.de - la Jimdo.de puteți crea o pagină de pornire fără cunoștințe de HTML cu un constructor de pagini de pornire. Există un pachet gratuit și diverse pachete profesionale - în versiunile plătite de ex. de asemenea, cu propriul domeniu.
  • 1 & 1 Ionos MyWebsite - site-ul meu 1 & 1 este un CMS complet găzduit, incluzând domeniu, adresă de e-mail, carte de oaspeți, contor de vizitatori și multe altele. Puteți alege dintre diferite modele, de ex. pentru varianta privată pentru nașterea copilului dvs., pentru o nuntă etc. Veți găsi multe șabloane industriale pentru varianta companiei. 1 și 1 Ionos MyWebsite este, de asemenea, optimizat pentru smartphone-uri și tablete! Construiți-vă pagina de pornire foarte ușor (chiar și fără cunoștințe anterioare) cu 1 & 1 Ionos MyWebsite.

alfahosting.de - cu kitul de construcție a site-ului web de la Alfahosting.de vă puteți crea site-ul în șapte pași simpli.

Cu toate acestea, un constructor de site-uri web nu este pentru toată lumea. Prin urmare, mai multe opțiuni de mai jos.

Utilizarea unei extensii Dreamweaver

Ne-am confruntat cu sarcina de a crea un site web pentru pepinieră Helmers, care este optimizat în principal pentru smartphone-uri. Odată cu introducerea etichetelor cu imagini ale plantelor cu coduri QR în vânzări, informațiile relevante trebuiau, de asemenea, să fie accesibile prin intermediul internetului mobil. Deoarece plantele sunt vândute în centrul de grădină și se presupune că clientul își folosește smartphone-ul acolo pentru a citi codul QR, site-urile web trebuiau, de asemenea, să fie proiectate în mod optim pentru acest lucru.

Deoarece folosim Dreamweaver doar pentru a crea site-urile noastre web și am avut deja experiențe pozitive cu Project Seven ca furnizor de extensii Dreamweaver bune, o extensie a projectseven.com a intrat în discuție la implementarea proiectului. Iată o prezentare generală a ceea ce credem că sunt cele mai bune extensii Dreamweaver pentru crearea de site-uri web responsive și instrumente de ajutor excelente:

  • Armonie: projectseven.com/products/tools/hmy/index.htm - un instrument excelent pentru a construi site-uri web responsive cu Dreamweaver.
  • Zeitgeist: projectseven.com/products/templates/pagepacks/zeitgeist/index.htm - construiți un site web receptiv cu Dreamweaver - cu pachetul de pagini PVII se poate face cu un singur clic - șablonul site-ului web este gata. Tot ce trebuie să faceți este să ajustați conținutul - atât. Demonstrații
  • Mecanici: projectseven.com/products/templates/pagepacks/typecrafters/index.htm un alt pachet de pagini PVII. Demonstrații
  • armoniu: projectseven.com/products/templates/pagepacks/harmony/harmonium/index.htm - un alt pachet de pagini PVII. Demonstrații
  • Meniu adaptiv Magic: projectseven.com/products/menusystems/amm/index.htm - un sistem de meniu de navigare complet receptiv. Demonstrații
  • Galeria de artă Magic: projectseven.com/products/galleries/agm/index.htm - o galerie de imagini - complet responis și foarte elegant. Demonstrații

Am dori să recomandăm trei șabloane:
Un șablon simplu, fără efecte: on-mouseover.de/templates/hp02/index.html, un șablon cu multe efecte (imagine cu ecran complet receptiv/transparență prin CSS-rgba/meniu de comutare/animații CSS precum „cutremur”, „ Rotire "," Distorsiune "," Decolorare "," Efect glisant "): on-mouseover.de/templates/hp33/index.html, un șablon cu" animații pentru cadre cheie "(prezentare de imagini și prezentare de text): on- mouseover.de/templates/hp26/index.html

Alte site-uri web cu informații despre optimizarea site-urilor web pentru utilizare pe dispozitive mobile:

Știm că suntem chiar la începutul dezvoltării atunci când vine vorba de optimizarea site-urilor web pentru smartphone-uri și tablete. Prin urmare, cerem tuturor cititorilor care au legături și sfaturi pentru noi să ni le trimită, de exemplu în câmpul de comentarii următor puțin mai jos. Alternativ, ne puteți trimite informațiile prin secțiunea noastră de pagină de abonare.

Ați găsit o eroare pe site-ul nostru? Anunțați-ne pentru a putea remedia eroarea!