, Plugin Mana Yang Harus Saya Gunakan Dalam Proyek Web Saya? | MEMAHAMI DAN OPTIMASI WEB

Plugin Mana Yang Harus Saya Gunakan Dalam Proyek Web Saya?

Plugin Mana yang harus saya gunakan dalam proyek web saya?


Masing-masing orang dan saya juga setiap hari browsing melalui internet untuk menemukan script baru yang berguna  atau file CSS yang mungkin membuat hidup kita lebih mudah saat membuat website. Jumlah skrip yang berbeda dan plugin di luar sana hanya luar biasa macamnya dan itu menjadi lebih dan lebih sulit dan membingungkan untuk benar-benar tahu mana yang akan digunakan dalam proyek website. Dalam posting blog ini saya akan memberikan gambaran atas plugin yang paling penting dan berguna dan skrip (daftarpun akan diperpanjang oleh waktu). Dalam langkah kedua saya akan mencoba untuk menunjukkan contoh setup plugin dan skrip yang dapat Anda gunakan dalam proyek web Anda.

CSS Frameworks

  • PureCSS
    Sebuah setting kecil, modul css responaive yang bisa Anda gunakan
  • Foundationd
  • Fro :'ccd'&ggnt-end framework  yang populer  reaponsivenya
  • Bootstrap
    Satu set, modul CSS responsif kecil yang dapat Anda gunakan dalam setiap proyek web 
  • Skeleton
    Boilerplate Responsive,dengan membuat ringan blog

Modernizing scripts

  • Modernizr
    JavaScript mendetekdih?library yang men detectsHTML5 and CSS3 features in the user’s browser
  • CSS3Pietug
    Makes Internet Explorer 6-9 capable of rendering several of the most useful CSS3 decoration features
  • Selectivizr
    CSS3 pseudo-class and attribute selectors untuk IE 6-8
  • HTML5Shiv
    Memungkinkan fitur HTML5 di browser lama.
  • PrefixFree
    Memungkinkan Anda menggunakan CSSproperties hanya unprefixed di mana saja.
  • Respond.js
    Memungkinkan desain web responsif di browser yang tidak mendukung CSS3 Media Query - khususnya, Internet Explorer 8 dan di bawahnya.  

Performance-improving scripts

  • Minify
    Menggabungkan, minifies, dan cache JavaScript dan file CSS pada permintaan untuk mempercepat beban halaman.  

CSS Resets

  • CSS Reset
    Reset styling semua HTML element ke dasar yang konsisten  
  • Normalize.css                                                         Sebuah HTML5 modern yang siap untuk mereset CSS sebagai alterternatif
  • Daftar ini hanya berisi sebagaian ccript yang di gunakan, namun lebih banyak plugin dan script yang yang tidak di masukan dalam  dafyar ini. Namundemikian, sekarang sudah sangat sulit untuk memutuskan mana  skrip untuk diigunakan dalam proyek web. Sekarang akan di tunjukan preferensi pribadi saya dari script dan plugin yang saya gunakan si hampir setiap proyek web. Anda dapat mencoba setup danmemberitahu apa yang akan terpikirkan tentwng hal itu. Dalam contoh setup ini kita akan mengasumsikan bahwa tujuan kami adalah membangun swbuah website responsif html5 dengan dukungan lintas browser.                                Daftar ini hanya berisisi sebagian besar menggunakan script, namun ada lebih banyak script dan plugin yamf tidak saya masukkan ke dalam daftar.Namun demikia n sekarang sudah sangat sulit untuk memutuskan mana script untuk digunakan dalam proyek web ini.      Sekarang akan ditumjukan preferensi pribadi saya dari script dan plugin yang saya gunakan dihampir setiap laman. Amda dapat mencoba setup ini. Dalam contoh setup ini kita akan mengasumsikan bahwa tujuan kami adalah untuk membangun sebuah website responsif HTML5 dengan dukungan luntas browser.
Pertanyaan yang paling penting adalah apakah akan menggunakan kerangka CSS dan jika demikian yang mana, khisusnya untuk pemula dan orang-orang yang benar-benar menjadi kerangka CSS  dapat membantu. Untuk informasi lebih lanjut tentang apakah akan menggunakan kerangka atau tidak bisa baca artikel Chris Coyier:  Apa keuntunganya menggunakan sebuah css framework itu?“. Saya pribadi suka mrnggunakan purecss oleh yahoo! Karena ringan  dan dapat mendownload hanya bagian-bagian yang Anda butuhkan saja (bentuk, grid, tombol, tabel, menu). Menggunakan skin builder, anda dapat membuat tampilan sendiri dengan mengjasilkan css skin custom. Pure css sudah dilengkapi dengan moderniz. Css jadi kita tidak perlu memikirkan ulang CSS kami.   
Agar dapat mendeteksi fitur browser yang mendukung atau tidak kita dapat menggunakan modernizr pastikan untuk mendeteksi"html5shive" dan "media queries. Dengan cara itu modernizr sudah dilengkapi dengan dukungan diturHTML5 untuk mendukung IE dan Mediaquery dan kami tidak memenyertakan script terpisah.  Jika anda mengguankan fitur CSS3 dalam proyek web yang anda pastikan untuk memeriksa fitur yang diperlukan dibagian CSS3  dari halaman download Modernizr.                                Kami telah mencantumkan hanya satu script dan satu file CSS sejauh ini dan sudah diurus Reset CSS, dukungan theHTML5 untuk IE, Media Queries dan dukungan CSS3. Sekarang ada satu lagi script yang saya temukan sangat berguna tetapi terserah kepada proyek Anda apakah Anda menggunakan banyak fitur CSS3 atau tidak. Script yang dibicarakan adalah prefixfree, sebuah plugin yang membiarkan Anda  menggunakan fitur CSS3 tanpa harus menulis semua prefix dalam  beda browser secara manual. Jadi hanya menuliskan- moz-box-shadow, -webkit-box-shadow dan box-shadow anda hanya akan memerlukan menulis box-shadow saja.  Jika Anda menggunakan banyak fitur css kemudian menggunakan script ringan ini akan menghemat waktu dan menolong anda berkarya peraturan css yang lebih baik dan dapat dibaca. Dan untuk sumber daya anda dapat menyimpanya menggunakan minify.js yang mana dengan menggabungkan ,minimalis, dan mencaching file-file js dan css dengan menggunakan alat minify online cssminifierCSS untuk meminimalkan file css dan jscompress umruk meminimalkan file javascript dan menggabungkan file-file JS Anda.

Kesimpulannya itu tergantung pada selera pribadi Anda dan persyaratan untuk proyek web apa script dan kerangka untuk digunakan. Saya akan senang mendengar tentang preferensi Anda. Kita sama-sama belajar.                                                                                          
.

CSS Frameworks


Modernizr
JavaScript perpustakaan yang detectsHTML5 dan CSS3 fitur di pengguna browser
CSS3Pie
Membuat Internet Explorer 6-9 mampu rendering beberapa dekorasi CSS3 paling berguna features
Selectivizr
CSS3 pseudo-class dan atribut penyeleksi untuk IE 6-8.
HTML5Shiv
Memungkinkan fitur HTML5 di browser yang lebih tua.
PrefixFree 
Memungkinkan Anda menggunakan hanya unprefixed properti CSS diamanapun.
Respond.js
Memungkinkan desain web responsif di browser yang tidak mendukung meida browser CSS3 Media Query khususnya, Internet Explorer 8 dan di bawahnya.

Script meningkstkan kerja 

Mengecilkan/minify.
Menggabungkan, minifies, dan cache JavaScript dan file CSS pada permintaan untuk mempercepat beban halaman.


CSS ulang
Reset styling semua HTMLelements ke baselineNormalize.css konsisten
Sebuah modern, HTML5-siap alternatif untuk me-reset CSS

Normalize.css
Sebuah modern, HTML5-siap alternatif untuk me-reset CSS


Daftar ini hanya berisi script sebagian besar digunakan, ada namun lebih banyak script dan plugin yang saya tidak dimasukkan ke dalam daftar. Namun demikian sekarang sudah sangat sulit untuk memutuskan mana skrip untuk digunakan dalam proyek Anda.

Sekarang saya ingin menunjukkan preferensi pribadi saya dari script dan plugin yang saya gunakan di hampir setiap proyek web. Anda dapat mencoba setup saya dan memberitahu saya apa yang Anda pikirkan tentang hal itu. Dalam contoh setup ini kita akan mengasumsikan bahwa tujuan kami adalah untuk membangun sebuah website responsiveHTML5 dengan dukungan lintas-browser.

Pertanyaan yang paling penting adalah apakah akan menggunakan Kerangka CSS dan jika demikian yang mana. Ecspecially untuk pemula dan orang-orang yang tidak benar-benar menjadi CSS kerangka dapat membantu. Untuk informasi lebih lanjut tentang apakah akan menggunakan kerangka atau tidak memeriksa artikel Chris Coyier's "Apakah Manfaat dari Menggunakan CSS Framework?". Saya pribadi seperti usingPureCSS oleh Yahoo! karena ringan dan Anda dapat men-download hanya bagian-bagian yang Anda butuhkan (bentuk, grid, tombol, tabel, menu). Menggunakan Builder Kulit Anda dapat membuat tampilan Anda sendiri dengan menghasilkan CSS kulit kustom. PureCSS sudah dilengkapi dengan Normalize.css jadi kita jangan perlu memikirkan ulang CSS kami.


Agar dapat mendeteksi fitur browser tidak mendukung atau tidak mendukung kita gunakan Modernizr. Ketika men-download Modernizr pastikan untuk memeriksa "html5shiv" dan "Media Queries". Dengan cara itu Modernizr sudah dilengkapi dengan dukungan fitur HTML5 untuk dukungan IE dan Media Query dan kami jangan perlu menyertakan skrip terpisah. Jika Anda ingin menggunakan fitur CSS3 dalam proyek web Anda pastikan untuk memeriksa fitur yang diperlukan di bagian CSS3 dari halaman download Modernizr.

Kami telah mencantumkan hanya satu script dan satu file CSS sejauh ini dan sudah diurus Reset CSS, dukungan theHTML5 untuk IE, Media Queries dan dukungan CSS3. Sekarang ada satu lagi script yang saya temukan sangat berguna tetapi terserah kepada proyek Anda apakah Anda menggunakan banyak fitur CSS3 atau tidak. Script saya bicarakan isPrefixFree, sebuah plugin yang mari kita fitur yang Anda useCSS3 tanpa harus menulis semua prefiks untuk browser yang berbeda secara manual. Jadi alih-alih menulis -moz-box-shadow, -webkit-box-shadowand box-shadow Anda akan hanya perlu menulis box-shadow. Jika Anda menggunakan banyak fitur CSS3 kemudian menggunakan script ini mungkin menghemat waktu dan membantu Anda membuat aturan readableCSS jauh lebih baik.


Share on Google Plus

0 komentar:

Untuk Melanjutkan Membaca Silahkan Lengkapi Form Ini