# Boy Karşılaştırma — indirebileceğiniz, yan yana bir grafik

Boyları yazın, resmi alın. Onu çizmek için hiçbir şey gönderilmez.

> Boyları yan yana karşılaştırın. Bir erkek, bir kadın, bir erkek çocuk, bir kız çocuk ve nesneler ekleyin — bir kapı, bir pencere, bir beyaz tahta, bir otomat — santimetre ya da fit ve inç cinsinden, sonra grafiği PNG veya SVG olarak indirin. Tarayıcınızda çizilir.

Bu sayfa, tamamen tarayıcınızda çalışan etkileşimli bir araçtır: https://abox.tools/tr/boy-karsilastirma/. Ona verdiğiniz hiçbir şey yüklenmez. Aşağıda, sayfanın bu araç hakkında sözcüklerle söylediği her şey yer alır; kullanmak için adresi açın.

## adlar, boylar ve bunlardan çıkan grafik **asla yüklenmez**. Sunucu yoktur.

Bir boy grafiği aritmetik ve bir çizimdir: gönderilecek bir dosya ve sorulacak bir hizmet yoktur — ve bu sayfanın kabul ettiği tek dosya, cetvele koyacağınız kendi görseliniz, burada okunur ve hiçbir yere gitmez. Erkek, kadın, erkek çocuk ve kız çocuk bu sayfayla birlikte gelen kamu malı çizimlerdir, ve erkek çocuk ile kız çocuk küçültülmüş yetişkinler değil gerçek çocukların çizimleridir — bir aile grafiğinin, kimsenin adını koyamadığı bir biçimde yanlış görünmesini önleyen de tam olarak budur. Bunun her adımı, bu sayfada okuyabileceğiniz birkaç yüz satır JavaScript içinde olup biter. Herhangi bir ağ işlevi hiç yoktur, ve bu burada önemlidir; çünkü yazdığınız şey bir insan listesi ve her birinin boyudur.

- ✗ Yükleme yok
- ✗ Hesap yok
- ✗ Filigran yok
- ✓ Çevrimdışı çalışır
- ✓ Açık kaynak

## Boy karşılaştırma grafiği nasıl yapılır

1. **Önce herkesi ekleyin, nasıl göründüğünü sonra dert edin.** Bir satır bir figür, bir ad, bir boy ve bir renktir. Ad isteğe bağlıdır — boyları üstlerinde yazan iki adsız siluetten oluşan bir grafik çoğu zaman tam da istenendir — ve her satırdaki oklar, sıra önemliyse onu sola ya da sağa taşır.
2. **Boyu nasıl yazıyorsanız öyle yazın.** `173`, `1,73 m`, `5'8"`, `68 in` ve `5 ft 8` hepsi doğru okunur. Kutunun altındaki satır neyin anlaşıldığını her iki sistemde de gösterir; böylece yanlış bir okuma, basıldıktan sonra değil çizilmeden önce görünür. Çıplak bir sayı, metrik bir grafikte santimetre, imperial bir grafikte inçtir; üçün altındaki çıplak bir sayı ise metredir — kimse 1,73 cm boyunda değildir.
3. **Kişiye uyan figürü seçin.** Bir çocuk yaklaşık altı baş boyundadır, bir yetişkin ise yedi buçuk; bu yüzden küçültülmüş bir yetişkin gibi çizilen bir çocuk, adı konması güç ama görülmesi kolay bir biçimde yanlış durur. Erkek çocuk ile kız çocuk, küçültülmüş yetişkinler değil gerçek çocukların çizimleridir, ve bir aile grafiğinin aileye benzemesini sağlayan da çoğunlukla budur. Ayrıca her satır içinde bir boyla gelir, yani birini eklemek birini çizer — üzerine doğrudan yazın.
4. **Grafiğe tanıdık bir şey koyun.** Bir sayı soyuttur, bir kapı boşluğu değil. Herkesin boyutunu bildiği tek bir nesne eklemek — bir kapı, bir pencere, bir sınıf tahtası, bir otomat — iki boyu bildiren bir grafiği, onları gösteren bir grafiğe çeviren şeydir. Menüde bunlardan yirmi tane var, gruplanmış hâlde, ve her biri kendi sayılarınızı üzerine yazabileceğiniz sıradan bir satır olarak gelir. Nesneler yüksekliğin yanı sıra bir genişlik de alır, yani bir kapı bir şerit değil 203'e 81'dir.
5. **Ya da üzerine kendi çiziminizi koyun.** **Kendi görseliniz**, makinenizden bir dosya alır ve onu verdiğiniz boyda cetvele koyar — grafik bir insan yerine bir ürün, bir araç ya da bir bina hakkındayken başvurulacak şey budur. Bir SVG, diğer her figür gibi satırının kendi rengiyle çizilir; bir fotoğraf ya da PNG olduğu gibi konur. İkisi de kendi oranlarını korur, ve ikisi de bir yere gönderilmek yerine burada okunur.
6. **Cetveli okurunuzun düşündüğü birimlere ayarlayın.** Santimetre ile fit arasında geçiş yapmak, kutulardakini yeniden yorumlamak yerine yeniden yazar; böylece grafiğin kendisi kımıldamaz, yalnızca gösterim değişir. Grafik iki okur kitlesi içinse, her figürün üstünde yazan boy grafiğin biriminde olur ve her kutunun altındaki satırda ikisi birden bulunur.
7. **Yapıştırmak için PNG, basmak için SVG.** PNG, belirlediğiniz piksel yüksekliğinde bir resimdir; bir sohbet penceresinin, bir belgenin ya da bir slaytın istediği de budur. SVG ise grafiğin yönerge hâlidir, bu yüzden her boyutta net basılır ve sonradan vektör açan her şeyle yeniden renklendirilebilir.

## Uzun sürüm

[Boy karşılaştırma grafiği nasıl yapılır](https://abox.tools/tr/rehberler/boy-karsilastirma-grafigi-yapma/): Bir boy listesini yan yana bir resme çevirin: boyların nasıl yazılacağı, bir çocuk için hangi figürün seçileceği, tanıdık tek bir nesnenin neden üçüncü bir kişiden daha çok iş gördüğü, ve grafiğin PNG ya da SVG olarak nasıl dışarı çıkarılacağı.

## Kutuda ayrıca

- [Görsel Sıkıştırıcı](https://abox.tools/tr/resim-sikistirma/): Boyutu siz söyleyin, gerisini o hesaplasın.
- [Görsel Boyutlandırıcı](https://abox.tools/tr/resim-boyutlandirma/): Boyutu söyleyin. Kutuyu çizin. Biçimi seçin.
- [HEIC'ten JPG'ye](https://abox.tools/tr/heic-jpg-donusturme/): Bir iPhone'un ürettiği fotoğraflar, her şeyin açtığı bir biçimde.
- [Vesikalık Fotoğraf Yapıcı](https://abox.tools/tr/biyometrik-vesikalik-fotograf/): Ülkeyi seçin. O ülkenin kuralını tam olarak uygular.

## Sorular

### Yazdığım herhangi bir şey bir yere gönderiliyor mu?

Hayır. Grafik bu sayfadaki JavaScript tarafından, kendi cihazınızda çizilir ve bu aracın herhangi bir ağ işlevi hiç yoktur — hiçbir zaman bir şey getirmez ve hiçbir zaman bir şey göndermez. Sayfanın `Content-Security-Policy`'si iletişim kurabileceği her adresi sayar; hiçbiri bize ait değildir. Bunu burada açıkça söylemeye değer, çünkü girdi insanların adlarından ve her birinin boyundan oluşan bir listedir; bu da bu sitenin ele aldığı hemen her şeyden daha özeldir.

### Grafiği indirebilir miyim?

Evet, PNG ya da SVG olarak, filigransız ve hesapsız. PNG belirlediğiniz piksel yüksekliğinde çizilir ve bir belgeye, bir slayta ya da bir sohbete yapıştırılacak olan odur. SVG ise grafiğin piksel değil yönerge hâlidir: her boyutta net basılır ve sonradan herhangi bir vektör düzenleyicide açılıp yeniden renklendirilebilir. İkisi de ekranda duran aynı işaretlemeden yapılır, dolayısıyla hiçbiri önizlemeyle uyuşmazlık edemez.

### Boyu nasıl yazayım — santimetre mi, fit mi?

Hangisi olursa, hangi satırda olursa, normalde nasıl yazıyorsanız öyle. `173`, `173 cm`, `1,73 m`, `5'8"`, `5 ft 8 in` ve `68 in` hepsi anlaşılır, ve kutunun altındaki satır her iki sistemde de neyin okunduğunu gösterir. Çıplak bir sayı, grafik metrikse santimetre, imperial ise inçtir; üçün altındaki çıplak bir sayı metre kabul edilir, çünkü 1,73 cm kimsenin yazacağı bir boy değildir.

### Çocuklar neden küçültülmüş yetişkinlere benzemiyor?

Çünkü bir çocuk öyle değildir. Vücut oranları yaşla değişir: iki yaşındaki bir çocuk kabaca dört buçuk baş boyundadır, sekiz yaşındaki altı, bir yetişkin yedi buçuk — yani baş, küçük bir çocuğun neredeyse dörtte biri, bir yetişkinin ise sekizde biridir. Buradaki erkek çocuk ile kız çocuk, küçültülmüş tek bir siluet değil gerçek çocukların çizimleridir; bir aile grafiğinin farklı boyutlarda dört yetişkin gibi değil de bir aile gibi görünmesinin sebebi budur.

### Figürler nereden geliyor?

Dördü de başkalarının çizimleri, hepsi de kamu malı: erkek pitr'den, kadın Madeleine Price Ball'dan, kız çocuk OpenClipart-Vectors'tan, ve erkek çocuk NIH BioArt kitaplığı için Ryan Kissinger'dan. Her dosya bu sayfayla birlikte `vendor/` içinde yayımlandığı hâliyle gelir, böylece onları asıllarıyla karşılaştırabilirsiniz. Kamu malı hiçbir şey istemez ve asıl mesele budur: çizim, indirdiğiniz bir resmin içinde son bulur ve atıf isteyen bir lisans o zorunluluğu sizin grafiğinize iliştirirdi.

### Grafiğe kendi görselimi koyabilir miyim?

Evet — **Kendi görseliniz**, bir çizim ya da bir fotoğraf alır ve onu yazdığınız boyda cetvele koyar: bir logo, bir kat planı, bir makine parçası, bir araba ya da şeyin kendisinin bir fotoğrafı. Oranları kendine aittir, dolayısıyla doldurulacak bir genişlik yoktur. \
\
Bir **SVG** tek bir düz renkle çizilir, o satırın ayarlandığı renkle, çünkü grafiğin geri kalanı da odur — yani dolu biçimler yerine ince dış hatlardan yapılmış bir çizim leke olarak çıkar, ve bunun için bu yanlış araçtır. Yalnızca *biçimler* tutulur: dosya, yollardan, dikdörtgenlerden ve dairelerden sıfırdan yeniden kurulur, ve ağa ulaşabilecek ne varsa — bağlantılı bir resim, bir stil sayfası, bir yazı tipi, bir betik — geride bırakılır. \
\
Bir **fotoğraf ya da PNG** olduğu gibi konur ve kendi renklerini korur, dolayısıyla satırın rengi yalnızca ona ad verir. Konmadan önce burada yeniden çizilir; bu, grafiğe ne kadar ekleyeceğini sınırlar ve dosyanın üst verisini geride bırakır. Saydamlık korunur, böylece kesilip çıkarılmış bir görsel cetvelde temiz durur — bir fotoğrafsa arka planını da beraberinde getirir, onu önce kırpmak iyi olur. \
\
İki dosyanın hiçbiri hiçbir yere gitmez. Bu iki kez önemlidir, çünkü indirdiğiniz grafik birine gönderebileceğiniz bir dosyadır.

### Neden küçük çocuk ya da bebek yok?

Çünkü kimse birini çizip kamu malı yapmamış. Wikimedia Commons'ta kullanılabilir tek bir özgür çocuk var — kız çocuk — ve NIH BioArt kitaplığında erkek çocuk; okul çağının altında arama boş dönüyor, ve tutarlı her özgür insan seti, her yaşta aynı biçimi taşıyan bir tuvalet piktogramı; ki bu araç bütünüyle o hatadan kaçınmak için var. Bir süre bu sayfanın kendi koduyla çizilen bir küçük çocuk vardı, ve grafikte kimsenin çizmediği tek figür oydu: birinin çizdiği dört figürün yanında bu belli oluyordu. Erkek çocuktan ya da kız çocuktan daha küçük biri için, ikisinden birini gerçek boya ayarlayın — karşılaştırmayı taşıyan cetveldir, ve o doğru olacaktır.

### Bir grafiğe kaç kişi koyabilirim?

On iki. Bu teknik bir sınır değil — çizim seve seve otuz tane yapardı — ama bir düzineyi geçince sütunlar üstlerinde yazan adlardan daha dar olur ve resim okunur olmaktan çıkar. Daha fazlası gerekiyorsa adları kapatmak genişliği size geri verir, ya da iki grafik bunu birinden daha iyi anlatır.

### Grafiğe bir nesne koyabilir miyim?

Evet — ve çoğu çizilmiş olarak gelir. Menüde başlamak için yirmi tane var, dört grup hâlinde: kapılar ve pencereler, okul ve ofis (bir beyaz tahta, bir masa, bir dosya dolabı, bir projeksiyon perdesi), şehirdeki şeyler (bir otomat, bir tekerlekli çöp konteyneri, bir basketbol potası, 20 ft'lik bir deniz konteyneri) ve evdeki şeyler. On yedisi bir resimle gelir — kollu bir kapı, dondurucusu üstte bir buzdolabı, koltuk olduğu belli bir koltuk — ve resim satırdaki yükseklik ile genişliğe oturtulur; dolayısıyla boyutu yine sayılar belirler ve üzerine yazdığınız kendi sayılarınız yine geçerlidir. Kalan üçü sade dikdörtgendir, çünkü onlar için hem doğru hem de oranları doğru bir özgür çizim bulunamadı; ölçek üzerine bir grafikte yanlış bir çizim, dürüst bir bloktan daha kötüdür. \
\
Bunların bir kısmı gerçek standart, bir kısmı olağan ölçüdür; sayfa bunu açıkça söyler. Tanıdık tek bir nesne, bir grafik için ne kadar fazladan insandan daha çoğunu yapar: bir karşılaştırmayı ölçek duygusuna çeviren odur.

### Köpek ya da kedi için bir figür var mı?

Yok, ve bu bir gözden kaçırma değil, bilinçli bir boşluk. İkisi de yapılmıştı — profilden, ayakta, baş omuz hizasında; böylece çizimin tepesi yanında yazan boy olacaktı, ki her ırk standardı bir hayvanı orada ölçer. Yayımlanacak kadar iyi çıkmadılar: önden görünen dört kişinin yanında yandan görünen dört ayaklı bir hayvan, çizim iyi olsa bile bir hata gibi okunuyor. Hayvanın omuz yüksekliğinde bir dikdörtgen, o zamana dek dürüst bir karşılık.

### Grafiği bir bağlantıyla paylaşabilir miyim?

Buradan hayır, ve bu bilinçli. Bunu sunan araçlar, bütün listeyi adrese koyarak yapar; bu da her adın ve her boyun, bağlantının içinden geçtiği her şeye düşmesi demektir — bir sohbet sunucusunun günlükleri, bir posta tarayıcı, birinin tarayıcı geçmişi, bağlantı önizlemesi çeken bir hizmet. Bunun yerine resmi indirip onu gönderin: aynı şeyi söyler ve yanında hiçbir liste taşımaz.

### Ücretsiz mi, ve grafiği ticari olarak kullanabilir miyim?

Ücretsizdir, hesap ve filigran yoktur, ve sonucu bir rapora, bir sunuma, bir ilana ya da bir ürüne koyabilirsiniz. Sitede reklam vardır, masrafı karşılayan da odur. Burada yaptığınız bir grafiğin hiçbir yanı bize ait değildir, ve hiçbir şey saklanmaz.

### Cetvel neden birer birer değil de onar onar?

Çünkü aralık, sabit bir sayıdan değil, resmin kaç çizgi taşıyabileceğinden seçilir. İki yetişkinlik bir grafik her on santimetrede bir çizgi alır; üzerine bir basketbol potası koyun, çizgiler yirmi beşe kayar, çünkü bir resim üzerinde doksan çizgi cetvel değil gri bir bulanıklıktır. Fit ve inçte merdiven bir, üç, altı ve on iki inçtir; böylece çizgiler tam inçlerin yakınına değil üstüne düşer.

### Grafiği koyu bir slayta koyabilir miyim?

Evet. Arka planı üzerinde duracağı renge ayarlayın; cetvel ile yazı ona uyacak biçimde koyu ile açık arasında geçiş yapar — tahminle değil, rengin parlaklığından hesaplanarak. Sonra resmin kendisini saydam istiyorsanız „hiç arka plan yok“ kutusunu işaretleyin: mürekkebe yine seçtiğiniz renk karar verir, yani lacivert bir slayta gidecek saydam bir grafik onun üzerinde okunur çıkar.

### Çevrimdışı çalışır mı?

Evet. Sayfayı bir kez yükleyin, sonra internet bağlantısını kesin; çalışmayı sürdürür. Bu aynı zamanda hiçbir şeyin yüklenmediğini kanıtlamanın en basit yoludur: listenizi grafik çizdirmek üzere gönderen bir araç, fişi çektiğiniz anda dururdu.

## Gizlilik iddiası nasıl doğrulanabilir

- **Bir insan listesi teslim edilecek küçük bir şey değildir.** Boy grafiklerinin çoğu hesap ister, istemeyenlerin ise yazdığınız her adı ve her sayıyı gören bir sunucusu yine de vardır. Burada yazdığınız şey ailenizde kimlerin olduğu ve her birinin ne kadar uzun olduğudur; çoğu zaman adın yanındaki figürden bir çocuğun yaşı da anlaşılır. Bunların hiçbiri hiçbir yere gönderilmez, çünkü burada gidebileceği bir yer yoktur.
- **Burada hiçbir şey bir şey getirmez.** `src/` içinde hiçbir yerde ne bir `fetch`, ne bir `XMLHttpRequest`, ne de bir `sendBeacon` vardır. Content-Security-Policy, bu sayfanın iletişim kurabileceği her adresi tek tek sayar ve bunların hiçbiri bize ait değildir.
- **İki ziyaret arasında da hiçbir şey hatırlanmaz.** Grafik sayfada yaşar, başka hiçbir yerde değil. Sekmeyi kapatın, liste gitmiştir: onu tutan bir hesap, taşıyan bir çerez ve bu tarayıcının deposuna yazılmış hiçbir şey yoktur — saklamak istediğiniz bir grafiğin indirdiğiniz bir grafik olmasının sebebi de budur.
- **Bağlantı grafiği taşımaz.** Bunun gibi birçok araç, paylaşılabilsin diye bütün listeyi adres çubuğuna koyar; bu da her adı ve her boyu, bağlantının uğradığı her şeyin kaydettiği bir şeye dönüştürür — bir sohbet sunucusu, bir posta tarayıcı, birinin tarayıcı geçmişi. Bu sayfanın adresi siz yazarken hiç değişmez.
- **PNG, ekranda duran SVG'den yapılır.** İndirme, önizlemeyle uyuşmayabilecek ikinci bir çizim değildir. Aynı işaretleme tarayıcıya verilip bir tuvale boyanır; bu, ağ fişi çekiliyken de yapılabilmesinin sebebidir: getirilecek bir yazı tipi ve içine yüklenecek bir görsel yoktur.
- **Eklediğiniz bir görsel burada okunur, ve asla gönderilmez.** Dosya bu sayfadan hiç çıkmaz — tarayıcının kendi `FileReader`'ıyla okunur ve hiçbir şey çalıştırmayan ölü bir belgeye ayrıştırılır. Çizilen şey o dosya değildir: `src/import-svg.js`, biçimlerden ve geometriden oluşan bir beyaz listeden YENİ bir çizim kurar; böylece bir betik, bir stil sayfası, bir yazı tipi, bağlantılı bir resim ya da başka bir belgeye yapılan atıf, taşınmak yerine geride bırakılır. Bu iki kez önemlidir, çünkü indirdiğiniz grafik başkalarına gönderdiğiniz bir dosyadır: sağ kalan herhangi bir şey, günler sonra, bu sayfanın yazdığı bir şeyden onların tarayıcısının bir yabancının sunucusunu çağırması olurdu. Bir fotoğraf ya da PNG bir program değildir ve yeniden kurulacak hiçbir şeyi yoktur: onu tarayıcının kendi çözücüsü okur, ve grafiğe konmadan önce burada bir tuvale yeniden çizilir. Dosyanın üst verisini — kamerayı, yeri, profili, içinde ne varsa — geride bırakan da bu yeniden çizmedir; çünkü bunların hiçbiri bir tuvalden sağ çıkmaz. Grafiğe giren şey bu sayfanın kodladığı bir görseldir, adres olarak değil veri olarak yazılır, dolayısıyla grafik yine hiçbir yeri göstermez.
- **Çizimler burada, getirilmiyor.** Dört figürün dördü de kamu malı çizimlerdir ve sayfanın geri kalanıyla birlikte bu kaynaktan sunulur — simge yazı tipi yok, CDN yok, siz yazarken başkasının sunucusundan çekilen bir sprite sayfası yok. Grafiğin ağ fişi çekiliyken de çizilmesinin sebebi de budur.
- **Google'ın yüklediği ve kendisine verilmeyen şeyler.** Reklam ve ölçüm betikleri Google'dan, bağış düğmesi ise Buy Me a Coffee'den gelir. Hiçbirine bir ad ya da bir boy verilmez. Listenizi bir resme çeviren her satır bu kaynaktan sunulur ve depoda listelenmiştir.
- **Çevrimdışı çalışır.** Ağ bağlantısını kesin, araç hiç değişmez; çünkü içinde zaten hiç ağ adımı olmadı. Bundan daha basit bir kanıt yoktur.

**Kendiniz kontrol edin.** Yukarıdakilerin hiçbirine güvenmeniz gerekmez. Bu sayfa, depodaki şablonlardan ve yapılandırmadan, okuyup kendiniz çalıştırabileceğiniz bir derleme betiği tarafından üretilir ve sonuç `dist` dalına işlenir — yani sunulan şeyi kaynakların bir derlemesinin ürettiğiyle karşılaştırabilirsiniz: https://github.com/A-Box-of-Tools/website

Önce okunmaya değer dosyalar, Content-Security-Policy için `config/site.toml`, dört figür ve çizimlerinin nereden geldiği için `src/traced.js` ile `vendor/`, menünün kurulduğu liste için `src/figures.js`, yazılan bir boyun nasıl sayıya döndüğü ve cetvelin nasıl etiketlendiği için `src/units.js`, yerleşim için `src/chart.js`, iki indirme için `src/save.js` — ki bunlar ekrandaki SVG ile aynı SVG'nin bir tuvale boyanmış hâlidir — ve eklenen bir SVG'nin kendisinden yeniden kurulduğu beyaz liste için `src/import-svg.js`, yani buradaki, yanlış olmasının önem taşıyacağı tek dosya.