Cara Mengetahui Ukuran Layout Website


Cara Mengetahui Ukuran Layout Website
thumbnail-caption

Cara Mengetahui Ukuran Layout Website,-

Saat membuat sebuah website dari CMS, apapun itu pasti kita menggunakan template (themes) yang sudah dibuatkan oleh orang lain (developer).

Sehingga kita tidak tahu berapa ukuran laytout pada website kita, Atau bahkan ukuran setiap element yang ada di website kita kecuali kita paham mengenai coding CSS, HTML, dan sebagainya.

Apa gunanya mengetahui ukuran layout yang pas dari template kita?

Gunanya adalah supaya ketika browser melakukan compile terhadap code yang dimiliki oleh template kita tidak mengalami “kebingungan”.

Analoginya sama seperti berikut…

Ketika Anda mempunyai frame foto ukuran A4, tapi Anda hendak memasang foto ukuran f4 tentunya tidak pas bukan? sehingga ada yang harus dikorbankan, seperti…

  • Browser akan melakukan fit to size, yaitu memaksa gambar tersebut supaya sama dengan layoutnya
  • Browser memotong gambar tersebut supaya sama dengan wadahnya.

Sayangnya, kedua cara tersebut dapat mengurangi kecepatan website Anda.

Silahkan baca 10 Tips meningkatkan kecepatan website dan optimasi htaccess untuk meningkatkan kecepatan website

Cara Otomatis

Supaya tidak berbelit beli mari kita bahas Cara Mengetahui Ukuran Layout Website…

Sebelumnya, silahkan download plugin/addon firebug (mozilla firefox) atau untuk google chrome silahkan download disini.

Setelah instal plugin tersebut, sekarang saatnya mengoperasikannya. Ikuti langkah langkah berikut :

  1. Aktifkan firebug dengan menekan icon serangga pada kanan atas browser Anda
  2. Pilih Click an element in the page to inspect
  3. Kemudian pilih element/layout yang ingin Anda ketahui ukurannya
  4. Kemudian pilih kolom layout pada kiri bawah browser Anda
  5. Selanjutnya Anda tinggal melihat berapa ukuran yang sebenarnya.

Jika kurang jelas, silahkan lihat gambar berikut :

[su_spoiler title=”Firebug” style=”simple” icon=”arrow”]

firebug
firebug

[/su_spoiler]

Cara Manual

Akan tetapi, Jika Anda tidak meu install firebug tersebut Anda bisa menggunakan cara manual dengan melakukan inspect element. Berikut tahapannya :

  1. Klik kanan pada halaman Anda
  2. Pilih Inspect Element
  3. Kemudian hover cursor Anda pada setiap class yang tersedia
  4. Setelah menemukan class yang Anda cari
  5. Klik dan lihat pada box model di sisi kiri bawah browser Anda

[divider style=”double” top=”5″ bottom=”5″]
[]

Sekian artikel kategori internet mengenai Cara Mengetahui Ukuran Layout Website kali ini, Semoga bisa memberi inspirasi kepada Anda, Terima Kasih.

Jika Ada yang ingin ditambahkan atau ditanyakan silahkan mengisi kolom komentar.

Silahkan Like Fanspage kami dan Share artikel ini Jika Menurut Anda Bermanfaat Untuk Anda dan Orang Lain.


Mungkin Kamu Juga Suka :

What's Your Reaction?

Cute Cute
0
Cute
Cuek Cuek
0
Cuek
Lol Lol
0
Lol
Love Love
0
Love
OMG OMG
0
OMG
Angry Angry
0
Angry
Like Like
0
Like
Dislike Dislike
0
Dislike

Comments 0

Your email address will not be published. Required fields are marked *

log in

Become a part of our community!

Captcha!
Don't have an account?
sign up

reset password

Back to
log in

sign up

Captcha!
Back to
log in
Choose A Format
Personality quiz
Series of questions that intends to reveal something about the personality
Trivia quiz
Series of questions with right and wrong answers that intends to check knowledge
Poll
Voting to make decisions or determine opinions
Story
Formatted Text with Embeds and Visuals
List
The Classic Internet Listicles
Open List
Open List
Ranked List
Ranked List
Meme
Upload your own images to make custom memes
Image
Photo or GIF
Gif
GIF format

Send this to a friend