Khalil


Main

INGIN MENJADI SEORANG WEB DESIGNER? KAMU HARUS TAU HAL BERIKUT INI!

Posted by Khalil on
INGIN MENJADI SEORANG WEB DESIGNER? KAMU HARUS TAU HAL BERIKUT INI!

Jika kamu seorang pecinta teknologi, berarti kamu tau dong tentang web design?

Yup betul! Secara teori, web design adalah kegiatan untuk merancang aplikasi – aplikasi dan tampilan dengan berbasis web yang menggunakan bahasa pemograman.

Orang yang melakukan kegiatan tersebut dikenal dengan sebutan web designer. Peran dari seorang web designer adalah mengintegrasikan semua komponen dan semua sumber daya yang dipakai untuk membuat sebuah rancangan website seperti membuat tampilan halaman aplikasi web yang dinamis dan user friendly.

Berikut adalah hal yang harus dikuasai Web Designer kemampuan teknik seorang web designer, diantaranya:

  1. HTML/CSS

HTMLadalahsingkatan dari Hyper Text  Markup Language yaitu bahasa pemrograman standar yang digunakan untuk membuat sebuah halaman web, yang kemudian dapat diakses untuk menampilkan berbagai informasi di dalam sebuah penjelajah web Internet (Browser).

  • JavaScript/jQuery

Bahasa pemrograman web yang bersifat Client Side Programming Language. Client Side Programming Language adalah tipe bahasa pemrograman yang pemrosesannya dilakukan oleh client. Aplikasi client yang dimaksud merujuk kepada web browser seperti Google Chrome dan Mozilla Firefox.

  • Framework CSS

Pengguna website apapun pasti akan membutuhkan yang namanya CSS Framework. Hal ini berguna untuk mempermudah dalam mendesain dalam sebuah website dan pemanfaatan yang ada

  • Preprocessor CSS

kemampuan untuk membuat variabel, fungsi, dan penulisan CSS yang lebih terstruktur dan pastinya membuat proses Development lebih efisien dan fungsionalitas

  • Version Control/Git

sistem yang dapat menyimpan perubahan yang dilakukan terhadap suatu file ataupun sekumpulan file, sehingga kita dapat melakukan mengatur versi dari file tersebut. 6. Responsive design

  • Testing/Debugging

Testing adalah salah satu aktivitas yang harus dilakukan sebagai bagian dari tahap pembangunan perangkat lunak. Sementara Debugging adalah aktivitas yang dilakukan untuk mencari posisi kesalahan dan memperbaikinya apabila dari hasil testing diperoleh indikasi adanya error atau defect

  • Soft skill web designer

Selain keterampilan secara teknik (hard skill) yang harus dimiliki oleh seorang web designer, ada juga keterampilan secara soft skill, yakni kemampuan berpikir dari dalam diri seseorang. Untuk selengkapnya, simak penjelasan berikut:

YANG HARUS DIPERHATIKAN BILA INGIN MENJADI SEORANG WEB DESIGNER

1. Keterampilan menulis

Keterampilan menulis sangat penting bagi perancang web agar hasil desain website semakin maksimal dan menarik di lihat pengunjung.

2. Gaya tersendiri

Setiap orang memiliki gaya unik tersendiri atau lebih spesifiknya “gue punya gaya sendiri” slogan itu cocok di sematkan untuk kamu yang mau mendesain web, be creative by your self ya!

3. Pengelolaan manajemen

Selain dalam hal artistik, kemampuan mengelola website juga perlu kamu pelajaridan perlu kamu terapkan lho

4.  Dunia Marketing

Bila kamu memiliki web dengan design mu sendiri, kamu bisa mempromosikannya kepada publik apa yang sudah kamu kerjakan, dan kuncinya harus tetap percaya diri ya!

5. Paham akan SEO

SEO merupakan singkatan dari “search engine optimization” (pengoptimalan mesin telusur) atau “search engine optimizer”. Hal ini sangatlah penting dalam mengoptimalkan halaman web, sehingga dapat muncul di halaman paling depan mesin pencari Google.

Elemen Penting Dalam Web Design

Tampilan website kamu harus bagus dan menarik, rapi sesuai fungsinya.

  • Layout
  • Element white space
  • Pewarnaan website
Main

WEB DESIGN

Posted by Khalil on
WEB DESIGN

Web design adalah suatu kegiatan yang bertujuan untuk merancang aplikasi dan tampilannya dengan basis web menggunakan bahasa pemograman. Web design terdiri dari jenis,gaya dan manfaatnya,untuk jenis website sendiri terdiri dari website statis dan website dinamis. Desain website statis ini termasuk desain yang tidak memiliki interaktif pada pengunjung. Biasanya digunakan untuk presentasi dan merupakan jenis desain yang pertama kali.

Secara teori, perbedaan kedua nya adalah jika website statis adalah website dimana informasi yang terkandung di dalamnya tidak bisa diupdate melalui aplikasi website tersebut melainkan harus merubah script yang ada di dalamnya. Sedangkan Web Dinamis adalah website dimana informasi yang terkandung di dalamnya dapat di update melalui aplikasi website tersebut. Contoh website statis adalah Microsoft Word, Notepad, Photoshop, dan Dreamweaver Sedangkan website dinamis sendiri termasuk generasi setelah statis dan memiliki kelebihan yang lebih banyak. Dirancang dengan bahasa pemrograman PHP atau asp yang sudah menggunakan HTML juga.Lalu ada CMS, CMS adalah Content Management System yang akan lebih

Gaya Web Design

  • Dropbox
  • FreshBooks
  • Sribu
  • Airbnb
  • Evernote
  • Mint
  • Boxbee
  • eWedding

Manfaat Penggunaan Web Design

  • Akan menjadikan tampiilan website kita lebih menarik , bisa juga akan berbeda dengan website orang lain. Dan pengunjung pun akan merasa kagum dengan layout website yang kita ciptakan.
  • Tampilan website yang Anda miliki juga menjadi lebih tertata rapi dan lebih rajin. Pengunjung menjadi dapat lebih mengetahui jenis jasa atau produk yang Anda tawarkan.
  • Dengan adanya web desain, maka akan menjadi media promosi yang dapat menyampaikan misi dan visi yang dimiliki perusahaan dalam sekaligus.
  • Desain website dapat digunakan sebagai alat untuk membuat bisnis menjadi terlihat baik dan lebih menarik. Bila pengunjung datang pada website kita dengan isi dan tampilan menarik, maka itu juga bisa di sebut dengan tek marketing dimana itu bisa menarik perhatian para calon kpnsumen atau para calon pembeli.
  • Situs web dapat dijadikan transaksi bisnis baik barang jasa

Elemen Penting Dalam Web Design

Membuat desain pada web tentunya harus memperhatikan kerapihan serta kejelasan pada website itu sendiri, dan terutama kita harus fokus pada elemen –elemennya yaitu Layout website, font, white space,  dan warna. Layout website ini termasuk elemen penting dalam desain website. Layout atau tata letak ini termasuk elemen yang akan berhubungan dengan tata letak Web Design dan penyusunannya harus optimal.

Untuk elemen white space, merupakan ruang kosong tapi penting dalam desain website. Berfungsi sebagai separator untuk setiap elemen desain, Memberi fokus terhadap elemen yang ingin ditonjolkan dan Memberi kesan desain yang lebih clean dan relaxing. Untuk font, kita harus menganali klasifikasi huruf dan karakternya masing-masing. Ukuran font berpengaruh terhadap readibility. Dalam jarak dekat, mata manusia tidak bisa membaca huruf yang terlalu kecil juga huruf yang terlalu besar. Ukuran paling pas untuk body text biasanya antara 10-12px. Untuk warna desain website, kita harus bisa memilah warna mana yang akan di pakai karena itu menentukan bagaimana menariknya website yang kita buat, terlebih warna adalah sesuatu yang bisa mempengaruh mood pembaca dan pengunjung. Jangan memilih warna yang membosankan atau warna yang terkesantidak nyambung dengan warna lainnya.

Main

MACAM – MACAM LAYOUT DESAIN WEB

Posted by Khalil on
MACAM – MACAM LAYOUT DESAIN WEB

Web design adalah suatu kegiatan yang bertujuan untuk merancang aplikasi dan tampilannya dengan basis web menggunakan bahasa pemograman. Dan bagaimana isi web konten ditampilkan, yang dikirimkan ke pengguna akhir melalui World Wide Web, dengan menggunakan sebuah browser web atau perangkat lunak berbasis web. Sebelum mengenal jenis-jenis design web, ada baiknya kita kenali dulu jenis-jenis dari web itu sendiri. Berikut adalah ulasannya :

  • Website Statis

Merupakan website yang kontennya konstan atau tidak berubah. Setiap laman dibuat dengan kode HTML dan menunjukkan informasi yang sama kepada setiap pengunjung. Hanya webmaster atau developer yang bisa melakukan update pada konten website statis.Umumnya website statis dibuat dengan menggunakan HTML dan CSS oleh developer yang memahami pemrograman dan coding. Anda juga bisa menggunakan generator website statis seperti Jekyll, Hexo, atau Hugo. Karena website statis tidak membutuhkan update konten secara berkala, website statis tidak memerlukan database. Biasanya website statis digunakan untuk website perusahaan yang hanya perlu memberikan informasi-informasi dasar seperti alamat, kontak, dan sejarah perusahaan.

  • Website Dinamis

Sebaliknya website dinamis adalah website yang kontennya selalu di-update secara berkala. Kebanyakan website bersifat dinamis karena lebih mudah dikelola dibandingkan website statis. Website dinamis menampilkan kontennya dari database yang biasanya hanya bisa diakses oleh webmaster atau developer. Meskipun begitu, website dinamis memungkinkan untuk memiliki beberapa user yang bisa melakukan update konten website tanpa mengganggu desain web.

  • CMS

Metode pertama adalah cara yang paling populer, yaitu menggunakan Content Management System (CMS). CMS adalah perangkat lunak atau sistem yang digunakan untuk membuat dan mengatur konten digital. Anda bisa membuat website dengan cepat dan mudah menggunakan CMS. Beberapa CMS yang paling banyak digunakan adalah WordPress, Joomla!, dan Drupal. Dari ketiga CMS populer tersebut, WordPress adalah yang paling mudah untuk dioperasikan. Selain mudah dioperasikan, WordPress juga merupakan pemegang market share terbesar CMS dengan angka 59.9%.

  • HTML dan CSS

Jenis website berdasarkan platform yang terakhir adalah website yang menggunakan HTML dan CSS. Masih ingat jenis website di awal artikel ini? Betul, website statis. Biasanya website statis dibuat menggunakan metode ini. Metode membuat website terakhir ini memerlukan pengetahuan tentang coding dan pemrograman menggunakan HTML dan CSS. Anda bisa membuat kode untuk website menggunakan software seperti Notepad++, Text Wrangler, atau Sublime Text.

  • Blog atau Website Pribadi
  • Ecommerce/Toko Online
  • Website Perusahaan
  • Blog (Content Marketing)
  • Organisasi atau Instansi Pemerintah
  • Komunitas Online
  • Media Sharing
  • Website Berita

Berikut adalah macam-macam layout desain web:

1. Static

Layout static pada web desain memiliki ukuran tetap pada semua resolusi browser. Lebar layout static ini menggunakan satuan pixel (px) sehingga akan menghasilkan layout yang statis.

Contoh layout static: Facebook, Twitter.

2. Fluid

Layout fluid memiliki kemampuan untuk menyesuaikan lebar layout sesuai dengan resolusi browser. Hal tersebut terjadi karena lebar layout menggunakan satuan percent (%) sehingga lebar layout akan mengikuti resolusi browser saat dikecilkan atau dibesarkan (resize).

Contoh layout fluid: gmail, yahoo mail.

3. Responsive

Layout responsive memiliki kemampuan untuk berganti layout pada resolusi tertentu. Layout bisa berganti ini berkat kehadiran CSS3 dengan sintax media queries nya. Kalo di pemrograman fungsinya mirip ‘if‘, tapi ini di css. Jadi sebuah web bisa memiliki tampilan berbeda saat dibuka dengan pc, tablet atau smartphone.

4. Responsive-fluid

Layout responsive-fluid merupakan gabungan antara responsive dengan fluid sehingga lebar layout akan mennyesuaikan resolusi dan akan berganti layout pada resolusi tertentu. Layout ini menggunakan media queries dan satuan percent (%) untuk ukuran.

5. Horizontal Scrolling

Layout horizontal scrolling adalah dengan menata content web kesamping, sehingga untuk melihat content web tersebut menggunakan scroll horizontal.

6. Parallax Scrolling

Layout parallax scrolling menggunakan beberapa layer dan setiap layer memiliki kecepatan perpindahan yang berbeda-beda saat di scroll sehingga menimbulkan efek yang menarik.

(Sumber hiduptreda.com )

Main

WEB DESIGN

Posted by Khalil on
WEB DESIGN

Web Design adalah cangkupan bagaimana isi web konten ditampilkan, (biasanya berupa hypertext atau hypermedia) yang dikirimkan ke pengguna akhir melalui World Wide Web, dengan menggunakan sebuah browser web atau perangkat lunak berbasis web. Beberapa web designer memilih membuat coding HTML dan CSS dari awal, sementara yang lain menggunakan “WYSIWYG” editor seperti Adobe Dreamweaver. Jenis editor ini menyediakan antarmuka visual untuk merancang tata letak halaman web dan perangkat lunak yang secara otomatis menghasilkan coding HTML dan CSS yang sesuai.

Cara lain yang lebih populer untuk desain website adalah dengan sistem manajemen konten seperti wordpress. Layanan ini menyediakan template website yang berbeda yang dapat digunakan sebagai titik awal pembuatan website. Webmaster dapat menambahkan konten dan menyesuaikan tata letak menggunakan antarmuka berbasis web.

Ada beberapa prinsip yang harus diperhatikan dalam membuat Web Design, diantaranya sebagai berikut :

  • Clarity yaitu suatu prinsip dimana pembuatan web harus mempunyai tujuan/kejelasan untuk apa web tersebut dibuat.
  • Metaphore yaitu suatu penerapan prinsip – prinsip lama untuk digunakan pada suatu prinsip yang baru.
  •  Consistency yaitu dalam pembuatan web, perancang web harus konsisten dengan tema yang diangkat.
  • Alignment yaitu mengenai kerapihan tulisan yang dibuat pada suatu artikel. Prinsip ini mempunyai peranan penting karena mempengaruhi pembacaan suatu artikel.
  • Proximity yaitu merupakan kelengkapan dari suatu field.
  • Contrast yaitu prinsip dimana para pembaca nyaman dalam melihat suatu situs.

Tujuan Web Design

  • Perbaikan sesuai browser dengan standar W3C diminta penerimaan luas dan penggunaan XHTML / XML bersama dengan Cascading Style Sheets (CSS) untuk posisi dan memanipulasi unsur-unsur halaman web dan objek. Kemampuan browser untuk mengirimkan berbagai konten dan pilihan aksesibilitas kepada klien tanpa menggunakan plug-in
  • Dengan spesialisasi yang tumbuh di bidang teknologi informasi ada kecenderungan kuat untuk membedakan antara desain web (web design) dan pengembangan web (web development).
  • Menampilkan media yang lebih kompleks (vektor grafis, animasi, video, suara) membutuhkan plug-in seperti Adobe Flash, QuickTime, Java run-time dan lain-lain. Plug-in juga dimasukkan ke dalam halaman web dengan menggunakan HTML / tag XHTML.
  • Untuk membuat situs web atau dokumen elektronik dan aplikasi yang berada pada web server dan menampilkan konten dan fitur antarmuka interaktif kepada pengguna akhir dalam bentuk halaman Web. Seperti unsur-unsur teks, gambar (gif, jpeg) untuk ditempatkan pada halaman menggunakan HTML / XHTML / tag XML.

Layout atau tata letak dibutuhkan untuk mengatur bagaimana isi sebuah kontent website. Jenis-jenis tata letak website antara lain:

  • Fixed Layout

Ini adalah layout atau tata letak primitif yang disukai oleh banyak orang, dan mudah untuk dibuat serta disesuaikan. Sebagaimana namanya, komponen website dikemas dalam lebar yang tetap . Dari pernyataan di atas jelaslah bahwa siapa pun yang melihat website dari browser dengan ukuran apa pun akan melihat website beserta komponen – komponennya dalam lebar yang tetap dan mereka tidak akan berpindah. Jika designer web di Surabaya menggunakan layout tipe fixed, lebar tata letak situs web tetap sama bahkan ketika dilihat di browser yang berbeda.

Bila dilihat melalui layar yang lebih besar, pengguna akan dihadapkan dengan spasi. Bila dilihat melalui layar yang lebih kecil, pengguna harus scroll website secara horizontal (yang tidak disukai oleh sebagian besar pengguna) untuk melihat elemen web. (crosstechno.com)

  • Fluid Layout

Ini adalah salah satu tipe layout  yang paling disukai oleh web designer. Layout dengan tipe fluid akan membuat keseluruhan tampilan situs web terlihat baik pada browser yang berbeda. Lebar persentase yang dirancang untuk elemen – elemen situs menyesuaikan dengan baik untuk ukuran layar yang berbeda dan sesuai untuk resolusi layar pengguna dengan sempurna. Beberapa poin yang menarik sedikit tentang tata letak ini adalah: Tidak ada perbedaan white space yang berlebihan ketika dilihat melalui browser yang berbeda, sebuah fluid layout yang dirancang dengan baik dapat mengatasi horizontal scroll untuk meningkatkan visibilitas pengguna, menyiapkan beberapa ukuran untuk video, konten, gambar agar sesuai dengan resolusi layar yang berbeda. (crosstechno.com)

  • Elastic Layout

Secara singkat, ini tidak lain adalah kombinasi dari dua layout lainnya, fixed dan fluid. Ini adalah tata letak terbaik yang kebanyakan diadopsi berbagai website untuk saat ini, terutama setelah masuknya ponsel ke pasar. Pada tipe ini, ukuran font menyesuaikan diri setiap kali terjadi perubahan resolusi layar. Jadi, jika designer web Surabaya menggunakan tipe ini, layout akan sesuai dengan berbagai ukuran dan resolusi layar yang berbeda sehingga dapat menyediakan visibilitas pengguna web menyenangkan.

Main

HAL YANG HARUS KAMU PAHAMI UNTUK MENJADI WEB DESIGNER

Posted by Khalil on
HAL YANG HARUS KAMU PAHAMI UNTUK MENJADI WEB DESIGNER

Jika kamu seorang pecinta teknologi, berarti kamu tau dong tentang web design?

Yup betul! Secara teori, web design adalah kegiatan untuk merancang aplikasi – aplikasi dan tampilan dengan berbasis web yang menggunakan bahasa pemograman.

Orang yang melakukan kegiatan tersebut dikenal dengan sebutan web designer. Peran dari seorang web designer adalah mengintegrasikan semua komponen dan semua sumber daya yang dipakai untuk membuat sebuah rancangan website seperti membuat tampilan halaman aplikasi web yang dinamis dan user friendly.

Berikut adalah hal yang harus dikuasai Web Designer kemampuan teknik seorang web designer, diantaranya:

  1. HTML/CSS

HTMLadalahsingkatan dari Hyper Text  Markup Language yaitu bahasa pemrograman standar yang digunakan untuk membuat sebuah halaman web, yang kemudian dapat diakses untuk menampilkan berbagai informasi di dalam sebuah penjelajah web Internet (Browser).

  • JavaScript/jQuery

Bahasa pemrograman web yang bersifat Client Side Programming Language. Client Side Programming Language adalah tipe bahasa pemrograman yang pemrosesannya dilakukan oleh client. Aplikasi client yang dimaksud merujuk kepada web browser seperti Google Chrome dan Mozilla Firefox.

  • Framework CSS

Pengguna website apapun pasti akan membutuhkan yang namanya CSS Framework. Hal ini berguna untuk mempermudah dalam mendesain dalam sebuah website dan pemanfaatan yang ada

  • Preprocessor CSS

kemampuan untuk membuat variabel, fungsi, dan penulisan CSS yang lebih terstruktur dan pastinya membuat proses Development lebih efisien dan fungsionalitas

  • Version Control/Git

sistem yang dapat menyimpan perubahan yang dilakukan terhadap suatu file ataupun sekumpulan file, sehingga kita dapat melakukan mengatur versi dari file tersebut. 6. Responsive design

  • Testing/Debugging

Testing adalah salah satu aktivitas yang harus dilakukan sebagai bagian dari tahap pembangunan perangkat lunak. Sementara Debugging adalah aktivitas yang dilakukan untuk mencari posisi kesalahan dan memperbaikinya apabila dari hasil testing diperoleh indikasi adanya error atau defect

  • Soft skill web designer

Selain keterampilan secara teknik (hard skill) yang harus dimiliki oleh seorang web designer, ada juga keterampilan secara soft skill, yakni kemampuan berpikir dari dalam diri seseorang. Untuk selengkapnya, simak penjelasan berikut:

Dan berikut adalah hal yang perlu di perhatikan bila ingin menjadi seorang Web Designer.

1. Keterampilan menulis

Keterampilan menulis sangat penting bagi perancang web agar hasil desain website semakin maksimal dan menarik di lihat pengunjung.

2. Gaya tersendiri

Setiap orang memiliki gaya unik tersendiri atau lebih spesifiknya “gue punya gaya sendiri” slogan itu cocok di sematkan untuk kamu yang mau mendesain web, be creative by your self ya!

3. Pengelolaan manajemen

Selain dalam hal artistik, kemampuan mengelola website juga perlu kamu pelajaridan perlu kamu terapkan lho

4.  Dunia Marketing

Bila kamu memiliki web dengan design mu sendiri, kamu bisa mempromosikannya kepada publik apa yang sudah kamu kerjakan, dan kuncinya harus tetap percaya diri ya!

5. Cukup memahami SEO

SEO merupakan singkatan dari “search engine optimization” (pengoptimalan mesin telusur) atau “search engine optimizer”. Hal ini sangatlah penting dalam mengoptimalkan halaman web, sehingga dapat muncul di halaman paling depan mesin pencari Google.

Manfaat Penggunaan Web Design

The webdesign in website creation
  • Penampilan web tidak akan terlihat membosankan.
  • Tampilan website akan menjadi lebih tertata. Visitor bisa lebih paham apa jenis jasa atau produk yang di tawarkan.
  •  Dengan adanya web desain, maka akan menjadi media promosi yang dapat menyampaikan misi dan visi yang dimiliki perusahaan dalam sekaligus.
  • Design website bisa membuat bisnis kamu menjadi positif dimata visitor yang mengunjungi website kamu.

Elemen Penting Dalam Web Design

Tampilan website kamu harus bagus dan menarik, rapi sesuai fungsinya.

  • Layout
  • Element white space
  • Pewarnaan website