Elementor 3.16 - 速度の向上、多用途なデザイン、アクセシビリティの向上

Rifat Elementor Oct 16, 2023

最新リリースの Elementor 3.16 には、Web 開発者とサイト所有者向けにいくつかの注目すべき機能強化が導入されています。デフォルトでは、Flexbox コンテナがすべての新しい Web サイトでアクティブ化されるようになり、パフォーマンスと設計の柔軟性が大幅に向上します。この更新では、強化された「要素間のギャップ」コントロールも導入され、ユーザーが Flexbox コンテナを操作する際の柔軟性がさらに高まりました。

このバージョンの主な改善点の 1 つは、ウィジェット パネル内のフレックスボックス ウィジェットとグリッド コンテナ ウィジェットが明確に区別されたことです。この差別化により、コンテナの種類ごとに個別のウィジェットが作成され、設計プロセスが合理化され、全体的なユーザー エクスペリエンスが向上します。

さらに、サイト訪問者は、最初のバイトまでの時間 (TTFB) メトリクスの最適化により、読み込み時間が大幅に短縮されるという恩恵を受けることができます。このアップデートではアクセシビリティにも重点が置かれており、スクリーン リーダーやその他の支援技術を利用するユーザーにとって、より包括的なエクスペリエンスが保証されます。

特に、メニュー ウィジェットとタブ ウィジェットは重要なインフラストラクチャの更新を受けており、将来のリリースで高度な機能を実装するための準備が整っています。これらの改善により、Elementor 3.16 は新規 Web サイトと既存 Web サイトの両方にとって価値のあるアップグレードとなります。

素晴らしいウェブサイトを作成します

最高の無料ページビルダーElementor を使用

今すぐ始める

デザインの自由度を最大限に引き出す: 新しい Web サイトで Flexbox コンテナを有効にする

Flexbox コンテナは、その名にふさわしい、驚くべき柔軟性を提供します。これらにより、デザイナーはピクセルが完璧なだけでなく、パフォーマンスと応答性の高い Web サイトを作成することができます。 Flexbox コンテナは、正確な配置オプションを備えているため、コンテナ内でアイテムを配置および配布するタスクを簡素化し、柔軟なレイアウトを簡単に作成できます。たとえば、見出し、画像、およびテキスト エディター ウィジェットを 1 つのコンテナーに配置する機能を考えてみましょう。さらに素晴らしいのは、さまざまな画面サイズに対して個別のフレックス方向を設定できる機能で、デバイスに基づいて要素をシームレスに並べ替えることができます。

さらに、Flexbox コンテナにはネストされたウィジェットのサポートが装備されており、カルーセル、メニュー、タブ、およびアコーディオン ウィジェットのコンテンツ領域内にウィジェットを配置できます。アコーディオン ウィジェットを使用して複雑なレイアウトを構築し、ある項目には問い合わせフォームを、別の項目には Google マップ ウィジェットを組み込む可能性を検討してください。

この点での重要な進歩は、このバージョンの時点で、Flexbox コンテナがすべての新しい Web サイトで自動的に有効になることです。この変更は、セクションと列を使用して構築された既存のサイトには影響せず、引き続き使用できます。ただし、新しい設計機能を最大限に活用するには、コンテナーを採用することを強くお勧めします。新しい Web サイトの作成に着手し、セクションと列を使い続けるつもりの場合は、Flexbox コンテナー機能を無効にするオプションがあります。ただし、これは、ネストされた機能を持つ機能やウィジェットにアクセスできなくなることを意味します。

Flexbox コンテナをアクティブ化すると、コンテナに適合した人気のセクションベースのキットや、まったく新しいデザイン オプションを含む、コンテナ ベースのキットとテンプレートへのアクセスもロック解除されます。逆に、セクションベースのキットとテンプレートを使い続けたい場合は、Flexbox コンテナ機能を無効にするだけです。

アップグレードされたギャップ制御

最新のアップデートでは、開発者は用語を簡素化することでユーザー インターフェイスを合理化しました。以前は「要素間のギャップ」として知られていたコントロールは、現在は単に「ギャップ」と呼ばれています。この変更により、ユーザーはその目的を理解しやすくなります。さらに、コンテナ内の要素間のギャップを調整する方法が大幅に強化されました。

以前は 1 つの範囲コントロールで機能していましたが、現在は 2 つの異なる数値入力 (水平方向のギャップ用と垂直方向のギャップ用) が表示されるようになりました。この変更により、各要素の位置を最高の精度で微調整できるため、精度の世界が開かれます。一様なギャップがあった時代は終わりました。水平方向と垂直方向のギャップに異なる値を柔軟に設定して、デザインを完璧に調整できるようになりました。

もう 1 つの魅力的な機能は、これらのギャップを定義する単位をカスタマイズできることです。ピクセル、パーセンテージ、EM、REM、または VW のいずれを好む場合でも、設計要件に従ってギャップを設定できます。プロジェクトを目立たせるために必要な創造的な自由とコントロールを提供することがすべてです。

グリッドコンテナウィジェット

Web デザインとレイアウト管理の領域では、グリッド コンテナーが強力なツールとして登場し、単一のグリッド状の囲い内で複雑な複数要素の配置を作成する手段を提供します。最新のイテレーションでは、ウィジェット パネル内でグリッド コンテナに独自の存在を与える機能強化が導入されています。この新たな統合により、ユーザーはグリッド コンテナに直接アクセスできる利便性が得られ、Flexbox コンテナをドラッグし、その後そのタイプを変更するという複雑なプロセスに頼る必要がなくなりました。

ユーザーの利便性を考慮してワークフローが合理化されました。ユーザーが Flexbox コンテナをエディタに挿入すると、システムはそのコンテナをシームレスにインスタンス化しますが、グリッド コンテナの導入により、グリッド レイアウトが即座に表示されます。ただし、この柔軟性は単なる最初の選択を超えて拡張されることに注意することが重要です。ユーザーは、[レイアウト] セクション内の [コンテナ レイアウト] ドロップダウン メニューを介して、いずれかのコンテナ タイプを代替コンテナに変換することができます。このような適応性により、設計者は創造的な自由を持ってレイアウトを仕様に正確に合わせることができます。

TTFBによるより速い加速

人気の WordPress ページ ビルダーである Elementor の最新アップデートでは、サイトの読み込み時間の大幅な改善が約束されています。 2023 年 9 月 21 日木曜日にリリースされたバージョン 3.16 では、ページの複雑さに応じて、無料の Elementor Core を使用しているサイトでは最初のバイトまでの時間 (TTFB) が 5 ~ 20%、Elementor Pro を使用しているサイトでは最大 40% 向上します。 。このアップデートでは、これまでよりも迅速にコンテンツを配信することで、サイト訪問者に高速かつスムーズなエクスペリエンスを提供します。

Elementor エディター内の表示条件を変更することで、フロントエンドのパフォーマンスが大幅に向上しました。 Elementor がエディター インターフェイスでコンテンツをレンダリングする方法に対するこれらの変更は、サイトがデータの最初のバイトをユーザーに送信する速度を測定するための重要な指標である TTFB の強化につながります。 Elementor はエディターを合理化することで、ビルダーの人気を高めた豊富なデザイン機能をすべて提供しながら、サイトがコンテンツをより迅速に配信できるようにします。

アクセシビリティの向上

人気の WordPress ページビルダー Elementor の最新リリースには、Web サイトのアクセシビリティと包括性に関するいくつかの注目すべき改善が含まれています。 2023 年 9 月 21 日木曜日の発表によると、バージョン 3.16 では、スクリーン リーダーやその他の支援技術を使用する訪問者がサイト コンテンツにアクセスしやすくなります。

たとえば、複数の要素とリンクを含むアイコン ボックスやイメージ ボックスなどのウィジェットが強化されました。スクリーン リーダーがこれらのウィジェットをスキャンするとき、同じリンクを重複して繰り返すのではなく、それぞれの一意のリンクを 1 回だけ読み取るようになりました。この更新により、スクリーン リーダー ユーザーが重複した情報で時間を無駄にすることがなくなります。

投稿ウィジェットもアクセシビリティのためにアップグレードされました。スクリーン リーダーは、このウィジェット内の投稿タイトルのみに焦点を当て、「続きを読む」CTA や注目の画像の代替テキストなどの不要な追加コンテンツを無視します。このように読書体験を合理化することで、視覚障害のある訪問者が支援技術を使って投稿を閲覧する場合のサイト アクセシビリティが向上します。

全体として、Elementor に対するこれらの思慮深い改善により、クリエイターは、能力に関係なく、すべてのユーザーにとってより包括的で楽しい Web サイトを構築できるようになります。この機能強化により、スクリーン リーダーやその他の支援技術を利用する訪問者にサイト コンテンツが効率的かつ効果的に配信されるようになります。

メニューとタブのウィジェットを更新

Elementor の最新リリースには、メニューとタブのウィジェットを駆動するインフラストラクチャに対する内部的な改善が含まれています。 2023 年 9 月 21 日木曜日の発表によると、バージョン 3.16 ではこれらのウィジェットが更新され、すべての画面サイズでメニュー項目とタブ タイトルの統一コードが生成されます。

このアップグレードにより、以前のバージョンでこれらのウィジェットに応答性の設定を適用するときに発生する可能性のある重複コードが排除されます。バックエンドのコードベースを統合することで、将来的にこれらのウィジェットに高度な機能を実装するための道も開かれます。

コーディングの強化に加えて、メニューとタブのウィジェットが全体的にアクセスしやすくなりました。ただし、タイトル コードを統一すると、過去にカスタム CSS がタイトルに適用されていた場合、既存のウィジェットのデザインが壊れる可能性があります。

これらの一般的に使用されるウィジェットの改善は、コア ウィジェットを最新の状態に保つという Elementor の取り組みを示しています。この変更により、開発者はカスタム CSS を再確認する必要があるかもしれませんが、今後のより優れた応答性の動作とアクセシビリティのための基礎が築かれます。ほとんどのユーザーにとって、更新はシームレスであり、画面サイズを問わずエクスペリエンスが向上するはずです。

まとめ

全体として、この最新バージョンは、より高速で応答性が高く、アクセスしやすい Web サイトの作成において大きな進歩を示しています。 Elementor はコア機能の改良を続けるため、開発者はコンテナの可能性を解き放ち、パフォーマンスを向上させ、アクセシビリティを向上させるためにアップグレードを検討する必要があります。人気のページ ビルダーに追加されたこれらの最先端の機能を検討することで、サイトを最先端のデザインに保ちながら、すべての訪問者に優れたエクスペリエンスを提供することができます。

Divi WordPress Theme