Cara Memotong Templat

Isi kandungan:

Cara Memotong Templat
Cara Memotong Templat

Video: Cara Memotong Templat

Video: Cara Memotong Templat
Video: cara menghilangkan watermark template capcut/capcut 2024, November
Anonim

Pereka web profesional mengembangkan templat laman web, biasanya dalam penyunting grafik yang hebat seperti Adobe Photoshop. Hasil karya adalah fail dengan gambar, yang dalam bentuk ini diberikan kepada pelanggan. Untuk menggunakan reka bentuk siap pakai, iaitu untuk menyusun laman web, anda perlu memotong templatnya.

Cara memotong templat
Cara memotong templat

Perlu

penyunting grafik raster Adobe Photoshop

Arahan

Langkah 1

Buka fail templat di editor grafik Adobe Photoshop. Pilih Fail dan Buka dari menu, atau tekan kombinasi kekunci Ctrl + O. Dalam dialog yang muncul selepas itu, pergi ke direktori dengan fail, pilih dalam senarai dan klik butang "Buka".

Cara memotong templat
Cara memotong templat

Langkah 2

Pilih skala yang sesuai untuk melihat gambar templat. Gunakan item Zoom Tool atau menu konteks. Pilih skala yang membolehkan anda meletakkan kursor dengan ketepatan piksel. Ini diperlukan untuk menetapkan garis rujukan dengan tepat.

Cara memotong templat
Cara memotong templat

Langkah 3

Bentuk sekumpulan garis rujukan di atas gambar templat. Hidupkan paparan pembaris di tetingkap dokumen jika belum dihidupkan. Untuk melakukan ini, tekan Ctrl + R atau pilih View and Rulers dari menu.

Cara memotong templat
Cara memotong templat

Langkah 4

Gerakkan kursor tetikus ke atas pembaris atas untuk menambah garis rujukan mendatar. Tekan dan tahan kekunci kiri. Gerakkan kursor tetikus ke bawah ke kawasan gambar. Begitu juga, dengan menggunakan pembaris yang betul, anda boleh menambah garis mendatar.

Langkah 5

Tambahkan bilangan garis rujukan yang diperlukan dan letakkan di sepanjang sempadan pembahagian kawasan templat. Garisan harus melalui semua tempat di mana anda ingin memotong templat. Mereka harus mengekang semua gambar dan kawasan logik (logo, tajuk laman web, menu mendatar dan menegak, dll.) Yang akan disajikan di laman web.

Langkah 6

Aktifkan Slice Tool. Butang berada pada bar alat menegak.

Cara memotong templat
Cara memotong templat

Langkah 7

Buat bilangan kawasan pemotongan yang diperlukan menggunakan Slice Tool. Pilih skala yang sesuai untuk memaparkan templat. Gunakan tetikus untuk menetapkan sempadan kawasan. Garis panduan yang ditambahkan pada langkah ketiga akan memberikan penentuan kedudukan tepat pada objek yang anda buat. Selaraskan kawasan yang ada jika perlu menggunakan Slice Select Tool.

Cara memotong templat
Cara memotong templat

Langkah 8

Tukar sifat kawasan pemotongan seperti yang diperlukan. Aktifkan Slice Select Tool. Klik kanan pada kawasan yang dikehendaki. Dalam menu konteks, pilih item Edit Slice Options. Dalam dialog Slice Options yang muncul, pilih jenis kawasan (gambar, kawasan kosong, meja), mod isi latar, tentukan, jika perlu, nama, URL sasaran, kandungan atribut alt="Image" dan nilai lain. Klik OK.

Cara memotong templat
Cara memotong templat

Langkah 9

Potong templat. Pilih Fail dan Simpan untuk Web & Peranti dari menu, atau tekan Shift + Ctrl + Alt + S. Dalam dialog Save for Web & Devices tentukan format dan parameter pemampatan gambar yang akan dipotong templat. Klik butang Simpan. Dialog Save Optimized As akan dipaparkan.

Cara memotong templat
Cara memotong templat

Langkah 10

Pilih HTML dan Imej (*.html) dalam senarai drop-down Jenis fail, dan di medan Nama fail masukkan nama fail di mana markup HTML templat akan ditempatkan. Dalam senarai Slice, pilih Semua Slice. Tentukan direktori untuk output dan klik butang "Simpan".

Langkah 11

Fail HTML akan ditempatkan di direktori sasaran, yang sebenarnya adalah templat halaman web siap pakai. Subdirektori gambar akan mengandungi sekumpulan gambar ke mana templat asal dipotong.

Disyorkan: