Sosyal Medya İçin Kod Ekran Görüntülerini Nasıl Oluşturuyoruz
Eskiden kod ekran görüntülerini elle alırdık.
Editörü açar, pencereyi kırpar ve dosyayı bir gönderiye eklerdik. Bu durum üç soruna yol açıyordu:
- Gönderiler arasında temalar değişiyordu.
- Görsel genişlikleri tutarsızdı.
- Ekran görüntüleri mobil ekranlarda bulanık görünüyordu.
Bunu manuel olarak yapmayı bıraktık. Artık ihtiyaçlarımıza göre iki farklı yöntem kullanıyoruz.
Tek seferlik gönderiler için Bir tarayıcı aracı kullanıyoruz. Kodunuzu yapıştırır, bir dil seçer ve temiz bir PNG indirirsiniz. Bu, tek bir tweet veya slayt için hızlı bir yöntemdir.
Otomatik gönderiler için Bir API kullanıyoruz. Bu, görselleri yayınlama anında veya bir derleme hattı (build pipeline) içinde oluşturmanız gerektiğinde kullanılır. Kodu bir POST isteği ile gönderirsiniz ve karşılığında bir URL alırsınız.
Neden bir API kullanmalısınız? Bir insan, bir dağıtım hattında (deployment pipeline) bir düğmeye tıklayamaz. Bir API, sisteminizin manuel iş yükü olmadan her seferinde mükemmel görseller oluşturmasına olanak tanır.
Daha iyi sosyal medya kod görselleri için ipuçlarımız:
- Kısa tutun. Yirmi satırı geçmeyin. Uzun kod parçacıkları mobil cihazlarda okunmayacak kadar küçük hale gelir.
- Yüksek kontrast kullanın. Dracula veya One Dark gibi temalar, sosyal medya platformları görsellerinizi sıkıştırdıktan sonra bile keskin kalır. Düşük kontrastlı temalar kirli görünür.
- Çözünürlüğü koruyun. Yüksek çözünürlük, kodunuzun retina ekranlarda net kalmasını sağlar.
- Sonuçlarınızı önbelleğe alın. Aynı kodu iki kez oluşturmamak için görsel URL'sini saklayın.
Tarayıcı aracı ve API aynı işleyiciyi (renderer) kullanır. Bu, manuel gönderilerinizin ve otomatik gönderilerinizin her zaman aynı görünmesi anlamına gelir.
Siz kod ekran görüntülerini nasıl hallediyorsunuz? Elle mi yapıyorsunuz yoksa bir API mi kullanıyorsunuz? Yorumlarda bana bildirin.
Kaynak: https://dev.to/accreditly/how-we-generate-code-screenshots-for-socials-b91