{"id":44337,"date":"2026-08-26T09:01:56","date_gmt":"2026-08-26T06:01:56","guid":{"rendered":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/"},"modified":"2026-08-26T09:02:21","modified_gmt":"2026-08-26T06:02:21","slug":"sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk","status":"publish","type":"post","link":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/","title":{"rendered":"S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk"},"content":{"rendered":"<h2>S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk<\/h2>\n<p>Hi\u00e7 kendi web sitenizin olmas\u0131n\u0131 hayal ettiniz mi? Belki bir hobinizi sergilemek, belki de k\u00fc\u00e7\u00fck bir i\u015fletmeniz i\u00e7in dijital bir vitrin olu\u015fturmak istiyorsunuz. Ancak nereden ba\u015flayaca\u011f\u0131n\u0131z\u0131 bilmiyorsunuz. Bu makale, web geli\u015ftirme d\u00fcnyas\u0131na ad\u0131m atacak, teknik bilgisi olmayan her bireyin ilk canl\u0131 web sitesini olu\u015fturma s\u00fcrecini ad\u0131m ad\u0131m ele alacakt\u0131r. Teknik terimlerin anla\u015f\u0131l\u0131r bir dille a\u00e7\u0131kland\u0131\u011f\u0131, pratik \u00f6rneklerle desteklendi\u011fi bu yolculukta, siz de hayalinizdeki web sitesini hayata ge\u00e7irebileceksiniz.<\/p>\n<h2>Web Sitesi Olu\u015fturma Temelleri: Neler Bilmelisiniz?<\/h2>\n<p>Bir web sitesi olu\u015fturmak, asl\u0131nda bir binan\u0131n temelini atmak gibidir. Sa\u011flam bir temel olmadan, \u00fczerine ne kadar s\u00fcsl\u00fc detaylar eklerseniz ekleyin, yap\u0131 ayakta kalamaz. Bu nedenle, web geli\u015ftirmenin temel yap\u0131 ta\u015flar\u0131n\u0131 anlamak b\u00fcy\u00fck \u00f6nem ta\u015f\u0131r. Bu temel yap\u0131 ta\u015flar\u0131, web sitenizin i\u00e7eri\u011fini olu\u015fturan <strong>HTML (HyperText Markup Language &#8211; Hiper Metin \u0130\u015faret Dili)<\/strong>, web sitenizin g\u00f6rsel tasar\u0131m\u0131n\u0131 ve d\u00fczenini belirleyen <strong>CSS (Cascading Style Sheets &#8211; Basamakl\u0131 Stil Sayfalar\u0131)<\/strong> ve web sitenize etkile\u015fim katman\u0131z\u0131 sa\u011flayan <strong>JavaScript<\/strong>&#8216;tir. Bu \u00fc\u00e7 teknoloji, modern web sitelerinin vazge\u00e7ilmez sacaya\u011f\u0131d\u0131r. Ba\u015flang\u0131\u00e7 seviyesinde, ilk web siteniz i\u00e7in HTML ve CSS&#8217;e odaklanmak yeterli olacakt\u0131r. JavaScript, daha sonra sitenize dinamik \u00f6zellikler eklemek istedi\u011finizde devreye girecektir.<\/p>\n<h3>HTML: Web Sitenizin \u0130skeleti<\/h3>\n<p>HTML, bir web sayfas\u0131n\u0131n i\u00e7eri\u011fini yap\u0131land\u0131rmak i\u00e7in kullan\u0131lan standart bir i\u015faretleme dilidir. D\u00fc\u015f\u00fcn\u00fcn ki bir gazete haz\u0131rl\u0131yorsunuz. Gazetenin ba\u015fl\u0131\u011f\u0131, haber metinleri, resimler, altyaz\u0131lar&#8230; \u0130\u015fte HTML, bu farkl\u0131 i\u00e7erik \u00f6\u011felerini tan\u0131mlaman\u0131z\u0131 sa\u011flar. HTML belgeleri, <strong>etiketler (tags)<\/strong> ad\u0131 verilen \u00f6zel anahtar kelimelerle olu\u015fturulur. Bu etiketler, taray\u0131c\u0131ya i\u00e7eri\u011fin ne oldu\u011funu ve nas\u0131l g\u00f6r\u00fcnt\u00fclenmesi gerekti\u011fini s\u00f6yler. \u00d6rne\u011fin, bir ba\u015fl\u0131k olu\u015fturmak i\u00e7in <code>&lt;h1&gt;<\/code> etiketini kullan\u0131rs\u0131n\u0131z. Paragraflar i\u00e7in <code>&lt;p&gt;<\/code> etiketi, g\u00f6rseller i\u00e7in <code>&lt;img&gt;<\/code> etiketi kullan\u0131l\u0131r. Her etiketin bir ba\u015flang\u0131c\u0131 ve bir de sonu vard\u0131r (baz\u0131 istisnalar hari\u00e7). Bu etiketler, i\u00e7eri\u011fi <strong>elementler<\/strong> halinde grupland\u0131r\u0131r. Bir web sitesi olu\u015ftururken, bu etiketleri do\u011fru \u015fekilde kullanarak i\u00e7eri\u011finizi mant\u0131ksal bir hiyerar\u015fi i\u00e7inde d\u00fczenlersiniz. Bu yap\u0131, hem arama motorlar\u0131n\u0131n sitenizi daha iyi anlamas\u0131na yard\u0131mc\u0131 olur hem de eri\u015filebilirlik a\u00e7\u0131s\u0131ndan \u00f6nemlidir. \u00d6rne\u011fin, bir makale yazarken, ana ba\u015fl\u0131klar\u0131 <code>&lt;h2&gt;<\/code> ile, alt ba\u015fl\u0131klar\u0131 <code>&lt;h3&gt;<\/code> ile belirtmek, hem okuyucunun hem de arama motorlar\u0131n\u0131n i\u00e7eri\u011fi daha kolay takip etmesini sa\u011flar. Ba\u015flang\u0131\u00e7 i\u00e7in en s\u0131k kullan\u0131lan HTML etiketlerini \u00f6\u011frenmek, web sitenizin temelini sa\u011flam atman\u0131z\u0131 sa\u011flayacakt\u0131r.<\/p>\n<h3>CSS: Web Sitenizin Makyaj\u0131 ve Dekorasyonu<\/h3>\n<p>HTML, i\u00e7eri\u011finizi yap\u0131land\u0131r\u0131rken, CSS bu i\u00e7eri\u011fin nas\u0131l g\u00f6r\u00fcnece\u011fini belirler. Yani, HTML web sitenizin iskeletiyse, CSS de onun k\u0131yafeti, makyaj\u0131 ve dekorasyonudur. Renkler, yaz\u0131 tipleri, kenarl\u0131klar, bo\u015fluklar, d\u00fczen&#8230; Hepsi CSS ile kontrol edilir. CSS, web sitenizin g\u00f6rsel kimli\u011fini olu\u015fturur. Bir d\u00fc\u015f\u00fcn\u00fcn, ayn\u0131 HTML yap\u0131s\u0131na sahip iki farkl\u0131 web sitesi, kullan\u0131lan CSS sayesinde tamamen farkl\u0131 g\u00f6r\u00fcnebilir. Birisi modern ve minimalist olabilirken, di\u011feri daha canl\u0131 ve renkli olabilir. CSS, <strong>se\u00e7iciler (selectors)<\/strong> arac\u0131l\u0131\u011f\u0131yla belirli HTML elementlerini hedefler ve bu elementlere stil kurallar\u0131 uygular. \u00d6rne\u011fin, t\u00fcm paragraflar\u0131n yaz\u0131 rengini de\u011fi\u015ftirmek istedi\u011finizde, CSS&#8217;te bir paragraf se\u00e7icisi kullanarak bu kural\u0131 uygulayabilirsiniz. CSS&#8217;in en b\u00fcy\u00fck avantajlar\u0131ndan biri, stil kurallar\u0131n\u0131 tek bir yerde toplayabilmesidir. Bu, web sitenizin g\u00f6r\u00fcn\u00fcm\u00fcn\u00fc g\u00fcncellemek istedi\u011finizde b\u00fcy\u00fck kolayl\u0131k sa\u011flar. Tek bir CSS dosyas\u0131nda yapaca\u011f\u0131n\u0131z bir de\u011fi\u015fiklik, sitenizin her yerinde ayn\u0131 etkiyi yarat\u0131r. Bu, <strong>s\u00fcrd\u00fcr\u00fclebilirlik<\/strong> a\u00e7\u0131s\u0131ndan da kritik \u00f6neme sahiptir. Ayr\u0131ca, CSS ile duyarl\u0131 (responsive) tasar\u0131mlar olu\u015fturabilirsiniz. Duyarl\u0131 tasar\u0131m, web sitenizin farkl\u0131 ekran boyutlar\u0131na (bilgisayar monit\u00f6r\u00fc, tablet, cep telefonu) uyum sa\u011flayarak her cihazda iyi g\u00f6r\u00fcnmesini sa\u011flar. Bu, g\u00fcn\u00fcm\u00fcz mobil odakl\u0131 d\u00fcnyas\u0131nda olmazsa olmazd\u0131r. Ba\u015flang\u0131\u00e7ta temel CSS \u00f6zelliklerini \u00f6\u011frenmek, web sitenize istedi\u011finiz estetik dokunu\u015flar\u0131 katman\u0131z\u0131 sa\u011flayacakt\u0131r.<\/p>\n<h2>\u0130lk Web Sitenizi Olu\u015fturma: Ad\u0131m Ad\u0131m Rehber<\/h2>\n<p>Teorik bilgileri bir kenara b\u0131rak\u0131p, \u015fimdi i\u015fin pratik k\u0131sm\u0131na ge\u00e7me zaman\u0131. Kendi ilk canl\u0131 web sitenizi olu\u015fturmak i\u00e7in izlemeniz gereken ad\u0131mlar\u0131 detayl\u0131ca inceleyece\u011fiz. Bu s\u00fcre\u00e7, g\u00f6z\u00fcn\u00fczde b\u00fcy\u00fctt\u00fc\u011f\u00fcn\u00fcz kadar karma\u015f\u0131k de\u011fil. Sab\u0131r ve do\u011fru ad\u0131mlarla, siz de bir web sitesini yay\u0131na alabilirsiniz.<\/p>\n<h3>1. Fikir Geli\u015ftirme ve Planlama<\/h3>\n<p>Her b\u00fcy\u00fck projenin ba\u015flang\u0131c\u0131 bir fikirdir. Web siteniz ne hakk\u0131nda olacak? Hangi bilgileri sunacak? Kimlere hitap edecek? Bu sorular\u0131n cevaplar\u0131, projenizin temelini olu\u015fturacakt\u0131r. \u00d6rne\u011fin, bir foto\u011fraf\u00e7\u0131ysan\u0131z, portf\u00f6y sitenizde en iyi \u00e7al\u0131\u015fmalar\u0131n\u0131z\u0131 sergilemek isteyebilirsiniz. Bir yemek blogu yazar\u0131ysan\u0131z, tariflerinizi d\u00fczenli bir \u015fekilde sunman\u0131z gerekecektir. Planlama a\u015famas\u0131nda, sitenizin ana sayfalar\u0131n\u0131 belirleyin. Hangi sayfalar olacak? (Anasayfa, Hakk\u0131m\u0131zda, \u0130leti\u015fim, Blog vb.) Her sayfada hangi i\u00e7erikler yer alacak? Bu, projenizin karma\u015f\u0131kl\u0131\u011f\u0131n\u0131 anlaman\u0131za ve kaynaklar\u0131n\u0131z\u0131 do\u011fru y\u00f6nlendirmenize yard\u0131mc\u0131 olacakt\u0131r. Bu a\u015famada basit bir \u00e7izim veya zihin haritas\u0131 (mind map) olu\u015fturmak, fikirlerinizi somutla\u015ft\u0131rmada faydal\u0131 olabilir. \u00d6rne\u011fin, bir hobi olarak ba\u015flad\u0131\u011f\u0131n\u0131z ah\u015fap oymac\u0131l\u0131\u011f\u0131 \u00fcr\u00fcnlerinizi sergilemek istedi\u011finiz bir web sitesi i\u00e7in \u015f\u00f6yle bir planlama yapabilirsiniz: Ana sayfa (en pop\u00fcler \u00fcr\u00fcnler, k\u0131sa tan\u0131t\u0131m), \u00dcr\u00fcnler sayfas\u0131 (kategorilere ayr\u0131lm\u0131\u015f \u00fcr\u00fcnler, her \u00fcr\u00fcn i\u00e7in detayl\u0131 bilgi ve g\u00f6rseller), Hakk\u0131m\u0131zda sayfas\u0131 (kendinizden ve hobinizden bahseden yaz\u0131), \u0130leti\u015fim sayfas\u0131 (ileti\u015fim formu veya e-posta bilgileri). Bu basit planlama, ilerleyen ad\u0131mlarda size yol g\u00f6sterecektir.<\/p>\n<h3>2. Gerekli Ara\u00e7lar\u0131 Haz\u0131rlama<\/h3>\n<p>Web sitesi olu\u015fturmak i\u00e7in karma\u015f\u0131k yaz\u0131l\u0131mlara veya pahal\u0131 lisanslara ihtiyac\u0131n\u0131z yok. Ba\u015flang\u0131\u00e7 i\u00e7in ihtiyac\u0131n\u0131z olanlar olduk\u00e7a temel:<\/p>\n<ul>\n<li><strong>Metin D\u00fczenleyici (Text Editor):<\/strong> HTML ve CSS kodlar\u0131n\u0131z\u0131 yazaca\u011f\u0131n\u0131z programlard\u0131r. Notepad (Windows) veya TextEdit (Mac) gibi basit metin d\u00fczenleyicileri kullanabilirsiniz. Ancak daha geli\u015fmi\u015f \u00f6zellikler sunan \u00fccretsiz edit\u00f6rler (\u00f6rne\u011fin, <strong>Visual Studio Code<\/strong>, <strong>Sublime Text<\/strong>, <strong>Atom<\/strong>) kod yazmay\u0131 \u00e7ok daha kolay hale getirir. Bu edit\u00f6rler, kod renklendirme, otomatik tamamlama gibi \u00f6zelliklerle hata yapma olas\u0131l\u0131\u011f\u0131n\u0131z\u0131 azalt\u0131r.<\/li>\n<li><strong>Web Taray\u0131c\u0131s\u0131 (Web Browser):<\/strong> Olu\u015fturdu\u011funuz web sitesini g\u00f6r\u00fcnt\u00fclemek i\u00e7in kullanaca\u011f\u0131n\u0131z programlard\u0131r. Chrome, Firefox, Safari, Edge gibi taray\u0131c\u0131lar bu ama\u00e7la kullan\u0131l\u0131r. Farkl\u0131 taray\u0131c\u0131larda sitenizin nas\u0131l g\u00f6r\u00fcnd\u00fc\u011f\u00fcn\u00fc test etmek, uyumluluk a\u00e7\u0131s\u0131ndan \u00f6nemlidir.<\/li>\n<li><strong>FTP \u0130stemcisi (FTP Client):<\/strong> Web sitenizi internette bar\u0131nd\u0131racak bir <strong>hosting<\/strong> firmas\u0131 se\u00e7ti\u011finizde, dosyalar\u0131n\u0131z\u0131 bu sunucuya y\u00fcklemek i\u00e7in bir FTP istemcisine ihtiyac\u0131n\u0131z olacakt\u0131r. FileZilla gibi \u00fccretsiz FTP istemcileri bu i\u015f i\u00e7in idealdir.<\/li>\n<\/ul>\n<p>Bu ara\u00e7lar\u0131 bilgisayar\u0131n\u0131za kurduktan sonra, web geli\u015ftirme yolculu\u011funuza haz\u0131rs\u0131n\u0131z demektir. \u00d6zellikle metin d\u00fczenleyici se\u00e7imi, kodlama deneyiminizi do\u011frudan etkileyecektir. Visual Studio Code, g\u00fcn\u00fcm\u00fczde en pop\u00fcler ve kapsaml\u0131 \u00fccretsiz se\u00e7eneklerden biridir. Kurulumu ve kullan\u0131m\u0131 olduk\u00e7a basittir.<\/p>\n<h3>3. HTML Yap\u0131s\u0131n\u0131 Olu\u015fturma<\/h3>\n<p>\u015eimdi ilk HTML dosyam\u0131z\u0131 olu\u015ftural\u0131m. Bo\u015f bir metin d\u00fczenleyici a\u00e7\u0131n ve a\u015fa\u011f\u0131daki temel yap\u0131y\u0131 yap\u0131\u015ft\u0131r\u0131n:<\/p>\n<p>Bu kodu <code>index.html<\/code> ad\u0131yla kaydedin. <code>index.html<\/code>, web sitelerinin varsay\u0131lan giri\u015f sayfas\u0131d\u0131r. Bu dosyay\u0131 web taray\u0131c\u0131n\u0131zda a\u00e7t\u0131\u011f\u0131n\u0131zda, &#8220;Ho\u015f Geldiniz!&#8221; ba\u015fl\u0131\u011f\u0131n\u0131 ve alt\u0131ndaki paragraf\u0131 g\u00f6receksiniz. <code>&lt;!DOCTYPE html&gt;<\/code>, bu belgenin bir HTML5 belgesi oldu\u011funu belirtir. <code>&lt;html&gt;<\/code> etiketi, t\u00fcm HTML i\u00e7eri\u011fini kapsar. <code>&lt;head&gt;<\/code> b\u00f6l\u00fcm\u00fc, taray\u0131c\u0131ya g\u00f6nderilen ancak sayfada do\u011frudan g\u00f6r\u00fcnmeyen meta bilgileri i\u00e7erir (karakter seti, sayfa ba\u015fl\u0131\u011f\u0131 gibi). <code>&lt;body&gt;<\/code> b\u00f6l\u00fcm\u00fc ise web sayfas\u0131nda g\u00f6r\u00fcnen t\u00fcm i\u00e7eri\u011fi bar\u0131nd\u0131r\u0131r. Ba\u015fl\u0131klar i\u00e7in <code>&lt;h1&gt;<\/code>, paragraflar i\u00e7in <code>&lt;p&gt;<\/code> etiketlerini kulland\u0131\u011f\u0131m\u0131z\u0131 g\u00f6rebilirsiniz. Bu temel yap\u0131, her web sitesinin ba\u015flang\u0131\u00e7 noktas\u0131d\u0131r.<\/p>\n<h3>4. CSS ile Tasar\u0131m Ekleme<\/h3>\n<p>HTML yap\u0131m\u0131z\u0131 olu\u015fturduk, \u015fimdi bu yap\u0131ya renk ve stil katma zaman\u0131. Yeni bir metin d\u00fczenleyici a\u00e7\u0131n ve a\u015fa\u011f\u0131daki CSS kodunu yap\u0131\u015ft\u0131r\u0131n:<\/p>\n<pre><code>body {\n  font-family: Arial, sans-serif;\n  margin: 20px;\n  background-color: #f4f4f4;\n  color: #333;\n}\n\nh1 {\n  color: #0056b3;\n}\n\np {\n  line-height: 1.6;\n}<\/code><\/pre>\n<p>Bu kodu <code>style.css<\/code> ad\u0131yla kaydedin. \u015eimdi, bu CSS dosyas\u0131n\u0131 HTML dosyam\u0131za ba\u011flamam\u0131z gerekiyor. <code>index.html<\/code> dosyan\u0131z\u0131n <code>&lt;head&gt;<\/code> b\u00f6l\u00fcm\u00fcne a\u015fa\u011f\u0131daki sat\u0131r\u0131 ekleyin:<\/p>\n<p>Bu sat\u0131r, taray\u0131c\u0131ya <code>style.css<\/code> dosyas\u0131n\u0131 y\u00fcklemesini ve HTML i\u00e7eri\u011fine uygulamas\u0131n\u0131 s\u00f6yler. \u015eimdi <code>index.html<\/code> dosyas\u0131n\u0131 tekrar taray\u0131c\u0131n\u0131zda a\u00e7t\u0131\u011f\u0131n\u0131zda, metinlerin Arial yaz\u0131 tipinde oldu\u011funu, arka plan\u0131n a\u00e7\u0131k gri oldu\u011funu ve ba\u015fl\u0131\u011f\u0131n mavi renkte g\u00f6r\u00fcnd\u00fc\u011f\u00fcn\u00fc fark edeceksiniz. <code>body<\/code> se\u00e7icisi, t\u00fcm sayfan\u0131n genel stilini belirler. <code>h1<\/code> se\u00e7icisi ba\u015fl\u0131\u011f\u0131n rengini, <code>p<\/code> se\u00e7icisi ise paragraflar\u0131n sat\u0131r aral\u0131\u011f\u0131n\u0131 ayarlar. Bu, sadece k\u00fc\u00e7\u00fck bir ba\u015flang\u0131\u00e7t\u0131r. CSS ile yapabilecekleriniz sonsuzdur.<\/p>\n<h3>5. Dosyalar\u0131 Yerel Olarak Test Etme<\/h3>\n<p>\u015eimdiye kadar t\u00fcm \u00e7al\u0131\u015fmalar\u0131 bilgisayar\u0131n\u0131zda, yani yerel olarak yapt\u0131n\u0131z. Bu, geli\u015ftirme s\u00fcrecinin en \u00f6nemli a\u015famas\u0131d\u0131r. Olu\u015fturdu\u011funuz <code>index.html<\/code> ve <code>style.css<\/code> dosyalar\u0131n\u0131 ayn\u0131 klas\u00f6re kaydederek, taray\u0131c\u0131n\u0131zda a\u00e7t\u0131\u011f\u0131n\u0131zda de\u011fi\u015fiklikleri an\u0131nda g\u00f6rebilirsiniz. Bu, h\u0131zl\u0131 deneme yan\u0131lma yapman\u0131z\u0131 ve hatalar\u0131 an\u0131nda d\u00fczeltmenizi sa\u011flar. Bu a\u015famada, farkl\u0131 HTML etiketlerini deneyebilir, CSS ile farkl\u0131 stiller uygulayabilir ve sonu\u00e7lar\u0131 an\u0131nda g\u00f6zlemleyebilirsiniz. \u00d6rne\u011fin, bir g\u00f6rsel eklemek i\u00e7in <code>&lt;img src=\"resim.jpg\" alt=\"A\u00e7\u0131klama\"&gt;<\/code> etiketini kullanabilirsiniz. <code>src<\/code> \u00f6zniteli\u011fi g\u00f6rselin yolunu, <code>alt<\/code> \u00f6zniteli\u011fi ise g\u00f6rselin y\u00fcklenmemesi durumunda g\u00f6sterilecek metni belirtir. G\u00f6rseli de ayn\u0131 klas\u00f6re kaydetmeyi unutmay\u0131n.<\/p>\n<h2>Web Sitenizi Canl\u0131ya Alma (Hosting ve Alan Ad\u0131)<\/h2>\n<p>Yerel olarak olu\u015fturdu\u011funuz web sitesini t\u00fcm d\u00fcnyan\u0131n eri\u015fimine a\u00e7mak i\u00e7in iki temel \u015feye ihtiyac\u0131n\u0131z var: <strong>Hosting (Bar\u0131nd\u0131rma)<\/strong> ve bir <strong>Alan Ad\u0131 (Domain Name)<\/strong>. Bu iki kavram, web sitenizin internetteki adresi ve evi gibidir.<\/p>\n<h3>Hosting: Web Sitenizin Evi<\/h3>\n<p>Hosting, web sitenizin dosyalar\u0131n\u0131n (HTML, CSS, resimler vb.) sakland\u0131\u011f\u0131 ve internet \u00fczerinden eri\u015filebilir hale getirildi\u011fi sunucular anlam\u0131na gelir. Bu sunucular, 7\/24 \u00e7al\u0131\u015f\u0131r ve internet ba\u011flant\u0131s\u0131 olan herkesin sitenize ula\u015fmas\u0131n\u0131 sa\u011flar. Bir\u00e7ok hosting firmas\u0131 bulunur ve ba\u015flang\u0131\u00e7 seviyesi i\u00e7in uygun fiyatl\u0131 payla\u015f\u0131ml\u0131 hosting (shared hosting) paketleri mevcuttur. Bu paketler, ayn\u0131 sunucuyu birden fazla kullan\u0131c\u0131yla payla\u015fman\u0131z\u0131 sa\u011flar ve maliyeti d\u00fc\u015f\u00fcr\u00fcr. Hosting se\u00e7imi yaparken dikkat etmeniz gerekenler \u015funlard\u0131r:<\/p>\n<ul>\n<li><strong>G\u00fcvenilirlik ve H\u0131z:<\/strong> Sitenizin h\u0131zl\u0131 a\u00e7\u0131lmas\u0131 ve kesintisiz \u00e7al\u0131\u015fmas\u0131 \u00f6nemlidir.<\/li>\n<li><strong>Destek:<\/strong> Kar\u015f\u0131la\u015fabilece\u011finiz teknik sorunlarda h\u0131zl\u0131 ve etkili destek alabilmeniz kritik \u00f6neme sahiptir.<\/li>\n<li><strong>Depolama Alan\u0131 ve Bant Geni\u015fli\u011fi:<\/strong> Sitenizin boyutuna ve beklenen ziyaret\u00e7i trafi\u011fine g\u00f6re yeterli alan ve bant geni\u015fli\u011fi sunmal\u0131d\u0131r.<\/li>\n<li><strong>Fiyat:<\/strong> B\u00fct\u00e7enize uygun bir se\u00e7enek olmal\u0131d\u0131r.<\/li>\n<\/ul>\n<p>T\u00fcrkiye&#8217;de ve d\u00fcnyada bir\u00e7ok hosting sa\u011flay\u0131c\u0131s\u0131 bulunmaktad\u0131r. Ba\u015flang\u0131\u00e7 i\u00e7in pop\u00fcler se\u00e7enekler aras\u0131nda GoDaddy, Hostinger, Natro, Turhost gibi firmalar yer al\u0131r. Bu firmalar\u0131n sitelerini ziyaret ederek paketlerini kar\u015f\u0131la\u015ft\u0131rabilirsiniz.<\/p>\n<h3>Alan Ad\u0131: Web Sitenizin Adresi<\/h3>\n<p>Alan ad\u0131, web sitenizin internetteki benzersiz adresidir. \u00d6rne\u011fin, <code>www.benimilkwebim.com<\/code> gibi. Kullan\u0131c\u0131lar bu adresi taray\u0131c\u0131lar\u0131na yazarak sitenize ula\u015f\u0131rlar. Alan adlar\u0131 genellikle y\u0131ll\u0131k olarak kiralan\u0131r. Pop\u00fcler uzant\u0131lar <code>.com<\/code>, <code>.org<\/code>, <code>.net<\/code>&#8216;tir. T\u00fcrkiye&#8217;ye \u00f6zg\u00fc uzant\u0131lar ise <code>.com.tr<\/code>, <code>.net.tr<\/code> gibi se\u00e7eneklerdir. Alan ad\u0131n\u0131z\u0131 se\u00e7erken:<\/p>\n<ul>\n<li><strong>K\u0131sa ve Ak\u0131lda Kal\u0131c\u0131 Olmal\u0131:<\/strong> Kolay hat\u0131rlanabilir ve yaz\u0131labilir olmal\u0131d\u0131r.<\/li>\n<li><strong>Markan\u0131zla veya \u0130\u00e7eri\u011finizle \u0130lgili Olmal\u0131:<\/strong> Sitenizin ne hakk\u0131nda oldu\u011funu yans\u0131tmal\u0131d\u0131r.<\/li>\n<li><strong>Benzersiz Olmal\u0131:<\/strong> Daha \u00f6nce al\u0131nmam\u0131\u015f olmal\u0131d\u0131r.<\/li>\n<\/ul>\n<p>Alan ad\u0131n\u0131z\u0131, hosting firman\u0131z arac\u0131l\u0131\u011f\u0131yla veya farkl\u0131 alan ad\u0131 kay\u0131t firmalar\u0131ndan (domain registrar) sat\u0131n alabilirsiniz. Alan ad\u0131n\u0131z\u0131 ald\u0131ktan sonra, hosting hesab\u0131n\u0131zla ili\u015fkilendirmeniz gerekecektir. Bu i\u015flem genellikle hosting firman\u0131z\u0131n kontrol panelinden yap\u0131l\u0131r ve olduk\u00e7a basittir.<\/p>\n<h3>Dosyalar\u0131 Sunucuya Y\u00fckleme (FTP)<\/h3>\n<p>Alan ad\u0131n\u0131z ve hosting hesab\u0131n\u0131z haz\u0131r oldu\u011funda, yerel bilgisayar\u0131n\u0131zda olu\u015fturdu\u011funuz <code>index.html<\/code>, <code>style.css<\/code> ve di\u011fer t\u00fcm dosyalar\u0131n\u0131z\u0131 hosting sunucusuna y\u00fcklemeniz gerekir. Bu i\u015flem i\u00e7in bir <strong>FTP (File Transfer Protocol &#8211; Dosya Transfer Protokol\u00fc)<\/strong> istemcisi kullan\u0131rs\u0131n\u0131z. En yayg\u0131n kullan\u0131lan ve \u00fccretsiz FTP istemcilerinden biri <strong>FileZilla<\/strong>&#8216;d\u0131r. FileZilla&#8217;y\u0131 indirip kurduktan sonra, hosting firman\u0131z\u0131n size sa\u011flad\u0131\u011f\u0131 FTP bilgileri (sunucu adresi, kullan\u0131c\u0131 ad\u0131, \u015fifre) ile ba\u011flant\u0131 kurabilirsiniz. Ba\u011flant\u0131 kurulduktan sonra, bilgisayar\u0131n\u0131zdaki dosyalar\u0131n\u0131z\u0131 (sol panel) sunucudaki ilgili klas\u00f6re (genellikle <code>public_html<\/code> veya <code>www<\/code> klas\u00f6r\u00fc) s\u00fcr\u00fckleyip b\u0131rakarak y\u00fckleyebilirsiniz. T\u00fcm dosyalar\u0131n\u0131z y\u00fcklendikten sonra, alan ad\u0131n\u0131z\u0131 taray\u0131c\u0131n\u0131zda yazd\u0131\u011f\u0131n\u0131zda web sitenizin canl\u0131 olarak g\u00f6r\u00fcnd\u00fc\u011f\u00fcn\u00fc g\u00f6receksiniz.<\/p>\n<h2>\u0130leri D\u00fczey Konular ve \u0130pu\u00e7lar\u0131<\/h2>\n<p>\u0130lk web sitenizi ba\u015far\u0131yla yay\u0131na ald\u0131ktan sonra, daha fazla \u00f6zellik eklemek ve sitenizi geli\u015ftirmek isteyebilirsiniz. Bu b\u00f6l\u00fcmde, web geli\u015ftirme yolculu\u011funuzda size yard\u0131mc\u0131 olacak baz\u0131 ileri d\u00fczey konulara ve pratik ipu\u00e7lar\u0131na de\u011finece\u011fiz.<\/p>\n<h3>Duyarl\u0131 Tasar\u0131m (Responsive Design)<\/h3>\n<p>G\u00fcn\u00fcm\u00fczde kullan\u0131c\u0131lar\u0131n b\u00fcy\u00fck bir k\u0131sm\u0131 web sitelerine mobil cihazlardan eri\u015fmektedir. Bu nedenle, web sitenizin farkl\u0131 ekran boyutlar\u0131na (telefon, tablet, bilgisayar) uyum sa\u011flamas\u0131 kritik \u00f6neme sahiptir. Buna <strong>duyarl\u0131 tasar\u0131m<\/strong> denir. CSS&#8217;te <strong>medya sorgular\u0131 (media queries)<\/strong> kullanarak farkl\u0131 ekran boyutlar\u0131 i\u00e7in farkl\u0131 stiller tan\u0131mlayabilirsiniz. \u00d6rne\u011fin, k\u00fc\u00e7\u00fck ekranlarda yaz\u0131 boyutunu k\u00fc\u00e7\u00fcltebilir, men\u00fcy\u00fc farkl\u0131 bir \u015fekilde g\u00f6sterebilir veya baz\u0131 \u00f6\u011feleri gizleyebilirsiniz. Bu, kullan\u0131c\u0131 deneyimini \u00f6nemli \u00f6l\u00e7\u00fcde iyile\u015ftirir.<\/p>\n<p>\u00d6rnek bir medya sorgusu:<\/p>\n<pre><code>@media (max-width: 768px) {\n  body {\n    font-size: 14px;\n  }\n  h1 {\n    font-size: 24px;\n  }\n}<\/code><\/pre>\n<p>Bu kod, ekran geni\u015fli\u011fi 768 pikselden az oldu\u011funda, genel yaz\u0131 boyutunu 14px&#8217;e, h1 ba\u015fl\u0131\u011f\u0131n\u0131n boyutunu ise 24px&#8217;e d\u00fc\u015f\u00fcr\u00fcr.<\/p>\n<h3>JavaScript ile Etkile\u015fim Katma<\/h3>\n<p>HTML ve CSS ile statik bir web sitesi olu\u015ftururken, <strong>JavaScript<\/strong> web sitenize dinamik \u00f6zellikler ve etkile\u015fim katman\u0131z\u0131 sa\u011flar. Kullan\u0131c\u0131lar\u0131n t\u0131klamalar\u0131na tepki veren men\u00fcler, animasyonlar, form do\u011frulamalar\u0131, i\u00e7erik g\u00fcncellemeleri gibi bir\u00e7ok \u00f6zelli\u011fi JavaScript ile hayata ge\u00e7irebilirsiniz. JavaScript kodlar\u0131, <code>&lt;script&gt;<\/code> etiketleri aras\u0131na yaz\u0131larak HTML dosyas\u0131na dahil edilir. Ba\u015flang\u0131\u00e7 i\u00e7in basit JavaScript \u00f6rnekleriyle ba\u015flayarak, sitenize etkile\u015fim katabilirsiniz.<\/p>\n<h3>Arama Motoru Optimizasyonu (SEO) Temelleri<\/h3>\n<p>Web sitenizin arama motorlar\u0131nda \u00fcst s\u0131ralarda yer almas\u0131, daha fazla ziyaret\u00e7i \u00e7ekmenizi sa\u011flar. Buna <strong>Arama Motoru Optimizasyonu (SEO)<\/strong> denir. Temel SEO prensipleri \u015funlard\u0131r:<\/p>\n<ul>\n<li><strong>Anla\u015f\u0131l\u0131r HTML Yap\u0131s\u0131:<\/strong> \u0130\u00e7eri\u011finizi mant\u0131ksal etiketlerle yap\u0131land\u0131r\u0131n (ba\u015fl\u0131klar, paragraflar vb.).<\/li>\n<li><strong>Anlaml\u0131 Ba\u015fl\u0131klar ve Meta A\u00e7\u0131klamalar\u0131:<\/strong> Her sayfan\u0131z i\u00e7in a\u00e7\u0131klay\u0131c\u0131 <code>&lt;title&gt;<\/code> ve <code>&lt;meta name=\"description\"&gt;<\/code> etiketleri kullan\u0131n.<\/li>\n<li><strong>Anahtar Kelime Kullan\u0131m\u0131:<\/strong> \u0130\u00e7eri\u011finizde hedef kitlenizin arama yaparken kullanabilece\u011fi anahtar kelimeleri do\u011fal bir \u015fekilde kullan\u0131n.<\/li>\n<li><strong>G\u00f6rsel Optimizasyonu:<\/strong> G\u00f6rsellerinizi optimize ederek sayfa y\u00fcklenme h\u0131z\u0131n\u0131 art\u0131r\u0131n ve <code>alt<\/code> etiketlerini doldurun.<\/li>\n<li><strong>Mobil Uyumluluk:<\/strong> Duyarl\u0131 tasar\u0131m kullanarak mobil kullan\u0131c\u0131lar i\u00e7in iyi bir deneyim sunun.<\/li>\n<\/ul>\n<p>SEO, s\u00fcrekli \u00f6\u011frenmeyi gerektiren bir aland\u0131r ancak bu temel ad\u0131mlar\u0131 atmak, sitenizin g\u00f6r\u00fcn\u00fcrl\u00fc\u011f\u00fcn\u00fc art\u0131rmada b\u00fcy\u00fck fark yaratacakt\u0131r.<\/p>\n<h3>Vaka Analizi: Yerel Bir \u0130\u015fletmenin Dijitalle\u015fmesi<\/h3>\n<p>Ankara&#8217;da faaliyet g\u00f6steren k\u00fc\u00e7\u00fck bir el yap\u0131m\u0131 sabun \u00fcreticisi olan &#8220;Do\u011fal Dokunu\u015flar&#8221; firmas\u0131n\u0131 ele alal\u0131m. Firman\u0131n daha \u00f6nce online bir varl\u0131\u011f\u0131 yoktu ve \u00fcr\u00fcnlerini sadece yerel pazarlarda ve elden sat\u0131yordu. M\u00fc\u015fteri kitlesini geni\u015fletmek ve daha geni\u015f bir co\u011frafyaya ula\u015fmak amac\u0131yla bir web sitesi kurmaya karar verdiler. \u0130lk a\u015famada, firman\u0131n temel ihtiya\u00e7lar\u0131 belirlendi: \u00dcr\u00fcnlerini sergileyebilecekleri bir <strong>portf\u00f6y sitesi<\/strong> ve m\u00fc\u015fterilerin do\u011frudan sipari\u015f verebilece\u011fi basit bir <strong>ileti\u015fim formu<\/strong>.<\/p>\n<p><strong>Uygulama Ad\u0131mlar\u0131:<\/strong><\/p>\n<ol>\n<li><strong>Planlama:<\/strong> Sitenin ana sayfalar\u0131 belirlendi: Anasayfa (Firman\u0131n tan\u0131t\u0131m\u0131, \u00f6ne \u00e7\u0131kan \u00fcr\u00fcnler), \u00dcr\u00fcnler (Sabun kategorileri, her sabunun g\u00f6rselleri, i\u00e7eri\u011fi ve faydalar\u0131), Hakk\u0131m\u0131zda (Firman\u0131n hikayesi, \u00fcretim felsefesi), \u0130leti\u015fim (Adres, telefon, e-posta, basit ileti\u015fim formu).<\/li>\n<li><strong>Teknik Altyap\u0131:<\/strong> Basit bir HTML yap\u0131s\u0131 ve CSS ile g\u00f6rsel tasar\u0131m olu\u015fturuldu. Renk paleti olarak firman\u0131n do\u011fal \u00fcr\u00fcn konseptine uygun olarak ye\u015fil ve toprak tonlar\u0131 tercih edildi. Duyarl\u0131 tasar\u0131m prensipleri g\u00f6z \u00f6n\u00fcnde bulundurularak, sitenin mobil cihazlarda da iyi g\u00f6r\u00fcnmesi sa\u011fland\u0131.<\/li>\n<li><strong>\u0130\u00e7erik Olu\u015fturma:<\/strong> \u00dcr\u00fcnlerin y\u00fcksek kaliteli foto\u011fraflar\u0131 \u00e7ekildi ve her sabun i\u00e7in detayl\u0131 a\u00e7\u0131klamalar yaz\u0131ld\u0131. Firman\u0131n kurucusu taraf\u0131ndan samimi bir dille &#8220;Hakk\u0131m\u0131zda&#8221; b\u00f6l\u00fcm\u00fc kaleme al\u0131nd\u0131.<\/li>\n<li><strong>Hosting ve Alan Ad\u0131:<\/strong> Firman\u0131n b\u00fct\u00e7esine uygun payla\u015f\u0131ml\u0131 hosting paketi ve <code>dogaldokunuslar.com.tr<\/code> alan ad\u0131 al\u0131nd\u0131.<\/li>\n<li><strong>Canl\u0131ya Alma:<\/strong> Olu\u015fturulan t\u00fcm dosyalar FTP ile sunucuya y\u00fcklendi.<\/li>\n<li><strong>Sonu\u00e7:<\/strong> K\u0131sa s\u00fcre i\u00e7inde &#8220;Do\u011fal Dokunu\u015flar&#8221; firmas\u0131, \u00fcr\u00fcnlerini sergileyebilecekleri ve potansiyel m\u00fc\u015fterilerle etkile\u015fim kurabilecekleri modern ve kullan\u0131c\u0131 dostu bir web sitesine sahip oldu. Sitenin yay\u0131na al\u0131nmas\u0131ndan sonra, firman\u0131n telefon ve e-posta yoluyla gelen sipari\u015flerinde belirgin bir art\u0131\u015f g\u00f6zlemlendi.<\/li>\n<\/ol>\n<p>Bu vaka analizi, k\u00fc\u00e7\u00fck bir i\u015fletmenin bile basit bir web sitesi ile dijital d\u00fcnyada nas\u0131l yer edinebilece\u011fini g\u00f6stermektedir. Ba\u015flang\u0131\u00e7ta karma\u015f\u0131k e-ticaret sistemlerine veya pahal\u0131 \u00e7\u00f6z\u00fcmlere gerek kalmadan, temel web teknolojileriyle de etkili bir online varl\u0131k olu\u015fturulabilir.<\/p>\n<h2>Sonu\u00e7<\/h2>\n<p>Bir web sitesini s\u0131f\u0131rdan canl\u0131ya almak, ilk ba\u015fta g\u00f6z korkutucu g\u00f6r\u00fcnebilir. Ancak bu makalede ele ald\u0131\u011f\u0131m\u0131z temel kavramlar\u0131, ad\u0131m ad\u0131m ilerleyen s\u00fcreci ve pratik ipu\u00e7lar\u0131n\u0131 takip ederek, bu s\u00fcreci ba\u015far\u0131yla tamamlayabilirsiniz. HTML ile yap\u0131n\u0131n olu\u015fturulmas\u0131, CSS ile g\u00f6rsel zenginli\u011fin kat\u0131lmas\u0131 ve hosting ile sitenin d\u00fcnyaya a\u00e7\u0131lmas\u0131, web geli\u015ftirmenin temel ta\u015flar\u0131d\u0131r. Unutmay\u0131n, her uzman\u0131n bir zamanlar acemi oldu\u011funu. \u00d6nemli olan ba\u015flamak, \u00f6\u011frenmek ve denemekten \u00e7ekinmemek. \u0130lk web siteniz, sizin dijital d\u00fcnyadaki ilk ad\u0131mlar\u0131n\u0131z olacak. Bu yolculukta ba\u015far\u0131lar dilerim!<\/p>\n<h2>S\u0131k\u00e7a Sorulan Sorular (SSS)<\/h2>\n<ul>\n<li><strong>Web sitesi olu\u015fturmak i\u00e7in kodlama bilmem gerekiyor mu?<\/strong>\n<p>Temel d\u00fczeyde bir web sitesi olu\u015fturmak i\u00e7in HTML ve CSS gibi i\u015faretleme ve stil dillerini \u00f6\u011frenmek gereklidir. Ancak g\u00fcn\u00fcm\u00fczde kod yazmadan web sitesi olu\u015fturman\u0131z\u0131 sa\u011flayan <strong>site olu\u015fturucu (website builder)<\/strong> platformlar\u0131 da bulunmaktad\u0131r. Yine de, temel kodlama bilgisi, sitenizin \u00fczerinde daha fazla kontrol sahibi olman\u0131z\u0131 sa\u011flar.<\/p>\n<\/li>\n<li><strong>\u00dccretsiz hosting ve alan ad\u0131 bulabilir miyim?<\/strong>\n<p>Evet, <strong>\u00fccretsiz hosting<\/strong> ve alt alan ad\u0131 (subdomain) sunan platformlar mevcuttur (\u00f6rne\u011fin, GitHub Pages, Netlify&#8217;\u0131n \u00fccretsiz planlar\u0131). Ancak bu hizmetler genellikle s\u0131n\u0131rl\u0131 \u00f6zelliklere sahiptir ve profesyonel kullan\u0131m i\u00e7in ticari hosting ve \u00f6zel alan ad\u0131 tercih edilmesi \u00f6nerilir.<\/p>\n<\/li>\n<li><strong>Web sitemin g\u00fcvenli\u011fi i\u00e7in neler yapmal\u0131y\u0131m?<\/strong>\n<p>Web sitenizin g\u00fcvenli\u011fi i\u00e7in SSL sertifikas\u0131 kullanmak (genellikle hosting firmalar\u0131 taraf\u0131ndan sunulur), g\u00fc\u00e7l\u00fc \u015fifreler belirlemek, d\u00fczenli olarak yedekleme yapmak ve kulland\u0131\u011f\u0131n\u0131z yaz\u0131l\u0131mlar\u0131 (e\u011fer varsa) g\u00fcncel tutmak \u00f6nemlidir.<\/p>\n<\/li>\n<li><strong>\u0130lk web sitem i\u00e7in hangi teknolojilere odaklanmal\u0131y\u0131m?<\/strong>\n<p>Ba\u015flang\u0131\u00e7 i\u00e7in <strong>HTML<\/strong> (yap\u0131) ve <strong>CSS<\/strong> (tasar\u0131m) konular\u0131na odaklanman\u0131z en do\u011frusudur. Bu iki teknoloji, web sitenizin temelini olu\u015fturur ve ilk canl\u0131 sitenizi olu\u015fturmak i\u00e7in yeterlidir. Daha sonra JavaScript ile etkile\u015fim katmay\u0131 \u00f6\u011frenebilirsiniz.<\/p>\n<\/li>\n<\/ul>\n<p>#WebGeli\u015ftirme #\u0130lkWebSitem #HTML #CSS #Teknoloji #S\u0131f\u0131rdanWebSitesi<\/p>\n<div class=\"github-example-link\"><strong>\u00d6rnek kod:<\/strong> <a href=\"https:\/\/github.com\/fatihsoysalcom\/basic-html-css-website-structure\" target=\"_blank\" rel=\"noopener noreferrer\">github.com\/fatihsoysalcom\/basic-html-css-website-structure<\/a><\/div>\n","protected":false},"excerpt":{"rendered":"Hi\u00e7 kendi web sitenizin olmas\u0131n\u0131 hayal ettiniz mi? Belki bir hobinizi sergilemek, belki de k\u00fc\u00e7\u00fck bir i\u015fletmeniz i\u00e7in dijital bir vitrin olu\u015fturmak istiyorsunuz.","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"csco_page_header_type":"","csco_page_load_nextpost":"","csco_page_subscribe_form":"","csco_page_contact_form":"","footnotes":""},"categories":[1],"tags":[],"class_list":{"0":"post-44337","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-genel","7":"cs-entry","8":"cs-video-wrap"},"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v20.5 (Yoast SEO v25.3.1) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk - Kodlar\u0131n Gizemli D\u00fcnyas\u0131<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk\" \/>\n<meta property=\"og:description\" content=\"Hi\u00e7 kendi web sitenizin olmas\u0131n\u0131 hayal ettiniz mi? Belki bir hobinizi sergilemek, belki de k\u00fc\u00e7\u00fck bir i\u015fletmeniz i\u00e7in dijital bir vitrin olu\u015fturmak istiyorsunuz.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/\" \/>\n<meta property=\"og:site_name\" content=\"Kodlar\u0131n Gizemli D\u00fcnyas\u0131\" \/>\n<meta property=\"article:published_time\" content=\"2026-08-26T06:01:56+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-08-26T06:02:21+00:00\" \/>\n<meta name=\"author\" content=\"Fatih Soysal\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Yazan:\" \/>\n\t<meta name=\"twitter:data1\" content=\"Fatih Soysal\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data2\" content=\"18 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/\"},\"author\":{\"name\":\"Fatih Soysal\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"headline\":\"S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk\",\"datePublished\":\"2026-08-26T06:01:56+00:00\",\"dateModified\":\"2026-08-26T06:02:21+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/\"},\"wordCount\":3441,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/#respond\"]}],\"copyrightYear\":\"2026\",\"copyrightHolder\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/\",\"name\":\"S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk - Kodlar\u0131n Gizemli D\u00fcnyas\u0131\",\"isPartOf\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\"},\"datePublished\":\"2026-08-26T06:01:56+00:00\",\"dateModified\":\"2026-08-26T06:02:21+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\/\/fatihsoysal.com\/blog\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#website\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/\",\"name\":\"Fatihsoysal.com\",\"description\":\"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim\",\"publisher\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"tr\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1\",\"name\":\"Fatih Soysal\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"contentUrl\":\"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png\",\"width\":512,\"height\":512,\"caption\":\"Fatih Soysal\"},\"logo\":{\"@id\":\"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/\"},\"description\":\"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.\",\"url\":\"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/","og_locale":"tr_TR","og_type":"article","og_title":"S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk","og_description":"Hi\u00e7 kendi web sitenizin olmas\u0131n\u0131 hayal ettiniz mi? Belki bir hobinizi sergilemek, belki de k\u00fc\u00e7\u00fck bir i\u015fletmeniz i\u00e7in dijital bir vitrin olu\u015fturmak istiyorsunuz.","og_url":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/","og_site_name":"Kodlar\u0131n Gizemli D\u00fcnyas\u0131","article_published_time":"2026-08-26T06:01:56+00:00","article_modified_time":"2026-08-26T06:02:21+00:00","author":"Fatih Soysal","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Fatih Soysal","Tahmini okuma s\u00fcresi":"18 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/#article","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/"},"author":{"name":"Fatih Soysal","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"headline":"S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk","datePublished":"2026-08-26T06:01:56+00:00","dateModified":"2026-08-26T06:02:21+00:00","mainEntityOfPage":{"@id":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/"},"wordCount":3441,"commentCount":0,"publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/#respond"]}],"copyrightYear":"2026","copyrightHolder":{"@id":"https:\/\/fatihsoysal.com\/blog\/#organization"}},{"@type":"WebPage","@id":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/","url":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/","name":"S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk - Kodlar\u0131n Gizemli D\u00fcnyas\u0131","isPartOf":{"@id":"https:\/\/fatihsoysal.com\/blog\/#website"},"datePublished":"2026-08-26T06:01:56+00:00","dateModified":"2026-08-26T06:02:21+00:00","breadcrumb":{"@id":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fatihsoysal.com\/blog\/sifirdan-canli-web-sitesi-acemiden-uzmana-yolculuk\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/fatihsoysal.com\/blog\/"},{"@type":"ListItem","position":2,"name":"S\u0131f\u0131rdan Canl\u0131 Web Sitesi: Acemiden Uzmana Yolculuk"}]},{"@type":"WebSite","@id":"https:\/\/fatihsoysal.com\/blog\/#website","url":"https:\/\/fatihsoysal.com\/blog\/","name":"Fatihsoysal.com","description":"Blog - Yaz\u0131l\u0131m D\u00fcnyas\u0131 Tecr\u00fcbelerim","publisher":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fatihsoysal.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"tr"},{"@type":["Person","Organization"],"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/002a254750921dcfd568a99e48240dd1","name":"Fatih Soysal","image":{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/","url":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","contentUrl":"https:\/\/fatihsoysal.com\/blog\/wp-content\/uploads\/2024\/04\/cropped-replicate-prediction-3kgg1hgjn5rgp0cf0p5tr0jw7w-1.png","width":512,"height":512,"caption":"Fatih Soysal"},"logo":{"@id":"https:\/\/fatihsoysal.com\/blog\/#\/schema\/person\/image\/"},"description":"Kullan\u0131m ve kodlama m\u00fckemmeliyetini odak alan uygulamalar olu\u015fturma deneyimine sahip, profesyonel olarak 15+ y\u0131l \u00fczeri deneyime sahip bir yaz\u0131l\u0131m m\u00fchendisi.","url":"https:\/\/fatihsoysal.com\/blog\/author\/fatihsoysal\/"}]}},"yoast_meta":{"yoast_wpseo_title":"","yoast_wpseo_metadesc":"","yoast_wpseo_canonical":""},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/44337","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/comments?post=44337"}],"version-history":[{"count":1,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/44337\/revisions"}],"predecessor-version":[{"id":44338,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/posts\/44337\/revisions\/44338"}],"wp:attachment":[{"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/media?parent=44337"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/categories?post=44337"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/fatihsoysal.com\/blog\/wp-json\/wp\/v2\/tags?post=44337"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}