Tumblr menggabungkan penekanan pada kreativitas visual dengan panjang posting yang berada di antara singkatnya Twitter dan panjang terbuka dari entri blog tradisional. Saat Anda menggunakan tema Tumblr khusus yang memperluas tampilan identitas online dan offline Anda, sebuah tumblelog cocok dengan strategi yang mencakup media online dan sosial lainnya. Desainer web sering mulai mengembangkan tema khusus di Adobe Photoshop, menggunakan format file PSD berlapis program sebagai ruang kerja visual mereka.
Menetapkan Dimensi
Panduan penggaris Adobe Photoshop dan kemampuan pelapisan menyederhanakan tugas membuat dasar tema Tumblr, lengkap dengan kisi tata letak yang mendefinisikan dimensi area konten. Jika Anda mengatur grup lapisan untuk setiap aspek desain Anda, termasuk area konten utama dan bilah sisi, Anda dapat menempatkan semua panduan untuk setiap elemen pada satu lapisan dalam setiap grup. Pengaturan ini memungkinkan Anda untuk membuat panduan Anda terlihat secara selektif, daripada hanya menampilkan dan menyembunyikan semuanya dengan pintasan keyboard Photoshop atau item menu, dan menyatukan elemen panduan terkait. Beri nama grup dan lapisan Anda untuk mengidentifikasi fungsi setiap bagian dari desain Anda. Saat-saat Anda berinvestasi dalam tugas penamaan tambahan terbayar saat Anda tidak perlu menghabiskan waktu untuk menghidupkan dan mematikan lapisan untuk menentukan apa yang dikandungnya. Untuk menemukan dimensi elemen tata letak apa pun dengan cepat, tekan "F8" untuk membuka panel Info dan kemudian "Ctrl-klik" pada thumbnail panel Lapisannya untuk memuat pilihan berdasarkan piksel pada lapisan itu.
Memilih Warna
Apakah Anda menggunakan Color Picker yang telah teruji waktu untuk memilih warna untuk tema Anda, memuat opsi dari perpustakaan warna untuk mencocokkan bagian atau logo yang dicetak, atau mengandalkan alat pipet untuk mengambil sampel nuansa dari file atau grafik lain, Adobe Photoshop menawarkan berbagai cara untuk memilih warna tema. Saat Anda mengisi lapisan dengan warna solid untuk mensimulasikan warna latar belakang tema Tumblr atau elemen lain dari desain Anda, Anda dapat menyalin rumus warna sebagai teks dari pembacaan hex Pemilih Warna dan menempelkan identifikasi warna ke dalam nama lapisan untuk referensi cepat. Enam karakter alfanumerik dalam warna hex muncul dalam kode Tumblr serta dalam desain Web untuk blog dan format online lainnya.
Membuat Grafik
Header yang mengidentifikasi tumblelog dapat menggunakan grafik bitmap sebagai grafik tematik. Anda dapat membuat elemen penting ini menggunakan kombinasi elemen berbasis teks dan piksel atau vektor di dalam file PSD Anda. Jika grafik menyertakan elemen yang dapat disesuaikan yang Anda ketik di Photoshop, biarkan sebagai tipe langsung dalam file tema berbasis PSD Anda dan rasterisasikan hanya dalam salinan file yang Anda berikan kepada orang lain yang tidak memiliki lisensi untuk file font yang diperlukan dalam tema Anda. Saat Anda menggunakan alat vektor untuk menggambar di Photoshop, termasuk alat Pena dan bentuk, gambar menggunakan aturan panduan yang selaras dengan resolusi yang mendasari file template Anda. Teknik ini membantu menjaga karya seni Anda setajam mungkin saat Anda menyimpan atau mengekspor versi rasternya.
Langkah selanjutnya
Jika Anda tahu cara membuat kode HTML dan CSS, dan memahami variabel khusus yang digunakan Tumblr dalam struktur kodenya, Anda dapat menerjemahkan dimensi, spesifikasi warna, dan grafik yang Anda buat di PSD ke dalam tema Tumblr kustom yang berfungsi. Jika pengkodean Web berada di luar keahlian Anda, Anda dapat memberikan PSD Anda kepada seorang programmer untuk menghasilkan tema untuk Anda. Seiring dengan perawatan visual, tema Tumblr harus menyertakan variabel dan blok. Variabel menerima nilai dinamis untuk membuat elemen visual Tumblr standar. Blok membentuk potongan kode yang menggabungkan variabel dengan HTML. Blok mengatur posting dan permalink yang menjangkau mereka, tautan yang bergerak di antara potongan materi yang diatur secara kronologis dan elemen yang mengakomodasi orang-orang yang menyukai atau mengikuti tumblelog individu.
Informasi Versi
Informasi dalam artikel ini berlaku untuk Adobe Photoshop CC dan Adobe Photoshop CS6. Ini mungkin sedikit berbeda atau signifikan dengan versi atau produk lain.
