Tampilkan postingan dengan label PHP. Tampilkan semua postingan
Tampilkan postingan dengan label PHP. Tampilkan semua postingan

Display Dalam CSS

Atribut Display

Dalam CSS, anda dapat pula memanipulaskan elemen-elemen dalam html agar tampilannya menjadi sesuai dengan yang anda inginkan, Saat ini kebanyakan halaman web dapat di buat hanya dengan menggunakan sedikit tag yang di susun rapi ke dalam style css yang akan mengatur tampilan dokumen web hingga sesuai dengan keinginan anda.

Kebanyakan dokumen html yang di tampilkan dalam browser saat ini terdiri dari berbagai style font, margin, padding, dan pada dasarnya adalah tipe display. Adapun penulisan display dalam css dapat di masukan ke dalam sebuah selector seperti contoh script berikut ini:
selector {display : tipe display;}
kebanyakan tipe pokok dari display adalah berupa tipe inline, block-line, dan none yang dapat di manipulasi dengan property display dan nilai inline, block serta none tersebut. Adapun maksud dari tipe display adalah:

Tipe-tipe Display

Inline : Seperti artinya di mana elemen-elemen yang di tampilkan secara inline akan mengikuti alur dari sebuah garis/line. Elemen-elemen seperti strong, anchor, dan emphasis adalah elemen yang biasa nya di tampilkan secara inline
Block : Akan menempatkan sebuah line break sebelum dan sesudah elemen yang di berikan property ini. Header dan paragraf adalah contoh dari elemen yang biasanya di tampilkan secara blok-line dalam display.
None : Maksud dari property ini adalah tidak akan menampilkan elemen yang memiliki property ini, walaupun terlihat tidak berguna, tetapi property ini dapat di gunakan dan akan terlihat bagus jika di gabungkan dengan elemen-elemen accessibility seperti accessbility link, alternate stylesheet, atau efek hover tingkat lanjut.
Berikut sebuah contoh penerapan property display dalam membuat layout sebuah dokumen web:
  • <html>
  • <head>
  • <title>Belajar Display</title>
  • </style>
  • #bg{
  • display: inline;
  • z-index: 1;
  • background: #ffccff;
  • left: 10px;
  • width : 100%;
  • border-bottom: #fc9b52 20px solid;
  • position: absolute;
  • top: 10px;
  • height: 150;
  • }
  • </style>
  • </head>
  • <body>
  • div id=bg> </div>
  • </body>
  • <html>
Pada contoh kode di atas di gunakan sebuah property display yang di terapkan secara inline, kemudian posisi z-index 1, warna background #ffccff warna border bawah dengan nilai 20 piksel, posisi absolute, besar margin atas 10 piksel dan tinggi sebesar 150 piksel. Jika di dalam browser akan terlihat seperti pada gambar di bawah ini :




Tampilan Dalam Tabel

Dalam CSS kita dapat pula menampilkan data dalam bentuk tabel seperti yang di buat dengan html menggunakan property display css, seperti :
selector {display : table;}
Pada nilai inline-table tersebut akan mengatur data dalam sebuah tabel tanpa adanya line break sebelum dan sesudahnya.

Mungkin cara terbaik untuk memahami tabel yang berhubungan dengan nilai dari prperty display ini adalah dengan menggunakannya seperti tabel dalam Html. Tabel dalam CSS adalah display insial dan anda dapat menirukan elemen ter dan td dengan nilai dari baris tabel menggunakan table-roe dan cell table menggunakan table-cell secara terpisah. Penulissannya dalam CSS adalah:
selector {display : nilai table;} 
Property display semakin baik dengan menawarkan nilai yang lebih lengkap untuk tabel berupa table-column, table-row-group, table-column-group, dan table-caption  guna pengaturan data dalam sebuah tabel menggunakan css, di mana seluruh nilai tersebut cukup deskriptif untuk mewakili tampilan dari tabel dalam css.

Keunggulan dari nilai ini adalah bahwa anda dapat membuat tabel dengan kolom di bandingkan tabel yang di gunakan dalam html yang lebih condong pada metode menggunakan baris.
Catatan : Menggunakan sebuah tabel css dalam dokumen web yang anda buat dapat merusak tampilan dokumen web yang anda buat menggunkan html. Html biasanya di gunakan untuk menyampaikan pesan. Jadi, jika anda memiliki data-data yang tersusun dalam tabel, ada baiknya jika data tersebut di susun dalam tabel html.

Tipe-tipe display lainnya:

1.List-item : Untuk tampilan data daftar yang biasanya di gunakan seperti pada tag li dalam elemen html. Agar tipe ini bekerja dengan baik, elemen yang akan menggunakan tipe ini sebaiknya menggunakan elemen ul atau ol sehingga akan menampilkan berupa daftar
2.Run-in : Akan membuat sebuah elemen baik berupa in-line maupun block-line tergantung tipe ini adalah tidak dapata bekerja dalam browser Internet Explorer atau Mozilla
3.Compact : Sama dengan run-in, yaitu membuat elemen terlihat dalam bentuk inline atau block-line tergantung pada isinya. Namun tipe ini tidak dapat bekerja dengan baik pula dalam kedua browser di atas
4.Marker : Di gunakan bersama dengan pseudo element : before dan after untuk menentukan tampilan dari nilai property isi yang telah di tandai dengan tag ini. Jadi tipe ini hanya dapat berjalan dengan baik jika anda mengesampingkan nilai pseudo elemen property display sebelumnya.

Nah itulah pembahasan dari saya mengenai Display Dalam CSS, semoga artikel ini dapat membantu, ok saya pamit dulu sampai bertemu di artikel selanjutnya. Salam Sukai Penulis

Pengelompokan Dan Nesting Dalam CSS Dalam HTML

Pembahasan kali ini adalah pengelompokan dan nesting dalam CSS, berikut penjelasannya dan pembahasannya, semoga anda dapat memahami apa yang kami sampaikan di bawah ini, baiklah simak penjelasannya. 

Pengelompokan Dan Nesting dalam CSS

Dalam dookumen web yang di buat menggunakan syle kita dapat memformat berbagai aturan yang di buatnya menjadi makin ramping sesuai dengan keinginan kita. Adapun format untuk style CSS tersebut berupa :

1. Pengelompokan atau Grouping

Dalam Css kita mengenal adanya pengelompokan atau grouping, pengelompokan di sini berfungsi untuk mengelompokan berbagai selector ID atau Class yang memiliki nilai property yang sama. Anda dapat memberikan propety yang sama tersebut ke dalam sejumlah selector tanpa harus mengulang penulisannya dengan membagi selector-selector tersebut dengan koma (,).

Pengelompokan dalam CSS berfungsi untuk menyingkat berbagai penulisan dari aturan-aturan yang menyingkat berbagai penulisan dari aturan-aturan yang banyak hingga membentuk aturan baru yang jauh lebih singkat. Berikut ini adalah contoh mengelompokan tag yang memiliki nilai yang sama :
  • <style type="text/css">
  • p {background-color:yelow;}
  • b {background-color:yelow;}
  • i {background-color:yelow;}
  • </style>
Dengan demikian, dalam pengelompokan menggunakan CSS penulisannya dapat di ringkas menjadi :
  • <html>
  • <head>
  • <title>Pengelompokan tag</title>
  • <style type="text/css">
  • p, b, i {background-color: yelow;}
  • </style>
  • </head>
  • <body>
  • <p> pengelompokan dengan tag p</p>
  • <b> pengelompokan dengan tag b</b>
  • <i> pengelompokan dengan tag i</i>
  • </body></html>
Maksud aturan di atas adalah CSS akan memberikan nilai p yang di dalam dokumen HTML seharusnya adalah format untuk membuat paragraf, namun juga memiliki nilai warna background-biru yang sama dengan tag b (bold atau tebal) dan i (italic atau miring) seperti terlihat browser Netscape berikut :



Bila kita menerapkan pengelompokan tersebut dalam selector class, ID dan tag scriptnya akan seperti berikut ini :
  • <style type="text/css">
  • p {font-family: Arial, Verdana;}
  • .teks1 {font-family: Arial, Verdana;}
  • #teks2 {font-family: Arial, Verdana;}
  • </style>
Dengan demikian, dalam pengelompokan dengan CSS, penulisannya akan menjadi seperti script di bawah ini :
  • <html>
  • <head>
  • <title>pengelompokan tag </title>
  • <style>
  • .teks, .title, #teks2 {font-family:verdana; background-color:yellow;}
  • </style>
  • </head>
  • <body>
  • <span class="teks">pengelompokan dengan tag p </span><br>
  • <span class="title">pengelompokan dengan class teks1</span><hr>
  • <div id="teks2">pengelompokan dengan class teks2</div>
  • </body>
  • </html>
 Penampakannya akan terlihat seperti di bawah ini :



2. Nesting

CSS memiliki struktur bahasa yang baik sehingga dapat di manfaatkan untuk menyingkat style CSS agar lebih efisien dalam dokumen web yang di buat menggunakan CSS. Anda tidak membutuhkan class atau ID selector yang terlalu banyak untuk membuat sebuah dokumen web dengan bantuan CSS karena anda dapat menentukan property dari selector untuk di tempatkan dalam selector lain.
Contoh :
#atas {background-color: #ccc; padding: 2em}
#atas h1 {color: #ff0;}
#atas p {color: red; font-weight: bold;}
Dengan menghilangkan kebutuhan akan class atau ID yang cukup banyak tersebut, anda dapat menyingkatnya dengan menggunakan cara nesting sehingga dalam penulisaanya akan menjadi lebih singkat seperti berikut :
  • <div id="atas">
  • <h1> menyingkat CSS dengan nestingM</h1>
  • <p> penyingkatan ini menggunakan cara nesting </p>
  • <p> mudah sekali ya .. </p>
  • </div>
Dengan cara ini, memisahkan selector dengan spasi dapat berarti bahwa h1 berada dalam ID atas, yang memiliki nilai warna latar #ccc dan warna isi #ff0 dalam h1, serta penambahan tag p dalam ID atas yang berarti merah dan tebal.

Cara ini dapat di terapkan lebih dari dua tingkatan seperti di dalam dan di dalamnya ID atau class tertentu yang anda inginkan hingga di akhiri dengan penutup </div> seperti contoh di atas.Adapun script keseluruhan jika anda menggunakan nesting dalam HTML bisa anda lihat di bawah ini :
  • <html>
  •  <title>Nesting</title>
  • <head>
  • <style>
  • #atas {background-color: #ccc; padding:2em}
  • #atas h1 {color: #ff0;}
  • #atas p {color: red: font-weight: bold;}
  • </style>
  • </head>
  • <body>
  • <div id="atas">
  • <h1> menyingkat CSS dengan nesting </h1>
  • <p> penyingkatan ini menggunakan cara nesting</p>
  • <p> mudah sekali ya..</p>
  • <div>
  • </body?
  • </html>
Contoh Script yang di atas bila di eksekusi akan seperti di bawah ini :


Nah itu lah pembahasan mengenai pengelopokan dan nesting dalam css, semoga artikel ini dapat membantu anda dan bermafaat khusunya bagi yang membaca dan juga untuk penulis, sampai di sini pembahasannya, Salam Sukai Penuli

Inheritance, Pseudo Classes, Pseudo Element dan Selektor Kontekstual

Jika di artikel sebelumnya membahas Selector. Class Selector, dan ID selector, nah kali ini saya akan memenuhi janji yang membahas tentang Inheritance, Pseudo Classes, Pseudo Element, dan Selektor Kontekstual, Untuk penjelasan yang lebih lengkap anda bisa membaca artikel ini sampai akhir.



Pewarisan atau Inheratance

Yang di maksud dengan pewaris atau inheratance di sini adalah satu kondisidi mana bagian-baian HTML dalam dokumen kita yang kekurangan dalam spesifikasi aturan CSS dapat mengikuti atau di buat menurut aturan CSS yang menutupinya.

Setiap aturan yang tidak ada dalam format yang di buat dengan HTML atau ingin menggantikannya dengan aturan CSS, tetap akan memengaruhi huruf yang ada di dalam kurungan CSS. Di bawah ini adalah contoh kode script inheritance:
  • <html>
  • <head>
  • <title> Inheritance </title>
  • <style type="text/css">
  • B {background-color : green; color : white;}
  • </style>
  • </head>
  • <body>
  • <B>
  • Belajar membuat web dengan<font size="1"><em>CSS</em></font> Sangatlah mudah.
  • <br>
  • Hanya dengan program notepad pun jadi
  • </B>
  • </body>
  • </html>
Jika di lihat dari contoh di atas dapat di lihat bahwa tag <B> dalam aturan CSS akan mendefinisikan warna font dan warna latar dari font sedangkan tag <B> dalam HTML bisa di artikan sebagai bold atau format untuk menebalkan huruf.

Sementara tag <font> yang berada dalam lingkup CSS dapat menerapkan aturan HTML dasar akan tetapi teteap terpengaruh dengan kondisi warna dan tebalnya huruf dari aturan CSS yang melingkupinya. Cara ini dapat anda gunakan untuk di kombinasikan lebih lanjut dengan tag-tag lain agar sesuai dengan keperluan dokumen anda.

Berikut adalah penampakan dari kode script di atas :



Pseudo Classes

Pseudo Classes dalam CSS di buta tebal dalam selector-selector untuk menentukan sebuah statemen atau relasi selector penulisannya pun hanya di pisahkan dengan sebuah tanda titik dua, yaitu di antara selector dan pseudo dan class.

Adapun contoh format penulisaanya adan bisa lihat di bawah ini
selector:pseudo class {property :value; }
Banyak format css yang tidak di dukung oleh kebanyakan browser, tetapi terdapat 4 (empat) pseudo classes yang dapat di gunakan secara aman ketika di aplikasikan ke dalam hyperlink atau link, inilah di antaranya ke 4 (empat) pseudo classes itu :

  • Link
: Untuk tampilan sebuah link yang belum di kunjungi
  • Visited
: Untuk tampilan sebuah link ke halaman yang telah di kunjungi
  • Acrive
: Untuk tampilan sebuah link yang sedang aktif (ketika di klik)
  • hover
: Untuk tampilan sebuah link yang hover (ketika cursor melintas di atasnya
Contoh penggunaan :
a.snowman:link {color:blue;}
a.budi.visited {color:puple;}
a.budi.active {color:puple;}
a.budi.hover {text-decoration:none; color : blue; background-color:yellow;}
Anda dapat menggunakan hover pseudo class dengan elemen-elemen lain selain link. Sayangnya, Internet Explorer masih tidak mendukung metode ini karena banyak tampilan yang dapat anda buat dan terlihat bagus dalam browser lain, tetapi tidak terlihat dengan menggunakan browser ini.

Pseudo Element

Pseudo Element dalam CSS di tempatkan dalam sebuah selector sama seperti pada pseudo classes. Penulisannya akan seperti contoh berikut di bawah ini :
selector:pseudoelement {property:nilai;}
Contoh seting huruf dan baris pertama:
Pseudo element pada huruf pertama di aplikasikan elemen dari huruf pertama dan baris pertama pada atas baris sebuah elemen. Anda dapata membuat huruf besar dan huruf tebal baris pertama pada paragraf dengan menggunakan perintah berikut di bawah ini :
p:first-letter {font-size:5px; float:left;}
p:first-line {font-weight:bold;} 

Before And After dalam Pseudo Element
Pseudo Element before dan after di gunakan dengan property content untuk menempatkan isi dari sebuah elemen tanpa menyentuh kode HTML. Nilai dari property content ini dapat berupa open-quote, close-quote, no-open-quote, no-close-quote, berbagai string yang di sertakan dalam tanda kutip, atau berbagai image gambar menggunakan url (Nama Image) seperti contoh di bawah ini :
blockquote:before {content: open-quote;}
blockquote:after {content: close-quote;}
li:before {content: "POW: "}
p:before {content: url(images/jam.jpg)}

Selecktor Kontekstual (Contextual Selector)

Selektor kontekstual dalam CSS hampir sama dengan pernyataan-pernyataan kondisional di mana deklarasi dalam style-sheet CSS yang ada akan berpengaruh jika menemui kondisi atau keadaan tertntu. Contoh dari slector kontekstual adalah sebagai berikut :
  • <html>
  • <head>
  • <title> Selecktor Kontekstual </title>
  • <style type="text/css">
  • b em {font-family: verdana; background: blue; color : white;}
  • </style>
  • </head>
  • <body>
  • <b>
  • Belajar membuat web dengan <em>CSS</em> Sangatlah mudah.
  • <br></b>
  • <em>Hanya dengan program notepad pun jadi
  • </em>
  • </body>
  • </html>
Dalam contoh di atas dapat di lihat bahwa dokumen web tersebut akan menerapkan style CSS tersebut pada dokumen yang berada dalam tag <em> (font verdana, warna lata biru dan font berwarna putih) di mana tag <em> tersebut berada di dalam tag <b> dan </b> (bold atau tebal).

Sementara tag <em> yang berada di style tersebut atau hanya memiliki nilai <em> biasa atau huruf miring. Jika di lihat dalam browser maka penampakannya adalah seperti gambar di bawah ini berikut: 



Nah itu lah penjelasan mengenai Inheritance, kemudian Pseudo Classes, kemudian Pseudo elent, dan terakhir adalah Selektpr Kontekstual, semoga penjelasan di atas bisa mudah di pahami, okeh sampai di sini dulu perjumpaan kita. Sampai jumpa salam Sukai Penulis

Selector di dalam CSS (Class, dan ID Selector) Lengkap!!!

Untuk memahami apa itu selector sebaiknya anda memahami terlebih dahulu apa itu Struktur CSS, agar anda tidak bingung untuk membaca artikel yang satu ini, saya sudah siapkan linknya anda tinggal klik saja di bawah ini maka anda akan di alihkan ke halaman sebelumnya.

Baca juga : Keuuntungan Menggunakan CSS Dan Struktur CSS

Sekarang di artikel ini ingin menjelaskan seperti apa itu selector di dalam CSS, mungkin untuk pemula tidak tahu apa itu selector, dan apa tujuannya, baiklah mari kita lihat di bawah ini semoga dapat memuaskan anda untuk yang membacanya.


Selector Dalam CSS

Jika dalam HTML kita mengenal adanya tag-tag yang menyusun sebuah dokumen HTML, maka dalam CSS kita juga mengenal dengan sebutan selector.

Selector adalah nama-nama yang di berikan untuk style-style yang berbeda baik itu style internal maupun eksternal. Dalam style tujuan, anda harus menentukan bagaimana selector seharusnya bekerja yang dinamakan properties di dalam tanda { } atau curly bracket yang dapat memiliki nilai berupa font, warna dan lain-lain.

Selanjutnya dalam body di halaman web anda, arahkan ke selector-selector ini untuk mengaktifkan style tersebut.

Karena CSS memiliki atruan tersendiri dalam penulisan sintaksnya, penulisan sintaks tersebut terbagi ke dalam tiga bagian, yaitu selector, property, dan value. Untuk lebih jelasnya lihat kode script di bawah ini :
  • selector {property: value;}
Selector dalam CSS adalah elemen adalah elemen yang akan di definisikan dalam style CSS, sedangkan elemen ini berupa tag HTML ataupun class. Sementara property dalam CSS adalah atribut yang berfungsi untuk mendifinisikan selector, sedangkan value adalah nilai atau harga dari sebuah property.

Contoh:
  • <html>
  • <head>
  • <style type="text/css">
  • B.besar {color:read; font-size:15px; font-family:arial;}
  • </style>
  • </head>
  • <body>
  • <b> ini adalah huruf besar dengan HTML</b><br>
  • <b class="besar"> ini adalah huruf besar dengan CSS</b>
  • </body>
  • </html>

Dalam kasus ini, B.besar adalah selector, Contoh di atas akan menghasilkan tampilan seperti:



Class Selector

Class selector di gunakan untuk menentukan style yang dapat di gunakan tanpa menentukan lagi tag HTML sederhana. Penulisan class adalah dengan menggunakan tanda titik atau sering di sebut dot (.). Selain aturan penulisan di atas, CSS mengenal Class selector di mana dalam elemen yang sama, anda dapat menerapkan lebih dari satu style.

Contoh:
  • <html>
  • <head>
  • <title> Class Selector </title>
  • <style type="text/css">
  • <!--
  • f.times {font-family:times;}
  • f.verdana {font-family:verdana;} 
  • .courier {font-family: "courier";}
  • -->
  • </style>
  • </head>
  • <body>
  • <f class="times"> Ini adalah contoh pengunaan class sebagai selector, setiap huruf memiliki huruf times new roman </f><br>
  • <f class="verdana"> Ini adalah contoh pengunaan class sebagai selector, setiap huruf memiliki huruf verdana </f><br>
  • <f class="courier"> Ini adalah contoh pengunaan class sebagai selector, setiap huruf memiliki huruf courier </f><br> 
  • </body>
  • </html> 

Tampilan kode sript di atas akan seperti gambar di bawah ini : 



Pada contoh di atas, tag f memiliki 2 class berbeda untuk memformat paragraf, yaitu. times dan .verdana di karenakan tag clas .times dan .verdana adalah class yang memiliki oleh tag f maka ia hanya dapat di kenakan pada elemen f saja.

Lain halnya dengan class .courier, ia dapat di pergunakan oleh semua elemen tanpa harus menggunakan tag f di awal dan akhir elemen yang akan di format.

Nama untuk setiap class dapat berbeda-beda. Anda di bebaskan menentukan nama class sendiri, tetapi ada baiknya memilih nama dari tiap class yang mengacu kepada fungsi dari clas tersebut. Hal ini bertujuan agar anda tidak bingung menggunakan class pada saat menggabungkannya ke dalam tag HTML.

Contoh :
  • <p class="blog"> ini teks untuk paragraf pada blog </p>
  • <p class="menukiri"> ini teks untuk paragraf pada menu kiri </p>

ID Selector

ID selector di gunakan untuk menentukan style yang berhubungan dengan objek-objek dengan sebuah ID yang unik. Berbeda dengan class selector yang dapat kita pergunakan pada berbagai tag, ID selector ini memiliki sifat-sifat yang berbeda.

ID selector hanya dapat di pergunakan pada satu elemen saja pada setiap halaman yang kita buat. ID selector mneggunakan tag kres (#) sebelum menggunakan nama selector. Di bawah ini adalah contoh ID Selector :
  • #helvitica {font-family: Helvetica;}
Dalam penerapan pada tag html, anda dapat menggunakan atribut atau span atau pun div, seperti conotoh di bawah ini:
  • <span id="helvetica"> Ini adalah huruf helvetica</span>
  • atau
  • <div id="helvetica"> Ini adalah huruf helvetica </div>
 Contoh penulisan dokumen dapat di tuliskan pada contoh kode script di bawah ini: 
  • <html>
  • <head>
  • <title> ID Selector </title>
  • <style type="text/css">
  • <!--
  • #times {font-family: times;}
  • #verdana {font-family: verdana;}
  • #courier {font-family: "courier";}
  • -->
  • </style>
  • </head>
  • </html>
  • <body>
  • <div id="times"> Ini adalah contoh penggunaan id sebagai selector, setiap huruf memiliki huruf times new rowman </div><br>
  • <div id="verdana"> Ini adalah contoh penggunaan id sebagai selector, setiap huruf memiliki huruf verdana </div><br>
  • <div id="courier"> Ini adalah contoh penggunaan id sebagai selector, setiap huruf memiliki huruf courier </div><br>
  • </body>
  • </html>

Tampilan kode sript di atas akan seperti gambar di bawah ini:


Selain yang di jelaskan di atas, dalam css kita juga akan mengenal atau berhadapan dengan adanya pewarisan (Inheritance), Pseudo Classes, Pseudo-element, dan Selectors-Kontekstual (Contextual Selector), Tapi nanti di artikel selanjutnya. hihi :p

Baca juga : Inheritance,Pseudo Classes, Pseudo-element, dan Selector-Kontekstual
Saya rasa cukup untuk penjelasan mengenai selector di dalam css (class, dan id), terimakasih telah membaca artikel ini semoga bermanfaat, saya pamit, sampai jumpa. Salam Sukai Penulis

Apa Keuntungan Menggunakan CSS ?

Tahukah anda keuntungan menggunakan css ini.? Ku yakin pasti orang-orang sudah pada tahu, tapi tidak salahnya juga saya menuliskan artikel mengenai hal ini, berbeda pendapat itu adalah hal wajar, hal ini adalah pendapat saya mengenai keuntungan menggunakan CSS, jika ingin tahu maka simak artikel di bawah ini.

Catatan : Telitilah saat membaca


Apa keuntungan CSS?

CSS memungkinkan anda dapat memisahkan layout (Tampilan) dari isi dokumen, CSS ini juga memungkinkan anda dapat menentukan layout (Tampilan) yang lebih ampuh di bandingkan dengan HTML. Di bawah ini ada beberapa keuntungan menggunakn CSS yang bisa anda lakukan saat menggunakan CSS :
  1. Menentukan tampilan dari halaman-halaman web dalam sebuah tempat tanpa mengulangnya kembali melalui script (kode) HTML anda. Hal Ini akan lebih efisien di bandingkan menentukan warna dan font tiap kali anda memulai sebuah cell baru dalam sebuah tabel.
  2. Dengan mudah mengubah tampilan dari halaman-halaman web walaupun setelah halaman tersebut di buat. Setelah style di tentukan dalam sebuah tempat, anda dapat mengubah tampilan keseluruhan  situs sekaligus tanpa harus mengganti tag-tag tertentu ketika mengubah salah satu tampilan dari elemen halaman anda.
  3. Menentukan ukuran font dan atribut-atribut yang sejenis dengan keakuratan yang sama dengan sebuah  "word processor" dan tidak dibatasi hanya untuk tujuh ukuran font berbeda yang telah di tetapkan dalam HTML.
  4. Menentukan isi hingga ukuran piksel dari tiap halaman web dengan akurat
  5. Menentukan kembali keseluruhan tag-tag HTML. Sebagai contoh, anda dapat dengan mudah membuat tabel tag menjadi berwarna merah menggunakan font yang spesial
Style tersebut di hubungkan untuk memformat tampilan dalam dokumen HTML tersebut.

Dalam mengimpor file CSS, anda dapat langsung mengimpor beberapa file CSS, sekaligus dalam sebuah dokumen agar memperkaya tampilan dokumen seperti terlihat pada contoh kode di bawah ini:

  • <link rel="stylesheet" type="text/css" href ="default1.css"
  • <link rel="stylesheet" type="text/css" href ="default2.css"
  • <link rel="stylesheet" type="text/css" href ="default3.css"
  • Atau
  • <style>
  • <!--
  • @import url(default1.css)
  • @import url(default2.css)
  • @import url(default3.css)
  • -->
  • </style>

Perbedaan dalam terakhir adalah perintah impor tersebut akan mengambil style CSS dengan cara import style dari alamat url yang anda tentukan. Cara ini lebih efisien karena dokumen yang kita beri perintah impor tersebut hanya akan mengimpor file CSS yang pada akhirnya style CSS tersebut eksternal yang terpisah dengan dokumen HTML asli.

Ketika surfing ke dalam situs anda maka CSS akan di sembunyikan dalam komputer pengguna sehingga akan memperkecil ukuran file sebuah situs yang kita buat. Jadi jika anda menggunakan cara terkahir ini, maka sebelumnya anda harus membuat sebuah dokumen style CSS eksternal tersebut dengan eksternal (.css) di mana dokumen style tersebut berisi aturan yang akan mengatur tampilan dokumen web yang di buat.

Struktur CSS

Dalam pembuatan dokumen web menggunakan style CSS di kenal adanya aturan atau struktur penulisan buku agar style CSS yang anda buat tersebut dapat di tampilkan dengan baik dalam dokumen web yang di buat. Perhatikan Contoh kode script di bawah ini:
  • <html>
  • <head>
  • <title> HTML Selector </title>
  • <style type="text/css">
  • <!--
  • p {font-family: verdana;}
  • -->
  • </style>
  • </head>
  • <body>
  • <p> penggunaan HTML Selector dalam CSS</p>
  • </body>
  • </html>

Pada contoh di atas di gunakan tag HTML <p> sebagai selector dan setiap huruf yang berada di antara tag </p> akan memiliki jenis font verdana sesuai dengan value atau nilai yang di berikan pada property style tersebut. Seperti terlihat dalam gambar di bawah ini:


Untuk penjelasan mengenai apa keuntungan menggunakan CSS hanya itu saja yang bisa saya sampaikan, dengan adanya artikel ini semoga membantu dan bermanfaat, sampai jumpa di Artikel lain, dan terimakasih sudah berkunjung di artikel saya. Salam Sukai Penulis

Apa itu Css? Bagaimana cara kerjanya?

Saya yakin pasti para master sudah tidak asing lagi dengan CSS alat pembantu html, tapi saya hanya ingin berbagi saja dengan pengalaman saya saat di sekolah dan ini adalah salah satunya, ilmu itu tidak ada yang sia-sia jika kita mengamalkannya betul tidak? kurasa betul karena saya yang mengatakannya. hehe :D Baiklah silahkan baca-baca ke bawah dengan teliti.

Apa itu CSS?

CSS (Cascoding Style Sheets) adalah sebuah cara untuk memisahkan isi dengan layout dalam halaman-halaman web yang di buat. Css memperkenalkan template yang berupa style untuk membuat dan mempermudah penulisan dari halaman-halaman yang di rancang.

Hal ini sangat penting karena halaman yang menggunakan css dapat di baca secara bolak-balik dan isinya dapat di lihat oleh pengunjung dari manapun. CSS mampu menciptakan halaman yang tampak sama pada resolusi lauar daro pengunjung yang berbeda tanpa memerlukan suatu tabel.

Dengan CSS, anda akan lebih mudah melakukang setting tampilan keseluruhan web hanya dengan menggantikan atribut-atribut atau perintah dalam style CSS. Dengan atribut yang di inginkan tanpa harus mengubah satu per satu atribut tiap elemen yang ada dalam situs yang di buat.

Saat ini CSS merupakan style yang banyak di gunakan karena berbagai CSS dalam web akan lebih efisien karena CSS dapat di gunakan untuk penggunaan secara berulang pada tag-tag tertentu sehingga tidak usah mengetikkan ulang seluruh perintah pemformatan seperti halnya HTML klasik. 

CSS akan lebih mudah di pelajari jika telah mengetahui struktur pembuatan dokumen web dengan bahasa HTML.

Bagaimana cara Kerja CSS?
Cara kerja CSS sangatlah mudah, karena CSS hanya membutuhkan style sebagai penentu dari font, warna, dan format-format lain untuk memformat atribut sebuah halaman web yang kita buat. Tiap style memiliki dua buah elemen dasat, yaitu "selector" dan "deciaration".

Sebuah "Selector" biasanya adalah tag HTML, sementara "declaration" adalah satu atau beberapa perintah/nilai dari css yang menunjukan tipe bentuk yang di aplikasikan pada selector. Declaraton ini biasanya di tandai dengan kurung kurawal {}.

Perintah atau nilai CSS yang berbeda di pisahkan satu dengan yang lain dengan menggunakan titik koma (;) seperti terlihat pada contoh di bawah ini :

  • <style type="text/css">
  • .format {font-family:verdana; color:blue;}
  • </style>

Kode di atas telihat bahwa :
.Format adalah selector, dan {font-family:verdana; color:blue;} adalah declaration.

Selector-selector dan style dalam CSS akan di masukan dalam sebuah tempat yang sama dalam isi dokumen HTML atau di buat di luar dokumen HTML yang nantinya akan di panggil untuk menentukan isi tampilan dokumen HTML. Kita hanya menunjuk pada selector-selector di mana akan mengaktifkan sebuah style yang anda inginkan.

Hal paling umum dalam memasukan kode style sheet dengan menggunakan tag <style>, tag </style> ini selalu tamil dalam bagian <head> dan sebelum </head> dari dokumen anda.

Di bawah ini adalah contoh penempatan CSS di dalam kode HTML:
  • <html>
  • <head>
  • <style type="text/css">
  • (Aturan-aturan CSS)
  • </style>
  • </head>
  • <body>
  • (Dokumen html yang akan di berikan aturan)
  • </body>
  • </html>

Untuk menentukan font dan warna-warna tiap anda memulai sebuah cell table, anda dapat menentukan sebuah style dan kemudian anda tinggal menunjuk ke style dalam cell table anda. Di bawah ini contoh perbandingan dari sebuah tabel berikut yang di buat menggunakan html sederhana :

  • <html>
  • <head>
  • <title> Belajar CSS </title>
  • </head>
  • <body>
  • <table>
  • <tr>
  • <td bgcolor="red" align="center"><font face="verdana" color="blue">Belajar CSS1</font></td>
  • </tr>
  • </table>
  • </body>
  • </html>

Jika di browser maka tampilan kode html di atas akan seperti di bawah ini :


Bandingkan jika dokumen tersebut di buat dengan menggunakan CSS (dengan menganggap bahwa sebuah selector yang di panggil "format" telah di tetapkan yang akan mengatur format teks dokumen HTML tersebut).

  • <html>
  • <head>
  • <title> Belajar CSS </title> 
  • <style type="text/css">
  • .format {background-color:red; color:blue; font- family:verdana;}
  • </style>
  • </head>
  • <body>
  • <table>
  • <tr>
  • <td class="format">Belajar CSS1</font></td>
  • </tr>
  • </table>
  • </body>
  • </html>

Jika di browser maka tampilan kode html di atas akan seperti di bawah ini :


Dengan menggunakan CSS, dokumen yang di buat menggunakan HTML murni akan dapat lebih di singkat dan akan lebih mengefisienkan waktu yang di butuhkan. Bayangkan jika anda membuat sebuah situs yang kompleks dengan banyak atribut untuk halam dalam situs anda, Tentunya anda harus menentukan tiap atribut untuk tiap halaman tersebut satu per satu.

Bagaimana jika terdapat seratus halam dalam situs tersebut? Bayangkan beberapa waktu yang anda habiskan hanya untuk memformat tiap halaman jika terdapat kesalahan dalam halaman-halaman tersebut? Namun masalah tersebut dapat lebih diminimalisasi menggunakan CSS karena anda hanya akan membuat style yang akan memformat keseluruhan halaman dalam situs yang di buat dan kita cukup menentukan selector dalam style yang akan di gunakan dalam halaman tersebut.
Catatan : Terimakasih sudah membaca sampai akhir :D
Nah itulah penjelasan apa yang di maksud dengan CSS, terus bagaimana cara kerjanya, saya sudah jelaskan, semoga dengan penjelasan saya di atas bisa membuat anda mengerti, okeh sampai di sini dulu, sampai jumpa. Salam Sukai Penulis

Apa itu HTML? (Lengkap) Untuk pemula

Halo kembali lagi dengan web Sukai Penulis, admin mengatakan selamat menjalankan aktivitas seperti biasanya, para pengusaha, para blogger, para pencari kerja, para pencari ilmu dan lainnya.

Di sini saya ingin berbagi ilmu mengenai tentang apa itu HTML? Para IT tentunya sudah tahu apa yang di maksud dengan HTML, tetapi apa salahnya saya berbagi dengan pengalaman saya mengenai HTML tersebut, yah baiklah karena waktu itu terbatas jadi saya akan menjelaskan sebisa mungkin untuk para bos (pencari ilmu), simak penjelasan sebagai berikut di bawah ini.

Catatan : Untuk para pembuka halaman ini telitilah saat membacanya

Apa itu HTML ?

HTML (Hypertext Markup Languange) adalah sebuah protokol yang di gunakan untuk membuat format suatu dokumen web yang mampu di baca dalam browser dari berbagai platform komputer.

Sifat bahas HTML ini adalah client script, di mana dokumen tersebut dapat di buka dalam komputer stand alone yang tidak membutuhkan server untuk dapat menampilkannya di dalam browser.

Dokumen HTML merupakan file yang pada umumnya beresktensi (.htm atau .html), di mana bahasa html tersebut tersusun atas tag yang berformat <isi tag>. Aturan penulisan HTML adalah sebagai berikut :

  1. Dalam penulisannya, tag HTML diapit dengan dua karakter kurung siku "< dan >".
  2. Tag HTML secara normal selalu berpasangan.sebagai contoh : <div> dan </div>
  3. Tag HTML pertama dalam suatu pasangan adalah tag awal dan tag kedua merupakan tag akhir. Sebagai contoh : <index> akan di akhiri dengan </index>.
  4. Tag HTML tidak case sensitive, di mana tag dengan huruf kecil sama dengan tag dengan huruf besar. Sebagai contoh : <b> sama dengan <B>.
  5. Jiika dalam suatu tag terdapat tag lagi maka penulisan tag akhir boleh bersilang dan harus berurutan. Sebagai contoh : <b><i> huruf tebal dan miring </i></b>.
  6. Penulisan script HTML selalu di awali dengan <html> dan di akhir dengan  </html>.
Secara teknis, web browser akan melakukan penerjemahan dokumen untuk di tampilkan dalam bentuk HTML jika dokumen tersebut terdapat di antara tag <html> dan </html>. Ada baiknya dalam penulisan HTML menggunakan huruf kecil untuk menghadapi HTML generasi berikutnya (di rekomendasi dari w3c untuk HTML 4.0 dan XHTML).

Dalam HTMl, struktur di bagi menjadi dua bagian, di antara HTML ini anda harus tahu, lihat di bawah ini:
  1. Bagian (head) : Bagian ini memuat informasi mengenai kepala dokumen.
  2. Bagian Badan (body) : Bagian ini memuat informasi mengenai badan dokumen.
Contoh struktur utama penulisan dalam HTML adalah sebagai beriku :

<html>
<head>
 <title>Belajar html </title>
</head>
<body>
belajar html
</body>
</html>
Pembuatan dokumen web menggunakan HTML sangat mudah anda dapat membuatnya menggunakan program editor standar windows, yaitu Notepad dengan menuliskan bahasa dan aturan HTML-nya.

Kemudian simpan dalam ekstensi ( .htm atau .html) melalui menu Start - Program Files - Accessories - Notepad kemudian setelah terbuka halaman notepad anda ketikan kode html ke dalam halaman tersebut seperti contoh di atas.

Kemudian simpan dengan memilih menu file - Save As nanti akan muncul form untuk mengganti nama file yang anda tulis di notepad setelah sudah mengganti nama pilih  tombol save di sebelah kanan.
Catatan : Nama filenya harus format ( .htm atau .html).
Setelah proses dokumen html dari script yang telah di buat tersebut dan penyimpanan sudah selesai, maka selanjutnya anda lihat menggunakan web browser seperti internet Explorer, Netscape, Navigator, Mozilla Firefox, opera, google chorme, dan sejenisnya.

Halaman yang anda buat seperti script di atas hasilnya akan seperti di bawah ini:

belajar html

Script tadi adalah script yang sangat sederhana dan simple karena script tersebut menunjukan bahwa akan menampilkan tulisan dan title yang berbeda.

Nah itulah penjelasan mengenai apa itu HTML semoga dengan adanya artikel ini bisa menjadi bermanfaat, ilmu itu tidak harus sekaligus banyak nanti ilmunya minggat dari otak, lebih baik sedikit demi sedikit menjadi bukit dari pada banyak lalu tinggal secuil. hehe maaf becanda okeh saya pamit sampai jumpa salam Sukai Penulis.

Apa itu Objektif Basis Data? (Lengkap)

Dari artikel sebelumnya saya telah menjelaskan tentang apa itu Basis Data dan Apa definis database, nah di artikel tersebut admin telah berjanji bahwa akan ada pembahasan selanjutnya mengenai basis data, untuk di artikel ini saya akan membahas kelanjutan dari artikel kemarin. selanjutnya admin membahas tentang Objek Basis Data dan Penerapan Basis Data.

Apa itu Objektif Basis Data? Bagaimana penerapan Basis Data? mungkin di sini telah ada yang memahami atau belum juga ada yang memahami, baiklah sekarang saya bahas, siap? tentunya harus siap maka admin persilahkan untuk menyimak di bawah ini.

Catatan : Cobalah teliti saat membaca


Objektif Basis Data?

Telah di sebutkan dari artikel sebelumnya bahwa tujuan awal dan utama dalam pengelolaan data dalam sebuah basis data adalah agar kita dapat memperoleh menemukan kembali data (yang kita cari) dengan mudah dan cepat.

Di samping itu, pemanfaatan basis data untuk pengelolaan data, juga memiliki tujuan-tujuan lain, Seceara lebih lengkap, pemanfaatan basis data di lakukan untuk memenuhi sejumlah tujuan (objektif) seperti beberapa macam berikut ini :

  • Kecepatan dan Kemudahan (Speed)
  • Pemanfaatan basis data memungkinkan kita untuk dapat menyimpan data atu melakukan perubahan atau manipulasi terhadap data atau menampilkan kembali data tersebut dengan lebih cepat dan mudah, dari pada jika kita menyimpan data secara manual (non-elektronis) atau secara elektronis (tetapi tidak dalam bentuk penerapan basis data, misalnya dalam bentuk spread sheet atau dokumen teks biasa). 
     
  • Efisiensi Ruang Penyimpanan (Space)
  • Karena keterkaitan yang erat antar kelompok data dalam sebuah basis data, maka redunsi (pengulangan) data pasti akan selalu ada. Banyaknya redudansi ini tentu akan memperbesar ruang penyimpanan (baik di memori utama maupun memori sekunder) yang harus di sediakan.
     
    Dengan basis data, efisiensi atau optimalisasi penggunaan ruang penyimpanan dapat di lakukan, karena kita dapat melakukan penekanan jumlah redundansi data, baik dengan menerapkan sejumlah pengodean atau dengan membuat realasi-relasi (dalam bentuk tabel) antar kelompok data yang saling berhubungan.

  • Keakuratan (Accuracy)
  • Pemanfaatan pengkodean atau pembentukan relasi antar data bersama dengan penerapan aturan/batasan (constraint) tipe data, domain data, keunikan data, dan sebagainya, yang secara ketat dapat di terapkan dalam sebuah basis data, sangat berguna untuk menekan ketidak akuratan penyimpanan data.

  • Ketersediaan (Availability)
  • Pertumbuhan data (baik dari sisi jumlah maupun jenisnya) sejalan dengan waktu akan semakin membutuhkan ruang penyimpanan yang besar. Padahal tidak semua data itu selalu kita butuhkan. Karena itu kita dapat memilah adanya data utama/master/referensi, data transaksi, data histori hingga data yang kedaluarsa.
     
    Data yang sudah jarang atau bahkan tidak pernah lagi kita gunakan, dapat kita atur untuk di lepaskan dari sistem basis data yang seda akrif (menjadi off-line) baik dengan cara pengapusan atau dengan memindahkannya ke media penyimpanan off-line (seperti removable disk, atau tape).
     
    Di sisi lain, karena kepentingan pemakaian data, sebuah basis data dapat memiliki data yang yang di sebar di banyak lokasi geografis. Data nasabah sebuah bank, misalnya, di pisah-pisah dan di simpan di lokasi yang sesuai dengan keberadaaan nasabah.
     
    Dengan pemanfaatan tekhnologi jaringan komputer, data yang berada di suatu cabangm dapat juga di akses  (menjadi tersedia/available) bagi cabang lain.

          • Kelengkapan (Completeness)
          • Lengkap atau tidaknya data yang kita keloka dalam sebuah basis data bersifat relatif (baik terhadap kebutuhan pemakai maupun terhadap waktu). Seorang pemakai mungkin sudah menganggap bahwa data yang di kelola sudah lengkap, tetapi pemakai yang lain belum tentu berpendapat sama atau yang sekarang di anggap sudah lengkap belum tentu di masa yang akan datang juga demikian.
             
            Dalam sebuah basis data, di samping data kita kiha harus menyimpan struktur (baik yang mendefinisikan objek-objek dalam basis data maupun definisi detail dari tiap objek, seperti struktur file atau tabel dan indeks.
             
            Untuk mengkomodasi kebutuhan kelengkapan data yang semakin berkembang, maka kita tidak hanya dapat menambahkan record-record data, tetapi juga dapat melakukan perubahan struktur dalam basis data, baik dalam bentuk penambahan objek baru (tabel) atau dengan penambahan field-field baru pada suatu tabel.

          • Keamanan (Security)
          • Memang ada sejumlah sistem (aplikasi) pengelola basis data yang tidak menerapkan aspek keamanan dalam penggunaan basis data. Akan tetapi untuk sistem yang besar dan serius, aspek keamanan juga dapat di terapkan dengan ketat.
            Dengan begitu, kita dapat menentukan siapa-siapa (pemakai) yang boleh menggunakan basis data beserta objek-objek di dalamnya dan menentukan jenis-jenis operasi apa saja yang boleh di lakukannya.

          • Kebersamaan Pemakaian (Sharability)
            Pemakai basis data seringkali tidak terbatas pada satu pemakai saja, atau di satu lokasi saja atau oleh satu sistem aplikasi saja. Data pegawai dalam basis data kepegawaian, misalnya, dapat di gunakan oleh banyak pemakai, dari sejumlah departemen dalam perusahaan atau oleh banyak sistem (sistem pangajian, sistem akuntansi, sistem inventori, dan sebagainya).

            Basis data yang di kelola oleh sistem (aplikasi) yang mendukung lingkungan multi-user, akan dapat memenuhi kebutuhan ini, tetapi tetap dengan menjaga atau menghindari munculnya persoalan baru seperti inkonsistensi data (karena data yang sama di ubah oleh banyak pemakai pada saat yang bersamaan) atau kondisi deadlock (karena ada banyak pemakai yang saling menunggu untuk menggunakan data).

          Penerapan Basis Data

          Hampir di semua aspek pemanfaatan perangkat komputer dalam sebuah organisasi atau perusahaan senantiasa berhubungan dengan basis data. Perangkat komputer dalam suatu organisasi atau perusahaan biasanya di gunakan untuk menjalankan fungsi pengelolaan sistem informasi. yang dewasa ini sudah menjadi suatu keharusan, demi untuk meningkatkan efisiensi, daua saing, keakuratan, kecepatan, operasional organisasi atau perusahaan tersebut.

          Basis data merupakan salah satu komponen utama dalam setiap sistem informasi. Tidak ada sistem informasi yang bisa di buat dan di jalankan tanpa adanya basis data. Secara lebih nyata, bidang-bidang fungsional yang telah umum memanfaatkan basis data demi efisiensi, akurasi dan kecepatan operasi antara lain adalah :

          • Kepegawaian : Untuk berbagai perusahaan yang memiliki banyak pegawai.
          • Pergudangan (Inventory), Untuk perusahaan manufaktur (pabrik), grosir, apotik, dan lain-lain.
          • Akuntansi, Untuk berbagai perusahaan.
          • Reservasi, Untuk hotel, pesawat, kereta api, dan lain-lain.
          • Layanan Pelanggan (customer care), Untuk perusahaan yang berhubungan dengan banyak pelanggan (bank, konsultan, dan lain-lain).
          Sedangkan bentuk-bentuk organisasi/perusahaan yang memanfaatkan basis data (sebagai komponen manajemen sistem informasi) dapat berupa :
          1. Perbankan
          2. Dalam melakukan pengelolaan data nasabah, pengelolaan data tabungan, pengelolaan data pinjaman, pembuatan laporan-laporan akuntansi, pelayanan informasi pada nasabah/calon nasabah, dan lain-lain.
          3. Asuransi
          4. Dalam melakukan pengelolaan data nasabah, pengelolaan data pembayaran, pemrosesan pengajuan klaim asuransi, dan lain-lain.
          5. Rumah Sakit
          6. Dalam melakukan pengelolaan data histori penyakit, pengelolaan pengobatan pasien, penanganan pembayaran perawatan, dan lain-lain.
          7. Produsen Barang
          8. Dalam melakukan  pengelolaan data keluar masuk barang (inventori), dan lain-lain.
          9. Industri Manufaktur
          10. Dalam melakukan pengelolaan pesanan barang, pengelolaan data karyawan, dan lain-lain.
          11. Pendidikan/Sekolah
          12. Dalam melakukan pengelolaan data siswa, pengelolaan jadawal kegiatan perkuliahan, dan lain-lain.
          13. Telekomunikasi
          14. Dalam melakukan pengelolaan data administrasi kabel, pengelolaan data pelanggan, penanganan gangguan, dan lain-lain.
          Itulah pembahasan kali ini semoga halaman ini dapat membantu dan juga bermanfaat khususnya bagi para pencari ilmu. salam Sukai Penulisnya

          Apa itu Database? dan Apa Definisi Database? (Lenkap)

          Kita tahu bahwa pemrograman tidak lepas dengan namanya Basis Data (Database), mengapa? ya karena Basis Data adalah seperti sebuah jantung untuk pemrograman, jika tidak ada basis data pemrograman yang di buat itu tidak berguna, maaf bukan saya sok tahu tapi itu adalah menurut saya dengan pengamatan saya.

          Apakah kalian tahu apa itu Basis Data (database)? Jika tidak maka saya akan menjelaskan dengan jelas apa itu yang di maksud dengan basis data, tapi sebelum itu saya mau tanya sekali lagi, Apakah kalian tahu apa definisi Basis Data (database)? Tidak juga? Aduh kalau begitu saya menjelaskan kedua hal itu, yah baiklah saya akan jelaskan dengan senang hati maka simak lah dengan baik di bawah ini.

          Catatan : Telitilah saat membaca

           

          Apa itu Basis Data (Database) ?

          Basis Data atau selalu di sebut dengan nama Database, dapat di bayangkan sebagai sebuah lemari arsip, Jika kita memiliki sebuah lemari arsip dan bertugas untuk mengelolanya, maka kemungkinan besar kita akan melakukan hal-hal seperti : memberi map pada kumpulan arsip yang akan di simpan, menentukan kelompok arsip, memberi penomoran dengan pola tertentu yang nilainya unik pada seiap map, lalu menempatkan arsip-arsip tersebut dengan urutan tertentu di dalam lemari.

          Kalaupun hal-hal tersebut tidak seluruhnya, paling tidak, semua arsip menerapkan suatu aturan tertentu tentang bagaimana keseluruhan arsip-arsip tadi di susun. Yang paling sederhana, tentu menyusun arsip-arsip tadi sesuai kedatanganya (kronologisnya) dan tanpa pengelempokan. 

          Contoh : Bahkan untuk sebuah lemari buku atau bajupun, secara alamiah, kita seringkali menerapkan suatu aturan tertentu dalam menyusun buku-buku atau baju-baju di dalam sebuah lemari.

          Upaya penyusunan ini memang baru kita lakukan jika kita rasakan, bahwa buku atau baju tersebut sudah cukup banyak.

          Mengapa hal-hal semacam itu kita lakukan? Jawabannya sederhana (Simple) : kita berharap agar pada suatu saat nanti, sewaktu kita bermaksud untuk mencari dan mengambil kembali arsip, buku, atau baju dalam lemari masing-masing kita dapat melakukannya dengan mudah dan cepat.


          Definisi Database


          Basis Data atau Database terdiri atas 2 kata, yaitu Basis (Base) dan Data (Data). Basis (Base) kurang lebih dapat di artikan sebagai markas atau gudang, tempat bersarang/berkumpul, Sedangkan Data adalah representasi fakta dunia nyata yang mewakili suatu objek manusia (pegawai, siswa, pembeli, pelanggan), barang, hewan, angka, huruf, simbol, teks, gambar, bunyi, atau kombinasinya.

          Sebagai satu kesatuan istilah, Basis data (Database) sendiri dapat di definisikan dalam sejumlah sudut pandang seperti :
          • Himpunan kelompok data (arsip) yang saling berhubungan yang diorganisasi sedemikian rupa agar kelak dapat di manfaatkan kembali dengan cepat dan mudah.
          • Kumpulan data yang saling berhubungan yang di simpan secara bersama sedemikian rupa dan tanda pengulangan (redundansi) yang tidak perlu, untuk memenuhi berbagai kebutuhan.
          • Kumpulan file/tabel/arsip yang saling berhubungan yang dapat disimpan dalam media penyimpanan elektronis.
          Basis Data dan lemari arsip sesungguhnya memiliki prinsip kerja dan tujuan yang sama. Prinsip utamanya adalah pengaturan data/arsip, dan tujuan utamanya adalah kemudahan dan kecepatan dalam pengambilan kembali data/arsip.

          Perbedaannya hanya terletak pada media penyimpanan yang di gunakan. Jika lemari arsip menggunakan lemari dari besi atau kayu sebagai media penyimpanan, maka basis data menggunakan lemari dari besi atau kayu sebagai media penyimpan, maka basis data menggunakan media penyimpanan elektronis seperti cakram magnetis (magnetic disk atau di singkat sebagai disk saja).

          Hal ini merupakan konsekuensi yang logis, karena lemari arsip langsung di kelola oleh manusia, sementara basis data di kelola melalui perantaraan mesin pintar elektronis yang kita kenal sebagi komputer.

          Perbedaan media ini yang selanjutnya melahirkan perbedaan-perbedaan lain yang menyangkut jumlah dan jenis metode yang dapat di gunakan dalam upaya penyimpanan.

          Penting : Satu hal yang juga harus di perhatikan, bahwa basis data bukan hanya sekedar penyimpanan data secara elektronis (dengan bantuan kompter), maksudnya tidak semua bentuknya penyimpanan data secara elektronis itu bisa di sebut basis data.

          Kita dapat menyimpan dokumen berisi data dalam file teks (dengan program pengolah kata), file spread sheet, dan lain-lain, tetapi tidak bisa di sebut sebagai basis data. Hal ini di karenakan di dalamnya tidak ada pemilahan dan pengelompokan data sesuai jenis data.

          Kelak ketika file-file tersebut sudah cukup banyak, maka situasi ini tentu akan menyulitkan pencarian data tertentu, Yang sangat di tonjolkan dalam basis data adalah pengaturan, pemilihan, pengelompokkan, pengorganisasian data yang akan kita simpan sesuai fungsi atau jenisnya.

          Pemilihan, pengelompokkan, pengorganisasian ini dapat berbentuk sejumlah tabel terpisah atau dalam bentuk pendefinisian kolom-kolom (field) data dalam setiap tabel. 

          Operasi Dasar Basis Data

          Di dalam sebuah disk, basis data dapat di ciptakan dan dapat pula di tiadakan, Di dalam sebuah disk, kita dapat pula menempatkan beberapa lebih dari satu basis data. Sementara dalam sebuah basis data, kita dapat menempatkan satu atau lebih tabel.
          Pada tabel inilah sesungguhnya data di simpan dan ti tempatkan, Setiap basis data umumnya di buat untuk mewakili sebuah semesta data yang spesifik. Misalnya, ada basis data kepegawaian, basis data akademik, basis data inventori (pergudangan), dan sebagainya.

          Sementara dalam basis data akademik, misalnya, kita dapat menempatkan tabel nama mahasiswa, tabel mata_kuliah, tabel dosen, tabel jadwal, tabel kehadiran, tabel nilai, tabel ujian dan seterusnya.

          Oleh karena itu, operasi-operasi dasar yang dapat kita lakukan berkenan dengan basis data dapat meliputi sebagai berikut :

          • Pembuatan basis data baru (create database), yang identik dengan pembuatan lemari arsip yang baru.
          • Penghapusan basis data (drop database), yang identik dengan perusakan lemari arsip (sekaligus beserta isinya, jika ada).
          • Pembuatan tabel baru ke suatu basis data (create table), yang identik dengan penambahan map arsip baru ke sebuah lemari arsip yang telah ada.
          • Penghapusan tabel dari suatu basis data (drop table), yang identik dengan perusakan map arsip lama yang ada di sebuah lemari arsip.
          • Penambahan atau pengisian data baru ke sebuah tabel di sebuah basis data (insert), yang identik dengan penambahan lembaran arsip ke sebuah map arsip.
          • Pengambilan data dari sebuah tabel (query), yang identik dengan pencarian lembaran arsip dari sebuah map arsip
          • Pengubahan data dari sebuah tabel (update), yang identik dengan perbaikan isi lembaran arsip yang ada di sebuah map arsip.
          • Penghapusan data dari sebuah tabel (delete), yang identik dengan penghapusan sebuah lembaran arsip yang ada di sebuah map arsip.
          Di atas adalah Operasi yang berkenaan dengan pembuatan objek (basis data dan tabel) merupakan operasi awal yang hanya di lakukan sekali dan berlaku seterusnya, Sedangkan operasi-operasi yang berkaitan dengan isi tabel (data) merupakan operasi rutin yang akan berlangsung berulang-ulang dan karena itu operasi-operasi inilah yang lebih tepat mewakili aktivitas pengelolaan (management) dan pengolahan (processing) data dalam basis data.

          Nah itulah penjelasan mengenai tentang mulai dari apa itu database, apa definisi, dan di tambahkan dengan operasi dasar basis data, semoga dengan adanya artikel ini bisa membuat anda yang tadinya tidak tahu menjadi tahu mengenai database, dan juga artikel ini semoga bisa bermanfaat untuk para pembaca. Salam Sukai Penulis

          Apa itu PHP dan JavaScript

          Apa itu PHP dan JavaScript
          Assalamu'alaikum warrahmatullohi wabarakatuh, hallo teman-temanku dari dunia internet, saya di sini ingin menjelaskan tentang php dan java script, saya tahu kalian mungkin pernah mendengarnya tetapi untuk yang belum pernah mendengarnya anda tepat membuka website ini.

          Sebenarnya saya masih baru, tetapi saya hanya ingin menulis dengan suka rela karena berbagi pengalaman serta ilmu itu indah, kata orang-orang juga suka mengatakan berbagai itu indah, hehe makanya saya ingin berbagi supaya saya bisa indah. hehe :D

          Ok agan-agan maaf basa-basinya terlalu panjang lebar, saya ingatkan di sini saya ingin berbagi saja bukan niat apa-apa, langsung saja anda bisa simak di bawah sini.

          Apa itu PHP?

          PHP adalah perangkat lunak yang bersifat free (gratis), anda bisa mengunduhnya di internet melalui situs www.php.net. Namun, perlu di ketahui, PHP terkadang di kemas dalam bundel perangkat lunak, misalnya pada WAMP5, nanti saya bahas tentang WAMP5. Hal yang paling menarik lainnya adalah PHP bersifat multiplatform. Artinya, PHP dapat berjalan pada berbagai sistem, seperti Windows yang kini terkenal di dunia tekhnologi, Linux, dan UNIX.

          Kode PHP dapat diletakkan pada kode HTML dengan menggunakan tag <?php ?> contoh script di bawah ini :

          <html>
           <head>
          <title> Belajar Html </title>
          </head>
          <body>
          Selamat Belajar HTML. <br>
          <?php
          printf("Tgl. Sekarang: %s",  Date("d F Y"));
          ?>
          </body>
          </html>
          Pada contoh script di atas ,baris adalah :
          <?php
          printf("Tgl. Sekarang: %s",  Date("d F Y"));
          ?>
          Merupakan sebuah pertanyaan PHP yang di gunakan untuk menampilkan tulisan TGL. Sekarang :
          dan di ikuti dengan tanggal, bulan, dan tahun(diperoleh melalui pemanggilan fungsi Date()). Hasilnya bisa akan seperti ini :
          Selamat Belajar HTML
          Tgl. Sekarang 10 September 2017
          Catatan : Agar skrip PHP dapat di proses, nama file harus berekstensi .PHP.

          PHP dan JavaScript

          File yang hanya berisi kode HTML tidak mendukung pembuatan aplikasi yang melibatkan database karena HTML di rancang untuk menyajikan informasi yang bersifat statis (tampilan yang isinya tetap hingga web master atau penanggung jawab web melaukuan perubahan isi). Oleh karena itu selanjutnya muncul pemikiran untuk membuat suatu perantara yang memungkinkan aplikasi bisa menghasilkan sesuatu yang bersifat dinamis dan berinteraksi dengan database.

          Nah untuk penjelasan yang lebih lengkap nanti saya akan bahas di waktu yang berbeda, untuk saat ini saya hanya bisa menjelaskan sedikit mengenai PHP dan JavaScript semoga dengan adanya halaman ini bisa menambah ilmu, bermanfaat, maaf jika ada kata-kata yang kurang berkenan, namanya juga kan masih belajar, ok sampai jumpa di lain waktu.