Web “Sumringah” dengan Optimasi Script dan Gambar

1 Desember 10

Pernah mendesain website yang banyak gambar? Pernah dicoba dengan internet berkoneksi siput? Apa hasilnya? Hahaha.. website akan terbuka dalam itungan menit bukan detik lagi. Yup, sebagai desainer web jangan hanya berpikiran kalao website kita cantik dengan sejuta gambar yang manis dan ciamik. Memang sih saat kita develop pake localhost ya aman-aman saja, namun setelah diupload ke hosting.. alamak website baru kebuka dalam waktu 1 atau 2 menit. Saya memiliki beberapa tips yang sering saya gunakan, antara lain:

  1. Hindari pake header yang full gambar
    Sering sekali saya melihat website (portal) dengan kepala atau header full image malahan kadang-kadang pake file swf. Selain sudah ketinggalan jaman, hal tersebut sangat membebani proses load website. Kalo bisa pake logo kecil saja dan nama website bisa dengan tag h1 atau h2, kalo memang font untuk nama website itu unik ya sudah pake saja @font-face saja.
  2. Hindari menggunkan background gambar gede
    Jika website anda menginginkan background berwarna ada tiga kemungkinan kondisi:

    • Full warna
      Jika hanya membutuhkan full warna bisa dengan background-color saja dan memilih warna, bisa rgb, rgba, heksadesimal maupun nama warna (misal:white,red,black,)
    • Warna gradasi ke samping
      Jika membutuhkan warna gradasi kesamping tak harus menggunakan gambar full tapi bisa gambar sepanjang body dan setinggi 1px saja dan diulang ke bawah (repeat-y).
    • Warna gradasi ke bawah
      Jika membutuhkan warna gradasi kesamping tak harus menggunakan gambar full tapi bisa gambar setinggi body dan selebar 1px saja dan diulang ke samping(repeat-x).
  3. Minimalisasi gambar berekstensi JPG
    Gambar berekstensi JPG biasa lebih besar ukuran filenya dibanding dengan gif walaupun dengan dimensi yang sama. Jadi penggunaan gambar gif dan optimalisasi dengan photoshop bisa memperingan load website anda.
  4. Kurangi memanggil lead/menu berupa image.
    Banyak website menggunakan judul menu dengan gambar dengan alasan akan banyak variasi saat di hover,active maupun selected. Ini tidak salah namun jika sembrono dalam mengolahan gambar akan membuat website menjadi lemot. Solusinya adalah dengan membuat menu dari tag biasa misalkan h2,h3 atau lainnya, dengan kemampuan CSS3 tag-tag tersebut bisa dipercantik salah satunya dengan text-shadhow.
  5. Optimalisai script
    Ini adalah bagian yang tidak kalah penting, menghindari banyak looping dan meminimalisasi query adalah hal yang harus diperhatikan, dan ini memang perlu keahlihan dalam pengalaman dan trooblesooting script dan deadlink.
  6. Test kinerja website dengan “Inspect Element”
    Gunakan browser Chrome lalu klik kanan dan klik “Inspect Element” untuk melihat berapa besar source yang Anda panggil setiap satu halaman website anda terbuka, usahakan masih di bawah 100 Kb, pokoknya semakin kecil semakin baik.

Ok.. selamat mencoba. Semoga lekas sembuh ! 😀

23 responses to “Web “Sumringah” dengan Optimasi Script dan Gambar”

  1. Hi there it’s me, I am also visiting this web site on a
    regular basis, this website is genuinely pleasant and the
    visitors are genuinely sharing good thoughts.

  2. 東京自由行 mengatakan:

    Hello there! This post could not be written much better!
    Looking at this post reminds me of my previous roommate!
    He always kept talking about this. I’ll forward this information to him.
    Pretty sure he will have a very good read. Thank you
    for sharing!

  3. Several meridians run the five Yin organs of the U.

    If you forbidden city know a headache everyday or he’ll go somewhere else.
    In traditional Chinese medicine, or a cosmetic course of action either simply because they require.
    You may be able to tell you that the digestive process.

  4. It dog training felt like I said the appetite for historical romance was Caroline Green’s Dark Ride 6.
    The covers were pulled up to? That was just grateful it hadn’t happened.

    It’s also implicated dog training in all truth.
    I couldn’t handle, I don’t seem to be consistent in this kind
    of primer for paranormal activity.

  5. Velda mengatakan:

    each time i used to read smaller articles which as well clear their motive,
    and that is also happening with this post which I am reading
    here.

    Here is my blog post google.ca (Velda)

  6. Rene mengatakan:

    Hello to all, how is all, I think every one is getting more from this site, and your views are fastidious in favor of new visitors. http://moourl.com/wod1h

  7. Greetings from Ohio! I’m bored at work so I decided to browse your website on my iphone during lunch break.
    I really like the info you present here and can’t wait to take a look when I get home.
    I’m surprised at how fast your blog loaded on my
    cell phone .. I’m not even using WIFI, just 3G ..
    Anyhow, good blog!

  8. dog trainer mengatakan:

    I do believe all of the concepts you’ve offered in your post.
    They are very convincing and will definitely work. Still, the
    posts are very short for beginners. May just you please prolong them a little from next time?

    Thanks for the post.

  9. great puppies galore mengatakan:

    Normally I don’t read adticle on blogs, but I would like to say that this write-up very compelled me to check out and do it!
    Your writing style has bren amzed me. Thank you, quijte great post.

  10. This piece of writing will help the internet users for creating new web site or even a weblog
    from start to end.

  11. logo mengatakan:

    ” (if you know a bit about yoga yourself) or “I’ve never
    tried yoga, would you recommend it. Not only will
    you be capable to avail of the many advantages of yoga, you will also help
    save a considerable volume of income. You should also ensure that your yoga apparel
    is made from comfortable materials such as cotton that will absorb sweat and also not cause itching.

  12. BestSeller mengatakan:

    danielpipes. Davide Boni.Che invece si è rivelato una moneta vincente?Il sindaco di centro sinistra ha fornito anche la sua definizione di allerta: “Vuol dire che non ci deve essere nessuno per strada o in auto nelle zone esondabili. quelle se classe encore numéro 1 des charts US en 2011 avec le titre Moves like Jagger. anche i ceti meno abbienti”. il conna? vive comunque una partita strana e diversa dal solito,les au cinéma. la Federazione Italiana Sport Equestri.

  13. Nike Free Run 2 mengatakan:

    amicizia maschile ?fatta di elementi anche loro un po? La chanteuse américaine était accompagnée de sa sur. pi?efficiente e duraturo. si nasconde niente meno che Angelo Gaja, déclare-t-elle avant que son intervieweur lui dise quelle a lair très bien dans sa peau.il talento creato Secondo fonti sindacali,Piccardo era subito intervenuto spiegando che “?improprio emettere un verdetto giuridico di tipo islamico sostenendo che ?un peccato votare per noi i possessori di Nintendo 3DS potranno scambiarsi contenuti e commenti, Non ?un caso che da qualche tempo lo stato americano della California lo ha messo al bando dai menu dei ristoranti e dagli scaffali delle delikatessen, e i Beni culturali in generale, sembra scomparsa.

  14. auto skola beograd mengatakan:

    Before leaving your place and heading out to a
    new destination, always make sure to check first if your car’s driving lights
    are properly functioning. Driving school in Sydney helps you in the best possible way:.
    The intricacies of driving, including learning the multitude of vehicle controls as well as
    spatial awareness and general road sense, can leave many with a sense of being overwhelmed.

  15. I don’t know if it’s just me or if everyone else encountering problems with your site.

    It seems like some of the written text on your content are running off the screen. Can somebody else please provide
    feedback and let me know if this is happening to them too?
    This could be a issue with my browser because I’ve had this happen previously.
    Many thanks

  16. staracki dom mengatakan:

    Training is provided to help employees improve their levels of efficiency and this is rewarded with promotion or a bonus in recognition of their
    efforts. Dental hygienist occupations require the successful completion of the written National Board Dental Hygiene Examination and
    of the regional or state clinical board examination before a degreed candidate is allowed to practice
    the profession. What options are there to avoid moving a parent to nursing home care.

  17. key gens mengatakan:

    Unquestionably imagine that that you stated. Your favourite justification appeared to be
    at the internet the simplest factor to take into account of.

    I say to you, I certainly get irked even as folks think about concerns that they just don’t recognise
    about. You managed to hit the nail upon the top as smartly as outlined out the
    entire thing without having side effect , people can take a signal.

    Will probably be back to get more. Thank you

  18. What’s up, this weekend is nice designed
    for me, because this occasion i am reading this fantastic educational post here at my residence.

  19. dentists in my area mengatakan:

    Hi, its nice post concerning media print, we all understrand media is a impressive source
    of data.

  20. Happy Luke mengatakan:

    Have you ever thought about adding a little bit
    more than just your articles? I mean, what you say is important and everything.

    However think of if you added some great graphics or
    videos to give your posts more, “pop”! Your content
    is excellent but with pics and video clips, this website could definitely be one of the greatest in its niche.

    Good blog!

  21. txts mengatakan:

    Very good info. Lucky me I ran across your website by accident (stumbleupon).
    I’ve bookmarked it for later!

  22. adultfrienddinder mengatakan:

    Great site you have got here.. It’s hard to find excellent writing like yours nowadays.

    I seriously appreciate individuals like you! Take care!!

  23. Hey there, I think your website might be having browser compatibility issues.
    When I look at your blog site in Safari, it looks fine but
    when opening in Internet Explorer, it has some overlapping.

    I just wanted to give you a quick heads up! Other then that, excellent blog!

Tinggalkan Balasan