Showing posts with label Desain WEB. Show all posts
Showing posts with label Desain WEB. Show all posts

Wednesday, April 8, 2015

Mengenal Tentang Seputar Portofolio Desainer Grafis

Apa itu Portofolio?
Jika disimpulkan secara singkat, Portofolio adalah sebuah data informasi rangkuman /karya terbaik yang dibuat oleh seseorang, baik itu Perusahaan untuk mengenalkan suatu Objek untuk mencapai tujuan yang telah ditentukan (ex : Produk, Company, Layanan Jasa, bahkan Untuk Promosi Diri sendiri)

Dengan kata lain, Portofolio mengacu pada sebuah tampilan yang merupakan hasil rangkuman terbaik untuk menggambarkan suatu objek tertentu baik dalam bidang apa saja kelebihan dan keuntungan tentunya.

Untuk apakah kegunaannya?
Tentu selain digunakan untuk melamar pekerjaan, atau ingin menyediakan jasa kepada suatu instansi. Portofolio juga dapat membangun sebuah manajemen strategis, sangat berguna untuk pemasaran. Jadi apa bila Sobat hendak membuat tentang kelebihan yang anda miliki, atau jika kamu sedang ingin bekerja, mungkin  Portofolio dapat berperan membantu anda, dimana dalam portofolio yang telah kamu Rangkum/ Desain sebaik mungkin dapat membuat Si Perekrut tertarik.


Bagaimana Portofolio dalam dunia Desain grafis?
Umumnya, dalam dunia seni (Desain Grafis), portofolio adalah salah satu karya sendiri atau yang wajib kita sertakan untuk mendapatkan client atau pemasaran.
Karya itu bisa berupa dari hasil kerja Desain terdahulu kita, atau rekomendasi dari Client.

Dalam Portofolio Desain grafis , sesuatu yang hendak dituangkan ialah merupakan sebuah konten, konten tersebut dapat berupa, Desain Logo, Book Cover, atau berbentuk paper/ atau Koran. Dan tentu tetap harus memiliki isi yaitu deskripsi tentang suatu tujuan yang bersangkutan.

Ex: berupa Clipping, Foto, Brosure, atau berbentuk Majalah dan Koran.

Sejenak kembali lagi, seorang Desain Grafis tidaklah cukup hanya memiliki "gelar" atau "ijazah" (tentu keahlian Desain). Melainkan Desainer grafis bisa saja selebihnya tergantung pada Portofolio mereka.
Mungkin sebagai sebagai refrensi sudah ada banyak situs yang menyediakan contoh Jenis / bentuk yang bagus. Salah satunya mungkin sibat bisa melihat hasil karya para kontestan Desainer Grafis melalui situs ajang kontes seperti 99designs.com , sribulancer.com, dll

Atau  sobat juga bisa sekedar membaca tentang Situs Refrensi klik dibawah ini  :


Bagaimana saja bentuknya?
Secara umum Portofolio haruslah dibuat secara maksimal agar nantinya dapat memukau calon klien si pembuat portofolio, dan portofolio yang dibuat harus berhubungan dengan pekerjaan kita/ atau bisa saja permintaan klien sesuai ketentuan yang diminta.
1. (Contoh Portofolio sebagai promosi "Diri sendiri")
Kita bertugas untuk  merangkum apa saja yang bersangkutan dengan keahlian/pekerjaan kita dan apa saja yang akan kita tawarkan bagi calon yang ingin kita tujukan.

Tentu untuk mencapai "Goal", Maka dituangkanlah Rangkuman tersebut ke dalam sebuah data informasi dengan semenarik mungkin, jadi dapat berupa Data data atau tampilan grafis yang lebih profesional.
2. (Contoh Portofolio sebagai "Permintaan")
Perusahaan si A, telah memberikan deskripsi tentang perusahaanya, baik itu visi dan misinya secara "Detail".

Maka tugas si pembuat Portofolio lah, untuk menuangkan/menggambarkan Deskripsi tersebut kedalam sebuah data/ atau informasi dengan cara yang lebih menarik dan membuat orang terkagum.

Dan secara terperinci Portofolio desain grafis memiliki ragam bentuk, ukuran, hingga jenis tampilan desainnya.

Bisa dilihat dari jenis diatas bahwa sipembuat portofolio menjelaskan tentang dari awal isi hingga hasil kerje kerja sebelumnya turut disertakan dalam portofolio.


  


Tentu Portofolio yang disampaikan atau tawarkan bisa dengan cara beragam, 
 Manual (ada bentuk Fisik) 
Jenis yang satu ini mungkin bisa berupa suatu kartu, atau bentuk bentuk paper lainya, dan biasanya disampaikan secara face to face.

Mungkin sobat bisa melihat contoh dibawah ini sebagai bentuk fisik.
 



Melalui media Online
Jenis ini mungkin hanya mengandalkan Digital saja, jadi lebih portable atau praktis untuk disampaikan, baik itu melalui situs situs penyedia lowongan, atau media lain bahkan media sosial. 

Berikut Contoh yang mungkin hanya berbasis Digital saja dalam hal penyampaiannya


  




Mungkin yang perlu menjadi "Quote" bagi Sobat diantaranya ;
Fokuslah pada kualitas :
Dalam arti kualitas yaitu, bagaimana menyampaikan kepada si penerima atau sekedar pembaca dengan cara yang lebih mudah namun memiliki konten (Padat dan Jelas). Baik itu dari segi tata letaknya, jenis Desain, Hal hal unik namun kreatif.
Kamu harus mampu membuat penjelasan sesingkat singkat mungkin tentang sebuah deskripsi tersebut, dan tidak memakan banyak kalimat yang bertele tele.

Belajar dari yang berpengalaman
Belajar dari para ahli yang sudah berpengalaman dalam hal ini tidak ada salahnya, dimana untuk mendapat ilmu yang lebih profesional
.

Nah, sampai disini sudakah sobat paham apa itu portofolio?
Dan sudahkah terbayangkah dalam benak Sobat sobat sekalian untuk belajar membuat Portofolio sebaik mungkin?  :)

Berikut saran sebagai penambah refrensi untuk membuat portofolion online
www.behance.net
carbonmade.com
portfoliobox.net
crevado.com

Semoga artikel ini bermanfaat dan dapat menambah refrensi tentunya.
Salam BLogger.


Friday, April 3, 2015

Dasar HTML Membuat Tabel

Kesempatan kali ini blog membahas yaitu cara membuat tabel di HTML, kegunaanya tentu sangat penting seperti contoh ingin membuat Form, tampilan sebuah database, atau untuk data data perbandingan, dll. Biasanya untuk penggunaan dalam membuat tabel akan lebih dipermudah jika menggunakan Aplikasi Dreamweaver (Adobe/ Macromedia) yaitu langsung dari tahap desainnya.

Namun perlu diketahui bahwa untuk awal, kamu juga harus perlu mengetahui dasar membuat tabel sederhana dengan menggunakan tool biasa (NOTEPAD).
Hal ini ditujukan agar dapat paham konteks, bentuk Tag yang dipakai dalam membuat tabel.

NB. Maka dalam pembahasan kali ini pun kita tetap menggunakan Notepad.
Tentu dalam tabel dalam tabel ada "baris" dan "kolom".

Berikut Tag membuat Tabel adalah <table> </table>
Penulisan Tag tabel berada di antara <body> seperti ini
<body>
                 <table>

                 </table>
 </body>
Namun Bentuk diatas belumlah cukup, yang mana tag <table> masih hanya membuat garis kosong.

Sedangkan Tag membuat Baris adalah <tr> </tr>
Penulisan Tag Baris berada diantara tag <table>

<table>
                    <tr>
                    </tr>
</table>
 Dan Tag membuat Kolom adalah <td> </td>
Penulisan Tag Kolom berada di dalam antara tag baris <tr>
Contoh Kolom 1.
<table>
                    <tr>                                        
                         <td>ISI KOLOM</td>
                    </tr>
</table>
Sehingga secara otomatis jika kita ingin membuat tabel berisi 2 kolom akan seperti ini

            Contoh Kolom 2
<table>
                    <tr>                                        
                         <td>ISI KOLOM</td>
                                <td>ISI KOLOM</td>

                    </tr>
</table>
Kode diatas adalah sebuah tabel yang berisi dua kolom seperti gambar dibawah ini

Jika ingin menambahkan baris kebawah berarti kita harus duplikasi tag <tr> tersebut seperti ini ;
 
<table>
                    <tr>                                        
                       <td>ISI KOLOM</td>
                                <td>ISI KOLOM</td>

                    </tr>
                         <tr>                                        
                                <td>ISI KOLOM</td>
                                <td>ISI KOLOM</td>

                    </tr>

</table>

Sehingga menghasilkan seperti ini ;

Demikian selanjutnya jika ingin menambah baris dan kolom misalknya 8 Baris 2 kolom,
lakukan duplikat tag <tr> baris sebanyak 8 kali, 
dan setiap 1 tag <tr> berisi 2 duplikat tag kolom <td>
Bagaimana sobat kira kira paham kan.. (hehe)


Attribut Attribut Dalam Tag Tabel Dalam tabel penggunaan Attribut berfungsi disaat seperti colntoh kita ingin memperlebar ukuran Kolom, mengganti latar tabel. Berikut attribut nya ;

Untuk mengatur lebar kolom colspan = " "
Untuk mengatur jarang antar cell cellspacing =""
Mengatur jarak pinggiran Bingkai dengan isi cellpadding =""
Mengatur latar Tabel Background =""


Sehingga Penulisan dalam Html demikian ;
 <html>
<head>
   <title>Untitled Document</title>
</head>

        <body>
           <table width="200" border="1">
                <tr>
                      <td colspan="50">ISI</td>
                       <td>ISI</td>
                </tr>
                <tr>
                      <td cellspacing="30">ISI</td>
                       <td>ISI</td>
                </tr>
           </table>
        </body>
</html>
Penjelasannya demikian :
1. Attribut yang ada pada kode tag <table> yaitu
     width="200"  berfungsi untuk menambah lebar bingkai tabel
     border="1"  berfungsi untuk menambah ketebalan Garis Bingkai agar lebih terlihat jelas

2. Attribut yang ada pada kode tag <td> (kolom) yaitu
   colspand="50" berfungsi untuk mengatur lebar pada kolom
   cellspacing="30" berfungsi mengatur jarak antar cell

demikian selanjutnya sehingga menghasilkan tabel seperti dibawah

 


Sekian mengenai cara Membuat Tabel dengan Tools sederhana, untuk postingan pembahasan selanjutnya akan segera ditambahkan di kotak komentar, atau klik Halaman Kategori DESAIN WEB diatas. Semoga Bermanfaat, dan dapat menambah refrensi kamu sobat, Terima kasih telah berkunjung.

Salam BLogger.


Klik Like atau bagikan ke teman yang ingin belajar HTML. Silahkan tinggalkan komentar jika ada yang sulit dipahami.

Dasar HTML 2 | Membuat Judul Attribut dan Paragraf

Kesempatan kali ini Blog ingin melanjutkan postingan terdahulu/sebelumnya yaitu "Belajar Dasar Membuat HTML" . Dalam Postingan terakhir kita sudah sampai pada pembahasan /membuat HTML dasar biasa , dimana hanya menampilkan text dengan Format biasa, namun seperti halnya di aplikasi Tulis menulis seperti MS.WORD, dalam HTML juga berlaku hal yang namanya permak -permak, atau mempercantik tampilan, baik dari segi Font, Latar, dll,
Hal itu bisa kita lakukan melalui Penerapan/ variasi pada Kode <Tag> atau Attribut pada Tag .

Sebelumnya pembahasan kita sudah sampai pada pembuatan html sederhana dibawah ini, yang mana dibuat dalam notepad dan disimpan dalam format .html

<html>
              <head>
                      <title> Belajar HTML </title>
              </head>
                                  <body bgcolor="Yellow">
                                    BELAJAR HTML Bersama
                                   </body>
 </html>

Berikut Keterangannya :
Merah  : Adalah tag (yang mana memiliki Pembuka dan Penutup) NB; perhatikan Tag yang saling berpasangan

Biru   : Adalah Attribut ( berguna untuk menambah fungsi suatu Elemen/Merubah Latar)

Orange : ELEMEN (Isi dari TAG/ yang diapit oleh Tag)

Dalam Tag ada Attribut yang dapat menambah Fungsi Elemen yang ada didalamnya
yaitu dengan menambah beberapa Atribut seperti dibawah ini;
Contohnya Merubah FONT                    : <font face="arial">

                   Mewarnai FONT                 : <style="color:#0F6"> (untuk warna diawali # )
                   Membuat Text Rata Tengah : <align="center">
                   Membuat Text Rata Kiri      : <align="left">
                   Mengganti Warna FONT     : <color="RED">
                   Membuat Latar Halaman     : <bgcolor="Yellow">

Sehingga Jika mencoba menerapkan beberapa attribu HTML menjadi seperti dibawah ini :

<html>
              <head>
                      <title> Belajar HTML </title>
              </head>
                                  <body
bgcolor="Yellow">
                                    <a
style="color:#F00">BELAJAR HTML Bersama</a>
                                   </body>
 </html>
Kode Attribut yang biru (bgcolor="Yellow")berfungsi untuk membuat membuat latar menjadi warna KUNING.

Kode attribut biru (style="color:#F00") berfungsi untuk membuat Teks "Belajar HTML Bersama menjadi berwarna Merah"

(Klik Perbesar)
 

                  



 "PEMBUATAN JUDUL"
Dalam Pembuatan Judul ada hingga 6 (Heading & SubHeading) Yaitu ;


<h1>Judul Halaman</h1>

<h2>Judul Halaman</h2>

<h3>Judul Halaman</h3>

<h4>Judul Halaman</h4>

<h5>Judul Halaman</h5>

<h6>Judul Halaman</h6>

Sehingga diterapkan dalam sebuah HTML menjadi seperti ini ;

<html>
              <head>
                      <title> Belajar HTML </title>
              </head>
                                  <body
bgcolor="Yellow">
                                    BELAJAR HTML Bersama
                        <h1>Judul Halaman</h1>

                        <h2>Judul Halaman</h2>

                        <h3>Judul Halaman</h3>

                        <h4>Judul Halaman</h4>

                        <h5>Judul Halaman</h5>

                         <h6>Judul Halaman</h6>
                                    </body>
          </html>
  tampilannya setelah disimpan kira kira seperti ini (Klik untuk memperbesar)


Sehingga bisa kita rangkum bahwa H1 adalah ukuran paling besar, hingga H6 maka jenis judul akan semakin mengecil

Namun dalam Tag Judul <h1> tersebut kita juga bisa menambahkan attribut attribut diatas sebelumnya menjadi seperti dibawah ini ;

<html>
              <head>
                      <title> Belajar HTML </title>
              </head>
                                  <body
bgcolor="RED">
                                    BELAJAR HTML Bersama
                        <h1 align="Center">Judul Halaman</h1>

                        <h2 align="right">Judul Halaman</h2>

                        </body>
          </html>

Tampilannya seperti ini (Klik untuk perbesar)


Disimpulkan bahwa attribut untuk judul H1 berlaku untuk membuat rata tengah, dan attribut pada H2 untuk rata kanan.



Selain membuat judul dalam html berlaku/diperlukan juga peran untuk membuat sebuah paragraf

PARAGRAF (Kode Tag : <p> </p> )

misalkan setelah membuat judul dibawah kamu ingin memasukkan sebuah paragraf,
maka kode tag <p> </p>

Sehingga dalam html diapit seperti ini

<h1> Judul Paragraf </h1>
<p> contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf,</p>

Namun jika kamu ingin memberi warna pada paragraf  , mungkin sudah paham kan....??
maka menjadi demikian

<h1> Judul Paragraf </h1>
<p style="color:#F00"> contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf, contoh isi paragraf,</p>

Attribut pada tag paragraf tersebut berfungsi untuk mewarnai Paragraf tersebut.

Nah, Sekian untuk ulasan tambahan mengenai " Attribut hingga Membuat Judul Heading & Sub Heading dan Paragraf "

Dalam Postingan Berikutnya Blog akan menjelaskan "Cara Membuat Tabel Dalam HTML". Dan linknya akan Update pada Kotak Komentar.
so... Ditunggu ya...

Jika berkenan silahkan klik tombol like Facebook dibawah ini / share atau bagikan ke teman teman yang juga ingin belajar HTML Bersama, Berbagi itu Banyak Pahalanya Loh..

Trima kasih telah berkunjung, Salam BLogger.


Thursday, April 2, 2015

Belajar Dasar Membuat HTML

Jika sebelumnya kamu telah membaca Postingan "Belajar Desain Web (Perkenalan HTML)", maka kali ini kita akan mencoba membahas dan praktek yaitu Dasar Membuat HTML.

Untuk Membuat HTML tahap dasar ini kita hanya memerlukan aplikasi bawaan sederahana yaitu "Notepad".
Namun sebelum mencoba alangkah lebih baik untuk menyimak Hal hal penting dibawah ini;


Dalam HTML ada 3 Bagian yang perlu kamu ingat yaitu ;
1. TAG
2. ATTRIBUT
3. ELEMEN

1. Tag
Yaitu Coding berupa bagian elemen dari HTML. Singkatnya HTML berisi sekumpulan tag- tag.

Tag dalam HTML dituliskan dengan Awalan dan Akhirnya (ingat!!)


Contoh :
Awalan / pembukanya    <html>
Akhiran/ Penutup           </html>  "Penutup memakai Slash"

Ada 3 Bentuk Tag Utama  (Sebagai Dasar yang perlu diingat!!)

(klik untuk Perbesar)


Nah.. Jadi yang perlu digaris bawahi ;
Pertama : <html> </html> (adalah Badan HTML) berada di awal dan akhiran
Kedua    : <head> </head> (adalah Untuk Judul) berada kedua dalam Badan
Ketiga    : <body> </body> (adalah untuk Isi) ditengah


NB : Namun tak semua Tag harus memakai akhiran/penutup, akan ada contoh penulisan yang hanya awalan saja, akan dijelaskan.


Salah satuTag tag yang tidak memiliki akhiran/ penutup
1. <br/> (berfungsi untuk menurunkan Tulisan kebawah/ENTER)




2. Attribut
Nah, Attribut adalah Sebuah kode yang berguna untuk menambah fungsi dari Tag itu tadi. Hanya saja codingnya ditambahkan didalam Tag.
Contoh : color="yellow"
Jadi misalkan kita ingin membuat latar halaman berwarna kuning, maka dalam kode Tag <body> ditulis seperti ini;
<body bgcolor = "yellow">

</body>
attribut ini (bgcolor="yellow">) yaitu berfungsi untuk mengubah latar halaman menjadi warna kuning.



Attibut juga berlaku untuk mengganti jenis tulisan pada "Judul "(head) atau " isi" (Body).
untuk mengganti jenis font attributnya seperti berikut

<font face=”arial”> <font face=”arial”>
dll.



3. Elemen
Merupakan isi kode tag yang berada diantara tag pembuka dan tag penutup. Element terdiri atas tiga bagian, yaitu tag pembuka, isi, dan tag penutup. Sebagai contoh untuk menampilkan judul dokumen HTML pada web browser digunakan element title.
terkadang banyak yang berpikir bentuk ini  sama dengan attribut namun jangan salah paham dulu ya,

elemen bisa kita lihat seperti contoh dibawah


<html>
          <head>
                  <title> Belajar HTML </title>
          </head>

                              <body>
                                BELAJAR HTML Bersama
                               </body>

</html>

Elemen adalah Tulisan berwarna Hitam (berarti berada dalam tag pembuka dan penutup)
Nah, Sekarang kita sudah Paham, Langsung saja silahkan untuk membuka NOTEPAD kamu dan ketikan kode diatas :

Simpan File Namun sebelum menyimpan HARAP PERHATIKAN, Atur type filenya dengan merubah menjadi All Files dan ganti namanya menjadi format .html (jangan lupa titiknya)
lihat contoh dibawah ini.


setelah itu buka lah file yang sudah disimpan tersebut, maka jika format yang disimpan benar, secara otomatis file tersebut akan berekstensi dan akan dibuka oleh browser (ex; firefox).


Cukup Mudah Mudah bukan,  sekian postingan kali ini, selanjutnya blog akan menambahkan tutorial lanjutan antara lain: Cara Membuat JUDUL (HEADING & SUB HEADING)

Silahkan Tunggu Updatenya di kotak KOMENTAR (secepatnya)

Terima kasih telah berkunjung, Salam Blogger.


 

© 2013-2019 Flamingo Solution. All rights resevered. Designed by Templateism

Back To Top