Bu belgede, web sitenizde veya uygulamanızda Google ile oturum açma düğmesini nasıl göstereceğinizle ilgili yönergeler verilmektedir. Uygulama doğrulama sürecini tamamlamak için web siteniz veya uygulamanız bu yönergelere uymalıdır.
Google Kimlik Hizmetleri SDK'larımız, her zaman en son Google markalama kurallarına uyan bir Google ile oturum aç düğmesi oluşturur. Bunlar, Google ile oturum açma düğmesini web sitenizde veya uygulamanızda göstermek için önerilen yöntemdir. Google tarafından oluşturulan düğme seçeneğini kullanamadığınız durumlarda bir HTML düğme öğesi oluşturabilir, önceden onaylanmış markalama öğelerimizi indirebilir veya isteğe bağlı olarak özel bir Google ile oturum açma düğmesi oluşturabilirsiniz.
HTML düğme öğesini oluşturma
Google ile oturum aç düğmesinin görünümünü özelleştirmenize olanak tanıyan bir HTML yapılandırıcı sunuyoruz. Ardından, web sitenizde düğmeyi oluşturacak bir HTML ve CSS snippet'i indirebilirsiniz.HTML düğme öğesi oluşturma
Önceden Onaylanmış Marka Simgelerini İndirme
Özel resim düğmesi kullanmak yerine, tüm platformlar için PNG ve SVG biçimlerinde sunulan, ö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 |
|
Standart büyük açık temalı dikdörtgen Google ile oturum açma düğmesi |
| Koyu |
|
Standart koyu temalı, hap şeklinde Google ile oturum açma düğmesi |
Desteklenen Düğme Modları
| Açık |
|
|
| Koyu |
|
|
| Normal |
|
|
Özel bir Google ile oturum açma düğmesi oluşturma
Google kullanıcılarının Google markasını daha kolay tanımlamasını sağladığı için Google Kimlik Hizmetleri SDK'larımızı veya önceki bölümlerde ele alınan diğer seçeneklerden herhangi birini kullanmanız önemle tavsiye edilir. Kullanıcılar bir işlem düğmesini ne kadar kolay tanımlayabilirse düğmeyle etkileşim kurma olasılıkları da o kadar artar.
Ancak düğmeyi uygulama tasarımınıza uyacak şekilde uyarlamanız gerekiyorsa aşağıdaki yönergelere uyun.
Boyut
Düğmeyi farklı cihazlar ve ekran boyutları için gerektiği gibi ölçeklendirebilirsiniz ancak Google logosunun gerilmemesi için en boy oranını korumanız gerekir.
Metin
Kullanıcıları düğmeyi tıklamaya teşvik etmek için harekete geçirici mesaj metni olarak "Google ile oturum açın", "Google ile kaydolun" veya "Google ile devam edin" ifadelerini kullanmanızı öneririz. Bu metnin uygulamanızın veya web sitenizin diline uygun şekilde yerelleştirilmesi, daha iyi bir kullanıcı deneyimi sunmak için izin verilen ve teşvik edilen bir uygulamadır. Kullanıcı, uygulamanızda Google kimlik bilgileriyle oturum açtığını veya uygulamanıza kaydolduğunu, uygulamanızda Google Hesabı'na kaydolmadığını ya da Google Hesabı'nı kaydettirmediğini net bir şekilde anlamalıdır.
Renk
Düğmelerin varsayılan durumu aşağıda gösterilmiştir. Düğmede her zaman Google "G"sinin standart rengi bulunmalıdır.
| Tema | Örnek | |
|---|---|---|
| Açık |
|
Dolgu: #FFFFFF Kontur: #747775 | 1 piksel | iç Yazı tipi: #1F1F1F | Roboto Medium | 14/20 |
| Koyu |
|
Dolgu: #131314 Kontur: #8E918F | 1 piksel | iç Yazı tipi: #E3E3E3 | Roboto Medium | 14/20 |
| Normal |
|
Dolgu: #F2F2F2 Kontur: Kontur yok Yazı tipi: #1F1F1F | Roboto Medium | 14/20 |
Yazı tipi
Düğme yazı tipi, TrueType yazı tipi olan Roboto Medium'dur. Yüklemek için önce Roboto yazı tipini indirin ve indirilen paketi açın. Mac'te Roboto-Medium.ttf dosyasını çift tıklayın, ardından "Install Font"u (Yazı Tipini Yükle) 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çın" düğmesindeki Google logosu
Metinden bağımsız olarak Google "G" logosunun boyutunu veya rengini değiştiremezsiniz. Standart renkli sürüm olmalı ve beyaz arka planda görünmelidir. Kendi özel boyutlu Google logonuzu oluşturmanız gerekiyorsa indirme paketinde yer alan logo boyutlarından herhangi biriyle başlayın.
Yanlış düğme tasarımı
 Yapılacaklar Düğme sınırı ve renk şeması için Google Material 3 tasarım kurallarını kullanın. |
 Yapılmaması gerekenler Kullanıcı işlemini belirtmek için düğme sınırı ve metin olmadan yalnızca Google simgesini veya logosunu kullanın. |
 Yapılacaklar Koyu, açık ve nötr modlarda Google simgesi için Google'ın marka rengini kullanın. |
 Yapılmaması gerekenler Düğme için Google "G" harfinin tek renkli versiyonlarını kullanın. |
 Yapılacaklar Erişilebilirlik ve eşit önem için doğru renk modundaki düğmeyi seçin. |
 Yapılmaması gerekenler Standart Google "G" simgesini açık, koyu veya nötr olmayan renkli bir arka plana yerleştirin. |
 Yapılacaklar Sabit dolgu ve boyuta sahip Google "G" simgesini kullanın. |
 Yapılmaması gerekenler Düğme için kendi simgenizi oluşturun. |
 Yapılacaklar Gerekirse işlem düğmesi için Google "G"sini tek başına kullanın. |
 Yapılmaması gerekenler Google ile oturum açma işlemini belirtmek için düğmede "Google" terimini tek başına kullanın. |
Google ile Oturum Açma Markalama En İyi Uygulamaları
Google ile oturum açma ve diğer üçüncü taraf oturum açma seçenekleri
Google ile oturum açma düğmesi, diğer üçüncü taraf oturum açma seçenekleri kadar belirgin bir şekilde gösterilmelidir. Ö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 isteyecekseniz bunu artımlı yetkilendirme (Android, iOS, web) ile yapın. Kullanıcıdan yalnızca API erişimi gerektiren bir özellikle etkileşime girmeye başladığında yetkilendirme isteyin.
YouTube kapsamları istiyorsanız YouTube düğmesi kullanın.
Google Play Games hizmetlerini kullanıyorsanız Google Play Games hizmetleri markalama kurallarına da göz atın.
Google markalarının, açıkça bu belgenin kapsamına girmeyen yollarla kullanılması için Google'dan önceden yazılı izin alınması gerekir (daha fazla bilgi için Google Marka Özelliklerinin Üçüncü Taraf Kullanım Kuralları'na bakın).