Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (18)
Andere mochten auch
Andere mochten auch (20)
Ähnlich wie Pelatihan website#1
Ähnlich wie Pelatihan website#1 (20)
Pelatihan website#1
- 1. Pelatihan Website <#1/> Iankee.mualdo@gmail.com
- 3. THE OUTLINE PENGENALAN WEBSITE HTML CSS Mengenal CMS ( Content Management System) Iankee.mualdo@gmail.com
- 4. THE OUTLINE PENGENALAN WEBSITE HTML CSS Mengenal CMS ( Content Management System) Iankee.mualdo@gmail.com
- 5. PENGENALAN WEBSITE Chapter #1
- 6. website?
- 8. h t t p : / / w w w. k a s k u s . c o . i d
- 9. Website Statis Vs Website Dinamis
- 10. Unsur website
- 11. NAMA DOMAIN
- 12. WEBSITE HOSTING
- 13. DESAIN WEBSITE
- 14. WEB PROGRAMMING
- 15. Konten website
- 16. TEXT
- 17. IMAGE
- 18. VIDEO
- 19. FLASH
- 20. Web Designer Vs Web Developer
- 27. TEXT EDITOR
- 28. Web Server (Apache, Mysql/Or acle)
- 30. Konsep Desain & Coding Testing & Debuging
- 31. THE OUTLINE PENGENALAN WEBSITE HTML CSS Mengenal CMS ( Content Management System) Iankee.mualdo@gmail.com
- 32. HTML Chapter #2
- 33. HTML - HTML merupakan singkatan dari (Hyper Text Markup Language) - Merupakan salah satu bahasa untuk membuat website - HTML merupakan bahasa markup - Didalam dokumen html terdapat tag html, dan teks biasa (plain text) - Penulisan tag html tidak case sensitive (besar kecil huruf tidak berpengaruh) - Ekstensi file dari html adalah *.html
- 34. Tag HTML <BEGIN TAG> </END TAG>
- 35. Bentuk dari Tag HTML : <ELEMENT ATTRIBUT =“VALUE”> ELEMENT = NAMA TAG ATTRIBUT = ATTRIBUT DARI TAG VALUE = VALUE DARI ATTRIBUT Contoh dari Tag HTML : <BODY BGCOLOR =“lavender”> </BODY>
- 36. Contoh / struktur dasar Dokumen HTML Sederhana <html> //tag pembuka suatu dokumen html <head> //tag penanda bagian judul dokumen <tittle>HTML</tittle> //tag pemberian judul dokumen </head> <body> //tag penanda bagian isi dari dokumen Halo Dunia </body> </html>
- 37. Elemen Paragraf dalam HTML <P>….. </P> Attribut tambahan untuk pemformatan Paragraf ATRIBUT VALUE KETERANGAN Right Rata Kanan Align Center Rata Tengah Left Rata Kiri Justify Rata Kiri/Kanan
- 38. Elemen Heading dalam HTML <Hx>….. </Hx> X Bernilai 1 sampai dengan 6 Attribut tambahan untuk pemformatan Heading ATRIBUT VALUE KETERANGAN Right Rata Kanan Align Center Rata Tengah Left Rata Kiri
- 39. Physical Style dalam HTML ELEMEN FUNGSI <b>….</b> Menebalkan teks <i>….</i> Membuat teks miring <u>….</u> Menggaris bawahi teks <s>….</s> Memberikan coretan pada teks <big>….</big> Membesarkan teks <small>….</small> Mengecilkan teks <sub>….</sub> Membuat teks subscript <sup>….</sup> Membuat teks superscript
- 40. Elemen Text/Font Styling dalam HTML <font> ….. </font> Attribut tambahan untuk pemformatan Font. ATRIBUT VALUE KETERANGAN Size 1 sampai dengan 7 Mengatur ukuran font Color Nama warna / Kode Hex Warna Mengubah warna font Face Jenis Font Mengubah jenis font
- 41. List (Daftar) dalam HTML Elemen Ordered List/Numberd List (Daftar berurut dengan nomor/abjad) Elemen Unordered List/Bulleted list (Daftar tidak berurut menggunakan symbol)
- 42. Elemen Ordered List dalam HTML <ol> <li>text 1</li> <li>text2</li> </ol> Attribut tambahan untuk pemformatan Ordered List. ATRIBUT VALUE KETERANGAN Type A Daftar dengan huruf besar(A,B,C) a Daftar dengen huruf kecil(a,b,c) I Daftar dengan romawi besar(I,II,III) i Daftar dengan romawi kecil(i,ii,iii) 1 Daftar dengan nomor berurut(1,2,3)
- 43. Elemen Unordered List dalam HTML <ul> <li>text 1</li> <li>text2</li> </ul> Attribut tambahan untuk pemformatan Unordered List. ATRIBUT VALUE KETERANGAN Type disc Simbol berupa disk circle Simbol berupa lingkaran square Simbol berupa kotak
- 44. Menyisipkan gambar dalam HTML Format gambar yang dapat digunakan pada halaman web: o GIF (Graphical Interchange Format) .gif o JPEG (Joint Photographic Expert Group) .jpg o PNG (Portable Network Graphic) .png o BMP (Bitmap) .bmp
- 45. Elemen Penyisipan gambar dalam HTML <img>
- 46. Attribut tambahan untuk pemformatan Penyisipan gambar. ATRIBUT VALUE KETERANGAN src URL gambar Alamat penunjuk sumber gambar alt teks Tulisan yang akan ditampilkan align Center | Justify | Left | Top, bottom, middle : menentukan posisi Right | Baseline | Top | image terhadap teks. Left, Right, Center : Bottom | Middle untuk menentukan posisi image height angka ukuran tinggi gambar width angka ukuran lebar gambar border angka memberikan bingkai pada gambar
- 47. Elemen Hyperlink (link) dalam HTML <a> ….. </a> Attribut tambahan untuk pemformatan Hyperlink. ATRIBUT VALUE KETERANGAN Diisi dengan nama halaman web HREF URL/ Halaman web atau nama URL yang akan di-link- kan. NAME #namabagian Digunakan untuk link dalam satu dokumen web.
- 48. Membuat Tabel dalam dokumen HTML <table>…</table>
- 49. Elemen yang digunakan untuk membuat tabel ELEMEN KETERANGAN <TABLE> ... </TABLE> Tag utama. <TR> ..... </TR> Baris dari suatu table <TD> ..... </TD> kolom dari suatu table. <TH> ..... </TH> Judul tabel, terletak dibagian atas tabel <CAPTION> ...</CAPTION> Judul tabel yang terletak diluar tabel biasanya di bagian atas/bawah tabel.
- 50. Atribut yang digunakan oleh tabel Atribut Value Keterangan BORDER Angka (px) Menentukan tebal bingkai tabel. CELLSPACING Angka (px) Menentukan jumlah spasi antar sel CELLPADDING Angka (px) Menentukan jumlah spasi antar data dalam sel. WIDTH Angka (px) Mengatur lebar tabel. ALIGN Left, Center, Right Perataan tabel secara horizontal. VALIGN Midle, Bottom, Baseline Perataan tabel secara vertikal. BGCOLOR Warna Warna latar dari tabel / sel ROWSPAN Angka (px) Menggabungkan beberapa baris tabel. COLSPAN Angka (px) Menggabungkan beberapa kolom tabel.
- 51. Dw
- 52. THE OUTLINE PENGENALAN WEBSITE HTML CSS Mengenal CMS ( Content Management System) Iankee.mualdo@gmail.com
- 53. CSS Chapter #3
- 54. CSS - CSS merupakan singkatan dari (Cascading Style Sheet) - CSS memudahkan kita dalam mendesain halaman html - Meminimalkan penggunaan tag html seperti pewarnaan font dll (otomatis ukuran file juga berkurang) - Ekstensi file dari css untuk eksternal css(linked css) *.css
- 55. Tampilan facebook dengan CSS
- 56. Tampilan facebook tanpa CSS
- 57. Penulisan/struktur CSS selector { property_1: value_1; ... property_n: value_n; } SELECTOR berfungsi sebagai pemilih tag HTML yang akan dipakaikan CSS, sedangkan PROPERTY adalah atribut dari CSS yang bernilai VALUE.
- 58. Contoh Penerapan CSS <html> <head> <style> p Hasil di browser { color:red; text-align:center; } </style> </head> <body> <p>Hello World!</p> <p>This paragraph is styled with CSS.</p> </body> </html>
- 60. Selector Tag css memilih tag html untuk diberikan efek css h1 { property_1: value_1; ... property_n: value_n; }
- 61. Selector Class css Mendefinisikan class pada sebuah tag html, kemudian diberi efek dengan menentukan selector class .namaclass { property_1: value_1; ... property_n: value_n; }
- 62. Selector ID css Mendefinisikan ID pada sebuah tag html, kemudian diberi efek dengan menentukan selector class #namaid { property_1: value_1; ... property_n: value_n; }
- 64. Metode penulisan Inline CSS CSS didefinisikan langsung pada tag HTML yang bersangkutan, dengan menambahkan atribut style dalam tag HTML <p style = “color : red; font-size : 12pt;”> HALO CSS </p>
- 65. Metode penulisan Embedded CSS CSS didefinisikan terlebih dahulu dalam tag <style> … </style> yang diletakan di dalam tag <head>
- 66. <html> <head> <title> CSS </title> <style type = "text/css"> h1 {font-size: 20pt; font-style: italic; color: pink;} </style> </head> <body> <h1> CSS</h1> <p> Ayo kita belajar CSS ! </p> </body> </html>
- 67. Metode penulisan Linked CSS CSS didefinisikan pada file yang terpisah dan di link menggunakan tag link, yang diletakan di antara tag <head></head> <link href = “linked.css” rel = “stylesheet” type = “text/css”>
- 68. Beberapa property pada CSS
- 78. Dw
- 79. THE OUTLINE PENGENALAN WEBSITE HTML CSS Mengenal CMS ( Content Management System) Iankee.mualdo@gmail.com
- 80. MENGENAL CMS Chapter #5
- 81. CMS (Content Management System)
- 83. Penggunaan CMS (Content Management System) juga bermacam-macam, berikut diantaranya : a. Mengelola website pribadi atau lebih dikenal dengan blog b. Mengelola website perusahaan/bisnis. c. Portal atau website komunitas. d. Galeri foto, dan lain sebagainya. e. Forum. f. Aplikasi E-Commerce. g. Dan lain-lain.
- 84. CMS Populer
- 85. Joomla! V3.0
- 86. WordPress V3.xx
- 87. Drupal V7.x
- 88. Faq (Frequently Ask & Question)
Hinweis der Redaktion
- Website atausitusmerupakankumpulanhalaman yang menampilkaninformasi data, teks, gambar, data animasi, suara, dangabungandarisemuanya, baik yang bersifatstatismaupun yang bersifatdinamis yang membentuksuaturangkaianbangunan yang salingterkaitdenganjaringan-jaringanhalaman (hyperlink).
- Website atausitusmerupakankumpulanhalaman yang menampilkaninformasi data, teks, gambar, data animasi, suara, dangabungandarisemuanya, baik yang bersifatstatismaupun yang bersifatdinamis yang membentuksuaturangkaianbangunan yang salingterkaitdenganjaringan-jaringanhalaman (hyperlink).Website StatisWebsite Statis : website yang mempunyaihalaman yang statis, tidakberubah. Jadiuntukmelakukanperubahaninformasi, penambahaninformasi, menghapushalaman, update bagian-bagianpadahalaman website statisdilakukanolehpemilik website secara manual mengedit, menambahkan, ataumenghapus code yang menjadistruktur website statis.Website DinamisWebsite Dinamis: website yang secarastrukturdiperuntukanuntuk update seseringmungkin. Website inimempunyaihalamanmudahberubah, untukkebutuhan update informasiseseringmungkin. Pada website dinamis inilebihmemudahkanpemilikdalammeng-update sepertimenambahkaninformasibaru, mengeditinformasi lama, ataumenghapusnya. Untukmengoperasikansertamerawat (mantainance) website yang sifatnyadinamisinilebihmudahdilakukan. Bagiseorangweb designer/ web developer kategori web dinamisdibutuhkankemampuandalam pemrograman web, karenapada website dinamisbanyakditonjolkanpengolahan data sehinggadibutuhkankemampuandalam pemrograman web.Interaksiantarapengunjungdenganpemilik web Dalam web statistidakdimungkinkanterjadinyainteraksiantarapengunjungdenganpemilik web. Sementaradalam web dinamisterdapatinteraksiantarapengunjungdenganpemilik web sepertimemberikankomentar, transaksi online, forum dllAdanya script language yang digunakan Web statishanyamenggunakan HTML saja, sedangkan web dinamismenggunakanbahasapemrograman web seperti PHP atau ASP.Penggunaan database Web statistidakmenggunakan database karenatidakada data yang perludisimpandandiproses. Sedangkan web dinamismenggunakan database sepertimysql, oracle, dlluntukmenyimpandanmemproses dataContent Content dalam web statishanyadiberikanolehpemilik web danjarangdiupdate, sementara contentdalam web dinamisbisaberasaldaripengunjungdanlebihseringdiupdateApasajasih yang termasuk website?
- Inimerupakantampilandari website unsoed
- Inimerupakantampilandari website kaskus.co.id
- Interaksiantarapengunjungdenganpemilik web Dalam web statistidakdimungkinkanterjadinyainteraksiantarapengunjungdenganpemilik web. Sementaradalam web dinamisterdapatinteraksiantarapengunjungdenganpemilik web sepertimemberikankomentar, transaksi online, forum dllAdanya script language yang digunakan Web statishanyamenggunakan HTML saja, sedangkan web dinamismenggunakanbahasapemrograman web seperti PHP atau ASP.Penggunaan database Web statistidakmenggunakan database karenatidakada data yang perludisimpandandiproses. Sedangkan web dinamismenggunakan database sepertimysql, oracle, dlluntukmenyimpandanmemproses dataContent Content dalam web statishanyadiberikanolehpemilik web danjarangdiupdate, sementara contentdalam web dinamisbisaberasaldaripengunjungdanlebihseringdiupdateApasajasih yang termasuk website?
- Pengertian website jugabisakitapahamidariunsur-unsur yang adadalampenyediaansebuah website. Laluapasajaunsur-unsur yang adadalampenyediasebuah website itu? Unsur-unsur yang harusadadalampenyediaan website atausitus di antaranyasebagaiberikut:
- Alamatunik di dalamduniamaya (internet) yang bergunauntukmenemukansebuah website. Umumnya URL ini di perjualbelikandengansistemsewatahunan. Banyakextensi domain yang terdapat di seluruhdunia, .com, .net, .org, .co.id, .co.uk (domain untuk regional)
- Web Hosting merupakanruangan yang terdapatdalamharddisksebagaitempatpenyimpanan data, file, video, email, database,dll yang nantinyaakanditampilkan di dalam&nbsp; website tersebut.
- mendesainan website merupakanhal yang penting. Faktoruserfriendlyharusditerapkandalampembuatandesainsebuah website. Membuatpemakai website merasanyamandanmudahdalampenggunaannyamembuatpemakai website akanterusmengunjunginya.
- Bahasa Program mrupakanbahasa yang digunakanuntukmenterjemahkansetiapperintahpadasaat website tersebutsedangdijalankan.contohdaribahasa program, yakni HTML, PHP, CSS Java Script, XML, JSP, dll
- Istilah “kontenadalah raja” (content is king) Ada beberapacaradalammembagipenempatankontensehinggaterhindardaripengulangantopik, adalah:Homepage: Gunakan homepage untukmenampungsemua ide pokokatau ide utama yang bersifatumum. JikaAndahendakmenempatkan keyword umum (generic), maka homepage adalahhalaman yang paling tepat.Product/Service Pages: JikaAndahendakmenawarkansuatuprodukataulayanan, buatlahhalamankhususdanunikuntukmasing-masingprodukataulayanan yang Andatawarkan.Resource Center: Siapkanhalamankhususuntukmenempatkaninformasitambahan yang meliputipetunjukdan tip-tip yang berguna.Blogging: Blog merupakantempat yang paling bagusuntukmenempatkanpuluhanbahkanratusankonten. Blogging secara normal (sekalidalamseminggu) mampumemberidampak yang kuatterhadap SEO, karenasetiap blog post merupakanhalamanbaru yang unik. Search engine menyukai website yang kaya kontendanjugaunik.Isi website yang Efektifharusmencakup: Sebuahparagrafpembuka yang mengundangperhatian Kata kuncisetidaknyapadakalimatpertamadanterakhirdariartikel Informasi yang diinginkanpembaca Tulisanmengalir yang informatifdanmenarikperhatianpembaca
- janganmenuliskontenuntukmesinpencari, tulislahkontenuntukaudiensAnda (manusia) makamesinpencariakanmengikutiAnda.
- Flash digantikanolehmesinpencarai->Adaduapekerjaanmengenaipembuatan website
- Web development is the back-end of the website, the programming and interactions on the pages. Aweb developer focuses on how a site works and how the customers get things done on it. Good web developers know how to program CGI and scripts like PHP. They understand about how web frameswork and can keep a site running effectively.Web design is the customer-facing part of the website. A web designer is concerned with how a site looks and how the customers interact with it. Good web designers know how to put together the principles of design to create a site that looks great. T
- Website hanyalahkumpulan file yang terletakpadasebuahkomputer yang terhubsebuahungke Internet. KetikaseseorangmengunjungiWebsite Anda, merekasebenarnyahanyaterhubungkesebuahkomputerdankomputer (yang kemudiandisebutsebagai Server) tersebutmemberikan file yang inginmerekalihat. untukmenjelaskanfungsinyaadalah DNS bisadianggapsepertibukutelepon internetInikedengaran simple, tetapiumumnyakomputerbiasatidakmemilikipower dan software yang dibutuhkanuntukmeresponsemuapermintaan yang dibutuhkanolehpengunjung Website Anda. Dan walaupunkomputer/server Andasanggup, komputerAndaakanmembutuhkankoneksi/akses Internet yang luarbiasacepatuntukmelayanijumlahpengunjung Website Anda.
- Website hanyalahsebuahkumpulan file yang terletakpadasebuahkomputer yang terhubungke Internet. KetikaseseorangmengunjungiWebsite Anda, merekasebenarnyahanyaterhubungkesebuahkomputerdankomputer (yang kemudiandisebutsebagai Server) tersebutmemberikan file yang inginmerekalihat. untukmenjelaskanfungsinyaadalah DNS bisadianggapsepertibukutelepon internetInikedengaran simple, tetapiumumnyakomputerbiasatidakmemilikipower dan software yang dibutuhkanuntukmeresponsemuapermintaan yang dibutuhkanolehpengunjung Website Anda. Dan walaupunkomputer/server Andasanggup, komputerAndaakanmembutuhkankoneksi/akses Internet yang luarbiasacepatuntukmelayanijumlahpengunjung Website Anda.
- Dalammembuat website kitaperlumenggunakan software, software softwaretersebutsangatbanyakjenisnya, danbanyakmacamkegunaannya.
- Photoshop, illustrator, dll
- Notepad, sublime, dreamweaver
- Untukmembuatweb dinamismemerlukan software tambahan yang terinstallpada pc server, untukmenjalankanphpmembutuhkan apache, dandatabasenyamenggunakanmysql/oracle.Server HTTP Apache atau Server Web/WWW Apache adalah server web yang dapatdijalankan di banyaksistemoperasi (Unix, BSD, Linux,Microsoft Windows dan Novell Netware serta platform lainnya) yang bergunauntukmelayanidanmemfungsikansitus web. Protokol yang digunakanuntukmelayanifasilitas web/www inimenggunakan HTTP.Apache memilikifitur-fiturcanggihsepertipesankesalahan yang dapatdikonfigur, autentikasiberbasis basis data dan lain-lain. Apache jugadidukungolehsejumlah antarmukapenggunaberbasisgrafik (GUI) yang memungkinkanpenanganan server menjadimudah.Apache merupakan perangkatlunaksumberterbuka dikembangkanolehkomunitasterbuka yang terdiridaripengembang-pengembangdibawahnaungan Apache Software Foundation.
- Konsep (Tentukanmaubuat web apa?)Buat Site Map/PetaSitusCodingTesting n Debugging
- Konsep (Tentukanmaubuat web apa?) (konsep database untukmembuat website dinamis)Buat Site Map/PetaSitusDesain & CodingTesting n Debugging
- Mendesain html berarti melakukan suatu tindakan pemrograman. Namun html bukanlah sebuah bahasa pemrograman. Namun html hanyalah berisi perintah‐perintah yang telah terstruktur berupa tag‐tag penyusun. Menuliskan tag‐tag html tidaklah sebatas hanya memasukkan perintah‐perintah tertentu agar html kita dapat di akses oleh browser. Mendesain html adalah adalah sebuah seni tersendiri. Homepage yang merupakan implementasi dari html adalah refleksi dari orang yang membuatnya. Untuk itu kita perlu mendesainnya dengan baik agar para pengunjung homepage yang kita buat merasa senang dan bermanfaat.
- Dalam stukturdasar HTML terdapatsebuah tag. Tag adalahkode yang digunakanuntukmemark-up ataumemolesteksdalam file HTML. Tag terdiridariduabagian, bagianpembukadanpenutup. Kita bisamengisikanteksdiantara tag-tag tersebut.Tag HTML dapatmenginstruksikan web browser untuk menebalkansebuahteks (bold), menampilkandengan format miring/italic, membuatnyasebagaisebuah header dengan level tertentu, ataumembuatnyasebagaisebuah hyperlink kehalaman web yang lain.buat berpasangan, ada tag pembuka danada tag penutup. Format umum tag HTML adalah :
- AttributesDalamsetiap tag kitabisamenambahkanatrribute. Attribute adalahkode yang kitagunakanuntukmempengaruhitampilanatau format setiapelemen di dalam tag. Sekarangubahdokumen HTML andamenjadi:<html><body bgcolor="yellow" text="red">iniadalah web pertamasaya</body></html>Bisaandabisalihathasilnya, terjadiperubahan di tampilan web anda. Penulisan Attribute diletakkansetelahnama tag. Andabisamenambahkanbermacammacamattributpada tag. Nantiakankitapelajarilebihlanjut.ElementElementadalahsegalasesuatu yang terdapatdidalam tag (diantara tag pembukadanpenutup). Ataudengan kata lain apa yang adadiantara tag <body> dan </body> merupakanelemendari body. Element ini yang menjadiintidarisebuah web. Apa yang adadidalamtampilansebuah web berasaldari element element yang terdapat di dokumen HTML.
- Digunakanuntukmenandaisekumpulanteksssebagaisuatuparagraf
- Sekumpulan kata atauprasa yang menjadijudulatausubjuduldalamsuatudokumen html. Sekalipunsamasamamerupakanjudul, tapi heading berbedadengan <tittle>, html menyediakan 6 buahtingkat heading. Heading level 1 biasanyamerupakanjudulpentingataujudulutama , sedangkan heading level berikutnyamerupakan sub juduldarijudulutama
- Physical Style merupakansuatu format yang diberikanpadatekstanpatergantungpadajeniselemendasartekstersebut. Elemenelemeninisudahseringkitapakaidalama program pengolah kata, sepertimenebalkanataumembuat miring suatuteks.
- Untukmengaturukuransuatuteks, elemen <FONT> menyediakanatribut <SIZE> dengannilaidari 1 sampai 7. Semakinbesarangka, makasemakinbesarukurantekstersebut.penggunaanwarnapadateksmulaidiperkenalkanoleh Internet Explorer 1.0 denganmenambahkanatribut <COLOR> padaelemen <FONT>. Pendefinisianwarnadapatdilakukandenganduacarayaitu, melaluinamawarnaataumenggunakannilai RGB warna. Adapunwarna yang dikenalpada HTML 3.2 hanya 16 warna. Internet Explorer memperkenalkanatribut FACE padaelemen FONT yang dapatdigunakanuntukmembuatbermacam-macamjenis font padasuatu page.
- Salah satucara yang efektifdanmudahuntukdibacadalammenyampaikaninformasiadalahdenganmenggunakandaftar. HTML mewnyediakanbeberapajenisdaftar, yaitu :
- Ordered list atau numbered list adalahsuatudaftardimana item-item yang ada di dalamdaftartersebutmemilikinomorsecaraberurut. Ordered list dimulaidengan tag awal <OL> dandiakhiridengan tag akhir </OL>. Sedanguntukmenyatakan list item, menggunakan tag <LI> dan di akhirioleh tag </LI>.
- Unordered list ataudisebutjuga bulleted list adalahsuatudaftardimanaurutantidakdiutamakan, jadi item-item dalamdaftarbisamunculdalamsembarangurutan. Unordered list dimulaidengantag <UL> dandiakhiridengan tag </UL>. Samadengan Ordered List, untukmenyatakan list item tetapmenggunakan tag <LI> dan di akhirioleh tag </LI>. Sedangkanatributdan value yang digunakanoleh Unordered List adalahsebagaiberikut :
- Selainteks, halaman web jugadapatmemuatgambar/image. Terdapatbeberapajenis format gambaryang dapatdigunakanpadahalaman web, antara lain : o GIF (Graphical Interchange Format) .gif o JPEG (Joint Photographic Expert Group) .jpg o PNG (Portable Network Graphic) .pngo BMP (Bitmap) .bmp
- Untukmenyisipkansuatugambardalamhalaman web dapatdilakukandenganmenggunakan tag <IMG>. Tag inimemilikiatributdan value sebagaiberikut :
- Atribut Value Keterangansrc URL gambarDiisidenganalamat yang menunjukpadasumber file gambaralt teksMenentukantulisan yang akanditampilkan(biasanyaditempatkanantaratandapetik). Apabila browser tidakdapatmenampilkangambaruntukalasantertentu. align Center | Justify | Left | Right | Baseline | Top | Bottom | Middle Top, bottom, middle digunakanuntukmenentukanposisi image terhadapteksLeft, Right, Center untukmenentukanposisiimage padadokumenheight angkaDigunakanuntukmenentukanukurantinggigambarwidth angkaDigunakanuntukmenentukanukuranlebargambarborder angkaDigunakanuntukmemberikanbingkaipadagambarAda duacarauntukdapatmenyisipkansebuahgambarkedalamsuatuhalaman web atau file HTML denganmenggunakan tag <IMG>, yaitu : 1. Penggunaan tag <IMG> dengan Absolute Path, yaitudenganmeletakan file gambarkedalamfolder yang samadengan file HTML. Sehinggacukupmemanggilnamadari file gambartersebut. 2. Penggunaan tag <IMG> dengan Relative Path, yaituletakgambardan file beradapadaduafolder yang terpisahatauberbeda.
- Link adalahsuatukemampuan yang dimilikiolehhalaman web. Link berfungsiuntukmenghubungkanhalaman-halaman web, situs yang lain ataubagian-bagiantertentupadasuatuhalaman web. Tag yang digunakanadalah <A> ……. </A> yang berfungsiuntukmembentuksuatu link kedokumenatausumberyang akandimuatketika user melakukanklikpada link tersebut. Adapunatribut yang digunakanpadatag <A> adalah :
- Untukmenyisipkansuatugambardalamhalaman web dapatdilakukandenganmenggunakan tag <IMG>. Tag inimemilikiatributdan value sebagaiberikut :
- Tabelbiasanyadigunakanuntukmenempatkan data secara spreadsheet, tapiuntukdesainsuatu web, selainuntukmenempatkan data, tabeldigunakanuntukmerapikanteks, ataupungambar. Denganmenggunakantabel, teksataupungambardapatdisusunmenjadilebihrapi. Tampilanhalaman web akanmenjadilebihbaik, apabiladasar/kerangkanyamenggunakantabel. Adapunelemen-elemen yang digunakanuntukmembuatsuatutabeladalah :
- Untukmembuatsuatutabeldiperlukantigaelementabel, yaitu Tag <TABLE> yang digunakansebagaiawalpembuatantabel, tag <TR> digunakanuntukmendifinisikanberapabanyakbarispadatabel, dantag <TD> digunakanuntukmenampungsel data daritabeltersebut. Tabelbiasanyatidakhanyaterdiridaridari 1 dimensiatau 1 kolomsaja , tapibisa 2, 3 atausesuaidengankebutuhankita. Untukmembuattabelduadimensi, dibutuhkanelemen tag <TR> sebanyak 2 kemudiankolomtabeldisusaikandengan data yang akandiisikan.
- Cascading Style Sheet (CSS) merupakanaturanuntukmengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. CSS bukanmerupakanbahasapemograman.Samahalnya styles dalam aplikasi pengolahan kata seperti Microsoft Word yang dapatmengaturbeberapa style, misalnya heading, subbab,
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- Selector ituuntukmenunjukkanbagianmana yang hendakdiatur / diformat.Property untukmenunjukkan, bagian (properti) dari selector yang hendakdiatur.Value adalahnilaidaripengaturannya.
- memilih tag html untukdiberikanefekcss
- memilih tag html untukdiberikanefekcss
- memilih tag html untukdiberikanefekcss
- CSS didefinisikanlangsungpada tag HTML yang bersangkutan. Cara Penulisannyacukupdenganmenambahkanatribut style dalam tag HTML tersebut. atribut style inihanyaakanberlakupadatag yang bersangkutandantidakakanmempengaruhi tag HTML lainnya
- CSS didefinisikanterlebihdahuludalam tag <style> … </style> yang diletakansetelah tag <title> danmasihdalampasangan tag <head>. Padapendefinisianinidijabarkan property – property CSS yang akandigunakanuntuk tag – tag HTML, yang selanjutkanakandigunakanpada tag- tag HTML yang bersangkutan.
- Metodepenulisaninihampirsamadenganmetode Embedded CSS, hanyasajapendefinisian tag <style> … <style> dibuatdalam file yang terpisahdengan file HTML dandisimpandalam format .css. Pada file HTML yang akanmenggunakan Linked CSS ini, harusmenggunakan tag <link> yang diletakansetelah tag <title> danmasihdiantara tag <head>.
- Metodepenulisaninihampirsamadenganmetode Embedded CSS, hanyasajapendefinisian tag <style> … <style> dibuatdalam file yang terpisahdengan file HTML dandisimpandalam format .css. Pada file HTML yang akanmenggunakan Linked CSS ini, harusmenggunakan tag <link> yang diletakansetelah tag <title> danmasihdiantara tag <head>.
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- Cascading Style Sheet adalah standard pembuatandanpemakaian style untukdokumenterstruktur, CSS digunakanuntukmempersingkatpenulisan tag HTML seperti font, color, text, dan table menjadilebihringkassehinggatidakterjadipengulangantulisan. CSS mengendalikanbeberapakomponendalamsebuah web sehinggaakanlebihterstrukturdanseragam. Denganmenggunakan CSS, sebuah web akanlebihfleksibeldalampenampilannyadanjugaakanmeminimalkanpenggunaan tag yang berpengaruhpadaukuran file. Meskipun CSS telahdidukungolehkebanyakan browser saatini, penerjemahantiap browser untukmenampilkan CSS akanberbeda – beda.
- MarginMarginadalahkode yang mengaturseleksibatasjarakluar, sepertimisalmemberijarakantara header blog denganbatasatas, bawah, kanandankiridarikontent yang adapadastruktur header di sekitarnya.PaddingSeperti yang telahsayaterangkan di atasbahwafungsi margin dengan padding sebenarnyahampirsamawalaupunkeduanyaberbeda, dan yang membuatberbedadarifungsi padding iniyaitufungsi padding mengaturseleksibatasjarakpadabagiandalam (lihatgambar)
- http://jsfiddle.net/tovic/fwkWG/StaticIniadalahposisisebenarnya. Mendeklarasikan position:static samasajadengantidakmendeklarasikan CSS Posisi.RelativeMendeklarasikan position:relative padaelemensecarakasatmatatidakakanmengubahapapun, namunkitabisamenerapkankoordinatposisidanurutantumpukanpadatipeposisiini.AbsoluteMendeklarasikan position:absolute padaelemenakanbenar-benarmemutuskanaliranelemendaritempatasalnyadanmembuatelemenbertumpukdenganelemenlainnya.FixedMendeklarasikan position:fixed padaelemenakanbenar-benarmemutuskanaliranelemendaritempatasalnyadanmembuatelemenbertumpukdenganelemen lain. Kelebihanpenerapanposisiiniadalahakanmembuatelementampakmelayangdantidakterpengaruhgerakan scroll bar.z-index adalahurutantumpukan. Saatkitamendeklarasikan position:absolute, makakemungkinan yang terjadiadalahelemenakanbertumpuk di sebelahataselemenatau di bawahelemen. Jika yang terjadiadalah yang kedua, makauntukmengangkatnya, kitaharusmendeklarasikan z-index dengannilai yang lebihbesardari 1.
- CMS (Content Management System) adalahSebuahsistem yang memberikankemudahankepada para penggunanyadalammengeloladanmengadakanperubahanisisebuah website dinamistanpasebelumnyadibekalipengetahuantentanghal-hal yang bersifatteknis. Dengandemikian, setiap orang, penulismaupun editor, setiapsaatdapatmenggunakannyasecaraleluasauntukmembuat, menghapusataubahkanmemperbaharuiisi website tanpacampurtanganlangsungdaripihak webmaster.
- CMS secarasederhanadapatdiartikansebagai: Sebuahsistem yang memberikankemudahankepada para penggunanyadalammengeloladanmengadakanperubahanisisebuah website dinamistanpasebelumnyadibekalipengetahuantentanghal-hal yang bersifatteknis. Dengandemikian, setiap orang, penulismaupun editor, setiapsaatdapatmenggunakannyasecaraleluasauntukmembuat, menghapusataubahkanmemperbaharuiisi website tanpacampurtanganlangsungdaripihak webmaster. Bukankahinisuatuhal yang efisien?Jadidenganmenggunakancms yang ada di internet andadapatmembuat website denganmudah.
- Penggunaan CMS (Content Management System) jugabermacam-macam, berikutdiantaranya :a. Mengelola website pribadiataulebihdikenaldengan blogb. Mengelola website perusahaan/bisnis.c. Portal atau website komunitas.d. Galerifoto, dan lain sebagainya.e. Forum.f. Aplikasi E-Commerce.g. Dan lain-lain.
- CMS secarasederhanadapatdiartikansebagai: Sebuahsistem yang memberikankemudahankepada para penggunanyadalammengeloladanmengadakanperubahanisisebuah website dinamistanpasebelumnyadibekalipengetahuantentanghal-hal yang bersifatteknis. Dengandemikian, setiap orang, penulismaupun editor, setiapsaatdapatmenggunakannyasecaraleluasauntukmembuat, menghapusataubahkanmemperbaharuiisi website tanpacampurtanganlangsungdaripihak webmaster. Bukankahinisuatuhal yang efisien?
- Di internet terdapatbanyaksekali content management system tetapiberikutsayasampaikanbeberapacms yang popular , dandigunakanolehbanyak orang, parameter kepopulerancmsiniberdasarakandaridokumentasicmstersebutlengkapatautidak, komunitas yang tersebarluas di internet, template/tema yang terserdiasertamodul
- Joomla adalahsalahsatu yang paling populer Open Sorce CMS (sistemmanajemenkonten). 2,7 persendari Web berjalanpada Joomla, perangkatlunakdigunakanolehindividu, usahakecil & menengah, danorganisasibesar di seluruhduniauntukdenganmudahmembuat & membangunberbagai website & web-aplikasi.
- WordPress open source yang sangatpopulerdigunakansebagaimesin blog (blog engine). Selainsebagaiblog,WordPress jugamulaidigunakansebagaisebuah CMS (Content Management System) karenakemampuannyauntukdimodifikasidandisesuaikandengankebutuhanpenggunanya.
- Drupal adalahsebuahperangkatlunaksistemmanajemenkonten yang bebasdanterbuka yang di distribusikandibawahlisensi GPL, pengembangandanperawatannyadilakukanolehribuankomunitaspenggunadanpengembang di seluruhdunia.Dalampelatihanberikutnyamungkinakan di bahastuntasmengenaisalahsatudariketigacmstadi, mungkindaridisiniada yang punya saran cmsapa yang akandibahas?