Blok Düzenleyici: Yeni WordPress Erişilebilirlik Özelliklerini Keşfedin

Yayınlanan: 2021-10-22
Ayarlar kenar çubuğunu ve blok yerleştiriciyi gösteren WordPress blok düzenleyicisinin bir resmi

Kaynak: Themeisle

Web içeriği yönetimini tartışırken, WordPress akla gelir. 2021'de tüm web sitelerinin yüzde 40'ına güç veren WordPress, içerik yönetim sistemlerinin (CMS) kralıdır. Popülerliğine rağmen, platformun sorunları var. WordPress'in eski sürümleri, medya açısından zengin sayfalar oluşturmayı zorlaştırdı, bir WYSIWYG deneyimi sağlamadı ve ekran okuyucu dostu değildi.

WordPress geliştirme ekibi, düzenleme deneyimini daha erişilebilir ve kullanıcı dostu hale getirmek için Aralık 2018'de blok düzenleyiciyi tanıttı. Gutenberg olarak da bilinen WordPress blok düzenleyici, lansmanından bu yana herkesin kullanabileceği bir platform haline getirmek için muazzam değişiklikler geçirdi. Bu yazıda Gutenberg'in nasıl çalıştığını açıklayacağım ve yeni erişilebilirlik özelliklerinde size yol göstereceğim.

Gutenberg Editörü nedir?

Gutenberg, TinyMCE düzenleyicisini varsayılan WordPress düzenleyicisi olarak değiştirdi. İstemiyorsan Gutenberg kullanmak zorunda değilsin. WordPress, hala eski tarz CMS'yi tercih eden kullanıcılar için indirip yükleyebilecekleri klasik bir editör eklentisi sunar. Eski seçeneğin mevcut olmasına rağmen, WordPress kullanıcılarının yüzde 46'sından fazlası yeni blok düzenleyiciye geçti.

Yeni Gutenberg editörü, web içeriği oluşturmaya tamamen farklı bir yaklaşım sağlayan modern teknolojilerle oluşturulmuştur. WordPress blok düzenleyici, web içeriği geliştirmek için eklentiler ve özel kod kullanmak yerine, web sayfaları oluşturmak ve tasarlamak için bloklara güvenir. Bu bloklar, çok fazla teknik bilgi olmadan multimedya ağırlıklı sayfalar geliştirmenize olanak tanır.

Gutenberg Editörü Nasıl Çalışır?

Artık Gutenberg'in blok tabanlı bir düzenleyici olduğunu bildiğinize göre, muhtemelen blok düzenleyicilerin nasıl çalıştığını merak ediyorsunuzdur. Yeni WordPress düzenleyicisi temelde bir sürükle ve bırak içerik düzenleyicisidir. Bir web sayfası oluşturmak için serbest metin, eklenen medya ve kısa kodlar kullanmak yerine, farklı içerik türlerini kolayca oluşturmak, yeniden konumlandırmak ve stil vermek için sezgisel bileşenleri/blokları kullanabilirsiniz.

Gutenberg, çeşitli içerik türleri için bir dizi özel blok sunar. Bu bloklardan bazıları şunlardır:

  • Metin
  • resim
  • Video
  • Ses
  • Alıntı yapmak
  • sütunlar
  • Liste
  • Dosya

Üst araç çubuğundan bu bloklardan birini seçtikten sonra, bileşenin içine içerik eklemeye başlarsınız. Her blok ayrı bir varlık olduğundan, her bloğu beğeninize göre şekillendirebilir ve benzersiz bir sayfa düzeni oluşturmak için düzenleyicide herhangi bir yere sürükleyebilirsiniz. WordPress blok düzenleyici, özelleştirilmiş içerik oluşturmak için size daha fazla kontrol, esneklik ve erişilebilirlik sağlar.

Blok Düzenleyicinin Erişilebilirlik Özellikleri

Bloklar arasında nasıl gezinileceğini gösteren WordPress blok düzenleyicisi

Kaynak: WordPress Eklentileri – Gezinmeyi Engelle

Modüler blok yaklaşımı ve sürükle ve bırak işlevine ek olarak, Gutenberg düzenleyici, düzenleme deneyimini geliştirmek için birçok başka kullanılabilirlik ve erişilebilirlik özelliği sunar. Bu yeni özellikler, WordPress'in ekran okuyucu kullanıcıları da dahil olmak üzere herkes için kullanımını kolaylaştırıyor. Aşağıda Gutenberg'in yeni erişilebilirlik özelliklerini tartışacağım ve bunların nasıl kullanılacağına ilişkin talimatlar vereceğim.

Not: Windows veya Linux sistemi kullanıyorsanız, aşağıda verilen talimatlar için lütfen ⌘ yerine CTRL ve ⌥ yerine ALT kullanın.

Klavye Navigasyonu

WordPress'in eski sürümleriyle ilgili en büyük sorunlardan biri, ekran okuyucu kullanıcıları tarafından erişilememeleriydi. 7,6 milyondan fazla Amerikalı yetişkin görme engellidir ve web içeriğine erişmek için ekran okuyucular gibi yardımcı teknolojiler kullanır. WordPress'i görme engelli kullanıcılar için erişilebilir kılmak için blok düzenleyici, 2019'da Gezinme modunu tanıttı.

Gezinme modu, WordPress'i yalnızca ekran okuyucu kullanıcıları için erişilebilir kılmakla kalmaz, aynı zamanda platformun genel kullanılabilirliğini de geliştirir. Bu yeni erişilebilirlik özelliği, kullanıcıların Sekme ve ok tuşlarını kullanarak düzenleyicide hızla gezinmesine olanak tanır. İstediğiniz bloğa ulaşmak için kısayolları kullanmak, büyük içerik parçalarıyla etkileşime girme ihtiyacını ortadan kaldırarak zamandan tasarruf etmenize yardımcı olur.

İçerik oluşturmayı daha verimli bir süreç haline getirmek için aşağıdaki WordPress blok düzenleyici klavye gezinme ipuçlarını kullanın:

İç İçe Bloklar Arasında Gezin

Tonlarca içerik arasında gezinmeden bir ebeveyn veya alt/iç içe bloğa erişmek istiyorsanız, Gezinme modundan yararlanmalısınız. Navigasyon modunun en son sürümü, kullanıcıların üst bloktan alt bloklara ve alt bloklara ve alt bloklar arasında hareket etmesine olanak tanır. Navigasyon moduna geçmek için bir blok seçin ve ardından ESC tuşuna basın.

Blok düzenleyiciniz gezinme moduna girdikten sonra şunu kullanın:

  • Aynı seviyede gezinmek için YUKARI veya AŞAĞI ok tuşu
  • Yuvalanmış bir düzeye gitmek için SOL ok tuşu
  • Yuvalanmış düzeyden çıkmak için SAĞ ok tuşu

Seçilen bloğu başka bir konuma taşımak istiyorsanız, yeni konumu onaylamak için ENTER veya SPACE tuşlarını kullanın.

Blokları Farklı Düzeyler Arasında Taşı

Blokların nasıl taşınacağını gösteren WordPress Blok düzenleyicisi

Kaynak: WordPress

Gelecekte daha fazla blok yuvalamayı destekleyeceğinden, blokları farklı seviyeler arasında nasıl taşıyacağınızı öğrenmek, mizanpajları daha hızlı tasarlamanıza yardımcı olabilir. Gutenberg'de bir bloğu yeniden konumlandırmanın en kolay yollarından biri, kes ⌘X ve yapıştır ⌘V yöntemini kullanmaktır. Buna ek olarak, blok düzenleyici, klavyenizi kullanarak blokları taşımanıza izin veren başka bir özellik sunar.

Blokları bir ana bloğun içine ve dışına taşımak istiyorsanız, blok araç çubuğunun sonundaki Seçenekler öğesine tıklayın ve ardından menüden Taşı öğesini seçin. Bloğunuzu düzenleyicide herhangi bir yere taşımak için aşağıdaki tuşları kullanın:

  • Bloğu aynı seviyede hareket ettirmek için YUKARI veya AŞAĞI ok tuşu
  • Bloğu bir seviye yukarı taşımak için SOL ok tuşu
  • Bloğu bir seviye aşağı taşımak için SAĞ ok tuşu

İstediğiniz konuma ulaştığınızda, bloğu yeni konumuna sabitlemek için ENTER veya SPACE tuşunu kullanın.

Klavye kısayolları

WordPress blok düzenleyici, çalışma hızını artırmak ve üretkenliğinizi artırmak için birkaç yeni klavye kısayolu sunar. Bu kısayollar, bilgisayar işlerini halletmek için fare yerine klavye komutlarına güvendikleri için ekran okuyucu kullanıcıları için de vazgeçilmez bir araçtır. Yeni WordPress'i daha erişilebilir ve verimli hale getiren bazı kullanışlı klavye kısayolları:

Blokları Sayfada Yukarı ve Aşağı Taşı

Blok düzenleyicinin en iyi yeni özelliklerinden biri olan bu klavye kısayolu, blokları sayfada yukarı ve aşağı hızlı bir şekilde taşımak için harikadır. Bu özellik, seçili bloklardan önce veya sonra yeni bir blok ekleyen mevcut bir kısayola benzediği için size tanıdık gelebilir. Hem yeni hem de mevcut blokları taşımak için aşağıdaki klavye komutlarını kullanabilirsiniz.

Yeni bir blok konumlandırmak için düzenleyicide mevcut bir blok seçin ve ardından şunu kullanın:

  • ⌥⌘T: Seçilen bloğun üzerine yeni bir blok eklemek için
  • ⌥⌘Y: Seçilen bloğun altına yeni bir blok eklemek için

Mevcut blokları taşımak için klavye kısayolları, yukarıdakilere benzer. sadece eklerler

YUKARI ok tuşuna komut dizisine gidin. Mevcut bir bloğu yeniden konumlandırmak için bloğu seçin ve ardından şunu kullanın:

  • ↑⌥⌘T: Seçilen bloğu/blokları yukarı taşımak için
  • ↑⌥⌘Y: Seçilen blok(lar)ı aşağı taşımak için

Tam Ekran Moduna Girin

Tam ekran modunda WordPress blok düzenleyici

Kaynak: ManageWP

Blok düzenleyicideki bu yeni klavye kısayollarına bayılacaksınız. Tam ekran moduna geçmek ve ayarlar kenar çubuğunu gizlemek için yeni işlevler, işinize daha iyi odaklanmanıza yardımcı olmak için ekran alanını genişletir. Bu yeni kısayollar, düzenleyicinin kenar çubuklarını ve diğer ayrık alanlarını ortadan kaldırarak, ekran okuyucu kullanıcıları için içerikte gezinme ve düzenleme karmaşıklığını da azaltır.

  • ↑⌥⌘F: Sizi tam ekran moduna götürür
  • ↑⌘,: Ayarlar kenar çubuğunu gizler

Kullanılabilirlik İyileştirmeleri

Bir platformun kullanılabilirliğini artırmak, onu çeşitli yeteneklere sahip insanlar için daha erişilebilir hale getirir. Bir platformun kullanımını kolaylaştırabilecek etkili bir strateji, aynı şeyi yapmanın birden çok yolunu etkinleştirmektir. WordPress blok düzenleyici, işin yapılmasının önündeki engelleri azaltmak için birçok yeni kullanılabilirlik geliştirmesi sağlar ve böylece tüm kullanıcılar için düzenleme deneyimini basitleştirmeye yardımcı olur.

Gutenberg'i herkesin kullanmasını daha keyifli hale getiren bazı kullanılabilirlik güncellemeleri:

Liste görünümü

Liste Görünümü, blok düzenleyicide gezinmeyi ve blokları seçmeyi kolaylaştırmak için sürekli olarak geliştirilmekte olan mevcut bir işlevselliktir. Bu kullanılabilirlik özelliği Gutenberg'in üst araç çubuğunda bulunur ve sayfada kullanılan tüm blokların bir anahat listesini görüntüler. Liste öğelerine basit bir tıklama ile düzenleyicideki herhangi bir bloğa atlayabilirsiniz.

Liste Görünümü'nün eski sürümleri, varsayılan olarak iç içe blokları daralttı, bu da alt bloklara erişmeyi daha hantal hale getirdi. Son kullanılabilirlik güncellemeleri, blokların listede görünme şeklini iyileştiriyor. Yeni ve geliştirilmiş Liste Görünümü artık tüm iç içe blokları üst bloklarının içinde gösteriyor ve yeniden kullanılabilir blokları genel adları yerine özel adlarına göre gösteriyor.

Liste Görünümünü blok düzenleyicide açmak için üst araç çubuğunda üç yatay çizgili düğmeyi seçin veya ^⌥ O klavye kısayolunu kullanın.

Galeta unu

Gutenberg blok tabanlı bir düzenleyici olduğundan, WordPress platformun kullanılabilirliğini geliştirmek için bloklara erişmenin birden çok yolunu sunar. Liste Görünümü gibi, içerik kırıntıları, farklı düzeylerde iç içe geçmiş bloklara erişmeyi kolaylaştırmak için tasarlanmış başka bir kullanılabilirlik özelliğidir. Bu yeni özellik, Sütunlar veya Grup blokları gibi derinlemesine iç içe bloklarla çalışırken kullanışlı olabilir.

Peki, WordPress blok düzenleyicide kırıntı özelliğini nasıl kullanabilirsiniz? Editörün sonraki bölümlerinde hızla gezinmenizi sağlayan bu ^⌥ N klavye kısayolunu kullanın. Sayfanın sol alt köşesinde blok içerik haritası çubuğunu göreceğiniz düzenleyicinin sonuna ulaşana kadar blokları gözden geçirmek için bu kısayolu kullanmaya devam edin.

Araç Çubuğu Düğmeleri için Metin Etiketleri

Birçok kullanıcı simgeleri belirsiz ve ezberlenmesi zor buluyor. Simgeler yerine metin etiketlerini tercih edenler arasındaysanız, blok düzenleyici bunu sizin için kapsıyor. WordPress, kullanıcıların araç çubuğundaki tüm simge düğmelerini metin etiketlerine değiştirmesine olanak tanıyan yeni bir kullanılabilirlik özelliği sundu. Bu yeni işlev, birçok kullanıcının ihtiyaç duydukları araçları daha verimli bir şekilde bulmasına yardımcı olabilir.

Araç çubuğu simgelerini metin etiketleriyle değiştirmek istiyorsanız, yapmanız gerekenler burada.

  1. Seçenekler menüsüne tıklayın (üst araç çubuğunun en sağında bulunur)
  2. Tercihleri Seçin
  3. Görünüm bölümünde, Düğme Etiketlerini Görüntüle'ye tıklayın.

Blok Yerleştiricinin Davranışını Değiştirin

Blok yerleştirici ⏤ aynı anda birden fazla bloğa göz atmak ve eklemek için bir panel ⏤ WordPress blok düzenleyicisine yeni bir ektir. Verimliliği artırmak için tasarlanan bu özelliğin ilk sürümü, aslında kullanıcıların iş akışını bozuyordu. Panel, bir blok eklendikten sonra kapanacaktı ve bu da kullanıcıları daha fazla blok eklemek için paneli yeniden açmaya zorladı.

Neyse ki, WordPress topluluğu bir araya geldi ve bu sorunu çözdü. Blok yerleştiricinin en son sürümü artık bir blok eklendikten sonra açık kalır ve böylece kullanıcıların aynı anda birden fazla blok eklemesine izin verir. Blok yerleştirici ile işiniz bittiğinde, paneli kapatmak için bir klavye komutu var.

Bu yeni üretkenlik aracından yararlanmak için bu klavye kısayollarını kullanın:

  • ENTER veya SPACE: Bir blok ekler, ancak yerleştiriciyi açık bırakır
  • ⌘+Enter: Bir blok ekler, yerleştiriciyi kapatır ve odağı ekleme noktasına döndürür
  • ESC: Yerleştiriciyi blok eklemeden kapatır

Koalisyon Teknolojileri ile WordPress Sitenizi Geliştirin

Blok düzenleyici, birçok erişilebilirlik ve kullanılabilirlik sorunuyla kaba bir yama üzerinde başladı. Ancak Gutenberg, ilk lansmanından bu yana çok yol kat etti. Açık kaynak topluluğu, CMS'yi yükseltmek için çok çalıştı ve WordPress'in herkes için bir platform haline gelebilmesi için iyileştirmeler yapmaya devam edecek.

WordPress web siteleri geliştirme konusunda daha fazla yardıma ihtiyacınız varsa, Coalition Technologies size yardımcı olabilir. WordPress'te neredeyse on yıllık tasarım deneyimi ve geliştirilen 200'den fazla siteyle, son derece ilgi çekici WordPress siteleri oluşturmak için ihtiyacınız olan uzmanlığa sahibiz. Çevrimiçi varlığınızı nasıl iyileştirebileceğimizi öğrenmek için şimdi bizimle iletişime geçin.