<br />今日、新しくなった ChinaUI.com の Web サイトを見たのですが、ますます美しくなっていると思います。この変化は確かにかなり大きいです。朝にちょっと見て閉じました。夕方にもう一度開けてみると、問題が見つかりました。つまり、デザインの幅の関係でタイトルが完全に表示されず、プログラムで文字を切り取っているようです。多くのサイトがこのような状況に遭遇したことがあると思います。視覚効果のために、ウェブサイト全体の視覚効果に合わせてテキストを切り詰める必要があります。通常、切り捨てには 2 つの方法を使用します。1 つは、バックグラウンドで出力するときに、事前に特定の文字数を設定する方法です。もう 1 つの方法は、CSS または JS を使用して、出力された完全なコンテンツを視覚的にクリップすることです。 Web ページの標準が登場する前は、基本的に最初の方法がこの問題を解決するために使用されており、現在でも広く使用されています。この方法の利点は、正確に単語数をカットできることですが、バックグラウンドでカット作業が完了しているため、出力される内容が不完全になるという欠点があります。 2 つ目は、CSS または JS を使用して作成された巧妙な手法です。一定の長さを超えるコンテンツを非表示にします。望ましい視覚効果を実現するために、完全なデータ コンテンツを保持できるという利点があります。欠点は、IE 以外のブラウザーでキャプチャされたテキストが完全ではない可能性があることです。たとえば、Firefox では単語の半分が切り取られるという厄介な現象がよく発生します。 私が聞きたい質問は、「タイトルの不完全さは、ユーザーのクリック意欲に影響しますか?」ということです。あえて言うなら、タイトルの不完全さは、ユーザーが情報をクリックする意欲に大きく影響します。ここでは、Youai.com のニュースの見出しを使用して分析します。ウェブサイトには「アメリカが衝撃を与える新しいユーザーインターフェース技術を発明」というニュースの見出しがありますが、これは機械的に切り取られた見出しです。このようなタイトルを見ると、好奇心が掻き立てられるでしょうか? もちろん、それは可能です。しかし、私たちの理解はこうかもしれません。「米国がユーザーインターフェースの新しい技術を発明し、それを自慢している...これはフェイクニュースです。おそらく2つの企業が自慢しているのでしょう。」もしそうなら、私はこの種のゴシップニュースには興味がありません。しかし、完全なタイトルは「米国は、息を吹きかけることでコンピューターを操作できる新しいユーザーインターフェース技術を発明した」であるべきです。私はそのようなタイトルのほうが興味深いです。なぜ息を吹きかけることでコンピューターを操作できるのかを知りたいのです。これは私が今まで考えたことのないことです。こうすれば、このニュースをクリックして見ることに非常に興味を持つようになります。比較してみると、実は「吹き飛ばし操作」が私たちの好奇心を最も掻き立てるものであることがわかります。これが新しい技術の核心です。これもこのニュースの核心的な内容です。 もちろん、切り捨てが必要な場合もあります。そうしないと、Web サイト全体が乱雑に見えてしまいます。現在一般的な解決策は、リンクに「title」属性を追加することです。意味が不明瞭なタイトルに遭遇した場合、私は通常、マウスを移動してプロンプト領域のテキストを表示し、より完全なタイトル情報を取得します。これは、ニュースをクリックするかどうかを決定するのに役立ちます。しかし残念なことに、Youai.com のタイトル リンクの title 属性はタイトル コンテンツと同じであるため、title 属性の重要性が大幅に低下します。 デザインする際には、もちろんタイトルをできるだけ完全に表示するように努めます。特別な理由によりタイトルを完全に表示できない場合は、title 属性をできるだけ完全にする必要があります。また、Firefox では CSS の切り捨てに欠陥がありますが、それでも切り捨ては CSS で行うべきだと私は考えています。少なくともこの方法では、完全な HTML 情報ドキュメントを取得できます。少なくとも、CSS がなくても完全な情報コンテンツを見ることができます。 |
.imgbox{ 幅: 1200ピクセル; 高さ: 612px; 右マージン: 自動; 左マージン...
1. Linux .NET Core の紹介Microsoft は常に自社のプラットフォームに対して...
今回はHTML+CSSレイアウトを使用して、TG-vision Shuanghui Mediaのホー...
背景:場合によっては、json データをページに直接表示する必要があります (たとえば、インターフェ...
問題の説明フロントエンドリモート検索やファジークエリと呼ばれる種類のクエリがあります。 Ele.me...
目次落とし穴充填方法何の穴ですか?要約する落とし穴最近、仕事で商品の割引価格を計算すると、いつも1セ...
背景:最近、同社のプロジェクトは同時実行のプレッシャーに耐えられないようなので、最適化が差し迫ってい...
ソフィー・ハルダッククライドキー埠頭 37 東ソープボックス Rxバランス EEハーバー対比 SVN...
序文エージェントの役割は何ですか? - 複数のドメイン名が同じサーバーに解決される- 1つのサーバー...
導入MySQL スロー クエリ ログは、問題のある SQL ステートメントのトラブルシューティングや...
目次1. LAN内のプロキシ2. イントラネットの浸透イントラネット侵入とは何ですか?橋プロキシサー...
目次PagodaをインストールするPythonランタイム環境を構成するPythonをインストールする...
Zabbix 導入ドキュメントzabbix導入後zabbixエージェントの操作1. MySQLを監視...
Reactのdiffアルゴリズムの理解diffアルゴリズムは、 Virtual DOMの変更された部...
最近、実践的なトレーニング プロジェクトを実行する際に ssm フレームワークを使用しました。プロジ...