Tasarım Rehberi

Anlık Bildirimler: Görsel ve Video

Medya anlık bildirimleri için görseller Ne adımında görüntünün URL’si girilerek Android Medya URL’si ve iOS Medya URL’si metin alanlarına ayrı ayrı eklenebilir veya medya dosyaları cihazdan yüklenebilir. gif ve video biçimlendirilmiş medya anlık bildirimleri yalnızca iOS cihazları tarafından desteklenir.

Medya Ekle

Görsel	iOS	Android
Dosya türleri	Önerilen: jpg, jpeg, png, gif	Önerilen: jpg, jpeg, png
Çözünürlük	Önerilen: 2:1 en-boy oranında yatay  Yaygın Boyutlar: 512x256px   1440x720px Min. Genişlik: 300 piksel Maks. Genişlik: 4096 piksel	Önerilen: 2:1 en-boy oranında yatay  Yaygın Boyutlar: 512x256px   1440x720px Min. Genişlik: 300 piksel Maks. Genişlik: 2000 piksel

iOS Medya URL’si için Desteklenen Video Dosya Türleri

Video biçimli medya anlık bildirimleri yalnızca desteklenir iOS cihazları için.

Video	Desteklenen dosya türleri	Maksimum boyut
Video	MPEG MPEG-2 MP4 AVI	5 MB

Netmera Widget Görsel Boyutları

Widget’lar için ideal görsel boyutunu belirlemek esnek bir süreçtir; çünkü widget’larınız farklı çözünürlük ve boyutlara uyacak şekilde özelleştirilebildiğinden katı gereksinimler yoktur. Uygun görsel boyutunu kullanabilirsiniz; widget’lar istenen boyutlara göre ayarlanmış çözünürlüklerle hazırlanabilir.

Tam Genişlikte Görsel Widget’lar için İpuçları:

Tam genişlikte bir görünüm tercih ediyorsanız, widget boyutunu görsel boyutuna eşitleyerek widget boyutunu görsel boyutuyla hizalamak uygun bir yaklaşım olabilir. Bu esneklik, widget görsellerini özel ihtiyaçlarınıza göre uyarlamanızı sağlar.

Anlık Bildirim Stilleri

1. Tarayıcı Simgesi Manifest içinde başlangıçta tanımlanan ve tekil mesajlar için düzenlenemeyen simge.

2. Başlık 30 karakter (kısaltmadan önce).

3. Bildirim Zamanı Bildirim ne kadar eski olduğunu gösterir.

4. Uygulama Adı Web Uygulaması Manifesti’nde kayıtlı uygulama adı (düzenlenemez).

5. Mesaj Metni 120-150 karakter (kısaltmadan önce).

Web Push

macOS Monterey için Chrome

a. Tarayıcı Simgesi Chrome simgesi. Bu değiştirilemez.

b. Başlık 60-80 karakter ile sınırlıdır.

c. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

d. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil). Genişletildiğinde büyür.

e. İçerik 120-150 karakter ile sınırlıdır.

f. Eylem Düğmeleri En fazla 2 düğmeyi destekler.

Karakter sınırlamalarının, bir simgenin varlığına ve kullanılan karakterlere bağlı olarak değiştiğini unutmayın.

macOS Monterey için Firefox

a. Tarayıcı Simgesi Firefox simgesi. Bu değiştirilemez.

b. Başlık 60-80 karakter ile sınırlıdır.

c. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

d. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil). Genişletildiğinde büyür.

e. İçerik 120-150 karakter ile sınırlıdır.

f. Eylem Düğmeleri En fazla 2 düğmeyi destekler.

Karakter sınırlamalarının, bir simgenin varlığına ve kullanılan karakterlere bağlı olarak değiştiğini unutmayın.

macOS Monterey için Safari

a. Simge Bu bir kez ayarlanır ve tek tek mesajlar için değiştirilemez. 256×256 olmalıdır. PNG, JPG, GIF (animasyonlu değil).

b. Başlık 60-80 karakter ile sınırlıdır.

c. İçerik 120-150 karakter ile sınırlıdır.

Windows 11 için Chrome

a. Banner Görseli 360×180 veya 2:1 en-boy oranı. PNG, JPG, GIF (animasyonlu değil).

b. Tarayıcı + Tarayıcı Simgesi Değiştirilemez.

c. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

d. Eylem Düğmeleri En fazla 2 düğmeyi destekler.

e. Daha Fazla Seçenek Bildirim ayarlarını ve odak yardımını içerir.

f. Kapat Bildirimi kapatır.

g. Başlık 60 karakter ile sınırlıdır.

h. İçerik 120 karakter ile sınırlıdır.

i. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

Windows, hem banner görselinin hem de simgenin gösterildiği görseller için en geniş ekran alanını sunar.

Windows 11 için Microsoft Edge

a. Banner Görseli 360×180 veya 2:1 en-boy oranı. PNG, JPG, GIF (animasyonlu değil).

b. Tarayıcı + Tarayıcı Simgesi Değiştirilemez.

c. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

d. Eylem Düğmeleri En fazla 2 düğmeyi destekler.

e. Daha Fazla Seçenek Bildirim ayarlarını ve odak yardımını içerir.

f. Kapat Bildirimi kapatır.

g. Başlık 60 karakter ile sınırlıdır.

h. İçerik 120 karakter ile sınırlıdır.

i. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

Windows 11 için Firefox

a. Tarayıcı + Tarayıcı Simgesi Değiştirilemez.

b. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

c. Daha Fazla Seçenek Bildirim ayarlarını ve odak yardımını içerir.

d. Kapat Bildirimi kapatır.

e. Başlık 60 karakter ile sınırlıdır.

f. İçerik 120 karakter ile sınırlıdır.

g. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

Windows 11’de Firefox’un, Chrome ve Edge’deki gibi bir banner görseli veya eylem düğmeleri olmadığını unutmayın.

Android 12 için Chrome

a. Rozet 72×72 veya daha büyük. Şeffaf arka planlı beyaz olmalıdır. PNG.

b. Başlık 50 karakter ile sınırlıdır.

c. Gövde 150 karakter ile sınırlıdır.

d. Büyük Görsel 1024×512 veya 2:1 en-boy oranı. PNG, JPG, GIF (animasyonlu değil).

e. Tarayıcı Değiştirilemez.

f. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

g. Zaman Damgası Mesajın alındığı zaman.

h. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

i. Eylem Düğmeleri En fazla 2 düğmeyi destekler.

Mobil Push

iOS 15 Yerel

a. Uygulama Simgesi Uygulamanın varsayılan simgesini kullanır ve değiştirilemez.

b. Zengin Medya 1024×1024 veya 1:1 en-boy oranı. PNG, JPG, GIF, MP4, MP3, WAV.

c. Başlık 25-50 karakter ile sınırlıdır.

d. Zaman Damgası Mesajın alındığı zaman.

e. Mesaj 150 karakter ile sınırlıdır.

f. Eylem Düğmeleri En fazla 4 düğmeyi destekler.

iOS ayrıca altyazı desteğine sahiptir. Android’den farklı olarak iOS’ta şu anda web push desteği yoktur, ancak iOS web push desteğinin yakında gelebileceğini düşünüyoruz.

Android 12 Yerel

a. Küçük Simge Tüm cihaz boyutlarına uyacak şekilde 24×24 – 96×96. Şeffaf arka planlı beyaz olmalıdır. PNG.

b. Başlık 50 karakter ile sınırlıdır.

c. Gövde 150 karakter ile sınırlıdır.

d. Büyük Görsel 1440×720 veya 2:1 en-boy oranı. PNG, JPG, GIF (animasyonlu değil).

e. Uygulama Adı Değiştirilemez.

f. Zaman Damgası Mesajın alındığı zaman.

g. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

h. Eylem Düğmeleri En fazla 3 düğmeyi destekler.

Eski Web İşletim Sistemleri

Referans için işletim sistemleri (macOS Big Sur, iOS 14, Android 11).

macOS Big Sur için Chrome

a. Tarayıcı Simgesi Chrome simgesi. Bu değiştirilemez.

b. Başlık 60-80 karakter ile sınırlıdır.

c. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

d. İçerik 120-150 karakter ile sınırlıdır.

e. Tarayıcı Değiştirilemez.

f. Zaman Damgası Mesajın alındığı zaman.

g. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil). Genişletildiğinde büyür.

h. Eylem Düğmeleri En fazla 2 düğmeyi destekler.

Karakter sınırlamalarının, bir simgenin varlığına ve kullanılan karakterlere bağlı olarak değiştiğini unutmayın. macOS Big Sur ile önceki sürümler arasındaki temel fark, mesajların daha büyük bir simgeyle genişletilebilmesi ve tarayıcı simgesinin daha küçük olmasıdır; bu da içerik için daha fazla alan sağlar.

macOS Big Sur için Firefox

a. Tarayıcı Simgesi Firefox simgesi. Bu değiştirilemez.

b. Başlık 60-80 karakter ile sınırlıdır.

c. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

d. İçerik 120-150 karakter ile sınırlıdır.

e. Tarayıcı Değiştirilemez.

f. Zaman Damgası Mesajın alındığı zaman.

g. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil). Genişletildiğinde büyür.

h. Eylem Düğmeleri Bunlar Firefox için özelleştirilemez.

Karakter sınırlamalarının, bir simgenin varlığına ve kullanılan karakterlere bağlı olarak değiştiğini unutmayın. macOS Big Sur ile önceki sürümler arasındaki temel fark, mesajların daha büyük bir simgeyle genişletilebilmesi ve tarayıcı simgesinin daha küçük olmasıdır; bu da içerik için daha fazla alan sağlar.

macOS Big Sur için Safari

a. Simge Bu bir kez ayarlanır ve tek tek mesajlar için değiştirilemez. 256×256 olmalıdır. PNG, JPG, GIF (animasyonlu değil).

b. Başlık 60-80 karakter ile sınırlıdır.

c. İçerik 120-150 karakter ile sınırlıdır.

d. Web Sitesi Adı Değiştirilemez.

e. Zaman Damgası Mesajın alındığı zaman.

macOS Catalina için Chrome

a. Tarayıcı Simgesi Chrome simgesi. Bu değiştirilemez.

b. Başlık 20-40 karakter ile sınırlıdır.

c. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

d. İçerik 20-80 karakter ile sınırlıdır.

e. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

Karakter sınırlamalarının, bir simgenin varlığına ve kullanılan karakterlere bağlı olarak değiştiğini unutmayın. macOS için Chrome ayrıca 2 eylem düğmesini destekler.

macOS Catalina için Firefox

a. Tarayıcı Simgesi Firefox simgesi. Bu değiştirilemez.

b. Başlık 60-80 karakter ile sınırlıdır.

c. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

d. İçerik 20-80 karakter ile sınırlıdır.

e. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

Karakter sınırlamalarının, bir simgenin varlığına ve kullanılan karakterlere bağlı olarak değiştiğini unutmayın.

macOS Catalina için Safari

a. Simge Bu bir kez ayarlanır ve tek tek mesajlar için değiştirilemez. 256×256 olmalıdır. PNG, JPG, GIF (animasyonlu değil).

b. Başlık 40 karakter ile sınırlıdır.

c. İçerik 90 karakter ile sınırlıdır.

Safari’de tarayıcı simgesi olmadığını ve alan adını da göstermediğini fark edin.

Windows 10 için Chrome

a. Banner Görseli 360×180 veya 2:1 en-boy oranı. PNG, JPG, GIF (animasyonlu değil).

b. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

c. Tarayıcı Değiştirilemez.

d. Eylem Düğmeleri En fazla 2 düğmeyi destekler.

e. Başlık 60 karakter ile sınırlıdır.

f. İçerik 120 karakter ile sınırlıdır.

g. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

Windows, hem banner görselinin hem de simgenin gösterildiği görseller için en geniş ekran alanını sunar.

Windows 10 için Firefox

a. Başlık 40 karakter ile sınırlıdır.

b. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

c. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

d. İçerik 140-190 karakter ile sınırlıdır.

e. Ayarlar Değiştirilemez.

Windows 10 için Microsoft Edge

a. Başlık 40 karakter ile sınırlıdır.

b. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

c. Tarayıcı Değiştirilemez.

d. İçerik 140-190 karakter ile sınırlıdır.

e. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

Android 11 için Chrome

a. Rozet 72×72 veya daha büyük. Şeffaf arka planlı beyaz olmalıdır. PNG.

b. Başlık 50 karakter ile sınırlıdır.

c. Gövde 150 karakter ile sınırlıdır.

d. Büyük Görsel 1024×512 veya 2:1 en-boy oranı. PNG, JPG, GIF (animasyonlu değil).

e. Tarayıcı Değiştirilemez.

f. Alan Adı Kullanıcının abone olduğu web sitesi. Değiştirilemez.

g. Zaman Damgası Mesajın alındığı zaman.

h. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

Eski Mobil İşletim Sistemleri

Android 11 Yerel

a. Küçük Simge Tüm cihaz boyutlarına uyacak şekilde 24×24 – 96×96. Şeffaf arka planlı beyaz olmalıdır. PNG.

b. Başlık 50 karakter ile sınırlıdır.

c. Gövde 150 karakter ile sınırlıdır.

d. Büyük Görsel 1440×720 veya 2:1 en-boy oranı. PNG, JPG, GIF (animasyonlu değil).

e. Eylem Düğmeleri En fazla 3 düğmeyi destekler.

f. Uygulama Adı Değiştirilemez.

g. Zaman Damgası Mesajın alındığı zaman.

h. Simge 192×192 veya daha büyük. PNG, JPG, GIF (animasyonlu değil).

iOS 14 Yerel

a. Uygulama Simgesi Uygulamanın varsayılan simgesini kullanır ve değiştirilemez.

b. Zengin Medya 1024×1024 veya 1:1 en-boy oranı. PNG, JPG, GIF, MP4, MP3, WAV.

c. Başlık 25-50 karakter ile sınırlıdır.

d. Mesaj 150 karakter ile sınırlıdır.

e. Uygulama Adı Değiştirilemez.

f. Seçenekler Değiştirilemez.

g. Eylem Düğmeleri En fazla 4 düğmeyi destekler.

iOS ayrıca altyazı desteğine sahiptir. Android’den farklı olarak iOS’ta şu anda web push desteği yoktur.