Gelişmiş Animasyon Modülü (Slider)
Bu eğitimde sizlere, şu anda ekranda gördüğünüz, 'gelişmiş resim animasyonu' modülünü web sitenize nasıl ekleyeceğinizi anlatacağım.
1. Adım: Modül eklemek istediğiniz web sitesinin yönetim paneline gidin.
2. Adım: Yeni modül eklemek için, önce 'tüm modüller' düğmesine, ardından 'modül ekle' düğmesine tıklayın.
3. Adım: Modül türleri içinden, 'gelişmiş resim animasyonu' modülüne tıklayın.
4. Adım: Modülün yayınlanmasını istediğiniz sayfayı seçin.
5. Adım: Genel modül ayarları bölümünden, modülün başlığını yazın. Ardından, sayfa içinde görüntüleneceği konumunu seçin.
6. Adım: Kaydet düğmesine basarak modülü oluşturun.
Hangi türde olursa olsun, bütün modüller, hep aynı şekilde oluşturulur.
Şimdi sıra, 'gelişmiş resim animasyonu' modülüne özgü tercihleri düzenlemeye geldi.
Oranlar ve boyutlar parametreleri: Masaüstü ve mobil cihazlarda görüntülenecek en-boy oranlarını ve fiziksel boyutları belirlemenizi sağlar.
Animasyon parametreleri: Geçiş türünü, otomatik başlatma seçeneğini ve geçiş süresini ayarlayabilirsiniz. Ayrıca ileri-geri oklarının görünürlüğünü, tipini ve rengini özelleştirebilirsiniz.
Metin ayarları: Her bir metin satırı (1'den 4'e kadar) için aşağıdaki özellikleri ayrı ayrı düzenleyebilirsiniz:
- Animasyon ve genişlik ayarları
- Masaüstü ve mobil için font boyutları
- Yazı tipi kalınlığı ve renk ayarları (normal durum ve hover durumu için)
- Gölgelendirme ve arkaplan rengi
- Kenarlık özellikleri (kalınlık, tür ve renk)
- Padding değerleri (masaüstü ve mobil için dikey/yatay)
- Alt boşluk ve köşe ovalliği
Modül türüne özgü tercihlerinizi tamamladıktan sonra, kaydetmeyi unutmayın.
Şimdi, modülümüze yeni nesneler eklemeye başlayabiliriz. Bunun için, 'yeni nesne ekle' düğmesine tıklayın.
Görsel ayarları: Masaüstü ve mobil cihazlar için ayrı görseller yükleyebilir, arkaplan yerleşimini ve rengini belirleyebilirsiniz.
İçerik konumu: Masaüstü ve mobil cihazlarda içeriğin konumunu (üst, orta, alt ve sağ, sol, orta kombinasyonları) ve metin hizalamasını ayarlayabilirsiniz.
İçerik arkaplanı: Arkaplan rengi ve köşe ovalliği değerlerini belirleyebilirsiniz.
Metin içerikleri: Dört farklı metin satırı için içerik, bağlantı, renk (normal ve hover durumları), gölge ve arkaplan özelliklerini ayrı ayrı düzenleyebilirsiniz.
Modül nesnesi eklemeyi tamamlamak için 'kaydet' düğmesine tıklayın.
Bu anlattığım şekilde, 'gelişmiş resim animasyonu' modülüne, istediğiniz kadar yeni nesne ekleyebilirsiniz.
Ayrıca, 'yayınlanacağı sayfaları seç' düğmesine tıklayarak, modülünüzün hangi sayfalarda yayınlanacağına karar verebilirsiniz.
'gelişmiş resim animasyonu' modülü ile ilgili anlatacaklarım bu kadar.
En Gelişmiş Slider Modülü
Web sitenizin en vurucu modülü olan resim animasyonlarını (slider) oluşturabilirsiniz. Bizim modülleri, sadece ana sayfada yeri ve yüksekliği önceden hazırlanmış kalıp slider modülleriyle karıştırmayın. Tüm modüller, dilediğiniz sayfanın dilediğiniz pozisyonunda bir ya da daha çok sayfada yayınlanabilir. Ayrıca resimlerin üstüne eklediğiniz yazıları mobil için ayrı masaüstü için ayrı pozisyonda sunabilirsiniz. Animasyon modülünü masaüstü görünümde farklı bir en/boy oranına sahip, mobil cihazlarda farklı bir en/boy oranına sahip olacak şekilde kullanabilirsiniz.
Tüm animasyon slaytları için ayrı ayrı satırlar oluşturabilir, resim ve satırları klonlayabilir ve bu satırların ekranda hangi sırayla ve hangi animasyon şekliyle belireceğine karar verebilirsiniz. Her bir satırın konumunu, rengini, arkaplan rengini v.b. seçebilir ve dilerseniz satırlara link de verebilirsiniz. Tüm bu özellikleri ve daha fazlasını nasıl kullanacağınızı öğrenmek için eğitim videomuzu izleyiniz.
Animasyon İmajlarınında Mobil ve Masaüstü için Farklı Görseller Kullanabilirsiniz
Yaptığımız güncelleme ile gelişmiş animasyon ve zengin arkaplan modüllerinizde masaüstü cihazlar için ayrı, mobil cihazlar için ayrı görsel yükleyebilirsiniz. Aynı zamanda mobil ve masaüstü cihazlar için ayrı ayrı, görsel üzerinde beliren yazıların konumlarını da değiştirebilirsiniz.
Yeni Renk Hırsızı İle Optimizasyonun Sınırlarını Zorladık
Optimizasyonun sonu yok biliyorsunuz. Her zaman web sitesinin daha hızlı açılmasını sağlayacak bir şeyler bulunur. Elbette en hızlı web sitesi, hiç bir içeriğe sahip olmayan, animasyon içermeyen düz metinlerden oluşan sayflardır. Ama modern dünya da web siteleri çok fazla görsele ve çeşitli eklentilere ihtiyaç duyar.
Önemli olan hiç bir şey içermeyen bir web sitesini hızlı yapmak değil, dolu dolu içeriklere, zengin animasyonlara, formlar, videolar, haritalar içeren web sitelerine gerçekten hız verebilmek değil mi?
Son BulutPress® güncellememiz ile, sayfanızda en fazla yer kaplayan ve sayfa hızını en çok etkileyen gelişmiş resim animasyonu modülümüzü bir üst seviyeye çıkardık. Bir önceki güncellememizde bildiğiniz gibi, yüklediğiniz her bir devasa görselin, mobile uygun şekilde yeniden boyutlandırılarak sadece mobil cihazlarda açılan küçük birer kopyalarını hazırlamıştık.
Bu güncellememizde ise, her bir gelişmiş animasyon modülünde bulunan her bir resmin tek tek "dominant (baskın) renklerini" renk hırsızı uygulumamızla oluşturarak, resim yüklenmeden milisaniyeler önce sadece baskın renklerini tarayıcıya verip, sayfanın olağan üstü hızlarla açılmasını sağladık.
Aslında optimize edilmiş resim hala olması gerektiği hızla yükleniyor. Ancak ziyaretçi bu görselin yüklenmesini beklemeden, dominant rengini ve animasyon içindeki metin satırlarını görerek olağan üstü bir hızla yüklendiği izlenimine kapılıyor.
Bu sayede ekranın oldukça fazla bir alanını kaplayan animasyon modülü anında ziyaretçiye içerik sunuyor ve sayfamız hiç beklemeden açılmış oluyor.
Google page speed index puanımız çok yüksekten, çok daha yüksek skorlara erişiyor. Daha google uyumlu, daha kullanıcı dostu bir BulutPress® sitesi ile sonuçta ziyaretçilerimiz ve bayilerimiz kazanıyor.
Gelişmiş Resim Animasyonu ile Web Sitenize Profesyonel Dokunuş
Modern web tasarımında, ziyaretçilerinizi etkileyecek görsel öğeler kullanmak artık bir tercih değil, zorunluluk haline geldi. BulutPress'in gelişmiş resim animasyonu modülü, web sitenize profesyonel bir görünüm kazandırmanın en etkili yollarından biri.
Neden Gelişmiş Resim Animasyonu Kullanmalısınız?
Web sitesi tasarımında başarının sırrı, ziyaretçilerinizin dikkatini çekmek ve onları sitenizde daha uzun süre tutmaktır. Gelişmiş resim animasyonu modülü, bu hedefe ulaşmanızı sağlayan güçlü bir araçtır. Slider'lardan çok daha fazlasını sunan bu modül, her bir görseliniz için dört farklı metin katmanı oluşturmanıza olanak tanır.
Örnek kullanım alanları:
- Kurumsal web sitesi ana sayfanızda şirketinizin öne çıkan hizmetlerini görsel efektlerle sunabilirsiniz.
- E-ticaret sitenizde özel kampanyalarınızı ve yeni ürünlerinizi etkileyici animasyonlarla duyurabilirsiniz.
- Portföy sayfanızda projelerinizi profesyonel bir şekilde sergileyebilirsiniz.
Mobil Uyumlu Tasarım Garantisi
Günümüzde web sitesi ziyaretlerinin büyük çoğunluğu mobil cihazlardan geliyor. Gelişmiş resim animasyonu modülü, responsive web tasarım prensiplerine uygun olarak geliştirildi. Masaüstü ve mobil görünümler için ayrı ayrı özelleştirme yapabilirsiniz:
- Farklı ekran boyutları için optimize edilmiş görseller
- Mobil cihazlara özel metin boyutları ve konumlandırma
- Dokunmatik ekranlara uygun gezinme kontrolleri
SEO Dostu Yapı
BulutPress'in tüm modülleri gibi, gelişmiş resim animasyonu da SEO uyumlu web sitesi kriterlerini göz önünde bulundurarak tasarlandı. Modern web standartlarına uygun kod yapısı ve optimize edilmiş görsel yükleme sistemi sayesinde, sitenizin arama motorlarındaki performansını olumsuz etkilemez.
Performans ve Hız Odaklı
AWS tabanlı web hosting altyapımız üzerinde çalışan gelişmiş resim animasyonu modülü, yüksek performanslı hosting gereksinimlerini karşılayacak şekilde optimize edildi. Görselleriniz otomatik olarak sıkıştırılır ve en uygun formatta sunulur.
Önemli özellikler:
- Optimize edilmiş görsel yükleme sistemi
- Akıllı önbellek yönetimi
- Minimum kaynak kullanımı
Kolay Web Sitesi Yönetim Sistemi
Web tasarım yazılımı deneyiminiz ne olursa olsun, gelişmiş resim animasyonu modülünü kolayca kullanabilirsiniz. Sezgisel arayüzü sayesinde karmaşık animasyonları bile dakikalar içinde oluşturabilirsiniz.
Profesyonel web tasarım araçları ile web sitenizi bir üst seviyeye taşımaya hazır mısınız? BulutPress'in gelişmiş resim animasyonu modülü ile etkileyici görseller oluşturmaya hemen başlayın.
Bayi Ol 
Oturum Aç