外部リンクと内部リンクを作成する

サイトを訪問するとき、私はすべてを明確で理解できるようにしたいと思います、そして私は時々土の設計をしなければならないので、私はこれで少し助けを提供します。 ここでは、 特定のタイプのリンクの指定に関する私の考えを説明します。 このトピックは、初心者のWebデザイナーに最も役立つと思います。

外部リンク


私の意見では、外部リンクは個別のグループに分けられるべきであり、それらはサイトの内部ページまたは内部リンクを指すリンクと並ぶことはできません。 したがって、少なくともユーザーの利便性のために、ユーザーを割り当てる必要があります。 リンクを強調表示する方法はいくつかあります。異なる色で強調表示するか、リンクの横に小さなアイコンを追加します。 それらをより詳細に検討しましょう。

ハイライト。
この場合、色を変えるクラスを追加するだけです。 しかし、コンテンツを追加するユーザーがそれを知らない場合、すぐに問題が発生します-外部リンクの計算方法は? 正規表現を使用して状況を修正できます。

$link_str = preg_replace (
'#\<a(.+?)href=["|\']http://(.+?)["|\'](.+?)>(.+?)\
$link_str = preg_replace (
'#\<a(.+?)href=["|\']http://(.+?)["|\'](.+?)>(.+?)\
<a (. +?) href $link_str = preg_replace (
'#\<a(.+?)href=["|\']http://(.+?)["|\'](.+?)>(.+?)\
["| \'] http: // (. +?) [" $link_str = preg_replace (
'#\<a(.+?)href=["|\']http://(.+?)["|\'](.+?)>(.+?)\
\'] (. +?)> $link_str = preg_replace (
'#\<a(.+?)href=["|\']http://(.+?)["|\'](.+?)>(.+?)\
#is'、
"<a href=\determinedhttp://\\2\> class = \ tastoutsite \> \\ 1 \\ 3> \\ 4"、$ link_str);

この方法の欠点は、サーバー側で機能することですが、私はそれを最もよく見ます
最適。

リンクへのアイコンの追加
ここでは、この手法を1つまたは2つの方法で一度に実装できます。正規表現(関数の2番目の部分にコードイメージを追加する)とJavaScriptを使用することもできます。 jQueryを使用しているので、例を示します。 最初に、正規表現を使用してリンクを描画それらアウトサイトクラスを割り当ててから、jQueryを使用します。

$(".outsite").append(" ");

結果:

必要だと思うなら、 target = "_ blank"を追加できます。

内部リンク


内部リンクを何らかの方法で特定できるサイトはほとんど見ていません。 しかし、この省略はしばしば困難につながります、または、ユーザーは単にこれらのリンクをスキップします。 繰り返しますが、内部リンクを強調表示するには、2つの最適な方法があります。

下線
例を挙げる必要はありませんでした-Artemy Lebedevのスタジオウェブサイトはこれを長い間行ってきました。 確かに、この方法は可能な限りシンプルで簡単です。 、ストロークで下線が引かれているのはまれです。

アイコン
時々それはちょうど必要です:)


PS:また、一般的なリンクはメインのセクストから色で強調表示されることを忘れないでください:)

Source: https://habr.com/ru/post/J22809/


All Articles