Bu dokümanda, web sitenizde veya uygulamanızda Google ile oturum aç düğmesinin nasıl gösterileceğine dair yönergeler yer almaktadır. Web siteniz veya uygulamanız, uygulama doğrulama sürecini tamamlamak için bu yönergelere uymalıdır.
Google Kimlik Hizmetleri SDK'larımız, her zaman en güncel Google markalama yönergelerine uygun olan bir Google ile oturum aç düğmesi oluşturur. Bunlar, web sitenizde veya uygulamanızda Google ile oturum aç düğmesini görüntülemek için önerilen yöntemdir. Google tarafından oluşturulan düğme seçeneğini kullanamadığınız durumlarda HTML düğme öğesi oluşturabilir, önceden onaylanmış marka varlıklarımızı indirebilir veya isteğe bağlı olarak özel bir Google ile oturum aç düğmesi oluşturabilirsiniz.
HTML Düğmesi Öğesi Oluştur
Google ile oturum aç düğmesinin görünümünü özelleştirmenize olanak tanıyan bir HTML yapılandırıcısı sunuyoruz. Daha sonra, web sitenizdeki düğmeyi oluşturacak bir HTML ve CSS snippet'i indirebilirsiniz.HTML Düğmesi Öğesi Oluştur
Ön Onaylı Marka Simgelerini İndirin
Özel resim düğmesi kullanmaya alternatif olarak, tüm platformlar için PNG ve SVG biçimlerinde sağlanan önceden onaylanmış Google ile oturum açma düğmelerimizi indirebilirsiniz.Sağlanan resim düğmeleri standart ve simge modlarında kullanılabilir ve aşağıdaki stil seçeneklerini içerir:
- Tema : Açık, Nötr, Koyu
- Şekil : Dikdörtgen, Hap
Tema | Düğmeler | Açıklama |
---|---|---|
Açık renk |
|
Standart, büyük ışık temalı dikdörtgen Google ile oturum açma düğmesi |
Koyu renk |
|
Standart koyu temalı hap şeklindeki Google ile oturum aç düğmesi |
Desteklenen Düğme Modları
Açık renk |
|
|
Koyu renk |
|
|
Normal |
|
|
Özel bir Google ile Oturum Açma Düğmesi oluşturun
Google Kimlik Hizmetleri SDK'larımızın veya önceki bölümlerde ele alınan diğer seçeneklerden herhangi birinin kullanılması, Google kullanıcılarının Google markasını daha kolay tanımasını sağladığı için kesinlikle önerilir. Kullanıcılar bir işlem düğmesini ne kadar kolay tanımlayabilirse düğmeyle etkileşimde bulunma olasılıkları da o kadar artar.
Ancak düğmeyi uygulamanızın tasarımına uyacak şekilde uyarlamanız gerekirse aşağıdaki yönergelere uyun.
Boyut
Düğmeyi farklı cihazlar ve ekran boyutları için gereken şekilde ölçeklendirebilirsiniz, ancak Google logosunun genişletilmemesi için en boy oranını korumanız gerekir.
Metin
Kullanıcıları düğmeyi tıklamaya teşvik etmek için "Google ile oturum aç", "Google ile kaydol" veya "Google ile devam et" gibi harekete geçirici mesaj metinlerini öneririz. Kullanıcı, uygulamanızda bir Google hesabına kaydolduğunu veya Google kimlik bilgileriyle uygulamanıza kaydolduğunu, Google kimlik bilgileriyle değil, Google Hesabı'na kaydolduğunu açıkça anlamalıdır.
Renk
Düğmelerin varsayılan durumu aşağıda gösterilmiştir. Düğme, her zaman Google "G" için standart rengi içermelidir.
Tema | Örnek | |
---|---|---|
Açık renk |
|
Dolgu: #FFFFFF Çizgi: #747775 | 1 piksel | iç Yazı tipi: #1F1F1F | Roboto Medium | 14/20 |
Koyu renk |
|
Dolgu: #131314 Çizgi: #8E918F | 1 piksel | iç Yazı tipi: #E3E3E3 | Roboto Medium | 14/20 |
Normal |
|
Dolgu: #F2F2F2 Fırça: Çizgi yok Yazı tipi: #1F1F1F | Roboto Medium | 14/20 |
Yazı tipi
Düğme yazı tipi, bir TrueType yazı tipi olan Roboto Medium'dur. Yüklemek için önce Roboto yazı tipini indirin ve indirme paketinin sıkıştırmasını açın. Mac'te Roboto-Medium.ttf'yi çift tıklayıp "Yazı Tipi Yükle"yi tıklayın. Windows'da, dosyayı "Bilgisayarım" > "Windows" > "Yazı Tipleri" klasörüne sürükleyin.
Dolgu
Android |
|
iOS |
|
Web (mobil + masaüstü) |
|
Referans |
|
"Google ile oturum aç" düğmesindeki Google logosu
Metinden bağımsız olarak, Google "G" logosunun boyutunu veya rengini değiştiremezsiniz. Bu, standart renkli sürüm olmalı ve beyaz arka plan üzerinde görünmelidir. Kendi özel boyutlu Google logonuzu oluşturmanız gerekiyorsa indirme paketinde yer alan logo boyutlarından herhangi biriyle başlayın.
![Google G simgesi](https://developers-dot-devsite-v2-prod.appspot.com/static/identity/images/g-logo.png?authuser=8&hl=tr)
Hatalı düğme tasarımı
![]() Yapılması gerekenler Düğme sınırı ve renk şeması için Google Materyal 3 tasarım yönergelerini kullanın. |
![]() Yapılmayacaklar Google simgesini veya logosunu düğmenin sınırı olmadan ve kullanıcının işlemini belirten metin olmadan tek başına kullanın. |
![]() Yapılması gerekenler Koyu, açık ve nötr modlarda Google simgesi için Google marka rengini kullanın. |
![]() Yapılmayacaklar Düğme için Google "G" harfinin tek renkli sürümlerini kullanın. |
![]() Yapılması gerekenler Erişilebilirlik ve eşit belirginlik için doğru renk modunda düğmeyi seçin. |
![]() Yapılmayacaklar Standart renkli Google "G" simgesini açık, koyu veya nötr dışındaki renkli bir arka plan üzerine yerleştirin. |
![]() Yapılması gerekenler Sabit dolgu ve boyuta sahip Google "G" harfini kullanın. |
![]() Yapılmayacaklar Düğme için kendi simgenizi oluşturun. |
![]() Yapılması gerekenler Gerekirse işlem düğmesi için yalnızca Google "G"yi kullanın. |
![]() Yapılmayacaklar Google ile oturum açma işlemini temsil etmek için düğmede tek başına "Google" terimini kullanın. |
Google Marka Bilinci Oluşturma En İyi Uygulamaları ile oturum açma
Google ile oturum açma ve diğer üçüncü taraf oturum açma seçenekleri
Google ile oturum aç düğmesi en az diğer üçüncü taraf oturum açma seçenekleri kadar belirgin bir şekilde görüntülenmelidir. Örneğin, düğmeler yaklaşık olarak aynı boyutta olmalı ve benzer görsel ağırlığa sahip olmalıdır.
Diğer Kurallar
Ek kapsamlar talep ederseniz bunu artımlı yetkilendirme (Android, iOS, web) ile yapın. Yalnızca kullanıcı API erişimi gerektiren bir özellikle etkileşim kurmaya başladığında yetkilendirme isteyin.
YouTube kapsamlarını isterseniz bir YouTube düğmesi kullanın.
Google Play Games hizmetlerini kullanıyorsanız Google Play oyun hizmetleri markalama kurallarına da bakın.
Google markalarının bu belgede açıkça belirtilmeyen şekillerde kullanımına, Google'dan önceden yazılı izin alınmadan izin verilmez (daha fazla bilgi için Google Marka Özelliklerinin Üçüncü Taraf Kullanım Kuralları'na bakın).