İçeriğe geç
Ufuknâme.

Ad

E-posta *

Mesaj *

Yapay Zeka ile Kodlanan Blog: Ufuknâme'nin Kuruluş Notları

Yazı paylaşmak için kullandığımız platformlar bana hep kiralık bir oda gibi geldi; eşyaların yerini değiştiremediğiniz, duvarları boyayamadığınız bir oda. Tam da bu noktada, bu odalardan çıkıp kendi tarzımla ve kendi potansiyelimle tanışmak için Ufuknâme'yi kurmaya karar verdim.

Elbette kolay bir süreç değildi. Nihaî hâline ulaşabilmem için çeşitli sorunları tek tek çözerek ilerlemem, ilgili entegrasyonları yapmam, sosyal medya mecraları ve blog için yoğun tasarım çalışmaları yürütmem gerekti. Tabii ki, dijital bir yapıda hiçbir zaman tam anlamıyla "nihaî bir son" yok; istenildiği takdirde her zaman geliştirmeye devam edilebilir. Ancak, benim amacım -şimdilik- blogu sürdürülebilir ve kullanışlı bir hâle getirmekti. Ki günün sonunda, bunları sağlayabildiğimi görüyorum.

O hâlde, artık süreç hakkında en başından konuşmaya başlayabiliriz.



1. Önce Karar, Sonra İnşa

Girişte kısaca değindiğim gibi, daha önce denediğim blog sitelerinin ve yazı platformlarının kısıtlayıcı, belirli bir çerçevede tutmaya çalışan yapılarından sıkılmıştım. Bu sıkılma bir anda değil, yıllar içinde başka başka platformlar kullanıp hepsinde yaklaşık olarak aynı kanaate varmamın sonucu olarak ortaya çıktı.

Daha önce de birçok blog sitesi kurma girişimim oldu. Ancak yazılım bilgimin olmaması, bir noktada yine yazı platformlarının sunduğu şablona bağlı kalmaya mecbur bırakıyordu. Dolayısıyla, fikirlerimi blog sayfam üzerinde uygulayabilmem mümkün olmuyordu.

Ta ki, yapay zeka araçları hayatımıza girene kadar. Zaten Ufuknâme'den önce de bazı araçları kullanıyordum ancak çoğunlukla kişisel kullanımdan öteye gitmiyordu.

 Fakat yine de bu araçlarla bir şeyler yapmaya dair şevkim bir kat daha artmıştı. Çünkü neler yapılabildiğini artık her yerde görüyordum ve en azından bir noktaya kadar, üst düzey bir yazılım bilgisi de gerekmiyordu.

Bu noktada "Bu sefer bir şeyler yapmalıyım." diyerek Ufuknâme isimli -farkındayım, biraz klişe görünüyor- bir blog kurmaya karar verdim. Bu ismi, Ufuk isimli kişinin tüm hayat sürecine vurgu yaptığı için -bir seyahatnâmede tüm yolculuk sürecine vurgu yapılması gibi- tercih ettim. Blogun belirli bir kapsam içinde kalmasını istemiyor, birbiriyle alakasız alanlarda içerikler üretebilmek istiyordum. Ufuknâme isminin de bu beklentiyle denk düştüğüne kanaat getirdim.

Artık karar verdiğime göre, şimdi, nasıl ilerlemem gerektiğine yönelik bir planlama sürecine girmem gerekiyordu.


2. Planlama: Bunu Nasıl Yapacağım?

Basitçe, bir platformda blog sitesi kuracak; yapay zekaya kodu yazdıracak, düzenletecek; bir tasarım aracıyla da görseller hazırlayacaktım. Ancak yine de yol haritasını doğru şekilde çizebilmem için şu soruları net şekilde cevaplamam şarttı:

2.1. Hangi platformu kullanacağım?

Şimdilik, ücretli bir sunucu ve alan adı yerine ücretsiz bir platform kullanmak durumundayım. Bu sebeple, önceki tecrübelerime dayanarak o platformun Blogger olması gerektiğine karar verdim. Çünkü diğer platformların çoğu, sitenin tümü için kendi hazırladığınız kodun tam şekilde kullanılmasına izin vermiyor. Ancak Blogger'da, oluşturduğumuz kodu/dosyayı Tema bölümünden "Geri yükle" seçeneğiyle ".xml" dosyası olarak yükleyebiliyor veya "HTML'yi Düzenle" seçeneğiyle direkt olarak kod şeklinde yapıştırıp kullanabiliyoruz.

2.2. Hangi araçlara ihtiyaç duyacağım?

Yazılım bilgim olmadığı için, benim yerime bu kodu yazabilecek bir araca ihtiyacım vardı: Hepimizin artık aşina olduğu ClaudeGemini gibi araçlar. Ben ona nasıl bir blog sitesi istediğimi, hangi özelliklere sahip olması gerektiğini yazacağım; o da benim için bu sitenin kodlarını yazacak.

Bir de tasarım aracına ihtiyacım olacaktı. Evet; tasarım için de üstte yazdığım yapay zeka araçlarını kullanabilirdim -ki gerektiğinde kullandım da- ancak kendi tarzımızı daha iyi yansıtan, marka kimliğimizi hayal ettiğimiz gibi oluşturmamızı sağlayan bir tasarım oluşturabilmemiz için özel olarak bir tasarım aracı kullanılmasını gerekli görüyorum. Bu noktada da, Canva'yı tercih ettim.

2.3. Kaynaklarım neler?

Daha önce farklı farklı blog platformları üzerinde deneyimlerim olduğu için -bilhassa Blogger ile ilgili- bir sıfır öndeydim. Ancak daha önce herhangi bir blog deneyiminiz yoksa bu sizi korkutmasın. Zaten öğrenmesi basit şeyler.

Yapay zeka araçlarını da zaten kullanmaktaydım. Sadece, kod için kullanmayı ilk kez deneyimleyecektim. Ancak inanın bana, kod için kullanmak normal kullanımdan hiç de farklı değil; sakın gözünüzde büyütmeyin.

Bunun yanında, aktif bir Canva öğrenci hesabım vardı; bu sayede Canva'nın pro özelliklerine erişebilecektim. Tasarım süreçlerinde oldukça fayda sağlayacaktı. Ancak sizin Canva kullanmak gibi bir zorunluluğunuz da yok. Hangi aracı kullanma imkanınız varsa onu kullanabilirsiniz: Gimp, Adobe araçlarıKritaInkscape gibi... Üstelik Gimp, Krita gibi araçlar tamamen ücretsiz.

Yol haritamı da netleştirdiğime göre artık ilk somut adımlarımı atmaya hazırdım.


3. Uygulama: Kod Maratonu ve Tasarım Dokunuşları

"Ufuknâme isimli bir blog kurmaya karar verdim. Bana Medium tarzı, SEO uyumlu, sade ve şık bir Blogger teması hazırlar mısın?"

Sanırım Claude'a gönderdiğim ilk istem (prompt) buna benzer bir şeydi. Elbette bana tek seferde kusursuz bir tema kodu sunmadı, sunmayacağını da zaten biliyordum. Yapay zeka ile bir şeyler meydana getirme süreci tam da bu yüzden kod maratonuna benziyor; bitiş çizgisine varmak için sürekli tempoyu koruman, ortaya çıkan sorunlara rağmen koşmaya devam etmen gerekiyor.

Bana verdiği kodu Blogger'ın Tema sekmesinde "HTML'i düzenle" bölümüne yapıştırdım ve "Kaydet" dedim. Sitenin yeni hâline baktım, tam bir hayal kırıklığıydı. Oluşturduğu temayı Paint'te bile çizebilirdim. Ancak tam da bu noktada, yapay zeka ile iletişimi sürdürmeye devam etmek ve onu doğru yönlendirmek, kodumuzun adım adım bizim istediğimiz hâle gelebilmesi için oldukça önemli.

DİKKAT ETMEYİ UNUTMAYINIZ: Tema dosyanızın aşama kaydettiğini düşündüğünüz her adımda, bir sorun olursa eski hâline dönebilmeniz için yedek bir versiyon dosyası kaydetmenizi tavsiye ederim. Blogger'da Tema sekmesinde Özelleştir butonunun yanındaki aşağı ok işaretinden Yedekle'ye tıklayıp yedek dosyanızı indirebilir ve kendi isteğinize göre isimlendirebilirsiniz: ufukname-v1-ana-hatlar-olusturuldu.xml

Sunduğu kod beni şaşırtmadı. Ancak artık yapay zeka ile bir pazarlık moduna girmiştik. Ona "Hayır, benim istediğim bu gönderdiğin şekilde bir site değil. Ben parlak mavi ve açık gri renkleri kullandığın bir site istiyorum." diyordum, o da kodu isteğime göre yeniden güncelleyip gönderiyordu. Ona "Şöyle bir hata aldım, bunu düzelt." diyordum, düzeltip gönderiyordu. Bu böylece sürecekti ve hâlâ daha sürüyor.

Bu pazarlıkta kodlar yavaş yavaş şekillenirken diğer yandan görsel bir kimlik de oluşturmam gerekiyordu. Blog sitemde, yazılarımda ve sosyal medya platformlarında kullanılmak üzere bir logo,  sosyal medya platformlarına uyarlanmış logolar ve kapak resimleri, bir favicon görseli, tipografi tercihleri... Yaratıcı tasarım, gerçekten yorucu ancak bir o kadar da gelişime katkı sağlayan bir süreç. Bu süreci de layıkıyla yerine getirmeye çalışarak ilgili tasarımları hazırladım.

Tüm eksiklerin tamamlanmasıyla birlikte, Ufuknâme hem kod hem görsel tarafıyla ortaya çıkmış oldu. Elbette bu sürecin aşamalarına dair değinmediğim onlarca detay var; hepsine değinirsem bu yazı asla bitmez. Ancak sürecin genel hatlarını olabildiğince şeffaf şekilde aktarmaya çalıştım. Umarım yazının buraya kadarki kısmı, yapay zeka yardımıyla bir blog sitesinin kurulumuna dair fikir edinmenize katkı sağlamıştır.

Tüm detaylara değinemeyecek olmakla birlikte, süreçte not aldığım bazı hususlar için de ufak açıklamalar yapmam gerektiğini düşündüm. Maddeler hâlinde değindiğin bu hususlara aşağıdan ulaşabilirsiniz.


4. Yol Notları: Süreçten Teknik Detaylar

Ufuknâme'yi kurarken pek çok sorunla karşılaştım. Ancak kodlama hakkında neredeyse hiçbir şey bilmiyor olmama rağmen çoğunu yapay zeka yardımıyla hallettim. Tabii ki, halledemediklerim de var. Ancak süreç hâlâ devam ediyor. Onların da hallolacağını düşünüyorum.

Aşağıya, açıklamam gerektiğini düşündüğüm noktaları ekledim. Sizin de karşınıza benzer teknik engeller çıktığında bu notlar birer deniz feneri olabilir. Bu kod maratonunda bitiş çizgisine yaklaşırken geçtiğim teknik duraklar ve aşmaya çalıştığım engeller şöyle:

4.1. Kullanıcı Deneyimi (UX) ve Navigasyon

Bir evin koridorları ne kadar ferahsa, her şey ne kadar yerli yerinde duruyorsa, içinde gezinmesi de o kadar keyiflidir. Bu bölümde; okuyucunun Ufuknâme içinde kaybolmadan, hem mobilde hem masaüstünde en konforlu şekilde yolunu bulmasını sağlayan teknik düzenlemelere odaklandım. 

4.1.1. Mobil Menü

Site menüsünün sadece web'de değil, mobil cihazlarda da düzgün görünmesini sağlamak için hamburger menü entegre edildi. Hamburger menü, genellikle sağ üstte bulunup üç yatay çizgiden () oluşan menüye deniyor.

Web sitesinin mobil cihazlardaki hamburger menüsünü gösteren .gif görseli. Sayfada, sitenin logosu, arama kutusu, menü simgesi ve içerik yer almaktadır.
Web sitesinin mobil cihazlardaki hamburger menüsünü gösteren .gif görseli.

4.1.2. Okuma İlerlemesi Çubuğu

Daha keyifli bir okuma deneyimi için, sayfanın en üstüne, yazı sayfası aşağı kaydırıldıkça ilerleyen mavi renkli bir okuma çubuğu eklendi. Hatta şu anda siz bu yazıyı okumak için sayfayı kaydırırken o da en üstte yavaş yavaş ilerlemekte.

Bu özelliği başka sitelerde görüyordum ve bu özelliğin bulunduğu sitelerde herhangi bir okuma yapmak daha keyifli geliyordu. Bu sebeple ben de eklemeyi tercih ettim.

Bir web sayfasının ekran görüntüsü. Sayfanın en üstünde, başlıkların hemen üzerinde yavaş yavaş ilerleyen mavi renkli bir okuma ilerleme çubuğu yer alıyor. Altında ise "4.1 Kullanıcı Deneyimi" başlığı görülüyor.
Okuyucuya yazının neresinde olduğunu gösteren bu mavi çubuk, uzun içeriklerde odaklanmayı artırır. Ufuknâme'de sayfa aşağı kaydırıldıkça bu çubuk da yavaşça ilerleyerek okuma deneyimini interaktif kılıyor.

4.1.3. Okuma Süresi

Hem Ana Sayfa'da listelenen yazı açıklamalarına hem de yazıların direkt sayfalarına yazıların okuma sürelerini gösteren bir ibare eklendi.

Okuyucunun, bir yazıyı ne kadar sürede okuyabileceğini görmesi, yazıyı okuyup okumayacağına karar vermesinde oldukça etkili. 

İlaveten, bu sürenin hesaplanma şekline dair farklı yöntemler varmış. Ancak ben, şu anki hâlini yeterli bulduğum için daha fazla değişiklik yapmak istemedim. Belki ilerleyen zamanlarda ufak güncellemeler yapabilirim.

Ufuknâme blog sayfasında bir yazı başlığı ve hemen altında yazar adı, tarih ve "11 dk okuma" süresini gösteren bilgi satırı. Arka planda ise interaktif bir tarih çizelgesi ve Orhun Yazıtları temalı bir görsel yer alıyor.
Ufuknâme'de bir yazı başlığının altında yazar adı, tarih ve okuma süresini gösteren bilgi satırı.

4.1.4. Sayfa Navigasyonu

Ana Sayfa'nın en altına eski yazılara kolayca ulaşmayı sağlayan bir navigasyon bölümü eklendi. Genellikle "<  << 1 2 3 >> > " şeklinde görünen bu bölüm sayesinde, okuyucu arama yapmadan veya kategorilerde aramadan, hızlıca önceki yazılara ulaşabiliyor.

Web sitesindeki sayfalama bölümü. Sayfada, sayfa numaraları, önceki/sonraki sayfa butonları ve altbilgi bağlantıları yer almaktadır.
Ufuknâme'deki sayfalama (pagination) bölümü. Bu bölüm, ziyaretçilerin uzun içerikleri daha kolay okumasını ve farklı sayfalara erişmesini sağlıyor.

4.2. Akıllı İçerik ve Arşiv Yönetimi

Binlerce tuğlanın düzenli bir duvar oluşturması için doğru bir dizilime ihtiyacı vardır. Blogger’ın etiket sistemini özelleştirerek içerikleri akıllı kategorilere ayırdım ve okuyucunun geçmiş yazılara saniyeler içinde ulaşabileceği dinamik bir arşiv yapısı kurguladım. 

4.2.1. Dinamik Kategoriler

Blogger özelinde, siteme eklediğim en önemli özelliklerden biri buydu. Şöyle ki, Blogger'da içeriği otomatik olarak güncellenen bir KATEGORİLER açılır menüsü eklemek istiyorsanız, bu menüyü Blogger'ın Etiketler zımbırtısı (gadget) ile bağlamanız gerek.

Bir detay olarak, bunu yaparken "Seçilen etiketleri göster" seçeneğini de aktif etmelisiniz ki, yazılara eklediğiniz onlarca etiketten yalnızca sizin seçtiğiniz etiketler KATEGORİLER menüsünden görünsün.

Ufuknâme blog sitesinin navigasyon menüsünde yer alan "Kategoriler" sekmesinin açılır menü görünümü. Menü içerisinde "Dijital Pazarlama", "Eğitim" ve "Muhtelif Notlar" gibi otomatik güncellenen etiket listesi görülüyor.
Blogger'ın etiket sistemini özel kodlarla bağlayarak oluşturduğum bu dinamik menü, yeni bir kategori eklediğimde kendiliğinden güncelleniyor.

4.2.2. Otomatik Kategori Görünümü

Ana Sayfa'da listelenen yazı özetlerinde, yazıya "Seçilen etiketler" grubundan bir etiket eklendiğinde, bu etiket aynı zamanda yazının kategorisi olarak belirleniyor. Bu sayede, sonrasında yeniden bir kategori ayarı yapılmasına gerek kalmıyor. Ancak yazıya "seçilen etiketler" grubundan yalnızca bir etiket girilmesi önemli; birden fazla girilirse etiketler arasında alfabetik bir sıralama yapıyor ve belirlediğiniz etiket yerine başka bir etiket görünebiliyor.

Bir blog yazısı önizleme kartı. Alt kısımda "2 dk okuma" süresinin hemen yanında, yazıya eklenen ilk etiketten otomatik olarak çekilen gri kutucuk içinde "DİJİTAL PAZARLAMA" kategori ibaresi görülüyor.
El ile bir kategori atama süreciyle uğraşmak yerine, her yazıda "seçilen etiket"i otomatik olarak başlığın altına taşıyan akıllı bir kod yapısı kurguladım.

4.2.3. İşlevsel Arşiv

Ay ve yıla göre listelenen, içerik sayısını gösteren otomatik bir Arşiv sayfası kuruldu. Böylelikle, Ana Sayfa'daki navigasyon aracılığıyla sayfa sayfa geçmiş yazılara doğru gidilebilmesi mümkün olduğu gibi, okuyucunun belirli bir zaman dilimindeki yazılara da hızlıca göz atabilmesi sağlandı.

Ufuknâme blog sitesinin "Arşiv" sayfası ekran görüntüsü. Sayfada "Zamanın süzgecinden geçen düşünceler..." alt başlığı ve altında 2026 ile 2025 yıllarını içeren, yanında içerik sayılarının belirtildiği açılır menü (accordion) yapısı görülüyor.
Blogdaki tüm geçmiş yazıları kronolojik bir karmaşadan kurtarıp, yıl ve ay bazlı daralabilen şık bir listeye dönüştürdüm. Bu sayede yıllar geçse de aradığınız bir notu bulmak sadece iki tık uzağınızda olacak.

4.2.4. İlgili Yazılar

Okuyucuya interaktif bir okuma deneyimi yaşatabilmek adına yazı sonlarına "İlgili Yazılar" bölümü eklendi. İlgili yazılar bölümü, okumakta olduğunuz yazı ile aynı kategoride olan yazıları önermektedir. Böylelikle, okuyucu, ara vermeden ilgilendiği alana dair okuma yapmaya devam edebilmektedir. 

Ufuknâme blog yazısının son bölümü. "Yeni yazılardan haberdar ol" abonelik kutusu, sosyal medya takip daveti ve bu bölümün hemen devamında yer alan, okuyucuyu benzer içeriklere yönlendiren "İlgili Yazılar" algoritmasının başlangıç noktası.
Bir yazı bittiğinde okuyucuyu uğurlamak yerine, ona ilgi duyabileceği diğer içerikleri sunan "İlgili Yazılar" bölümünü kurguladım. Bu sayede blog içindeki etkileşimi artırırken, okuyucuya da kesintisiz bir bilgi akışı sağlıyorum.

4.3. Görsel Dil ve Tipografi

Ufuknâme’nin ruhunu yansıtan en önemli durak burası. Sitenin imzası olan logodan, metinlerin okunabilirliğini artıran gölge ve çizgi efektlerine kadar; dijital dünyada kendi estetik anlayışımı kodlara döktüğüm tasarım dokunuşlarını burada topladım. Kodlarımda parlak mavinin seçkinliğine ve açık grinin sadeliğine de yer verdim.

4.3.1. Akıllı Gölge Sistemi

Görsellere derinlik katan bir akıllı gölge özelliği eklendi. Bu özellik sayesinde, şeffaf olmayan görsellerin gölgesi resmin boyutuna göre dikdörtgen bir çerçeve şeklinde oluşturulurken şeffaf görsellerin (.png) gölgesi ise resimdeki şeffaf olmayan alanların etrafında oluşuyor. Kısaca, hem resmin türüne uygun şekilde gölge oluşturulmuş oluyor hem de yazının içinde görsele bir derinlik katılmış oluyor.

Örneğin, aşağıda bulunan şeffaf (.png) Ufuknâme logosunda, gölgenin, dikdörtgen bir çerçeve şeklinde değil de daire şeklinde oluşması gibi. 

Ufuknâme'nin görsel kimliğini temsil eden dairesel logo ve favicon tasarımı. Parlak mavi renkli yuvarlak bir alanın üzerinde, beyaz renkli, tırnaklı büyük "U" harfi ve onu çevreleyen, içe doğru hafifçe yuvarlatılmış sekizgen bir hat yer alıyor.
Mavi ve beyazın uyumuyla tasarlanan bu logo, blogun her sayfasında kurumsal bir mühür gibi markanın kimliğini temsil ediyor.

4.3.2. Bağlantı Stili

Yazı içindeki linklerin altına, imleç üzerine geldiğinde kalınlaşan estetik çizgiler eklendi.

Bu özelliği, pek çok tasarım çalışmasında yazılara uygulanan bir efekt olarak görüyordum ve bağlantı metinlerine uygulanırsa çok şık duracağını düşünüyordum. Nitekim, bence bağlantılara gayet estetik bir hava kattı.

Bir blog yazısı metni. İçerisinde yer alan mavi renkli köprü metinlerinin (linklerin) altında, standart düz çizgi yerine modern bir görünüm sunan kesikli/noktalı çizgi stili görülüyor.
Okunabilirliği koruyan ve bağlantıları zarifçe öne çıkaran özel noktalı alt çizgi tasarımı.
 

4.3.3. Özel Alıntılar

Metin içindeki alıntılar (blockquote) için özgün bir görsel stil tasarlandı.

Bu stil ile, yazıdaki vurgu cümleleri daha şık şekilde belirginleştirilerek okuma deneyimi iyileştirildi.

Blog yazısı içinde sol tarafında dikey mavi bir çizgi ve tırnak işareti ikonu bulunan, italik fontla yazılmış özel alıntı bölümü.
Önemli cümleleri metinden ayırmak ve okuyucunun dikkatini odaklamak için tasarladığım, minimalist ve şık alıntı stili.

4.3.4. Favicon & Logo

Hem logo hem favicon olarak sitenin kimliğini yansıtan tipografi odaklı geometrik bir tasarım oluşturuldu.

Yuvarlak, parlak mavi renkli bir alan üstüne beyaz renkli, hafifçe içe doğru yuvarlatılmış bir sekizgenin dış hattını ekledim ve merkeze tırnaklı bir büyük u harfi yerleştirdim.

Bu tercihler tasarım dünyasında rastgele yapılmıyor; her rengin, her şeklin bir anlamı var. Eğer bu yönde daha detaylı bilginiz var ise, logonuzu, faviconunuzu, daha genelde marka kimliğinizi bu bilgilere dayanarak oluşturmanızı tavsiye ederim.

Ancak ben şimdilik, kendi göz zevkime dayanarak ikna olduğum bir tasarım ve marka kimliği oluşturmakla yetindim.

Ufuknâme blog sitesinin tarayıcı sekmesindeki mavi favicon ikonu ve sayfa yüklenirken beliren kurumsal logo tasarımı.
Tarayıcı sekmelerinden mobil ana ekranlara kadar her yerde Ufuknâme'yi temsil eden bu ikonik mühür, markanın dijital dünyadaki kalıcı imzasıdır.

4.4. Etkileşim ve Sosyal Entegrasyon

Kendi evimi kurmam, dünyadan kopmak istediğim anlamına gelmiyordu. Okuyucularla bağ kurmak için abonelik sistemlerini, sosyal medya otomasyonlarını, yorum bölümünü ve etkileşimi artıran paylaşım butonlarını sitenin kalbine yerleştirdim.

4.4.1. Abone ve Takip (Follow.it)

Hamburger menü, arama bölümü ve paylaşım alanı olmak üzere üç farklı noktadan abonelik sistemi kuruldu. Ayrıca her yazının altında sabit olacak şekilde manuel e-posta abonelik kutusu eklendi.

Eğer gerçek bir kitle oluşturmak istiyorsanız, abonelik sistemi oldukça önemli. Bu e-posta pazarlaması gibi bir amaçla da olabilir, marka bilinirliğini artırmak amacıyla da.

Aslında Blogger'ın kendi içinde bir abonelik sistemi mevcut. Ancak bu durumda sadece Blogger kullananlar sizin yazılarınızı akışta görebiliyor. Blogger'ın da pek kullanıcısı olmadığı için, mecburen başka bir alternatife yönelmek gerekiyor.

Ben follow.it'i tercih ettim. Ücretsiz kullanımının bana şimdilik yeteceğini düşünüyorum. İlerleyen zamanlarda değiştirme ihtimalim var.

Yeni yazılardan haberdar ol" başlığı altında e-posta giriş alanı ve mavi "Abone Ol" butonu bulunan minimalist abonelik formu.
Sosyal medya algoritmalarına takılmadan, her yeni içeriğin doğrudan mail kutunuza ulaşmasını sağlayan e-posta abonelik sistemi.

4.4.2. Takip & Paylaşım Bölümü

Her yazının sonunda sabit olacak şekilde takip butonu, sosyal medya paylaşım butonları ve direkt link kopyalama butonu içeren bir panel yerleştirildi.

Okuyucunun yazıyla hızlıca etkileşime geçebilmesi için bu bölümü onlara en efektif şekilde sunmak önemli. Sosyal medyada paylaşma butonlarının çeşitliliğini artırmak daha da olumlu bir etki yaratabilir.

Yazı sonunda yer alan, Pinterest ve LinkedIn gibi sosyal medya paylaşım butonları ile içeriğin farklı platformlarda paylaşılmasını sağlayan dairesel sosyal medya ikonları.
Okuyucuların içeriği kolayca paylaşabilmesi için tasarlanan, minimalist etkileşim alanı.

4.4.3. Yorumlar

"Düşüncelerinizi Paylaşın" şeklinde bir yorum alanının içinde Blogger’ın yerleşik yorum özelliği aktive edilip tasarımı düzenlendi.

Blogger'ın orijinal temalarında yorum özelliği aktifleştirilince çok basit bir görünüm oluştuğunu hatırlıyorum. Ben basit değil, daha sade ve yorum yapmaya teşvik eder bir hâle getirmeye çalıştım.

Her yazının altında üç yorum görünecek şekilde ayarladım. Önce en yeni yorumlar görüntüleniyor. Daha eski yorumların görülebilmesi için "Daha fazla göster" seçeneği ekledim. Her tıklandığında üç yorumu daha gösteriyor.

Ufuknâme blogunun sade yorum alanı; "Düşüncelerinizi Paylaşın" başlığı, yorum ikonu ve minimalist metin giriş kutusu.
Okuyucu geri bildirimlerini teşvik eden, karmaşadan arındırılmış ve odak noktası sadece "fikir paylaşımı" olan modern yorum arayüzü.

4.4.4. Sosyal Medya Otomasyonu

Ufuknâme'nin Facebook, Instagram, Pinterest, Tumblr ve X hesapları oluşturuldu. Öncelikle hepsinin logo ve kapak resmi gibi görsel ögeleri ve güvenlik ayarları halledildikten sonra içerik paylaşımlarının otomasyonuna dair neler yapabileceğimi araştırdım.

Pinterest, sitenizin RSS akışı ve Instagram hesabını, Pinterest hesabına bağlamanıza olanak tanıyor. Yani, Pinterest ayarlarından sitenizin RSS akışını ve Instagram hesabını Pinterest'e bağlıyorsunuz. Sonrasında, blogunuzda bir yazı paylaştığınızda, paylaştığınız yazı Pinterest'teki RSS panosunda, Instagram'da bir içerik paylaştığınızda da Pinterest'teki Instagram panosunda otomatik olarak paylaşılıyor.

Eğer RSS linkinizi bulamadıysanız, Pinterest'e ekleyeceğiniz Blogger RSS linkiniz şöyledir:

https://sizinsitenizinadi.blogspot.com/feeds/posts/default?alt=rss

Facebook ve Instagram zaten kolaylıkla birbirine bağlanabiliyor. Instagram ayarlarında çapraz paylaşım seçeneğini bularak halledebilirsiniz.Meta Business Suiteile de ikisi birden kolaylıkla yönetilebiliyor. Telefondan,Instagram'da paylaşım yaptığınızı varsayalım. Instagram hesabımız Facebook hesabımıza bağlı olduğu için aynı gönderiyi aynı anda Facebook'ta da paylaşabiliyoruz. E, biz Instagram hesabımızı da Pinterest'e bağlamıştık. Bu sayede aynı gönderi Pinterest'te de paylaşılacak. Bir taşla üç kuş!

ve Tumblr için kullanabileceğim yerleşik bir otomasyon göremedim. Ancak şimdilik onları da, yazıların altına eklediğim sosyal medya paylaşım butonlarından kolayca halledebiliyorum.

Ufuknâme'nin Pinterest profil sayfası. Profilde markanın logosu (yuvarlak mavi bir arka plan üzerinde "U" harfi ve stilize bir dairesel desen), kullanıcı adı, takipçi sayısı, takip edilen sayısı, aylık görüntüleme sayısı, biyografi ve sosyal medya bağlantıları yer almaktadır.
Ufuknâme'nin Pinterest profili. İçeriklerimi sadece yazıyla sınırlamayıp çeşitli platformlar üzerinden geniş kitlelere ulaştırmayı amaçlıyorum.

4.5. Kurumsal Altyapı ve SEO

Bir binanın sağlamlığı temeliyle, görünürlüğü ise tabelasıyla ve konumuyla ölçülür. Ufuknâme'nin dijital dünyada kolayca 'bulunabilir' olması için gerekli analiz araçlarını ve yol haritalarını (SEO) kurguladım ve her profesyonel yapıda olması gereken yasal prosedürlere altbilgide (footbar) yer verdim.

4.5.1. Analiz Araçları

Performans takibi için Google Analytics ve Search Console kurulumları tamamlandı. (Şu an itibarıyla 6 sayfam arama sonuçlarında görünüyor.)

Blogger'ın kendi sunduğu temaları kullanırken, Google Analytics ölçüm kimliği (G-XXXXX) Blogger panelinden kolayca eklenebiliyor. Ancak biz kendi temamızı oluşturup kullandığımız için Google Analytics bağlantısını, Google Analytics kurulumundan sonra bize verilen kodu alıp sitemiz kodunda doğru yere ekleyerek sağlayabiliyoruz. Bunu yaptıktan sonra, çalışıp çalışmadığını kontrol etmek için mutlaka Google Analytics panelinde "Gerçek zamanlı genel bakış" sekmesine uğrayın. Diğer sekmede blog siteniz açıkken orada "Son 5 dakika içindeki etkin kullanıcı sayısı" bölümü "1" olarak gözüküyorsa, halletmişsiniz demektir.

Search Console kurulumunu yaptıktan sonra da ilk işiniz site haritanızı eklemek olacak.

Search Console'un sol panelinde "Site haritaları" sekmesine tıklayın. Site haritanızı "https://sizinsitenizinadi.blogspot.com/sitemap.xml" şeklinde girip "Gönder" butonu ile site haritanızı ekleyin. Aşağıda "Durum: Başarılı" ibaresi göründüyse, işlem tamam.
Ufuknâme'nin, Google Search Console'daki dizine eklenmiş sayfalar bölümü. Sayfada, sitenin URL'leri, son tarama tarihleri ve durumları yer almaktadır.
Ufuknâme'nin, Google Search Console'daki dizine eklenmiş sayfaları. Bu bölüm, sitenin arama motorları tarafından nasıl dizine eklendiğini ve taranma performansını takip etmeye yardımcı oluyor.

4.5.2. Yasal Sayfalar

Altbilgi (footbar) kısmına Gizlilik Politikası, KVKK, Kullanım Şartları ve İletişim sayfaları eklendi.

Hem hukukî açıdan hem de SEO açısından bu sayfaların önem arz ettiği pek çok yerde yazıyor. Dikkat edilmesi ve mümkün olduğunca özenli şekilde hazırlanması gerektiğini düşünüyorum.

Ufuknâme'nin altbilgi bölümü. Altbilgide, markanın logosu, Gizlilik Politikası, KVKK, Kullanım Şartları ve İletişim gibi yasal bağlantılar ve telif hakkı bilgisi yer almaktadır.
Ufuknâme'nin altbilgisi. Altbilgi, sitenin yasal bilgilerini ve bağlantılarını bir arada sunarak şeffaflık ve güvenilirlik sağlıyor.

4.5.3. İletişim Formu

Blogger'ın yerleşik iletişim formu optimize edilerek şık bir görünüme kavuşturuldu. İletişim sayfasında görebilirsiniz.

Blogger'ın kendi temalarıyla kullandığımda çoğunlukla hoş bir görünüm elde edemediğim bu form, kodu özelleştirip istediğim hâle getirebildiğimde gayet sade, şık bir görünüm kazandı ve gayet iyi şekilde çalışıyor.

Ufuknâme'nin iletişim formu. Formda, ad, e-posta adresi, mesaj ve "Gönder" butonu yer almaktadır.
Ufuknâme'nin iletişim formu. Bu form, ziyaretçilerin site yöneticisine kolayca ulaşabilmesini ve geri bildirimde bulunabilmesini sağlıyor.

4.5.4. Hakkımda Bölümü

Kişisel LinkedIn ve Pinterest hesapları için sosyal medya kartları ve "Neden Takip Etmelisiniz?" alanı oluşturuldu.

Hakkımda sayfası, sizi takip edenlerin dikkatlice inceleyeceği, sizin hakkınızda fikir edinmeye çalışacağı ve iletişim kurmak isterlerse size dair bağlantıları arayacakları önemli bir sayfa. Bu nedenle, kendinizi nasıl tanıttığınıza ve iletişim kurmak isteyenleri nereye yönlendirdiğinize dikkat ediniz.

Ufuknâme'nin Hakkımda sayfasındaki "Neden Takip Etmelisiniz?" bölümü. Bölümde, Ufuk Demir'in kişisel LinkedIn ve Pinterest hesaplarına bağlantılar verilmektedir.
Ufuknâme'nin Hakkımda sayfasındaki "Neden Takip Etmelisiniz?" bölümü. Bölümde, kişisel LinkedIn ve Pinterest hesaplarıma bağlantılar verilmektedir.

Böylelikle, tüm detayları olmasa da, yirmi farklı noktayı elimden geldiğince sizlere açıklamaya çalıştım ki, bu serüvenin içinde nelerin olduğu hakkında şöyle hızlıca bir fikir edinebilesiniz.


5. Son Söz: Maratonun Sonu, Yolun Başlangıcı

Tüm bu macera sadece on gün kadar sürdü. Canva'nın öğrenci planı hariç, tüm bunları tamamen ücretsiz yollarla (Blogger'ın altyapısı ve yapay zekanın ücretsiz planları) hayata geçirdim. Elbette aynı sonuçlara Canva'nın ücretsiz sürümüyle de ulaşabilirdim.

Belki prestij açısından .com uzantılı bir site çok daha iyi görünebilirdi. Belki yarını belli olmayan ücretsiz bir platform için bu kadar uğraşmaya değmeyeceğini düşünenler de olacaktır. Ancak yine de; başkasının kurallarıyla yönetilen kiralık bir odadan çıkıp, her bir köşesini kendi ellerinizle boyadığınız o "tek odalı" müstakil evde yaşamaya değmez mi? (Tabii, Blogger bir gün ansınız blogumu kapatmazsa. :P)

Ben değdiğini düşünüyorum. Artık uzun yıllar boyunca fikirlerimi özgürce paylaşabileceğim, her bir satırında emeğimin olduğu bir dijital mecraya sahibim.

Eğer sizin de zihninizde bir "Ufuknâme" varsa ve yazılım bilmediğiniz için erteliyorsanız; durmayın. İlk isteminizi (prompt) yazın, ilk hatanızı alın ve o maratona başlayın. Bitiş çizgisindeki o huzur, tüm o kod karmaşasına kesinlikle değiyor.


İlginizi çektiyse, yeni yazılarımı kaçırmamak için aşağıdaki form ile bloguma abone olmayı unutmayınız. 🔔

Peki, Ufuknâme hakkında siz ne düşünüyorsunuz? Ya da siz de bir blog oluşturmak ister miydiniz? Düşüncelerinizi yorumlarda duymayı heyecanla bekliyorum. 💬

Bir sonraki yazıda görüşmek üzere.

Allah'a emanet olun. 👋

Yazım, herhangi bir reklam içermeyip yalnızca kişisel deneyimlerimden oluşmaktadır.

Bültene Katılın

Yeni yazılar ve notlar yayımlandığında ilk sizin haberiniz olsun. İçerikler doğrudan e-posta kutunuza gelsin.

Bu yazıyı beğendiniz mi? Takip edin ve paylaşın.
Düşüncelerinizi Paylaşın2
  1. Çok harika bir tasarım olmuş. Elinize sağlık. Yazınızda o kadar ayrıntılı ve adım adım açıklamışsınız ki hiç bilmeyen birine bile yardımcı olacak şekilde anlaşılır ve net olmuş.

    YanıtlaSil
    Yanıtlar
    1. Bu güzel geri bildiriminiz için teşekkür ediyorum, faydalı olmasına çok sevindim. Esasında, ben de "hiç bilmeyen biri" olarak öğrenebildiğim kadarını aktarmaya çalıştım. Elbette çok daha iyisi yapılabilir. Ne dersiniz, darısı başınıza diyelim mi? 🙌

      Sil
Yorumunuzu Yazın
Yorum Gönder