Yıldız işaretinin HTML kodu nedir?

Dolu yıldız için ★ (decimal) veya ★ (hexadecimal). Boş yıldız için ☆ veya ☆ kullanılır.

CSS'te yıldız nasıl eklenir?

.element::before { content: "\2605"; color: gold; } kodu, seçilen öğenin önüne dolu yıldız ekler. \2605 değeri, yıldızın Unicode hexadecimal escape değeridir.

JavaScript'te yıldız karakteri nasıl kullanılır?

JS string içinde \u2605 yazarak ★ karakterini elde edebilirsiniz. Örnek: const star = "\u2605"; veya String.fromCharCode(9733);

Yıldız İşareti HTML Kodu | ★ ☆ Unicode, CSS ve JavaScript Kodları

Yıldız Kod Referans Tablosu

18 sembol için tam kod tablosu. HTML kodu sütunundaki "Kopyala" butonunu kullanın.

Yıldız sembolü HTML, CSS ve JavaScript kod referans tablosu
Sembol	Adı	HTML Decimal	HTML Hex	Unicode	CSS content	JavaScript
★	Dolu Yıldız	`★`	`★`	`U+2605`	`"\2605"`	`\u2605`
☆	Boş Yıldız	`☆`	`☆`	`U+2606`	`"\2606"`	`\u2606`
✩	Beyaz Yıldız	`✩`	`✩`	`U+2729`	`"\2729"`	`\u2729`
✪	Daireli Yıldız	`✪`	`✪`	`U+272A`	`"\272A"`	`\u272A`
✫	Açık Daireli	`✫`	`✫`	`U+272B`	`"\272B"`	`\u272B`
✬	Gölge Yıldız	`✬`	`✬`	`U+272C`	`"\272C"`	`\u272C`
✭	Kalın Yıldız	`✭`	`✭`	`U+272D`	`"\272D"`	`\u272D`
✮	Işınlı Yıldız	`✮`	`✮`	`U+272E`	`"\272E"`	`\u272E`
✯	Pinwheel Yıldız	`✯`	`✯`	`U+272F`	`"\272F"`	`\u272F`
✰	Dekoratif Yıldız	`✰`	`✰`	`U+2730`	`"\2730"`	`\u2730`
✦	Dört Köşeli Dolu	`✦`	`✦`	`U+2726`	`"\2726"`	`\u2726`
✧	Dört Köşeli Boş	`✧`	`✧`	`U+2727`	`"\2727"`	`\u2727`
✱	Ağır Asterisk	`✱`	`✱`	`U+2731`	`"\2731"`	`\u2731`
✴	8 Köşeli Yıldız	`✴`	`✴`	`U+2734`	`"\2734"`	`\u2734`
✶	6 Işınlı Yıldız	`✶`	`✶`	`U+2736`	`"\2736"`	`\u2736`
❄	Kar Tanesi	`❄`	`❄`	`U+2744`	`"\2744"`	`\u2744`
❇	Parıltılı Yıldız	`❇`	`❇`	`U+2747`	`"\2747"`	`\u2747`
❈	Çark Yıldızı	`❈`	`❈`	`U+2748`	`"\2748"`	`\u2748`

Kod Türleri ve Kullanımları

🔢

HTML Decimal

Ondalık sayı sistemine dayanan HTML karakter referansıdır. ★ biçiminde yazılır. Tüm HTML sürümleri ve tarayıcılar destekler. En güvenli yöntemdir.

🔡

HTML Hexadecimal

Onaltılık sayı sistemini kullanan HTML referansıdır. ★ biçiminde yazılır. Decimal ile tamamen aynı çıktıyı verir; tercih meselesidir.

🌐

Unicode Kod Noktası

Karakterin Unicode standardındaki adresidir. U+2605 biçiminde gösterilir. Python, Java, Ruby ve C# gibi dillerde doğrudan kullanılabilir.

🎨

CSS content

CSS pseudo-elementlerinde (::before, ::after) yıldız göstermek için kullanılır. Değer tırnak içine alınır: content: "\2605"

HTML'de Yıldız Sembolü Kullanmanın Üç Yolu

Web sayfanıza ★ eklemek istediğinizde üç farklı yöntemden birini tercih edebilirsiniz. Her yöntemin avantajları ve uygun kullanım senaryoları vardır.

Birinci yol — Karakteri doğrudan yazmak: HTML dosyanıza ★ sembolünü olduğu gibi yazabilirsiniz. Bu yöntem işe yarar; ancak dosyanın UTF-8 kodlamasıyla kaydedildiğinden ve sunucunun doğru charset başlığı gönderdiğinden emin olmanız gerekir.

İkinci yol — HTML karakter referansı: ★ veya ★ yazmak, dosya kodlamasından bağımsız çalışır ve her koşulda doğru karakteri render eder. Özellikle e-posta HTML'i yazarken bu yöntemi kullanmanız önerilir.

Üçüncü yol — CSS content: Sayfa HTML'ini değiştirmeden yıldız eklemek istiyorsanız CSS pseudo-elementleri idealdir. Bu yöntemle eklenen yıldız içerik değil dekor olarak değerlendirildiğinden ekran okuyucular tarafından atlanır.

CSS ile Yıldız Derecelendirme Sistemi Yapmak

Beş yıldızlı bir ürün değerlendirme bileşeni oluşturmak için aşağıdaki yaklaşım kullanılabilir. Dolu yıldızlar için color: #f5c518 (Amazon sarısı), boş yıldızlar için color: #d1d5db değerleri standart bir görünüm sağlar:

.star-full::before { content: "\2605"; color: #f5c518; }
.star-empty::before { content: "\2606"; color: #d1d5db; }
.star-half::before { content: "\2605"; clip-path: inset(0 50% 0 0); }

JavaScript'te Yıldız Karakteri

JavaScript string içinde yıldız eklemek için \u2605 escape değerini kullanabilirsiniz. Örneğin document.title = '\u2605 ' + document.title satırı, sayfa başlığının başına dolu yıldız ekler. Bu teknik, arama sonuçlarında başlığınızın dikkat çekmesini sağlamak amacıyla yaygın biçimde uygulanır.

Alternatif olarak String.fromCharCode(9733) ile de aynı karakteri elde edebilirsiniz. Aradaki fark yalnızca yazım biçimidir; ikisi de aynı ★ karakterini üretir.

Erişilebilirlik ve ARIA Kullanımı

Yıldız sembollerini kullanırken ekran okuyucu uyumluluğuna dikkat etmek gerekir. Bir yıldız salt dekoratifse aria-hidden="true" ekleyin; bu, TalkBack ve VoiceOver gibi okuyucuların yıldızı atlamasını sağlar. Anlamlı bir derecelendirme gösteriyorsanız role="img" ve aria-label="5 üzerinden 4,2 yıldız" kombinasyonunu tercih edin.

Schema.org AggregateRating verisi eklendiğinde Google, arama sonuçlarında ürün veya kuruluşunuzun yanında yıldız derecelendirmesini zengin snippet olarak gösterebilir. Bu, tıklanma oranını (CTR) ortalama %15–30 artırabilir.

Sık Sorulan Sorular

HTML e-postada yıldız sembolü nasıl kullanılır?

E-posta HTML'inde ★ referansını kullanın. Gmail, Outlook ve Apple Mail, HTML karakter referanslarını doğru şekilde render eder. Doğrudan ★ karakterini de yazabilirsiniz; ancak bazı e-posta istemcileri kodlama sorunlarına yol açabilir.

CSS content değerinde neden tırnak kullanılıyor?

CSS content özelliği bir string değeri bekler. "\2605" yazımında dış tırnaklar string sınırını belirtirken, \2605 içerideki Unicode escape değeridir. Tırnaklar olmadan bu değer geçersiz CSS olur.

SEO için title'a yıldız eklemeli miyim?

Tek bir ★ eklemek, başlığınızın arama sonuçlarında görsel olarak öne çıkmasını sağlar ve CTR'ı artırabilir. Ancak birden fazla yıldız veya aşırı özel karakter kullanımı Google'ın kalite politikalarını ihlal edebilir.