URL Encoding ve Decoding: Karakter Kodlama Rehberi

URL encoding (percent encoding) ve decoding işlemlerini öğrenin. Özel karakterler, UTF-8 kodlama ve farklı programlama dillerinde implementasyon.

URL encoding (yüzde kodlama), URL'lerde güvenli olmayan veya özel karakterleri temsil etmek için kullanılan bir mekanizmadır. Bu rehberde, URL encoding ve decoding işlemlerini, yaygın kullanım senaryolarını ve farklı programlama dillerindeki implementasyonları inceleyeceğiz.

URL Encoding Nedir?

URL encoding, ASCII karakter setinde bulunmayan veya URL'lerde özel anlamı olan karakterleri yüzde işareti (%) ve iki onaltılık rakamla temsil etme yöntemidir.

Temel Kurallar

Yaygın Karakter Kodlamaları

KarakterEncodedAçıklama
Boşluk%20Space karakteri
!%21Ünlem işareti
#%23Hash/Pound
$%24Dolar işareti
&%26Ampersand
+%2BArtı işareti
/%2FSlash
=%3DEşittir
?%3FSoru işareti
@%40At işareti

Türkçe Karakter Kodlamaları

// UTF-8 kodlama
ş → %C5%9F
ğ → %C4%9F
ü → %C3%BC
ö → %C3%B6
ç → %C3%A7
ı → %C4%B1
İ → %C4%B0

// Örnek URL
https://site.com/ürün → https://site.com/%C3%BCr%C3%BCn

JavaScript ile URL Encoding

encodeURIComponent()

// Tam URL parçası kodlama
const text = "Türkçe içerik örneği";
const encoded = encodeURIComponent(text);
console.log(encoded);
// T%C3%BCrk%C3%A7e%20i%C3%A7erik%20%C3%B6rne%C4%9Fi

// Decoding
const decoded = decodeURIComponent(encoded);
console.log(decoded);
// Türkçe içerik örneği

encodeURI() vs encodeURIComponent()

const url = "https://site.com/sayfa?q=test değer";

// encodeURI - URL yapısını korur
console.log(encodeURI(url));
// https://site.com/sayfa?q=test%20de%C4%9Fer

// encodeURIComponent - Her şeyi kodlar
console.log(encodeURIComponent(url));
// https%3A%2F%2Fsite.com%2Fsayfa%3Fq%3Dtest%20de%C4%9Fer

PHP ile URL Encoding

<?php
// URL encoding
$text = "Türkçe içerik örneği";
$encoded = urlencode($text);
echo $encoded;
// T%C3%BCrk%C3%A7e+i%C3%A7erik+%C3%B6rne%C4%9Fi

// Raw URL encoding (boşluk %20 olur)
$rawEncoded = rawurlencode($text);
echo $rawEncoded;
// T%C3%BCrk%C3%A7e%20i%C3%A7erik%20%C3%B6rne%C4%9Fi

// Decoding
$decoded = urldecode($encoded);
echo $decoded;
// Türkçe içerik örneği

Python ile URL Encoding

from urllib.parse import quote, unquote, urlencode

# Basit encoding
text = "Türkçe içerik örneği"
encoded = quote(text)
print(encoded)
# T%C3%BCrk%C3%A7e%20i%C3%A7erik%20%C3%B6rne%C4%9Fi

# Query string oluşturma
params = {'q': 'arama terimi', 'lang': 'tr'}
query_string = urlencode(params)
print(query_string)
# q=arama+terimi&lang=tr

# Decoding
decoded = unquote(encoded)
print(decoded)
# Türkçe içerik örneği

URL Encoding ve SEO

SEO için Öneriler

Örnek Karşılaştırma

// Encoded (okunması zor)
https://site.com/blog/%C3%BCr%C3%BCn-%C3%B6zellikleri

// Slug ile (okunması kolay, SEO dostu)
https://site.com/blog/urun-ozellikleri

Query String Encoding

// JavaScript - URLSearchParams
const params = new URLSearchParams();
params.append('q', 'arama terimi');
params.append('kategori', 'elektronik');
console.log(params.toString());
// q=arama+terimi&kategori=elektronik

// URL oluşturma
const url = new URL('https://site.com/arama');
url.search = params.toString();
console.log(url.href);
// https://site.com/arama?q=arama+terimi&kategori=elektronik

Base64 vs URL Encoding

// Base64 - Binary veri için
const base64 = btoa('Hello World');
// SGVsbG8gV29ybGQ=

// URL-safe Base64
const urlSafeBase64 = base64
  .replace(/\+/g, '-')
  .replace(/\//g, '_')
  .replace(/=/g, '');

// URL Encoding - URL'de güvenli olmayan karakterler için
const urlEncoded = encodeURIComponent('Hello World');
// Hello%20World

Yaygın Hatalar

Çift Encoding

// YANLIŞ - Çift encoding
const text = "test değer";
const doubleEncoded = encodeURIComponent(encodeURIComponent(text));
// test%2520de%25C4%259Fer

// DOĞRU - Tek encoding
const encoded = encodeURIComponent(text);
// test%20de%C4%9Fer

Sonuç

URL encoding, web geliştirmede temel bir kavramdır. Özel karakterlerin doğru şekilde kodlanması, URL'lerin tarayıcılar ve sunucular arasında güvenli şekilde iletilmesini sağlar. SEO açısından, encoded URL'ler yerine slug kullanmak hem kullanıcı deneyimi hem de arama motoru optimizasyonu için daha iyidir.