Mobil Uyumlu ve Responsive Basit Anketleri JavaScript ile Kodlama Rehberi

Web siteleri ve çevrimiçi platformlar için kullanıcı etkileşimi, geri bildirim toplama ve veri analizi vazgeçilmezdir. Bu süreçte en etkili araçlardan biri de anketlerdir. Ancak günümüzün mobil odaklı dünyasında, anketlerin yalnızca mevcut olması yeterli değildir; aynı zamanda mobil uyumlu anketler ve responsive bir yapıda olmaları zorunludur. Bir SEO editörü ve AdSense politikaları konusunda bilgili biri olarak, bu rehberde basit anketleri JavaScript ile nasıl kodlayacağınızı ve bunu yaparken AdSense politikalarına uygun bir kullanıcı deneyimi sunmanın inceliklerini ele alacağız.
Amacımız, gereksiz karmaşıklıktan uzak, performansı etkilemeyecek ve kullanıcıları rahatsız etmeyecek anketler tasarlamak ve uygulamaktır. Bu sayede hem kullanıcı memnuniyetini artıracak hem de AdSense gelirlerinizi riske atmadan değerli bilgiler toplayabileceksiniz.

Anketlerin Web Sitesi Etkileşimi ve Kullanıcı Deneyimine Katkısı

Anketler, sadece pazarlama araçları olmaktan çok öte, web sitenizle kullanıcılarınız arasında köprü kuran güçlü etkileşim mekanizmalarıdır. Doğru kurgulanmış bir anket, ziyaretçilerinizin sitenizde daha uzun süre kalmasını sağlayabilir, onların ilgisini çekebilir ve size doğrudan geri bildirim sağlayabilir. Bu geri bildirimler, içerik stratejinizi geliştirmek, ürün veya hizmetlerinizi iyileştirmek ve genel olarak sitenizin amacına daha iyi hizmet etmek için hayati öneme sahiptir.
Kullanıcıların siteyle etkileşimini artırmak, dolaylı olarak SEO performansınızı ve AdSense reklamlarınızın verimliliğini de olumlu etkiler. Yüksek etkileşim oranları, Google'ın sitenizin değerli ve alakalı olduğunu düşünmesine yardımcı olabilir. Ancak bu dengeyi iyi kurmak gerekir. Aşırıya kaçan, zorunlu veya kullanıcı akışını bozan anketler tam tersi etki yaratabilir, kullanıcıları siteden uzaklaştırabilir ve hatta AdSense politikaları açısından risk oluşturabilir. Bu nedenle, anket tasarımında ve konumlandırmasında her zaman kullanıcı deneyimi odaklı anketler prensibini benimsemeliyiz. Anketlerin, kullanıcının doğal akışını bozmadan, değerli bir etkileşim sunması esastır.

Mobil Uyumlu (Responsive) Tasarımın Önemi

Günümüzde internet trafiğinin büyük bir kısmı mobil cihazlardan gelmektedir. Bu durum, web sitenizin responsive bir tasarıma sahip olmasının ne kadar kritik olduğunu bir kez daha ortaya koymaktadır. Responsive tasarım, web sitenizin ekran boyutundan bağımsız olarak tüm cihazlarda (masaüstü, tablet, mobil) en iyi görüntülenme ve işlevsellik deneyimini sunması anlamına gelir. Anketleriniz için de bu durum geçerlidir. Küçük bir telefon ekranında doğru görüntülenmeyen, düğmeleri basılamayan veya metinleri okunamayan bir anket, kullanıcı için sinir bozucu bir deneyimden başka bir şey değildir.
Responsive anketler tasarlamak, CSS Media Queries gibi teknikleri kullanarak anketin düzenini ve stilini farklı ekran boyutlarına göre otomatik olarak ayarlamak demektir. Örneğin, masaüstünde yan yana duran anket seçenekleri, mobil cihazlarda alt alta sıralanabilir. Bu yaklaşım, sadece kullanıcı memnuniyetini artırmakla kalmaz, aynı zamanda Google'ın mobil uyumluluk kriterlerini karşılamanıza ve dolayısıyla arama motoru sıralamanızda olumlu bir etki görmenize yardımcı olur. AdSense açısından bakıldığında, responsive reklam birimlerinin sitenize sorunsuz entegre olması gibi, anketlerinizin de her cihazda sorunsuz çalışması, reklam gösterimlerinin ve tıklamalarının olumsuz etkilenmemesi için elzemdir. Anketinizin, responsive yapısıyla uyumlu olması, kullanıcıların reklamlara yanlışlıkla tıklamasını da önleyerek AdSense politikalarına uyumu destekler.

JavaScript ile Basit Anket Oluşturmanın Temelleri

Basit bir anket oluşturmak için HTML yapısı, CSS ile stillendirme ve JavaScript ile etkileşim ekleme adımlarını izleriz. Odak noktamız, uzun ve karmaşık kod bloklarından kaçınarak, temel prensipleri açıklamaktır.
HTML Yapısı: Anketin iskeleti HTML ile oluşturulur. Bir `

` etiketi içerisinde sorularınızı ve cevap seçeneklerinizi tanımlarsınız. Tek seçimlik sorular için ``, çoklu seçimler için `` ve açık uçlu sorular için `` veya `

` gibi elemanlar kullanırsınız. Her soru için bir `<div>` veya `<fieldset>` içinde etiketlerle birlikte ilgili giriş elemanlarını gruplandırmak, hem erişilebilirlik hem de stillendirme açısından faydalıdır. Bir `<button type="submit">` ile anketi gönderme veya `<button type="button">` ile sorular arasında geçiş yapma işlevselliği eklersiniz.<br><strong>CSS ile Stillendirme:</strong> Anketin <strong>responsive anket tasarımı</strong> için CSS hayati öneme sahiptir. `flexbox` veya `grid` gibi modern CSS düzenleme teknikleri, anket elemanlarını farklı ekran boyutlarına göre düzenlemenize olanak tanır. Media Queries (`@media (max-width: 768px) { ... }`) kullanarak belirli ekran genişlikleri için farklı stiller uygulayabilirsiniz. Örneğin, mobil cihazlarda radio butonlarını veya onay kutularını daha büyük ve tıklanabilir hale getirebilir, metin boyutlarını okunaklı tutabilir ve genişliği ayarlayarak yanlara kaydırma ihtiyacını ortadan kaldırabilirsiniz. Bu adımlar, anketinizin tüm cihazlarda görsel olarak çekici ve işlevsel olmasını sağlar.<br><strong>JavaScript ile Etkileşim:</strong> İşte burada <strong>JavaScript anket kodlama</strong> devreye giriyor. JavaScript, anketin dinamik davranışını yönetir:<br>*   <strong>Elemanları Seçme:</strong> `document.querySelector()` veya `document.getElementById()` gibi metotlarla HTML anket elemanlarına erişirsiniz.<br>*   <strong>Olay Dinleyicileri:</strong> Bir kullanıcının bir seçeneği işaretlemesi veya "Gönder" düğmesine tıklaması gibi olayları dinlemek için `addEventListener()` kullanırsınız.<br>*   <strong>Veri Toplama:</strong> Anket gönderildiğinde, seçilen değerleri veya girilen metinleri toplarsınız. Radio butonları için `checked` özelliği, metin kutuları için `value` özelliği kullanılır.<br>*   <strong>Doğrulama (Validation):</strong> Basit anketlerde dahi, kullanıcıların gerekli alanları doldurduğundan emin olmak için temel doğrulamalar yapabilirsiniz. Örneğin, tüm soruların cevaplandığını kontrol edebilirsiniz.<br>*   <strong>Geri Bildirim:</strong> Anket tamamlandığında veya gönderildiğinde kullanıcıya bir teşekkür mesajı veya sonuçların özetini gösterebilirsiniz. Bu, genellikle anket formunu gizleyip bir teşekkür `<div>`'ini görünür hale getirerek yapılır.<br>Bu temel adımlar, kullanıcıların kolayca etkileşim kurabileceği ve sitenizden ayrılmadan geri bildirimde bulunabileceği basit ama etkili bir anket mekanizması oluşturmanıza olanak tanır.<br><h3>Etkileşimli Anketler İçin Temel JavaScript Teknikleri</h3><br>Basit bir <strong>JavaScript anket kodlama</strong> süreci, genellikle şu adımları içerir:<br>1.  <strong>Form Elemanlarına Erişim:</strong> İlk olarak, anketinizin HTML elemanlarına JavaScript ile erişmeniz gerekir. Örneğin, anketin ana `<form>` etiketi, gönder düğmesi ve her bir soru için yanıt seçenekleri. `document.getElementById()`, `document.querySelector()` veya `document.querySelectorAll()` gibi DOM manipülasyon metotları bu iş için idealdir.<br>2.  <strong>Olay Dinleyicileri Ekleme:</strong> Kullanıcının anketle etkileşimini yakalamak için olay dinleyicileri (event listeners) kullanılır. En yaygın olanı, "Gönder" düğmesine basıldığında tetiklenecek `click` olayı veya formun tamamı gönderildiğinde tetiklenecek `submit` olayıdır. `form.addEventListener('submit', function(event) { ... });` şeklinde bir yapı kurabilirsiniz. `event.preventDefault()` çağrısı, formun varsayılan gönderim davranışını (sayfanın yeniden yüklenmesini) engellemek için önemlidir.<br>3.  <strong>Yanıtları Toplama:</strong> Olay tetiklendiğinde, kullanıcının seçtiği veya girdiği yanıtları toplarsınız.<br>*   Radio butonları için, ilgili `name` özelliğine sahip input elemanları arasından `checked` özelliği `true` olanı bulmanız gerekir.<br>*   Checkbox'lar için, `name` özelliği aynı olan tüm input elemanlarını döngüye alıp, `checked` olanların `value` değerlerini bir diziye ekleyebilirsiniz.<br>*   Metin kutuları için ise basitçe `inputElement.value` ile değeri alırsınız.<br>4.  <strong>Basit Doğrulama:</strong> Yanıtlar toplanmadan önce veya toplandıktan hemen sonra, anketin geçerliliğini kontrol edebilirsiniz. Örneğin, tüm zorunlu soruların cevaplandığından emin olabilirsiniz. Bir soru boşsa, kullanıcıya bir uyarı mesajı gösterip gönderimi engelleyebilirsiniz.<br>5.  <strong>Sonuçları Gösterme veya İşleme:</strong> Yanıtlar toplandıktan ve doğrulandıktan sonra, bu verileri kullanıcıya geri bildirim olarak gösterebilirsiniz. Örneğin, anketin olduğu bölümü gizleyip, "Teşekkürler! Yanıtlarınız kaydedildi." gibi bir mesajı veya toplanan yanıtların basit bir özetini gösterebilirsiniz. Daha gelişmiş senaryolarda bu veriler bir sunucuya gönderilebilir ancak konumuz <strong>basit anket oluşturucu JS ile</strong> olduğu için, bu kısmı şimdilik pas geçiyoruz.<br>Bu temel teknikler, kullanıcıların web sitenizle anlamlı bir şekilde etkileşime girmesini sağlayan dinamik ve <strong>responsive anket tasarımı</strong> uygulamak için yeterlidir.<br><h3>AdSense Politikaları ve Anket Kullanımı Arasındaki Denge</h3><br><strong>AdSense uyumlu anketler</strong> tasarlamak, hem kullanıcı deneyimini hem de reklam gelirlerinizi korumak için hayati önem taşır. AdSense, kullanıcıların sitenizdeki içerikle rahatça etkileşim kurmasını ve reklamları açıkça görmesini ister. Bu nedenle, anketlerinizi tasarlarken aşağıdaki politikalara dikkat etmek gerekir:<br>*   <strong>Reklamlarla Etkileşim:</strong> Anket elemanları (düğmeler, seçenekler) asla reklam birimleriyle çakışmamalı veya reklamların yanlışlıkla tıklanmasına neden olmamalıdır. Yanlışlıkla tıklama AdSense politikalarının ihlali anlamına gelir ve hesabınızın askıya alınmasına yol açabilir. Anketinizin, reklam alanlarından yeterli boşlukla ayrıldığından emin olun.<br>*   <strong>Kullanıcı Deneyimi:</strong> Anketleriniz kullanıcı deneyimini engellememeli, rahatsız edici olmamalıdır. Örneğin, otomatik açılan (pop-up) veya tam ekran anketler, kullanıcıların siteyi terk etmesine neden olabilir ve AdSense açısından sorunlu kabul edilebilir. İçeriğe erişimi engelleyen anketlerden kaçının. Kullanıcılara anketten çıkma veya anketi atlama seçeneği sunmak her zaman iyi bir uygulamadır.<br>*   <strong>İçerik Kalitesi:</strong> Anketler, sitenizin genel içeriğine değer katmalı ve ilgili olmalıdır. Değersiz veya alakasız anketler, sitenizin genel kalitesini düşürebilir.<br>*   <strong>Şeffaflık:</strong> Kullanıcılara neden anket yaptıklarını ve verilerinin nasıl kullanılacağını açıkça belirtin. Gizlilik politikası bağlantısı eklemek her zaman iyi bir uygulamadır.<br>Unutmayın ki AdSense'in önceliklerinden biri, reklamverenlerin kullanıcıya değerli bir deneyim sunulan sitelerde reklamlarının gösterilmesini sağlamaktır. Bu dengeyi iyi kurmak, uzun vadeli başarı için anahtardır.<br><h2>Gelişmiş Özelliklerden Kaçınarak Basit Tutma Stratejileri</h2><br>Basitlik, özellikle anketler söz konusu olduğunda bir erdemdir. <strong>Basit anket oluşturucu JS ile</strong> çalışırken, gereksiz karmaşıklıktan kaçınmak performansı artırır, yükleme sürelerini kısaltır ve bakım kolaylığı sağlar. Aşağıda, anketlerinizi basit tutmak için bazı stratejiler bulabilirsiniz:<br>1.  <strong>Minimalist Tasarım:</strong> Anketlerinizde sadece gerekli HTML elemanlarını kullanın. Aşırı animasyonlar, karmaşık geçişler veya fazla sayıda resimden kaçının. Temiz ve okunaklı bir tasarım, kullanıcının dikkatini dağıtmaz ve odaklanmasını sağlar.<br>2.  <strong>Hafif JavaScript:</strong> Harici kütüphaneleri (örneğin jQuery'nin tamamı) sadece anket için kullanmaktan kaçının. Modern JavaScript (Vanilla JS), DOM manipülasyonu, olay dinleyicileri ve veri işleme gibi temel görevler için oldukça yeterlidir. Bu, sayfa yükleme süresini önemli ölçüde azaltır. Örneğin, bir elemeni seçmek için `document.querySelector()` yeterliyken, tüm jQuery kütüphanesini yüklemek aşırıya kaçmaktır.<br>3.  <strong>Soru Sayısını Sınırlama:</strong> Anketinizin çok uzun olmamasına dikkat edin. Uzun anketler, kullanıcıların sıkılmasına ve anketi tamamlamadan terk etmesine neden olabilir. Genellikle 3-5 soruluk kısa anketler en iyi etkileşim oranlarını sunar.<br>4.  <strong>AJAX'sız Veri Gönderme (İlk Aşama):</strong> Eğer anket verilerini anında bir veritabanına kaydetme gibi karmaşık bir ihtiyacınız yoksa, başlangıçta `fetch` API'si veya `XMLHttpRequest` gibi AJAX tekniklerinden kaçınabilirsiniz. Basitçe JavaScript ile verileri toplayıp, sonuçları kullanıcıya göstererek veya tarayıcının `localStorage`'ında geçici olarak saklayarak başlayabilirsiniz. Bu, anketin kodlama karmaşıklığını ve sunucu yükünü azaltır.<br>5.  <strong>Tek Sayfalık Anketler:</strong> Soruları ayrı ayrı sayfalara bölmek yerine, tüm soruları tek bir HTML sayfasında tutup, JavaScript ile "İleri" veya "Geri" butonları aracılığıyla görünürlüklerini kontrol etmek daha basit bir yaklaşımdır. Bu, sayfa yükleme zamanını azaltır ve kullanıcı deneyimini hızlandırır.<br>6.  <strong>Basit Doğrulama Mantığı:</strong> Gereksiz karmaşık doğrulama kurallarından kaçının. Örneğin, sadece zorunlu alanların doldurulup doldurulmadığını kontrol etmek yeterli olabilir. Regex tabanlı e-posta doğrulaması gibi detaylar, basit bir anketin kapsamının dışına çıkabilir.<br>Bu stratejiler, hem kodunuzun daha temiz ve yönetilebilir olmasını sağlar hem de sitenizin genel performansına olumlu katkıda bulunur. Unutmayın, AdSense ve genel SEO için hızlı yüklenen, kullanıcı dostu siteler her zaman tercih edilir. Daha fazla web geliştirme ilkesi için bu makaleyi okuyabilirsiniz: [/makale.php?sayfa=web-tasarimi-ilkeleri]<br><h2>Anket Sonuçlarını Değerlendirme ve İyileştirme</h2><br>Bir <strong>mobil uyumlu anketler</strong> tasarlayıp uygulamak sadece ilk adımdır. Toplanan verileri anlamlandırmak ve bunlardan eyleme geçirilebilir içgörüler çıkarmak, anketin gerçek değerini ortaya koyar. Basit anketlerde bile, elde ettiğiniz bilgileri düzenli olarak gözden geçirmek ve değerlendirmek önemlidir.<br>Örneğin, basit bir JavaScript anketinde toplanan verileri, tarayıcının geliştirici araçları konsoluna yazdırarak veya sayfa içinde görsel olarak bir özet sunarak inceleyebilirsiniz. Bu veriler, ziyaretçilerinizin hangi konularda daha fazla ilgi gösterdiğini, hangi içeriğin daha değerli bulunduğunu veya sitenizde nelerin iyileştirilmesi gerektiğini anlamanıza yardımcı olabilir.<br>Anket sonuçlarına göre sitenizde yapacağınız düzenlemeler (örneğin, popüler bir konu hakkında daha fazla içerik oluşturmak veya kullanıcıların şikayet ettiği bir sorunu gidermek), <strong>web sitesi etkileşimini artırma</strong> yolunda önemli adımlardır. Bu süreç, kullanıcı deneyimini sürekli olarak optimize etmenizi sağlar ve AdSense reklamlarınızın performansını dolaylı olarak iyileştirir. Kullanıcıların olumlu geri bildirimlerini dikkate almak, sitenize olan sadakatlerini artıracak ve sonuç olarak daha uzun süreli ziyaretler ve daha fazla reklam gösterimi anlamına gelecektir. Kullanıcı deneyimi optimizasyonu hakkında daha fazla bilgi için bu kaynağa göz atabilirsiniz: [/makale.php?sayfa=kullanici-deneyimi-optimizasyonu]<br><h2>Sonuç</h2><br>Mobil uyumlu ve <strong>responsive anket tasarımı</strong> ile JavaScript kullanarak basit anketler oluşturmak, web sitenizin kullanıcı etkileşimini ve veri toplama kapasitesini önemli ölçüde artırabilir. Bu rehberde ele aldığımız gibi, HTML ile yapı, CSS ile responsive stil ve JavaScript ile etkileşim ekleyerek, sitenize değer katacak dinamik bir araç entegre edebilirsiniz.<br>Ancak bu süreçte AdSense politikalarına uygunluk ve kullanıcı deneyimini her zaman öncelikli tutmak hayati önem taşır. Aşırıya kaçmadan, kullanıcı akışını bozmadan ve reklamlarla çakışmadan tasarlanan <strong>AdSense uyumlu anketler</strong>, hem sizin için değerli bilgiler toplamanızı sağlar hem de sitenizin genel sağlığını ve gelir potansiyelini korur. Basit tutmak, performansı optimize etmek ve sürekli geri bildirim döngüsüne açık olmak, başarılı bir anket stratejisinin temelini oluşturur. Bu yaklaşımla, sitenizin değerini artırırken kullanıcılarınızla daha anlamlı bir bağ kurabilirsiniz.</p><style>
.author-box {
 margin-top: 25px; background:#f5f5f5; border-radius:12px; padding:20px;
 display:flex; gap:20px; align-items:flex-start; box-shadow:0 5px 15px rgba(0,0,0,0.05);
}
.author-box img{width:80px;height:80px;border-radius:50%;object-fit:cover;border:3px solid #007bff;}
.author-info h4{margin:0 0 10px 0;}
.author-info p{margin:0;font-size:0.95rem;line-height:1.6;color:#444;}
</style>
<div class="author-box">
 <img src="https://picsum.photos/150/150?random=848" alt="Serkan Çelik">
 <div class="author-info">
   <h4>Yazar: Serkan Çelik</h4>
   <p>Ben Serkan Çelik, bir Dijital Pazarlama Uzmanı. Platformumuzda teknolojiyi herkes için anlaşılır kılmak, karmaşık konuları basitleştirerek okuyucularımızın günlük yaşamında pratik olarak kullanabileceği bilgiler sunmak, yeni beceriler kazandırmak, farkındalık oluşturmak ve teknoloji dünyasındaki gelişmeleri anlaşılır bir dille aktarmak amacıyla yazıyorum.</p>
 </div>
</div>    </div>
    <div class="makale-sidebar">
        <h3>Diğer Makaleler</h3>
        <a class='sidebar-item' href='makale.php?sayfa=adim-adim-basit-javascript-anket-projesi-birden-fazla-soruyu-tek-bir-a'><img src='https://picsum.photos/seed/adim-adim-basit-javascript-anket-projesi-birden-fazla-soruyu-tek-bir-a/80/50' alt='Adim Adim Basit Javascript Anket Projesi Birden Fazla Soruyu Tek Bir A'><span>Adim Adim Basit Javascript Anket Projesi Birden Fazla Soruyu Tek Bir A</span></a><a class='sidebar-item' href='makale.php?sayfa=javascript-ile-olusturdugum-basit-anketi-mobil-cihazlarda-nasil-respon'><img src='https://picsum.photos/seed/javascript-ile-olusturdugum-basit-anketi-mobil-cihazlarda-nasil-respon/80/50' alt='Javascript Ile Olusturdugum Basit Anketi Mobil Cihazlarda Nasil Respon'><span>Javascript Ile Olusturdugum Basit Anketi Mobil Cihazlarda Nasil Respon</span></a><a class='sidebar-item' href='makale.php?sayfa=sunucuya-gerek-duymadan-basit-javascript-anket-sonuclarini-aninda-ekra'><img src='https://picsum.photos/seed/sunucuya-gerek-duymadan-basit-javascript-anket-sonuclarini-aninda-ekra/80/50' alt='Sunucuya Gerek Duymadan Basit Javascript Anket Sonuclarini Aninda Ekra'><span>Sunucuya Gerek Duymadan Basit Javascript Anket Sonuclarini Aninda Ekra</span></a><a class='sidebar-item' href='makale.php?sayfa=basit-javascript-anketini-tamamladiktan-sonra-kullaniciya-ozel-tesekku'><img src='https://picsum.photos/seed/basit-javascript-anketini-tamamladiktan-sonra-kullaniciya-ozel-tesekku/80/50' alt='Basit Javascript Anketini Tamamladiktan Sonra Kullaniciya Ozel Tesekku'><span>Basit Javascript Anketini Tamamladiktan Sonra Kullaniciya Ozel Tesekku</span></a><a class='sidebar-item' href='makale.php?sayfa=mevcut-html-sayfasina-basit-javascript-anketini-kopyala-yapistir-ile-n'><img src='https://picsum.photos/seed/mevcut-html-sayfasina-basit-javascript-anketini-kopyala-yapistir-ile-n/80/50' alt='Mevcut Html Sayfasina Basit Javascript Anketini Kopyala Yapistir Ile N'><span>Mevcut Html Sayfasina Basit Javascript Anketini Kopyala Yapistir Ile N</span></a><a class='sidebar-item' href='makale.php?sayfa=javascript-kullanarak-coktan-secmeli-ve-tek-secimli-basit-anket-sorula'><img src='https://picsum.photos/seed/javascript-kullanarak-coktan-secmeli-ve-tek-secimli-basit-anket-sorula/80/50' alt='Javascript Kullanarak Coktan Secmeli Ve Tek Secimli Basit Anket Sorula'><span>Javascript Kullanarak Coktan Secmeli Ve Tek Secimli Basit Anket Sorula</span></a><a class='sidebar-item' href='makale.php?sayfa=kullanici-bos-birakirsa-basit-javascript-anketini-gondermesini-engelle'><img src='https://picsum.photos/seed/kullanici-bos-birakirsa-basit-javascript-anketini-gondermesini-engelle/80/50' alt='Kullanici Bos Birakirsa Basit Javascript Anketini Gondermesini Engelle'><span>Kullanici Bos Birakirsa Basit Javascript Anketini Gondermesini Engelle</span></a><a class='sidebar-item' href='makale.php?sayfa=basit-bir-javascript-anketinden-kullanici-cevaplarini-sayfa-yenilemede'><img src='https://picsum.photos/seed/basit-bir-javascript-anketinden-kullanici-cevaplarini-sayfa-yenilemede/80/50' alt='Basit Bir Javascript Anketinden Kullanici Cevaplarini Sayfa Yenilemede'><span>Basit Bir Javascript Anketinden Kullanici Cevaplarini Sayfa Yenilemede</span></a><a class='sidebar-item' href='makale.php?sayfa=web-sitenize-hizlica-entegre-edebileceginiz-basit-javascript-anket-kod'><img src='https://picsum.photos/seed/web-sitenize-hizlica-entegre-edebileceginiz-basit-javascript-anket-kod/80/50' alt='Web Sitenize Hizlica Entegre Edebileceginiz Basit Javascript Anket Kod'><span>Web Sitenize Hizlica Entegre Edebileceginiz Basit Javascript Anket Kod</span></a><a class='sidebar-item' href='makale.php?sayfa=sifirdan-baslayanlar-icin-vanilla-javascript-ile-basit-anket-formu-nas'><img src='https://picsum.photos/seed/sifirdan-baslayanlar-icin-vanilla-javascript-ile-basit-anket-formu-nas/80/50' alt='Sifirdan Baslayanlar Icin Vanilla Javascript Ile Basit Anket Formu Nas'><span>Sifirdan Baslayanlar Icin Vanilla Javascript Ile Basit Anket Formu Nas</span></a><a class='sidebar-item' href='makale.php?sayfa=kullanici-dostu-ve-hizli-yuklenen-bir-js-anketi-icin-performans-optimi'><img src='https://picsum.photos/seed/kullanici-dostu-ve-hizli-yuklenen-bir-js-anketi-icin-performans-optimi/80/50' alt='Kullanici Dostu Ve Hizli Yuklenen Bir Js Anketi Icin Performans Optimi'><span>Kullanici Dostu Ve Hizli Yuklenen Bir Js Anketi Icin Performans Optimi</span></a><a class='sidebar-item' href='makale.php?sayfa=anket-sonuclarini-sayfayi-yenilemeden-aninda-gostermek-icin-javascript'><img src='https://picsum.photos/seed/anket-sonuclarini-sayfayi-yenilemeden-aninda-gostermek-icin-javascript/80/50' alt='Anket Sonuclarini Sayfayi Yenilemeden Aninda Gostermek Icin Javascript'><span>Anket Sonuclarini Sayfayi Yenilemeden Aninda Gostermek Icin Javascript</span></a><a class='sidebar-item' href='makale.php?sayfa=tek-sayfalik-bir-web-uygulamasina-javascript-ile-basit-bir-anket-biles'><img src='https://picsum.photos/seed/tek-sayfalik-bir-web-uygulamasina-javascript-ile-basit-bir-anket-biles/80/50' alt='Tek Sayfalik Bir Web Uygulamasina Javascript Ile Basit Bir Anket Biles'><span>Tek Sayfalik Bir Web Uygulamasina Javascript Ile Basit Bir Anket Biles</span></a><a class='sidebar-item' href='makale.php?sayfa=mobil-uyumlu-ve-hafif-javascript-anketi-icin-minimal-kod-gereksinimler'><img src='https://picsum.photos/seed/mobil-uyumlu-ve-hafif-javascript-anketi-icin-minimal-kod-gereksinimler/80/50' alt='Mobil Uyumlu Ve Hafif Javascript Anketi Icin Minimal Kod Gereksinimler'><span>Mobil Uyumlu Ve Hafif Javascript Anketi Icin Minimal Kod Gereksinimler</span></a><a class='sidebar-item' href='makale.php?sayfa=sifirdan-baslayarak-javascript-ile-css-stilli-basit-anket-formu-yapimi'><img src='https://picsum.photos/seed/sifirdan-baslayarak-javascript-ile-css-stilli-basit-anket-formu-yapimi/80/50' alt='Sifirdan Baslayarak Javascript Ile Css Stilli Basit Anket Formu Yapimi'><span>Sifirdan Baslayarak Javascript Ile Css Stilli Basit Anket Formu Yapimi</span></a><a class='sidebar-item' href='makale.php?sayfa=ziyaretcilerden-aninda-veri-toplamak-icin-dinamik-anket-elemanlarini-j'><img src='https://picsum.photos/seed/ziyaretcilerden-aninda-veri-toplamak-icin-dinamik-anket-elemanlarini-j/80/50' alt='Ziyaretcilerden Aninda Veri Toplamak Icin Dinamik Anket Elemanlarini J'><span>Ziyaretcilerden Aninda Veri Toplamak Icin Dinamik Anket Elemanlarini J</span></a><a class='sidebar-item' href='makale.php?sayfa=ucuncu-parti-araca-gerek-duymadan-javascript-ile-sadece-evethayir-tipi'><img src='https://picsum.photos/seed/ucuncu-parti-araca-gerek-duymadan-javascript-ile-sadece-evethayir-tipi/80/50' alt='Ucuncu Parti Araca Gerek Duymadan Javascript Ile Sadece Evethayir Tipi'><span>Ucuncu Parti Araca Gerek Duymadan Javascript Ile Sadece Evethayir Tipi</span></a><a class='sidebar-item' href='makale.php?sayfa=html-ve-saf-javascript-ile-coktan-secmeli-basit-anket-kodu-yazimi-icin'><img src='https://picsum.photos/seed/html-ve-saf-javascript-ile-coktan-secmeli-basit-anket-kodu-yazimi-icin/80/50' alt='Html Ve Saf Javascript Ile Coktan Secmeli Basit Anket Kodu Yazimi Icin'><span>Html Ve Saf Javascript Ile Coktan Secmeli Basit Anket Kodu Yazimi Icin</span></a><a class='sidebar-item' href='makale.php?sayfa=backend-olmadan-sadece-javascript-kullanarak-hizli-bir-geri-bildirim-f'><img src='https://picsum.photos/seed/backend-olmadan-sadece-javascript-kullanarak-hizli-bir-geri-bildirim-f/80/50' alt='Backend Olmadan Sadece Javascript Kullanarak Hizli Bir Geri Bildirim F'><span>Backend Olmadan Sadece Javascript Kullanarak Hizli Bir Geri Bildirim F</span></a><a class='sidebar-item' href='makale.php?sayfa=kendi-web-sitenize-javascript-ile-basit-anket-eklemenin-en-hizli-yolu-'><img src='https://picsum.photos/seed/kendi-web-sitenize-javascript-ile-basit-anket-eklemenin-en-hizli-yolu-/80/50' alt='Kendi Web Sitenize Javascript Ile Basit Anket Eklemenin En Hizli Yolu '><span>Kendi Web Sitenize Javascript Ile Basit Anket Eklemenin En Hizli Yolu </span></a><a class='sidebar-item' href='makale.php?sayfa=basit-javascript-anketinizin-gorsel-tasarimini-css-ile-kisisellestirme'><img src='https://picsum.photos/seed/basit-javascript-anketinizin-gorsel-tasarimini-css-ile-kisisellestirme/80/50' alt='Basit Javascript Anketinizin Gorsel Tasarimini Css Ile Kisisellestirme'><span>Basit Javascript Anketinizin Gorsel Tasarimini Css Ile Kisisellestirme</span></a><a class='sidebar-item' href='makale.php?sayfa=javascript-anket-gonderimi-sonrasi-basari-mesaji-veya-yonlendirme-nasi'><img src='https://picsum.photos/seed/javascript-anket-gonderimi-sonrasi-basari-mesaji-veya-yonlendirme-nasi/80/50' alt='Javascript Anket Gonderimi Sonrasi Basari Mesaji Veya Yonlendirme Nasi'><span>Javascript Anket Gonderimi Sonrasi Basari Mesaji Veya Yonlendirme Nasi</span></a><a class='sidebar-item' href='makale.php?sayfa=mevcut-web-sitenize-kolayca-entegre-edilebilen-minimalist-javascript-a'><img src='https://picsum.photos/seed/mevcut-web-sitenize-kolayca-entegre-edilebilen-minimalist-javascript-a/80/50' alt='Mevcut Web Sitenize Kolayca Entegre Edilebilen Minimalist Javascript A'><span>Mevcut Web Sitenize Kolayca Entegre Edilebilen Minimalist Javascript A</span></a><a class='sidebar-item' href='makale.php?sayfa=mobil-uyumlu-ve-duyarli-bir-javascript-anket-bileseni-nasil-kodlanir'><img src='https://picsum.photos/seed/mobil-uyumlu-ve-duyarli-bir-javascript-anket-bileseni-nasil-kodlanir/80/50' alt='Mobil Uyumlu Ve Duyarli Bir Javascript Anket Bileseni Nasil Kodlanir'><span>Mobil Uyumlu Ve Duyarli Bir Javascript Anket Bileseni Nasil Kodlanir</span></a><a class='sidebar-item' href='makale.php?sayfa=kullanicilarin-tum-alanlari-doldurmasini-saglayan-javascript-anket-dog'><img src='https://picsum.photos/seed/kullanicilarin-tum-alanlari-doldurmasini-saglayan-javascript-anket-dog/80/50' alt='Kullanicilarin Tum Alanlari Doldurmasini Saglayan Javascript Anket Dog'><span>Kullanicilarin Tum Alanlari Doldurmasini Saglayan Javascript Anket Dog</span></a><a class='sidebar-item' href='makale.php?sayfa=harici-kutuphane-bagimliligi-olmadan-saf-javascript-ile-hafif-anket-ta'><img src='https://picsum.photos/seed/harici-kutuphane-bagimliligi-olmadan-saf-javascript-ile-hafif-anket-ta/80/50' alt='Harici Kutuphane Bagimliligi Olmadan Saf Javascript Ile Hafif Anket Ta'><span>Harici Kutuphane Bagimliligi Olmadan Saf Javascript Ile Hafif Anket Ta</span></a><a class='sidebar-item' href='makale.php?sayfa=basit-bir-javascript-anketi-icin-katilimcilara-aninda-sonuc-grafigi-go'><img src='https://picsum.photos/seed/basit-bir-javascript-anketi-icin-katilimcilara-aninda-sonuc-grafigi-go/80/50' alt='Basit Bir Javascript Anketi Icin Katilimcilara Aninda Sonuc Grafigi Go'><span>Basit Bir Javascript Anketi Icin Katilimcilara Aninda Sonuc Grafigi Go</span></a><a class='sidebar-item' href='makale.php?sayfa=sunucuya-gerek-duymadan-tarayicida-javascript-ile-anket-sonuclarini-ge'><img src='https://picsum.photos/seed/sunucuya-gerek-duymadan-tarayicida-javascript-ile-anket-sonuclarini-ge/80/50' alt='Sunucuya Gerek Duymadan Tarayicida Javascript Ile Anket Sonuclarini Ge'><span>Sunucuya Gerek Duymadan Tarayicida Javascript Ile Anket Sonuclarini Ge</span></a><a class='sidebar-item' href='makale.php?sayfa=coktan-secmeli-ve-acik-uclu-sorular-icin-dinamik-javascript-anket-form'><img src='https://picsum.photos/seed/coktan-secmeli-ve-acik-uclu-sorular-icin-dinamik-javascript-anket-form/80/50' alt='Coktan Secmeli Ve Acik Uclu Sorular Icin Dinamik Javascript Anket Form'><span>Coktan Secmeli Ve Acik Uclu Sorular Icin Dinamik Javascript Anket Form</span></a><a class='sidebar-item' href='makale.php?sayfa=html-ve-saf-javascript-kullanarak-adim-adim-etkilesimli-anket-olusturm'><img src='https://picsum.photos/seed/html-ve-saf-javascript-kullanarak-adim-adim-etkilesimli-anket-olusturm/80/50' alt='Html Ve Saf Javascript Kullanarak Adim Adim Etkilesimli Anket Olusturm'><span>Html Ve Saf Javascript Kullanarak Adim Adim Etkilesimli Anket Olusturm</span></a><a class='sidebar-item' href='makale.php?sayfa=tek-sayfali-tek-adimli-javascript-anket-uygulamasi-gelistirme-ipuclari'><img src='https://picsum.photos/seed/tek-sayfali-tek-adimli-javascript-anket-uygulamasi-gelistirme-ipuclari/80/50' alt='Tek Sayfali Tek Adimli Javascript Anket Uygulamasi Gelistirme Ipuclari'><span>Tek Sayfali Tek Adimli Javascript Anket Uygulamasi Gelistirme Ipuclari</span></a><a class='sidebar-item' href='makale.php?sayfa=hicbir-backend-bilgisi-olmadan-javascript-ile-ilk-anketimi-nasil-yapar'><img src='https://picsum.photos/seed/hicbir-backend-bilgisi-olmadan-javascript-ile-ilk-anketimi-nasil-yapar/80/50' alt='Hicbir Backend Bilgisi Olmadan Javascript Ile Ilk Anketimi Nasil Yapar'><span>Hicbir Backend Bilgisi Olmadan Javascript Ile Ilk Anketimi Nasil Yapar</span></a><a class='sidebar-item' href='makale.php?sayfa=basit-javascript-ile-kosullu-dinamik-anket-sorulari-nasil-olusturulur'><img src='https://picsum.photos/seed/basit-javascript-ile-kosullu-dinamik-anket-sorulari-nasil-olusturulur/80/50' alt='Basit Javascript Ile Kosullu Dinamik Anket Sorulari Nasil Olusturulur'><span>Basit Javascript Ile Kosullu Dinamik Anket Sorulari Nasil Olusturulur</span></a><a class='sidebar-item' href='makale.php?sayfa=javascript-anket-verilerini-tarayicida-local-storage-kalici-hale-getir'><img src='https://picsum.photos/seed/javascript-anket-verilerini-tarayicida-local-storage-kalici-hale-getir/80/50' alt='Javascript Anket Verilerini Tarayicida Local Storage Kalici Hale Getir'><span>Javascript Anket Verilerini Tarayicida Local Storage Kalici Hale Getir</span></a><a class='sidebar-item' href='makale.php?sayfa=kullanici-dostu-ve-sik-gorunumlu-javascript-anket-tasarim-ipuclari-nel'><img src='https://picsum.photos/seed/kullanici-dostu-ve-sik-gorunumlu-javascript-anket-tasarim-ipuclari-nel/80/50' alt='Kullanici Dostu Ve Sik Gorunumlu Javascript Anket Tasarim Ipuclari Nel'><span>Kullanici Dostu Ve Sik Gorunumlu Javascript Anket Tasarim Ipuclari Nel</span></a><a class='sidebar-item' href='makale.php?sayfa=javascript-anket-cevaplarini-direkt-google-e-tablolara-gonderme-yolu-v'><img src='https://picsum.photos/seed/javascript-anket-cevaplarini-direkt-google-e-tablolara-gonderme-yolu-v/80/50' alt='Javascript Anket Cevaplarini Direkt Google E Tablolara Gonderme Yolu V'><span>Javascript Anket Cevaplarini Direkt Google E Tablolara Gonderme Yolu V</span></a><a class='sidebar-item' href='makale.php?sayfa=kendi-coktan-secmeli-javascript-anketimi-sifirdan-nasil-kodlarim'><img src='https://picsum.photos/seed/kendi-coktan-secmeli-javascript-anketimi-sifirdan-nasil-kodlarim/80/50' alt='Kendi Coktan Secmeli Javascript Anketimi Sifirdan Nasil Kodlarim'><span>Kendi Coktan Secmeli Javascript Anketimi Sifirdan Nasil Kodlarim</span></a><a class='sidebar-item' href='makale.php?sayfa=html-sayfama-hizli-ve-ucretsiz-javascript-anket-formu-eklemek-istiyoru'><img src='https://picsum.photos/seed/html-sayfama-hizli-ve-ucretsiz-javascript-anket-formu-eklemek-istiyoru/80/50' alt='Html Sayfama Hizli Ve Ucretsiz Javascript Anket Formu Eklemek Istiyoru'><span>Html Sayfama Hizli Ve Ucretsiz Javascript Anket Formu Eklemek Istiyoru</span></a><a class='sidebar-item' href='makale.php?sayfa=javascript-anket-sonuclarini-sunucusuz-nasil-toplar-ve-saklarim'><img src='https://picsum.photos/seed/javascript-anket-sonuclarini-sunucusuz-nasil-toplar-ve-saklarim/80/50' alt='Javascript Anket Sonuclarini Sunucusuz Nasil Toplar Ve Saklarim'><span>Javascript Anket Sonuclarini Sunucusuz Nasil Toplar Ve Saklarim</span></a><a class='sidebar-item' href='makale.php?sayfa=veritabani-gerektirmeyen-javascript-anket-olusturucu-kodu-ariyorum'><img src='https://picsum.photos/seed/veritabani-gerektirmeyen-javascript-anket-olusturucu-kodu-ariyorum/80/50' alt='Veritabani Gerektirmeyen Javascript Anket Olusturucu Kodu Ariyorum'><span>Veritabani Gerektirmeyen Javascript Anket Olusturucu Kodu Ariyorum</span></a>    </div>
</div>
<footer class="site-footer">
    <div class="container mx-auto px-4 py-6">
        <p>© 2025 Basit Anket Oluşturucu JS İle. Tüm hakları saklıdır.</p>
        <p>
			<a href="https://riyy.online/">🏠 Anasayfa</a> |
            <a href="https://riyy.online/pages/gizlilik-politikasi.php">🔒 Gizlilik Politikası</a> |
            <a href="https://riyy.online/blog.php">📜 Blog</a> |
            <a href="https://riyy.online/pages/hakkimizda.php">ℹ️ Hakkımızda</a> |
            <a href="https://riyy.online/pages/iletisim.php">📞 İletişim</a>
			<a href="https://riyy.online/pages/kullanim-sartlari.php">🚩 Kullanım Şartları</a> </p>
    </div>

.site-footer a {
            color: #111827; /* linkler koyu */
            text-decoration: none;
            margin: 0 0.5rem;
            transition: color 0.3s;
        }

.site-footer a:hover {
            color: var(--secondary-color, #f97316); /* hover turuncu veya tanımlı secondary-color */
        }
    </style>

<div id="cookie-popup">
  Bu site çerezleri kullanıcı deneyimini geliştirmek için kullanır. 
  <a href="/pages/gizlilik-politikasi.php" target="_blank">Daha fazla bilgi</a>.
  <button id="accept-cookies">Kabul Ediyorum</button>
</div>

/* Gösterim */
#cookie-popup.show {
  opacity: 1;
  transform: translateY(0);
}

/* Linkler */
#cookie-popup a {
  color: #4cc9f0;
  text-decoration: underline;
}

/* Buton */
#cookie-popup button {
  float: right;
  background: #4cc9f0;
  border: none;
  color: #fff;
  padding: 6px 12px;
  border-radius: 6px;
  cursor: pointer;
  font-weight: 600;
  transition: background 0.3s, transform 0.3s;
  animation: pulse 2s infinite;
}

/* Hover efekti */
#cookie-popup button:hover {
  background: #3ab0d9;
}

/* Pulse animasyonu */
@keyframes pulse {
  0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(76,201,240,0.5); }
  50% { transform: scale(1.05); box-shadow: 0 0 10px 5px rgba(76,201,240,0.3); }
  100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(76,201,240,0); }
}

/* Mobil uyumlu */
@media (max-width: 500px) {
  #cookie-popup {
    right: 5%;
    left: 5%;
    bottom: 15px;
    width: auto;
    font-size: 13px;
    padding: 12px 15px;
  }
  #cookie-popup button {
    padding: 5px 10px;
  }
}
</style>

</footer>