Projenin amacı:
Mevcut siteyi daha gelişmiş özelliklerle donatarak, daha kullanıcı odaklı ve SEO uyumlu hale getirmek ve gerek server tabanında gerek ise arayüz tabanında kodları detaylıca optimize etmek, sitenin yeni versiyonunu hazırlamak.
Sitenin Genel Özellikleri:
Arka planda:
- Sitedeki tüm alanlar hem Türkçe hem de İngilizce olarak tamamen admin panelinden düzenlenebilmektedir.
- Blog yazıları artık ne kadar sürede okunabileceğine yönelik bir algoritmaya sahip. Bu algoritma yazı içerisindeki kelimelerin yanı sıra, resimlerin ve kodların da ne kadar sürede incelenebileceğini dikkate alabilmektedir.
- Blog yazıları için artık yorum yapabilmek mümkün. Bu sayede okurlar etkileşime geçebilir ve teknik bilgi alışverişinde bulunabilirler.
- Yeni Blog bölümünde eklenen yazılar için artık etiket sistemi bulunmakta. Benzer yazılar tavsiyesi bu sayede aynı etikete sahip yazılar içinden rastgele olarak seçilmekte.
- Artık kodlar çok daha detaylı optimize edildi ve performans ölçümleri yapıldı. Ör:
class ProjectDetailsView(DetailView):
.....
queryset = Projects.objects.select_related("project_category").prefetch_related("used_techs")
.....
def get_context_data(self, **kwargs):
.....
context['project_en'] = ProjectsEN.objects.filter(id=self.object.id).only("slug")
context['new_post_count'] = Blog.objects.filter(published_date__range=(few_days_ago, now)).only(
"published_date").count()
return context
- Artık yeni blog yazılarından haberdar oluna bilinmesi için email listesi sistemi var. Email listesine kolayca kayıt olunabilmekte ve istenilmediği takdirde tek tıklama ile kolayca listeden çıkış yapılabilmektedir.
- Sitenin altyapısında kullanıcı tarafından admin panelinden yüklenen resimler (Örneğin blog yazıları veya proje resimleri) otomatik olarak istenilen boyutlarda yeni nesil webp formatında üretilmekte.
class Blog(SEOAbstractModel):
status = models.BooleanField("Durum (Aktif/Pasif)", default=False)
is_sended = models.BooleanField("Newsletter Durumu", default=False)
author = models.ForeignKey(User, on_delete=models.CASCADE, verbose_name="Yazar", related_name='blog_posts', default=1)
title = models.CharField("Blog Başlığı", max_length=150, unique=True)
short_description = models.TextField("Kısa Açıklama", max_length=155)
tags = TaggableManager()
post_image = models.ImageField("Yazı Resmi", help_text="1304x500 / Zorunlu alan değildir.",
blank=True, null=True, upload_to='img/blog/')
post_thumbnail_1304x500 = ImageSpecField(source='post_image',
processors=[Transpose(), ResizeToFill(1304, 500)],
format='WEBP',
options={'quality': 80})
post_thumbnail_500x500 = ImageSpecField(source='post_image',
processors=[Transpose(), ResizeToFill(500, 500)],
format='WEBP',
options={'quality': 80})
post_thumbnail_JPG = ImageSpecField(source='post_image',
processors=[Transpose(), ResizeToFill(1200, 460)],
format='JPEG',
options={'quality': 80})
text = RichTextUploadingField("Yazı İçeriği")
updated_on = models.DateTimeField("Güncellenme Tarihi", auto_now=True)
.....
- İletişim bölümünden artık mesaj gönderilebiliyor.
Arayüzde:
- Arayüz artık çok daha fazla Bootstrap ile entegre çalışmakta.
- Eğer son 1 hafta içerisinde yeni bir blog yazısı yazılmışsa, arayüz otomatik olarak üst navigasyondaki blog menüsünde bildirim rozeti gösteriyor.
- Blog yazılarının kolayca paylaşılabilmesi için sosyal medya paylaşım özelliği eklendi.
- Sitenin tüm alanları arayüz görünümünü bozmadan responsive olarak mobil uyumlu çalışır.
- Websitesi PWA entegrasyonu ile 100% mobil uyumludur. Dilerseniz uygulamayı tüm platformlardan kolayca telefonunuza veya bilgisayarınıza yükleyebilirsiniz. Android cihazlar için Play Store'dan da indirebilmek mümkün.
- Diller arası geçiş tam olarak çalışmaktadır. Örneğin Türkçe bir projeyi açtığınızda, İngilizce diline tıkarsanız aynı projenin İngilizce versiyonu açılacaktır.
SEO:
- Tüm ana SEO altyapısı (title, description, keywords, canonical, twitter tags, open graph meta vs.) tüm sayfalar için dinamik olarak oluşturulur ve admin panelinden yönetilebilir.
- 100% arama motoru optimizasyonu vardır.
- Site haritası otomatik üretilir.
Google Performans Testi Sonucu:
Ve daha birçok unuttuğum özelliği vardır. :)
