Web Siteni Mobil Responsive Yapma Kodlar─▒

Cepten girenlerin say─▒s─▒ ├ž─▒─č gibi b├╝y├╝d├╝─č├╝ bu g├╝nlerde web sitesi olanlar─▒n, mobil uyumlu siteler kervan─▒na kat─▒lma zaman─▒ gelmi┼č demektir.Ayr─▒ca mobil tema deste─či olan siteler arama motorlar─▒nca ├Ânemsendi─či i├žin s─▒ralamada ├Âncelik veriliyor.Son zamanlarda Responsive tema ├Ân plana ├ž─▒kt─▒─č─▒ i├žin k─▒saca bu konu hakk─▒nda bilgi vermek istiyorum.

Responsive Tasar─▒m Nedir

Responsive Tasar─▒m Nedir?

Responsive Tasar─▒m:
Kullan─▒c─▒n─▒n girdi─či ekran boyutlar─▒na uyumlu tasar─▒mlard─▒r. Yani siz tablet,telefon bilgisayardan girdi─činizde o cihaza uyumlu hale gelen, yap─▒lan tasar─▒m ekrana tam olarak oturan ┬átasar─▒mlard─▒r.
Responsive tasar─▒m 3 a┼čamada yap─▒l─▒r.
Bilgisayar ekranlar─▒na uyumlu responsive tasar─▒m
Tablet boyutlar─▒na uyumlu responsive tasar─▒m
Telefon boyutlar─▒na uyumlu responsive tasar─▒m

Mobil Site H─▒z Testi

Mobil Site H─▒z Testi Nas─▒l Yap─▒l─▒r?

Mobil sitenizin h─▒z─▒n─▒ test etmek art─▒k ├žok kolay.┬átestmysite.withgoogle.com/intl/tr-tr/
sayfas─▒na site ismini yazarak mobil h─▒z─▒n─▒ ve uyumlulu─čunu analiz edebiliyorsunuz.

Bedava Sitem Kullan─▒c─▒lar─▒na Mobil Site Deste─či

Bedava Sitem Kullan─▒c─▒lar─▒na Mobil Site Deste─či Veriyor

Benim sitenin uzant─▒s─▒ gibi sonu tr.gg ile biten b├╝t├╝n sitelerde mobil uyum deste─či var.E─čer kullan─▒c─▒lar isterse mobil site k─▒sm─▒n─▒ kendileri de ├Âzelle┼čtirebilirler.

Bedava Sitem Mobil Teman─▒n ilgili ID ve CLASS etiketleri ┼čunlard─▒r. Bu etiketleri kullanarak BS mobil tasar─▒m─▒ ├Âzelle┼čtirebilirsiniz. ─░lgili CSS kodlamalar─▒n─▒z─▒ Tasar─▒m > Mobil Tasar─▒m > Bir alt sayfan─▒n i├žerik metni (├Ârne─čin CSS kodu kullan─▒labilir) b├Âl├╝m├╝ne yerle┼čtirmelisiniz.
Etiketler ┼čunlard─▒r:

.ui mobile .ui header { }┬á─░sminden de anlayaca─č─▒n─▒z ├╝zere en ├╝stteki men├╝ ve sitenin isminin de yer ald─▒─č─▒ yatay alan.┬á
.ui-footer-fixed { }┬áYine isminden de anlayaca─č─▒n─▒z ├╝zere en alttaki bazen reklamlar─▒n yer ald─▒─č─▒ yatay alan.┬á
.ui-body-c { }┬áveya┬á.ui-overlay-c { }┬áMobil tasar─▒m─▒n v├╝cudu, yani s─▒kl─▒kla arkaplan─▒ bo┼čluklar─▒ ayarlamak i├žin kullan─▒lan etiket.┬á
.ui-content { }┬áMobil tasar─▒mda sayfa i├žeriklerinizin yer ald─▒─č─▒ alan.┬á
#nav-panel { } Sol taraftaki menü panelinin etiketi. 
.ui-link-inherit { }┬áMen├╝de yer alan linkler i├žin d├╝zenleme yapabilece─činiz etiket.┬á
#add-form { }┬áSa─č taraftaki + butonuna t─▒klay─▒nca a├ž─▒lan alan.┬á

Not: Kodlama bilgim olmad─▒─č─▒ i├žin ├Ârnek kodlama i├žin d├Ân├╝┼č bekliyorum.

isacotur Blog Mobil Site G├Âr├╝n├╝m├╝

isacotur Blog Mobil Site G├Âr├╝n├╝m├╝

Accelerated Mobile Pages AMP

Accelerated Mobile Pages (AMP) Nedir?

GoogleÔÇÖ─▒n Ekim 2015ÔÇÖte a├ž─▒klad─▒─č─▒ ÔÇťH─▒zland─▒r─▒lm─▒┼č Mobil Sayfalar ProjesiÔÇŁ (Accelerated Mobile Pages Project k─▒sa ad─▒yla┬áAMP) yo─čun mobil ─░nternet kullan─▒c─▒lar─▒nda etkin hale gelmeye ba┼člad─▒.

Accelerated Mobile Pages, yani H─▒zland─▒r─▒lm─▒┼č Mobil Sayfalar sayesinde google┬ákullan─▒c─▒ taraf─▒nda daha h─▒zl─▒ y├╝klenerek mobil ─░nternet kullan─▒c─▒ deneyimini art─▒rmay─▒ hedefler.K─▒saca┬ámobil sayfalar─▒n daha h─▒zl─▒ a├ž─▒lmas─▒n─▒ sa─člayabilecek kodlama y├Ântemidir. Google AMP y├Ânergelerine uygun ve do─črulanm─▒┼č sayfalar Google ├Ânbelle─činde saklamaya devam eder.

AMP Ne Gibi Faydalar Sa─člar?

Mobil bazl─▒┬áorganik trafik┬áve daha y├╝ksek reklam d├Ân├╝┼č├╝m performans─▒ ├Ân plana ├ž─▒k─▒yor. AMP projesini uygulamaya ba┼člayarak ziyaret├žilerinizi tekrar kazanmay─▒ deneyebilirsiniz. ├ľzellikle mobil cihaz kullan─▒c─▒lar─▒n─▒ h─▒zl─▒ a├ž─▒lan metin reklamlar ├Ân plana ├ž─▒k─▒yor.

Mobil uyumlulu─čun bir s─▒ralama fakt├Âr├╝ oldu─čunu d├╝┼č├╝n├╝rsek, AMP kullan─▒m─▒ yayg─▒nla┼čt─▒k├ža Google AMP versiyonuna sahip sayfalar─▒ daha ├╝st s─▒rada g├Âstermek i├žin algoritmas─▒ ile sizde ├╝st s─▒ralarda olabilirsiniz.

Web sitenizin AMP Hatalar─▒na Nereden Bak─▒l─▒r?

Web sitenizin veya sitenizde bulunan bir sayfan─▒n amp g├Âr├╝n├╝m├╝ merak ediyorsan─▒z yapman─▒z gereken ┼čey linkin sonuna /amp yaz─▒p enter tu┼čuna basman─▒z yeterlidir.

Bu yaz─▒n─▒n amp g├Âr├╝n├╝m├╝ ┼ču ┼čekildedir.

https://isacoturoglu.com.tr/code/mobil-responsive-yapma-kodlari.html/amp

Ayr─▒ca sitenizde olu┼čan ve fark─▒nda olmad─▒─č─▒n─▒ AMP hatalar─▒n─▒ ise google tools uygulamas─▒nda arama b├Âl├╝m├╝ k─▒sm─▒ i├žinde bulunan h─▒zland─▒r─▒lm─▒┼č mobil sayfalar k─▒sm─▒ndan takip edebilirsiniz.

Web sitenizin AMP Hatalar─▒na Nereden Bak─▒l─▒r

Google 1 Sayfada Çıkmak

GOOGLE 1. SAYFADA ÇIKMAK

Google 1. sayfada ├ž─▒kmak┬ái├žin kendi denedi─čim ve ├žok ba┼čar─▒l─▒ sonu├žlar ald─▒─č─▒m ve bir ├žok web sitesinde olmayan o ├žok ├Âzel detaylar─▒ sizlerle de payla┼č─▒yorum.Detaylar i├žin ┼ču linke t─▒klayabilirsiniz.
https://isacoturoglu.com.tr/code/google-1-sayfada-cikmak.html