Google Markalama Kuralları ile oturum açma

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
Aşağıda iki örnek verilmiştir:
Tema Düğmeler Açıklama
Açık renk Standart, büyük ışık temalı dikdörtgen Google ile oturum açma düğmesi örneği Standart, büyük ışık temalı dikdörtgen Google ile oturum açma düğmesi
Koyu renk Koyu renk temalı hap şeklindeki Google ile oturum açma düğmesi örneği Standart koyu temalı hap şeklindeki Google ile oturum aç düğmesi
Önceden Onaylanmış Marka Simgelerini indirin

Desteklenen Düğme Modları

Açık renk

açık renkli yuvarlak şekilli Google ile oturum açma düğmesi

açık temalı kare şekilli Google ile oturum açma düğmesi

ışık temalı hap şeklindeki Google ile oturum aç düğmesi

Google ile oturum aç düğmesi açık temalı dikdörtgen şekilli

Koyu renk

koyu temalı yuvarlak şekilli Google ile oturum açma düğmesi

koyu temalı kare şekilli Google ile oturum aç düğmesi

koyu temalı hap şeklindeki Google ile oturum aç düğmesi

koyu temalı dikdörtgen şekilli Google ile oturum aç düğmesi

Normal

nötr temalı yuvarlak şekilli Google ile oturum açma düğmesi

Nötr temalı kare şekilli Google ile oturum açma düğmesi

Google ile oturum aç düğmesi olan nötr temalı hap şeklinde hap

Google ile oturum aç düğmesi, nötr temalı dikdörtgen şekilli

Ö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 ışık temalı hap şeklindeki Google ile oturum aç düğmesi Dolgu: #FFFFFF
Çizgi: #747775 | 1 piksel | iç
Yazı tipi: #1F1F1F | Roboto Medium | 14/20
Koyu renk koyu temalı hap şeklindeki Google ile oturum aç düğmesi Dolgu: #131314
Çizgi: #8E918F | 1 piksel | iç
Yazı tipi: #E3E3E3 | Roboto Medium | 14/20
Normal Google ile oturum aç düğmesi olan nötr temalı hap şeklinde hap 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 Google logosundan önce 12 piksel sol dolgu, Google logosundan sonra 10 piksel sağ dolgu ve Google ile oturum aç metninden sonra 12 piksel sağ dolgu
iOS Google logosundan önce 16 piksel sol dolgu, Google logosundan sonra 12 piksel sağ dolgu ve Google ile oturum aç metninden sonra 16 piksel sağ dolgu
Web (mobil + masaüstü) Google logosundan önce 12 piksel sol dolgu, Google logosundan sonra 10 piksel sağ dolgu ve Google ile oturum aç metninden sonra 12 piksel sağ dolgu
Referans Google ile oturum açma düğmesi dolgu 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

Hatalı düğme tasarımı

marka bilinci oluşturma görkemli şeyler ve yapılmayacaklar resim örneği
Yapılması gerekenler

Düğme sınırı ve renk şeması için Google Materyal 3 tasarım yönergelerini kullanın.

marka bilinci oluşturma görkemli şeyler ve yapılmayacaklar resim örneği
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.

marka bilinci oluşturma görkemli şeyler ve yapılmayacaklar resim örneği
Yapılması gerekenler

Koyu, açık ve nötr modlarda Google simgesi için Google marka rengini kullanın.

marka bilinci oluşturma görkemli şeyler ve yapılmayacaklar resim örneği
Yapılmayacaklar

Düğme için Google "G" harfinin tek renkli sürümlerini kullanın.

marka bilinci oluşturma görkemli şeyler ve yapılmayacaklar resim örneği
Yapılması gerekenler

Erişilebilirlik ve eşit belirginlik için doğru renk modunda düğmeyi seçin.

marka bilinci oluşturma görkemli şeyler ve yapılmayacaklar resim örneği
Yapılmayacaklar

Standart renkli Google "G" simgesini açık, koyu veya nötr dışındaki renkli bir arka plan üzerine yerleştirin.

marka bilinci oluşturma görkemli şeyler ve yapılmayacaklar resim örneği
Yapılması gerekenler

Sabit dolgu ve boyuta sahip Google "G" harfini kullanın.

marka bilinci oluşturma görkemli şeyler ve yapılmayacaklar resim örneği
Yapılmayacaklar

Düğme için kendi simgenizi oluşturun.

marka bilinci oluşturma görkemli şeyler ve yapılmayacaklar resim örneği
Yapılması gerekenler

Gerekirse işlem düğmesi için yalnızca Google "G"yi kullanın.

marka bilinci oluşturma görkemli şeyler ve yapılmayacaklar resim örneği
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).