# 103: Photoshopping Parçacıklar Alanı - CSS Hileleri

Anonim

Snippet alanına dalma zamanı! Yani, onun asıl içerik alanı. Başlığı zaten yerleştirdik. Snippet alanı oldukça popüler. Analitiğin derinliklerine dalmadan, sosyal medyayı izlemekten ve gerçek hayattaki insanlardan bu alanda birçok yararlı şey bulduklarını duymaktan biliyorum.

V9'da çok yaygın ve meşru bir eleştiri, göz atmanın zor olmasıydı. Çok renkli bir akordeondu ve her bir pasaj, o pasaj alt bölümünün ana rengiyle eşleşen bir "balon bağlantısı" (daha iyi bir tanımlayıcı olmaması nedeniyle) idi. Daha da kötüsü, haklı olarak hizalanmışlardı ki bu onlara biraz yer açmanın ve gözlerini biraz zıplatmanın düzgün bir yolu olduğunu düşündüm, ancak sonunda tuhaf ve özensiz görünüyorlardı.

Burada kendimizi kurtaralım ve Snippet alanını daha güzel göz atalım. Yine de, bu içeriğin çoğu arama yoluyla bulunur. Yine de, göz atmayı güzelleştirebilir.

Hemen içerik alanına bir arama alanı koymamaya karar veriyoruz. Geçmişte vardı, ancak bu bir yeniden tasarım ve aramayı tek bir alanda birleştirmeye karar veriyoruz. Aramayı nasıl kullanacağınızı bir kez öğrendiğinizde, nasıl çalıştığını sonsuza kadar bileceksiniz.

Tasarım için iki sütunlu bir şey kullanıyoruz. Sol tarafta, her biri benzersiz bir renge sahip ana Snippet kategorileri. Gökkuşağı zamanı! İlham almak için kendi galerimize göz atıyoruz.

Sağdaki sütun, o kategorideki parçacıkların bir listesi olacaktır. Basit, göz atması kolay. Altbilgi bağlantıları gibi. İnsanlar bağlantı listelerini nasıl tarayacaklarını ve kullanacaklarını bilirler. Var olan en mükemmel basit tasarım kalıbı.

Yine de bazı tasarım kararlarıyla uğraşıyoruz. Bağlantılar bölümün rengiyle mi eşleşmeli yoksa sadece gri mi olmalı? Bağlantıları ana rengin soluk bir versiyonu ile "zebra çizmeli" miyiz? Bir yayın tarihi mi yoksa güncellenmiş bir tarih mi eklemeliyiz? Düşünülmesi gereken eğlenceli ve önemli şeyler, ancak bu tür kararları her zaman tarayıcıya geldiğimizde ve gerçek verilerle çalıştığımızda verebiliriz.