HTML Listeleri

 (blog.frankmtaylor.com)
1 puan yazan GN⁺ 1 시간 전 | 1 yorum | WhatsApp'ta paylaş
  • HTML listeleri görsel görünüme göre değil, anlam ve etkileşim biçimine göre seçilmelidir; kontrol, sıralı, açıklama, menü ve sırasız listelere ayrılır
  • Sabit seçenekler için <select>/<option>, önerili giriş için <datalist> uygundur; multiple, optgroup, size, value davranışları ayırt edilmelidir
  • <ol>, sırası değiştiğinde anlamı değişen prosedürler, olaylar ve süreklilikler için kullanılır; reversed yalnızca numaraları ters çevirir, gerçek öğe sırasını değiştirmez
  • <dl>, HTML5 ile tanım listesinin ötesine geçip açıklama listesi olarak genişletildi ve terim-değer, meta veri, JSON hata ayıklama gibi anahtar-değer çiftleri için uygundur
  • <menu>, araç düğmeleri gibi komut listeleri için kullanılır; nav ile anlamı ve izin verilen içeriği farklıdır, diğer genel listeleri ise <ul> üstlenir

Kontrol listeleri: <select>/<option> ve <datalist>

  • Formlarda da kullanıcının etkileşime girdiği listeler oluşturulabilir

  • Sabit seçenekler için <select> ve <option>

    • Kullanıcının yalnızca listedeki öğeleri seçebilmesi gerekiyorsa <select> ve <option> kullanılır
    • Dil listesi örneğinde Select a Language, English, French, Spanish, Portuguese gibi <option> öğeleri <select name="languages"> içine yerleştirilir
    • Varsayılan <select> tam olarak bir seçeneğin seçilmesine izin verir
    • Birden fazla öğe seçtirmek için multiple özniteliği eklenir
      • multiple kullanıldığında listenin görünümü değişir ve tüm seçenekler görünür; kullanıcı Shift veya Cmd + tıklama ile birden fazla öğe seçebilir
      • Gerçek select ve option kullanıldığında, role="listbox" eklenmiş bir liste öğesine aria-multiselectable elle eklemeye gerek kalmadan tarayıcının yerleşik semantiği bunu yönetir

  • İlgili seçenekleri <optgroup> ile gruplandırma

    • Dilleri dil ailelerine göre gruplamak isterseniz seçenek listesi <optgroup> ile gruplanır
    • Örnekte Germanic, Romance, Celtic etiketli <optgroup> öğeleri oluşturulur ve her gruba English, French, Spanish, Portuguese, Irish, Welsh yerleştirilir
    • Belirli bir alt grubu seçilemez yapmak için ilgili <optgroup> öğesine disabled özniteliği eklenir
    • Örnekte Celtic grubuna disabled eklenerek Irish, Welsh içeren grup devre dışı bırakılır

  • Varsayılan HTML özellikleriyle geliştirme

    • Gruplar arasında görsel ayrım gerekiyorsa <select> içinde izin verilen <hr> kullanılabilir
    • size özniteliği bir kerede gösterilecek öğe sayısını kontrol ettiği için uzun listelerde faydalıdır
    • size ile optgroup birlikte kullanıldığında grup etiketleri de görüntü alanından yer kaplar
    • Örnekte <select name="languages" size="4" multiple> içine Germanic, Romance, Celtic, Afroasiatic grupları ve gruplar arasına <hr /> eklenir; ayrıca Hebrew, Arabic de yer alır

Öneri listeleri: <datalist>

  • Kullanıcının mutlaka listeden seçmesi gerekmiyor, sadece liste öneri sunacaksa <datalist> kullanılır
  • <datalist> iki adımda bağlanır
    • Bir <datalist> oluşturulur ve ona bir id verilir
    • Buna karşılık gelen <input> öğesinin list özniteliğine bu id değeri yazılır
  • Dil önerisi örneğinde <datalist id="languages"> içine English, French, Spanish, Portuguese, Irish, Welsh, Hebrew, Arabic seçenekleri konur ve <input name="language" list="languages"> ile giriş alanına bağlanır

  • <option value> davranışı

    • <option> için varsayılan değer, sardığı metindir; value özniteliği varsa bu değer varsayılanı geçersiz kılar ve metin etiket gibi davranır
    • <select> içinde kullanıcı yalnızca metni gördüğü için bu büyük sorun olmaz, ancak <datalist> içinde kullanıcı etiketi görüp seçtikten sonra giriş alanına value yazıldığı için kafa karıştırıcı olabilir
    • Örnekte <option value="cy">Welsh</option> seçildiğinde kullanıcı Welsh görür ama giriş alanına cy gelir
    • <datalist> kullanırken, eklenen değerin etiket değil value olduğu varsayılmalıdır

  • Farklı giriş türleriyle birleştirme

    • <datalist> yalnızca metin seçenekleriyle değil, başka input türleriyle de kullanılabilir
    • Hafta seçimi örneğinde <input type="week" name="week" id="camp-week" min="2026-W2" max="2026-W51" list="preferred-weeks" /> öğesine <datalist id="preferred-weeks"> bağlanır
    • Önerilen haftalar 2026-W22, 2026-W23, 2026-W24, 2026-W25 olarak verilir

  • <input type="range"> ile birlikte kullanma

    • <datalist> yalnızca dize değerlerle sınırlı değildir, sayılarla da çalışır; bu yüzden range girdisi ile birleştirilerek aralığın üzerinde etiketli noktalar oluşturulabilir
    • Bahşiş oranı girdisi örneğinde <input type="range" name="tips" id="tips" min="0" max="50" step="1" list="recommended-tips" /> öğesine <datalist id="recommended-tips"> bağlanır ve 10%, 18%, 30%, 45% etiketleri kullanılır
    • Chrome tabanlı tarayıcılarda @supports (x: attr(x type(percentage))) ile attr() üzerinden label değeri okunur, type() ile değer yüzde olarak tanımlanır ve seçenekler position: absolute ile konumlandırılır
    • Firefox yaklaşımı için @supports not (x: attr(x type(percentage))) kullanılır ve değer ::before ile gösterilir
    • Bu yöntem, tüm tarayıcıların aynı şekilde çalışacağını veya ekranda aynı biçimde görüneceğini garanti etmez

Sıralı listeler: <ol>

  • Belirli bir sırayla okunması gereken öğe kümeleri için <ol> kullanılır
  • Ölçüt, öğelerin yanında sayı görünmesi değil; öğelerin sırası değiştirildiğinde listenin anlamının değişip değişmediğidir
  • <ol> için uygun koleksiyonlar algoritmalar, olay dizileri, artan ya da azalan bir süreklilik üzerindeki öğeler, tarifler ve alfabetik listelerdir
  • Muzlu ekmek tarifi örneğinde fırını önceden ısıtma ve kalıbı yağlama, malzemeleri karıştırma, hamuru dökme, 60 dakika pişirme veya kürdan temiz çıkana kadar pişirme, tel ızgara üzerinde soğutma sırası <ol> ile ifade edilir
  • Alfabetik malzeme listesi de alfabe adlı bir sürekliliği izlediği için <ol> kapsamına girer ve baking soda, bananas, brown sugar, butter, eggs, flour, salt sırasıyla yerleştirilir

  • Sıralı ve sırasız listeleri iç içe kullanma

    • İyi yapılandırılmış bir sıralı liste, tarayıcıda nasıl işlendiğine bakmadan da neyin hangi sırayla olması gerektiğini okuyabilmenizi sağlar
    • Tarif örneğinde üst düzey adımlar için <ol> kullanılır; adım içinde sıranın önemli olmadığı öğeler için <ul>, tekrar sıralı alt adımlar için <ol> iç içe yerleştirilir
    • Yapı, Prepare, Mix, Pour, Bake, Cool üst sırasını korurken; Prepare ve Bake içindeki paralel öğeleri <ul>, Mix ve Cool içindeki prosedürleri <ol> ile gösterir

  • reversed

    • reversed özniteliği, numaralandırma yönünü artandan azalana çevirir
    • Gerçek liste öğelerinin sırasını değiştirmez
    • most to least gibi, çoktan aza gösterilen malzeme ve miktar listelerinde kullanılabilir
    • Örnekte <ol reversed> içine eggs (2), flour (2 cups), bananas (2) (mashed), brown sugar (¾ cup), butter (½ cup), baking soda (1 teaspoon), salt (¼ teaspoon) eklenir

  • JavaScript ile gerçek öğe sırasını ters çevirme

    • Listeyi gerçekten tersine çevirmek için JavaScript ile li alt öğeleri ters sırada yeniden yerleştirilebilir ve reversed özniteliği açılıp kapatılabilir
    • Örnek işlev, list.querySelectorAll('li') sonucunu diziye çevirip .reverse() uygular, sonra list.innerHTML = '' ile boşaltır ve list.append(...children) ile yeniden ekler
    • Sonunda list.toggleAttribute('reversed') çağrılır
    • Örnek olay bağlamasında orderedList.addEventListener('dblclick', (evt) => { reverseList(orderedList) }) ile çift tıklamada ters çevirme yapılır

  • start

    • start özniteliği, tek bir dev liste yerine birden fazla sıralı listeye bölündüğünde numara sürekliliğini korumak için kullanılır
    • Muzlu ekmek tarifi örneğinde Prepare bir ul olarak bırakılırken, Mix için <ol start=2>, Pour için <ol start=5>, Cool için <ol start=7> kullanılarak adım numaraları sürdürülür
    • Arada 6: Bake gibi sırasız listeyle ifade edilen bir bölüm olsa bile, sonrasındaki Cool listesi start=7 ile başlatılarak tüm prosedür boyunca numara akışı korunur

Açıklama listeleri: <dl>, <dt>, <dd>

  • Açıklama listesi (description list), her şeyi zorla ol veya ul içine koymak zorunda kalmamanızı sağlayan bir liste türüdür

  • HTML 4'te tanım listesi

    • HTML 4'te buna description list değil, tanım listesi (definition list) deniyordu ve tanım sunan daha dar bir kullanım alanına odaklanıyordu
    • Yapı, tanımlanacak terim için <dt> ve tanım içeriği için <dd> öğelerinden oluşuyordu; anlamsal olarak doğru kullanım için tanımlanan terim ayrıca <dfn> ile sarılıyordu
    • Örnekte throw, yeet aynı tanıma bağlanırken no cap, bet için ayrı ayrı tanımlar verilir
      <dl>
    <dt><dfn>throw</dfn></dt>
    <dt><dfn>yeet</dfn></dt>
    <dd>Verb. To discard at a high velocity</dd>
    <dt><dfn>no cap</dfn></dt>
    <dd>Interjection. Expresses authenticity and truthfulness, sometimes surprise.</dd>
    <dt><dfn>bet</dfn></dt>
    <dd>Interjection. Expresses agreement and affirmation.</dd>
  </dl>

  • HTML5 ile genişleyen anlam

    • HTML5 ile bu yapı artık yalnızca tanımlarla sınırlı olmayan bir açıklama listesi oldu ve “terim ve değer kümeleri” olduğunda kullanılabilir hale geldi
    • HTML5, ilişkili <dt> ve <dd> öğelerini gruplamak için anlamsız bir sarmalayıcı olarak <div> kullanımına izin verir
    • Tarayıcı motoru örneğinde Chrome, Opera, Brave, Edge, Blink-based browsers altında; Firefox, Tor, Librewolf ise Gecko-based browsers altında gruplanır
      <dl>
    <div class="dl-item">
      <dt>Chrome</dt>
      <dt>Opera</dt>
      <dt>Brave</dt>
      <dt>Edge</dt>
      <dd>Blink-based browsers</dd>
    </div>
    <div class="dl-item">
      <dt>Firefox</dt>
      <dt>Tor</dt>
      <dt>Librewolf</dt>
      <dd>Gecko-based browsers</dd>
    </div>
  </dl>

  • Meta veri ve JSON hata ayıklama

    • Olgular ve etiketlerden oluşan bir dizi söz konusuysa, meta veri gösterimi için açıklama listesi kullanmak uygundur
    • Kullanıcı profili de <dl> içine konabilir; örnekte First Frank, Last Taylor, Age 44, Job Writer, Handle Paceaux öğeleri <dt> ve <dd> çiftleriyle ifade edilir
    • Tek sayfa uygulamalarda JSON hata ayıklama için de açıklama listesi kullanılabilir
    • DebugJson örneğinde nesnedeki her key, value çifti Object.entries(obj) ile gezilir; anahtar <dt><var>...</var></dt>, değer ise <dd><code>...</code></dd> olarak işlenir
    • Değer bir nesne ise ve dizi değilse DebugJson.createDl(value) yeniden çağrılarak iç içe bir <dl> oluşturulur; diğer durumlarda value.toString() sonucu <code> içine yerleştirilir
      const debugJson = new DebugJson({foo: 'bar', arr: ['a', 'b'], car: 1}, '.container')
  debugJson.render();
    • Açıklama listeleri, anahtar-değer çiftleri gereksinimine geniş ölçüde uyar

Menüler: <menu>

  • menu öğesi, komutların bir listesini temsil eder ve içerik gösteriminden çok etkileşimli web'e yakındır
  • menu, zengin metin düzenleyicideki metin düzenleme kontrolleri gibi “araç” niteliğindeki düğme listeleri için uygundur
  • Zengin metin düzenleyici örneğinde Strong, Emphasize, Strike düğmeleri menu içindeki li öğelerine yerleştirilir
  <menu>
    <li><button onclick="strong()">Strong</button></li>
    <li><button onclick="emphasize()">Emphasize</button></li>
    <li><button onclick="strike()">Strike</button></li>
  </menu>
  • HTML spesifikasyonuna göre bu kullanım araç çubuğu (toolbar) amacına yöneliktir ve etkileşimli sayfalarda araç düğmelerinin bulunduğu yerler büyük olasılıkla menu içinde yer alır
  • Video kontrolleri örneği de menu içine girer; button öğelerinde commandfor="vid-123" ve command="--play", --mute, --fullscreen kullanılır
  <div class="player player--video">
    <video source="whatever.mp4" id="vid-123"></video>
    <menu>
      <li><button commandfor="vid-123" command="--play">Play</button></li>
      <li><button commandfor="vid-123" command="--mute">Mute</button></li>
      <li><button commandfor="vid-123" command="--fullscreen">Fullscreen</button></li>
    </menu>
  </div>
  • menu kullanıldığında sırasız bir listeye ayrıca aria-role="menu" eklemeye gerek yoktur

  • li öğesinin yalnızca iki kapsayıcıda bulunduğunu varsaymamak

    • Gezinme içindeki liste öğelerinin sıradan bir liste gibi görünmesini istemiyorsanız, menu li için de aynı işlem uygulanmalıdır
    • Stil dosyasının başında yalnızca nav li değil, menu li de dahil edilerek list-style-type, text-indent, margin sıfırlanır
      nav li,
  menu li {
      list-style-type: none;
      text-indent: 0;
      margin: 0;
  }

  • <nav> ve <menu> farklıdır

    • nav, içine link konmuş bir menu değildir; anlamı ve izin verilen içeriği farklıdır
    • nav, kullanıcıya “bir yere gitmeyle ilgili çeşitli öğeler” sunan anlamsal bir bölüm öğesidir
    • nav, <p>, <h1-6> gibi paragrafları ve başlıkları, ayrıca <ul>, <ol>, <menu> gibi listeleri içerebilir
    • menu ise kullanıcıya “yapabilecekleri şeylerin listesi”ni sunan bir liste öğesidir ve yalnızca liste öğesi olan <li> kabul eder
    • menu ile nav birbirini dışlayan seçenekler değildir; menu, nav içinde yer alabilir ama nav, menu içinde yer alamaz

Sırasız listeler: <ul>

  • ul, diğer liste türleri ve nav ile çözülemeyen geri kalan liste ihtiyaçlarını kapsayan bir genel amaçlı listedir
  • Eski HTML'de sıralı ve sırasız listeler arasındaki fark, numara mı madde imi mi kullanıldığı gibi daha çok görsel bir ayrımdı
  • Günümüzde erişilebilirlik, ekran okuyucular ve arama motoru optimizasyonu dikkate alındığından, görsel gösterimden çok sıranın anlam taşıyıp taşımadığına odaklanmak gerekir
  • Grup üyeleri listesinde sıra önemli değildir; bu nedenle ul uygundur
  <h3>Beatles</h3>
  <ul>
    <li>John Lennon</li>
    <li>Paul McCartney</li>
    <li>Ringo Star</li>
    <li>George Harrison</li>
  </ul>
  • Grup adları listesi de sırasız liste olarak ifade edilebilir
  <ul>
    <li>Beatles</li>
    <li>Rolling Stones</li>
    <li>Van Halen</li>
    <li>Foo Fighters</li>
  </ul>

İlgili okumalar

1 yorum

 
GN⁺ 1 시간 전
Hacker News yorumları

  • Sadece örnekleri test ederek bile datalist'in Mobile Safari'de düzgün çalışmadığı anlaşılıyor.
    Bu kadar büyük bir pazarda uyumluluk sorunu varsa, pratikte kullanmaya değer senaryo neredeyse yok denebilir.

    • İstemediğim ama kesinlikle ihtiyaç duyduğum türden bir gerçeklik tokadı bilgi.

      10 yıldan daha uzun süre önce, arayüzde oldukça agresif bir giriş öneri widget'ı kullanan bir projede çalıştım ve o zamanlar bir jQuery eklentisi kullanmıştık.
      Frontend'deki en karmaşık kısımdı ve aslında o projede jQuery kullanmamızın başlıca sebebiydi.

      Yazıyı okurken, o frontend'i hafif bir minimize JS sürümüyle yeniden yapmak çocuk oyuncağı olur diye düşündüm, ama kullanıcı cihazına benim ortamımı olduğu gibi göndermediğiniz sürece gerçekler öyle değil.
      Yine de bugünlerde HTML spesifikasyonu içinde yer alan özellikler oldukça etkileyici.
      Lisede XHTML okuduğumdan beri spesifikasyondaki değişiklikleri neredeyse hiç takip edemedim; ara sıra nelerin değiştiğine bakmak gerek.
      Ama tarayıcı uyumluluğu o zaman da şimdi de hâlâ baş ağrıtıyor.

    • datalist örneği benim iPhone'umda kesin olarak çalışıyor.
      Yerel iOS klavyesinin üstündeki otomatik tamamlama öneri alanına entegre oluyor.
      Ama tüm önerileri gözden geçirmenin bir yolu yok ve muhtemelen datalist'in amaçlanan kullanım biçimi de bu değil.

      Ancak group için disabled özelliği kesinlikle çalışmıyor.

    • Android'de Firefox'ta da çalışmıyor.

    • İlk işimde, çok uzun zaman önce, Firefox'ta datalist çalışmıyordu ve bu yüzden Firefox desteklenen tarayıcılar listesinden çıkarılmıştı.

      Chrome dışındaki tarayıcıları desteklemek istiyorsanız, bu uzun süredir sorunlu bir özellik.

    • iOS'ta GBoard ile birlikte kullanıldığında düzgün çalışmıyor.

  • optgroup'a disabled özelliği ekleyerek bazı seçenekleri seçilemez yapan örnek Mobile Safari'de bozuk görünüyor.
    Aslında devre dışı kalmıyor ve devre dışı öğeler hâlâ seçilebiliyor.

    • En güncel Safari'de çalışması gerekiyor, yani bozuk olmaktan çok tuhaf bir durumda gibi.

      https://caniuse.com/mdn-html_elements_optgroup_disabled

      Bir Safari bug'ı olma ihtimali yüksek görünüyor.

    • Basit şeylerin ötesinde yerel HTML kullanmanın zor olmasının nedeni bu.
      Yeterince okuyup güvenle böyle bir yazı yazabilecek kadar bilgi sahibi olsanız bile, yorumlarda sonunda tarayıcı ve cihaz kombinasyonlarına göre garip davranışlar, kısıtlamalar ve destek eksikleri yine ortaya çıkıyor.

      div çorbası karşı uçta kalmış bir tercih olabilir, ama en azından garip davranışlar ve sınırlar epey tutarlı ve görünür oluyor.
      Çünkü ya benim yazdığım şeyle ya da framework'ün ürettiği şeyle daha tutarlı biçimde örtüşüyor.

  • Eğlenceli ve kapsamlı bir yazı.

    Ne yazık ki bugünlerde HTML öğrenmeden doğrudan React'e giren geliştiriciler çok ve artık LLM'ler de olduğuna göre, HTML'i hiç öğrenmeme ihtimalleri yüksek.

    Bu yüzden basit HTML'in yeterli olduğu yerlerde bile önce React bileşeni arıyorlar.

    • Bence bunda sorun yok.

      İlk kez XML kullanmak zorunda kaldığımda XML spesifikasyonunu öğrenip çıktıyı kendimiz üretmek zorundaydık.
      Serileştirme kütüphanelerinin fiilen olmadığı dönemlerdi.
      Sonra genç kuşakların XML'i, daha sonra da JSON'ı değişim biçimi olarak kullanıp bunları tamamen öğrenmediklerini gördüm, ama dünyanın sonu gelmedi.

      AJAX da gözde yeni teknolojiden kısaltmanın ne anlama geldiğini kimsenin bilmediği aşamaya geçti; şimdi ise çoğu kişi terimin kendisini bile tanımıyor.
      AJAX ölmedi; sadece o kadar sıradanlaştı ki artık ayrı bir kelimeye ihtiyaç kalmadı.

    • Benim sorunum, 20 yıl önce HTML'i çok derin öğrenmiş olmam ve sonrasında nasıl değişip geliştiğini sadece tesadüfen parça parça öğrenmiş olmam.
      CSS için bu daha da geçerli.

    • Dürüst olmak gerekirse HTML zahmetli.

      Örneğin bir kontrolün bir bölümünü stillendirmeye yönelik HTML tarzı yaklaşım pseudo-class kullanmak oluyor ve bazen seçiciler tarayıcıya göre değişiyor.
      O zaman gerçekten düzgün çalışıp çalışmadığını bilemezsiniz, dolayısıyla tarayıcı bazında test etmeniz gerekir.

      React sadece daha kolay değil, aynı zamanda daha güvenilir.
      React ve div'lerle yapınca tüm tarayıcılarda aynı şekilde çalışacağını varsayabiliyorsunuz.

  • Güzel içerik ama datalist'ten fazla şey beklememek lazım.
    Gerçekten faydalı kullanımlar için bağlantı noktaları yetersiz, bu yüzden küçük prototiplerin ötesine pek uygun değil.

    • Otomatik tamamlama önerileri için datalist kullandım ve gayet iyi çalıştı.
    • Sanırım zamanında datalist ile bir combo box yapmaya çalışmıştım ama pek iyi gitmemişti.

  • HTML linter'larının gerçekten bu farkları ayırt etmeye yardımcı olup olmadığını merak ediyorum.
    Bu tür semantik etiket seçimini zorlayabilen bir linter da var mı, onu da bilmek isterim.

    • Semantik etiketleri zorlamak fikri bana çok anlamlı gelmiyor.
      HTML her şeyden önce yazarın yaratıcı biçimde kullanması için tasarlanmış bir şey ve belirli etiketleri başkalarına göre zorunlu kılmak mantıklı görünmüyor.
      Erişilebilirlik önemli ama zaten yeterince fazla kısıt var.

    • Bildiğim en yakın şey https://github.com/kristoff-it/superhtml#diagnostics.

      SuperHTML yalnızca sözdizimini değil, öğe iç içe geçmesini ve özellik değerlerini de doğruluyor.
      Tüm HTML spesifikasyonunu doğrulama koduna döken başka bir language server yok.

  • Bunu bugün öğrendim.
    Daha fazla framework'ün neden bundan yararlanmadığını merak ediyorum.

    • Kullanıcı deneyimi açısından sıradan bir listeyle aynı şey olduğu için.
      Kodu anlamaya yardımcı oluyorsa kullanılabilir, ama tarayıcının erişilebilirlik ağacı ve diğer her şey açısından sadece sırasız bir liste.

      Bunun bir eylem listesi olduğunu iletmek için ARIA özellikleri eklemeniz gerekir.
      Yazı role=menu'den bahsediyor ama bu tek başına yeterli değil; her öğede ayrıca menuitem rolü de olmalı.
      WAI Authoring Practices Guide rol ve etkileşim beklentilerini açıklar, ama kod örneklerini olduğu gibi kopyalamayın; özellikle gezinme menülerinde bu rolü kullanmayın.

      https://www.w3.org/WAI/ARIA/apg/patterns/menubar/

    • Zeki insanlar zor HTML öğrenmek yerine birkaç div ile hallediyor.

    • Bugünün HTML'inde ilginç özellikler çok.

      İnsanlara bir öğenin ne yaptığını düşündüklerini sormayı seviyorum.
      Ben de ilk başta neredeyse hiçbirini doğru tahmin edememiştim.

  • Birkaç yıldır frontend lead olarak çalışıyorum ama yine de bilmediğim çok faydalı bilgi vardı.
    Şirkette de bunu ciddi biçimde kullanmaya başlayacağız gibi görünüyor.

  • Keşke tasarımcılar varsayılan datalist görünümünü sevseydi.

    • Benim deneyimimde stil özelleştirme eksikliği, yerel HTML özelliklerini kullanmanın önündeki en büyük engel.

  • Blog yazısı gerçekten çok iyi ama blogdaki tüm yazıların listesini tek seferde görmenin bir yolunu bulamıyorum.

    https://blog.frankmtaylor.com/archive olmuyor.

    https://blog.frankmtaylor.com/archives de değil.

    https://blog.frankmtaylor.com/posts da olmuyor.

    https://blog.frankmtaylor.com/all yok.

    https://blog.frankmtaylor.com/blog da değil.

    10 binden fazla yer imi olan insanlar da çok; açıklama ya da tam yazı olmadan, bugüne kadar yazılmış her şeyi listeleyen tek bir liste sayfası olsa gerçekten kullanışlı olurdu.

    • Bahsettiğiniz şey site haritası olabilir mi?
      Çoğu blogda tüm yazıları listeleyen bir sitemap.xml bulunur.

      Ayrıca 235 yazının tamamını neden tek tek gözden geçirmek istediğinizi de merak ediyorum.