Cara membuat situs web di Illustrator

Langkah 1

Buat dokumen Illustrator dengan lebar 960 piksel dari ketinggian yang Anda pilih tergantung pada konten dan desain yang ada dalam pikiran Anda. Situs dengan lebar 960 piksel sesuai dengan lebar resolusi monitor paling populer dari 1.024 piksel saat bilah gulir dan batas jendela diperhitungkan.

Langkah 2

Buat sketsa gambar desain visual dari situs web Anda, jika Anda belum melakukannya. Ini akan memberi Anda referensi yang berguna untuk membuat dalam Illustrator.

Langkah 3

Buat desain Anda menggunakan alat gambar dan teks untuk tajuk yang rumit. Jika Anda memasukkan di dalamnya teks seperti pesan di blog, kosongkan ruang di area tersebut atau buat tepi yang mengelilinginya untuk garis sederhana.

Langkah 4

Tambahkan panduan ke desain Anda untuk mendemarkasi bagian-bagian berbeda dari desain. Ini sangat penting karena Anda akan menggunakan panduan tersebut untuk melakukan pemotongan, yang akan menentukan tepi elemen di situs web Anda. Panduan dapat membantu Anda menyelaraskan objek dengan presisi. Klik pada penggaris vertikal atau horizontal dan seret mouse ke tempat yang Anda inginkan.

Langkah 5

Periksa kembali lokasi panduan Anda untuk akurasi dan akurasi. Seret lebih jauh, jika perlu, untuk memisahkan setiap elemen, seperti gambar navigasi yang akan menjadi tautan di situs Anda.

Langkah 1

Pilih "Objek" di menu, lalu pilih "Potong" dan "Buat dari panduan". Ketika Anda membuat panduan, Anda akan melihat kotak hitam kecil di dalam setiap potongan dengan nomor yang sesuai. Pilih "File" di menu dan kemudian "Simpan untuk web dan perangkat." Pilih alat untuk memilih potongan, yang merupakan ikon kedua pada menu alat yang terletak di sisi kanan layar di bawah ikon tangan. Pilih semua potongan.

Langkah 2

Pilih pengaturan optimasi dari antara opsi yang tercantum di sisi kanan layar. Anda dapat memilih konfigurasi yang telah ditetapkan sebelumnya atau membuat profil khusus, tergantung pada apakah Anda ingin gambar Anda menjadi file JPEG, GIF atau PNG. Anda juga dapat menyesuaikan kualitas gambar.

Langkah 3

Pratinjau konfigurasi yang berbeda dengan mengklik tab "2-up" dan "4-up". Di sudut bawah setiap pratinjau, Anda akan melihat informasi pengoptimalan, seperti ukuran file dan waktu perenderan dari browser. Klik pada tombol "Simpan". Putuskan apakah Anda ingin menyimpan gambar dan kode Anda dan arahkan ke area tersebut menggunakan tombol "Di mana".

Langkah 4

Pilih format pekerjaan Anda. Jika Anda mengontrol XXXX dan hanya menginginkan gambar karena Anda akan menambahkan kode nanti, pilih "Hanya gambar". Jika Anda seorang pemula atau lebih suka bahwa XXXX dihasilkan untuk Anda, pilih opsi "XXXX dan gambar". Jika Anda lebih suka untuk memposisikan elemen yang akan diatur dengan Cascading Style Sheets daripada tabel, pilih "Konfigurasi default" dan "Ekspor sebagai lapisan CSS" di tab "Lapisan".

Langkah 5

Buka file XXXX dari dalam browser untuk melihat pekerjaan Anda. Edit file dengan program desain web.