Secara umum, pekerjaan yang diselesaikan oleh desain web sebenarnya: mengubah rendering PSD menjadi halaman template HTML+CSS. Secara umum, kita akan mendapatkan PSD dari artis, dan orang yang berbeda akan memiliki pendekatan yang berbeda:
1. Buka kembang api dan ekspor gambar ke HTML.
2. Langsung gunakan alat -alat seperti Dreamweaver untuk menyeret dan meletakkan tata letak, mengimpor gambar yang relevan, dan sumber daya flash.
3. Setelah menyelesaikan potongan di PS, lihat rendering di editor teks dan buatlah langkah demi langkah.
Di atas adalah metode yang paling umum digunakan, tetapi tidak ada yang baik:
Metode pertama adalah yang terburuk, kode seperti itu tidak dipertahankan atau dapat dibaca sama sekali.
Metode kedua juga tidak baik, kode pasti akan menjadi berlebihan, dan hal -hal yang Anda buat perlu diperiksa.
Metode ketiga juga tidak baik, karena Anda perlu melihat rendering sedikit demi sedikit, yaitu ketika menulis tag HTML, Anda terus -menerus mengasumsikan cara menampilkan karya ini.
Cara yang benar untuk melakukannya:
1. Setelah mendapatkan PSD, jangan lakukan hal lain terlebih dahulu. Tulis kerangka kerja halaman web secara langsung di editor teks. Jangan berasumsi cara membuat CSS ini di masa depan. Label ini sepenuhnya dinaturalisasi tanpa menambahkan CSS apa pun.
2. Setelah menulis, pastikan tidak ada masalah dengan posisi keseluruhan setelah menjalankan setiap browser.
3. Tulis CSS secara keseluruhan, di sini CSS hanya bertanggung jawab atas penentuan posisi dan gaya blok besar.
4. Potong sumber daya gambar yang diperlukan, buatlah sedikit demi sedikit dalam kerangka kerja tertulis, terus -menerus men -debug mereka, dan akhirnya menjadi produk jadi.
5. Akhirnya, tambahkan komentar ke kode Anda sendiri, dan tambahkan komentar ke kode Anda sendiri dengan tepat di CSS dan HTML.
Masih banyak hal yang harus diperhatikan jika kita ingin melakukan saklar yang fleksibel untuk membuat kulit dan membiarkan CSS mendominasi kinerja, tetapi proses umum seperti ini. Tentu saja, kita tidak dapat menulis HTML secara langsung di awal, tetapi setidaknya kita harus memiliki kesadaran ini dan melanjutkan langkah demi langkah. . .
File PSD memotong situs web dari dua poin utama:
1. Halaman independen
1. Analisis halaman ini dan pertama -tama jelaskan struktur umum di kepala Anda atau di kertas konsep.
2. Menurut situasi draft desain, menganalisis distribusi gambar latar belakang, distribusi gambar ICO, dll.
3. Potong gambar yang sesuai, ekspor dan gabungkan gambar
4. Tulis kode xhtml struktur keseluruhan di editor, termasuk struktur semua elemen yang muncul di halaman
5. Tulis kode keseluruhan dan modul dalam gaya CSS
6. Penyesuaian Detail
7. Setelah bekerja, browser akan memverifikasi apakah itu benar
2. Situs kecil atau besar yang terdiri dari beberapa halaman
1. Jelajahi semua draft desain dan menyatukan distribusi modul situs, gambar, dan file
2. Mulai titik operasi pertama, tetapi penting untuk merencanakan distribusi konten Situs.
Pertimbangan keseluruhan:
1. Gabungan gambar untuk mengurangi jumlah permintaan
2. Rasionalitas struktural dan semantikisasi
3. Kesederhanaan gaya membuatnya mudah dipertahankan nanti
4. Sebagian besar pertimbangkan pemeliharaan dan pengembangan program selanjutnya, bagaimana cara mencapai efeknya.