Hızlandırılmış Mobil Sayfalar (Google AMP) Doğru Web Tasarım


Warning: Invalid argument supplied for foreach() in /home/dogruwebtasarim/public_html/uygulama/gorunumler/kurumsal2/icerik.php on line 22
Google'ın en son teknolojisi olan hızlandırılmış mobil sayfalar yani google amp sisteminden haberiniz varmı? Eğer yoksa veya az bir bilgiye sahipseniz bu makale size sitenizi geliştirmek için oldukça önemli bilgiler katacak.

Hızlandırılmış Mobil Sayfalar ( Google AMP ) nedir?



Bilirsiniz ki mobil kullanıcıları düşük hızda ( standart bağlantı 3g ) internete bağlandıkları için web sitesi 3 saniyeden fazla bekleten web sitelerinden hemen çıkarlar. Bunun böyle olduğunu çoğumuz kendimizden biliriz. Google "2020 yılına kadar dünya genelinde hücresel ağ bağlantılarının %70'i 3G veya daha düşük hızlarda gerçekleşecek" diye bir varsayımda bulunmuş. Bu sebepten dolayı web sitelerinin oldukça hızlı açılabilmesi için Google, AMP ( Accelerated Mobile Pages ) projesini geliştirdi. HTML'den farklı bir işaretleme diline sahip olan bu AMP işaretleme dilini javascript kodları sayesinde işler hale getirmiş. Bu sebepten dolayı önce kendine özel javascript kütüphaneyi yükleyip, sonrasında kodları çalıştırabiliyorsunuz.


Hızlandırılmış Mobil Sayfalar ( Google AMP ) nasıl kullanılır?



Örnek AMP sayfası kodu;
<!doctype html>
<html amp lang="tr">
  <head>
    <meta charset="utf-8">
    <script async src="https://cdn.ampproject.org/v0.js"></script>
    <title>Merhaba, DWT</title>
    <link rel="canonical" href="http://example.ampproject.org/article-metadata.html">
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
    <script type="application/ld+json">
      {
        "@context": "http://schema.org",
        "@type": "NewsArticle",
        "headline": "Open-source framework for publishing content",
        "datePublished": "2015-10-07T12:02:41Z",
        "image": [
          "logo.jpg"
        ]
      }
    </script>
    <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
  </head>
  <body>
    <h1>Hoşgeldiniz</h1>
  </body>
</html>



Sitenizin AMP versiyonunu Google'a bildirmek için;
​<link rel="amphtml" href="https://dogruwebtasarim.com/amp/" />
Amp versiyonu ile oluşturulmuş sayfanızın kaynağını bildirmek için?
<link rel="canonical" href="https://dogruwebtasarim.com" />

Ayrıca AMP ile ilgili herşeyi resmi sayfasından inceleyebilirsiniz: https://www.ampproject.org/tr/



Google AMP ile ilgili kafanıza takılan veya merak ettiğiniz sorular varsa iletişime geçerek bilgi alabilirsiz.

Google amp uyumlu bir siteye sahip olmak isterseniz web tasarım paketlerimizden birini satın alabilirsiniz.
css ile mobil uyumlu site google hızlı site indexleme mobil uyumlu site kontrolü mobil uyumlu sohbet sitesi mobil uyumlu site nedir