HTML

新しいブラウザウィンドウでリンク（a href）を開くには、HTMLアンカー要素にもう1つの属性を追加する必要があります（<a> ）つまり、target 属性。 hrefと同じように 属性にはリンクパス値（URL）、targetが必要です リンクをクリックしたときにブラウザが新しいタブを開くようにトリガーするには、属性に特定の値が必要です。この値は_blankと呼ばれます 。 新しいタブの例でリンクを開く： 新しいタブを介してtechstackerのフロントページに移動するリンクは次のとおりです。 Techstacker.comにアクセスします 例のHTMLコード：

HTMLドキュメントでは、Webブラウザによって解釈されないコメントを書き込むことができます。 HTMLファイル内でコメントを使用する目的は、自分自身またはチームのメンバーのために、コードを簡単に文書化（説明）することです。 HTMLドキュメントにコメントを追加するには、開始コメントタグと終了コメントタグを使用します： <！- 次のようなテキストが含まれています： <!-- Here is a comment on a single line --> HTMLコメントは複数行にすることもできます： <!-- Here is a comment. Here is an

リンクとURLの違いは何ですか？それは重要ですか？ リンクとURLの違いは、ウェブページ上のコンテンツへの直接パスを取得することについてカジュアルな会話をしているだけであれば問題ありません。すばらしい記事を仲間の1人と共有しているようなものです。 高い（技術的ではない）レベルから、リンクは特定の場所に移動するクリック可能なユーザーインターフェイスを指します。場所はURLで定義されます。 視覚的に リンクは、テキスト要素、画像、ボタン、またはその他のUI要素で表すことができます。これらはすべてHTMLコードで定義されます（詳細は後で説明します）。 クリック可能で、表面の後ろにURLがある

SEOのフォローリンクとフォローなしリンクの違いを学ぶ SEOを初めて使用する場合は、フォローリンクとフォローリンクなしの違いや、タイプを指定することが重要かどうかについて混乱する可能性があります。 ウェブサイトで使用しているリンクの数。 つまり、Googleやその他の検索エンジンは、ウェブサイトで何が起こっているかに細心の注意を払い、特にリンクスパムに注意を払っています。 リンク、特にインバウンドリンク（バックリンク）は、SERP（検索エンジンの結果ページ）でのランキングを上げるための最も強力なSEO要素の1つです。 スパマー（または詐欺師 ）これを十分に認識しており、検索エンジ

最適なSEOを実現するために、ウェブサイトのページごとに1回だけH1要素/タグを使用する必要がある理由を学びましょう。 Web開発者またはデザイナーが最初に学ぶことの1つは、H1からH6までの6レベルのHTML5の見出し要素です。 初心者として、H1は最も重要な要素であり、メインのタイトルや見出しなど、最も重要な要素に使用する必要があると言われています。次に、そこから下に向かって作業し、コンテンツの小見出しとしてH2、H3、H4などを使用します。 多くの初心者が同じページでH1タグを複数回使用していることに気づきました。これは、そのページの複数のテキスト要素が重要であると彼らが考えてい

フローティングラベルとは何か、フォームデザインでどのように使用されているか、UI/UXデザインでますます人気のあるアセットになっている理由をご覧ください。 フローティングラベルとは何ですか？ これはフローティングラベルです： 上の図を見るだけで、フローティングラベルが優れたUIアセットである理由をすぐに理解できる人もいるかもしれませんが、「フローティングラベル」の概念に慣れていない場合は、次のようになります。 多くのスペースをとらずに、多くの実用的な情報を伝えます。 滑らかなトランジション（「アニメーション」）効果により、フォームがより魅力的になります 従来の静的なフォームよりも、ブラ

UXデザイナーは、プレースホルダーテキストを入力フィールドラベルとして使用しないように警告することがよくありますが、これには正当な理由があります。 下の入力フィールドに入力して、何が起こるかを確認してください： 入力を開始するとすぐにプレースホルダーテキストが消えます。 なぜこの問題なのですか？なぜなら、平均的なメールとパスワードのログインフォームよりも大きなフォームでは、ユーザーは簡単に 入力フィールドのラベル（ここではプレースホルダーテキストが唯一のラベルとして機能します）が入力された直後に表示されない場合、フォームに正しく入力したかどうかについて混乱します。 多くのデザイナ

取り消し線は、関連性がなくなったコンテンツに使用されます。現在割引されている販売アイテムの以前の値札のように： 割引商品 Intel、2TBSSDドライブ $ 249 99ドル 現在非推奨となっているHTML4では、<strike>を使用しました 関連性がなくなったコンテンツにタグを付けます。最新のHTML、つまりHTML5では、短い<s>を使用します。 代わりにタグを付けてください。上記の例の取り消し線は次のようになります。 知っておきたい <s>を混同しないでください <del>のタグ 鬼ごっこ。 <s>

JavaScriptを使用してHTML要素の属性値を変更する方法を学びます。 ウェブサイトにアンカー要素があり、hrefのURLリンクパスに誤りがあるとします。 属性値。 メニュー/ナビゲーションバーに表示されるのはよくあることです： 内部Webページリンクを持つもう1つの一般的な場所は、Webサイトの下部にあるフッターです。 誰かが間違えたとしましょう。あなたのhref 値は/contact-meです ただし、/contact-usである必要があります 、および何らかの理由で、HTMLコードで直接解決することはできません（おそらく、バックエンドに書き込みアクセス権がありません）

JavaScriptを使用してHTML属性を作成および追加する方法を学びます。 あなたがそれをクリックしたときに機能を実行することになっているあなたのウェブサイト上のボタンがあるとしましょう。残念ながら、誰かがボタンにIDまたはクラス値を追加するのを忘れており、現在HTMLマークアップに直接アクセスすることはできません。 幸い、JavaScriptを使用して、属性を作成し、それをボタン要素にアタッチすることができます。 3つのことを行う必要があります： タイプidの属性を作成します 値（名前）を付けます 新しい属性と値をボタン要素に追加します HTMLマークアップ まず、残念な

HTML、CSS、JavaScriptの違いについて学びましょう。 Web開発、特にフロントエンド開発について学び始めると、HTML、CSS、およびJavaScriptは、スキルスタックの3つの最も基本的な要素であると主に見なされます。 HTML、CSS、JavaScriptはすべて同じウェブ開発エコシステムの一部であり、最新のウェブの可能性を最大化するために連携する必要があります。 しかし...HTML、CSS、JavaScriptの違いは何ですか？ HTML ハイパーテキストマークアップ言語の略です。 CSS カスケードスタイルシートの略です JavaScri

開発者が静的Webサイトと動的Webサイトについて話すのをよく耳にしますが、正確にはどういう意味ですか？調べてみましょう！ 純粋な静的サイトとは、プレーンなHTML、CSS、およびJavaScriptコード（通常）を使用してコーディングするWebサイトを指し、PHP、Python、Node.jsなどのサーバー側スクリプト言語は含まれません。静的サイトには、WordPressのような動的CMSとは異なり、従来のバックエンドはありません。 静的サイトは、コンテンツがすべての訪問者に対して同じであるWebサイトとしても定義されます。動的なWebサイトでは、コンテンツは閲覧者によって変わる可能性が

デザインの観点からアンカーリンクを視覚的にスタイリングする方法については多くの意見があります。今日は、さらに重要なことに焦点を当てます。リンクアンカーテキストに名前を付ける方法とその理由。 衝撃的な量のウェブサイトがこれを間違えています、私もこれに罪を犯しています。 Webサイトでクリック可能なリンクを作成するには、リンクパスをHTMLアンカータグでラップします：<a></a> 。アンカータグには、URL（リンクパス）クラス、ID、タイトル、アンカーテキストなどの多くの属性を含めることができます。 アンカーテキスト クリック可能を指します リンクの一部。アンカータ

今日は、HTMLでクリック可能なメールリンクを作成する貴重なスキルを習得する方法を学びます。 真剣に？ HTMLでメールリンクを作成するにはどうすればよいですか？これは1998年ですか？ いいえ、そうは思いません。しかし、真剣に、メールリンクは最も基本的な形式で非常に単純であるため、経験豊富な開発者であっても、メールリンクの書き方を忘れるのは簡単です（有罪です！）。 mailtoリンクとは何ですか？ これはmailtoリンクです。それをクリックすると、コンピュータのデフォルトのメールクライアント（WindowsのOutlookなど）が自動的に起動します。 上記のmailtoリンクを

最も一般的なHTMLビューポートメタ設定を使用する場合、入力要素をクリックすると、iOSデバイスで自動ズームが自動的にトリガーされます。少なくともスマートフォンでは。 SafariとChromeブラウザを使用して、iPhone 4、5、6でこれをテストしました。私の調査によると、すべてのiOSデバイスで同じです。 このHTMLコードは、自動ズーム効果を発生させるものです： しかし、この自動ズーム効果は必ずしも望ましいものではありません。時々それはあなたのウェブアプリの使いやすさを損なうでしょう。それは完全に文脈に依存します。 SafariとChromeの両方でこの効果を無効にするには、

トレーニングロガーに取り組んでいます 過去6か月間のサイドプロジェクトとしてのアプリ。ご想像のとおり、このようなアプリには数値入力が必要です。 コードエディタでオートコンプリートを使用する場合、入力要素のデフォルトのタイプはテキストです： 数値タイプのHTML入力要素は、数値入力のみを受け入れます。この数値入力フィールド内に文字を入力してみてください： できません。 タイプがtextのHTML入力要素 ただし、テキストと数字の両方を受け入れます。このテキスト入力フィールドに数字と文字の両方を入力してみてください： はい、機能します！ アプリで担当者とウェイトの入力を最初に宣言した

この超高速チュートリアルでは、ユーザーが画像やリンクなどの要素にカーソルを合わせたときに、簡単な説明テキスト（ツールチップなど）を表示する方法を学習します。 ツールチップを追加する方法は数秒かかりますHTMLタイトル属性titleを使用するだけです 。 ホバー（要素の上にマウスを置く）にテキストを表示する これは、ルービックキューブの画像の基本的な例です。この画像の上にマウスを移動すると、数秒以内にルービックキューブに関する追加情報がポップアップ表示されます。 上記の画像要素のHTMLマークアップは次のとおりです。 ユーザーがリンク/アンカー要素の上にマウスを移動したときにツールチ

今日は、<video>を使用してMP4ビデオをHTMLにすばやく埋め込む方法を学習します。 エレメント。以下について説明します： ビデオプレーヤーのサイズを調整する方法 動画を自動再生する方法 動画を無限ループにする方法 ほとんどのチュートリアルでは、概念を説明するために小さなビデオにGIFを使用しています。 MP4の方が品質が高く、占有するスペースが少ないことがわかりました。 MP4は、WebMとは異なり、最新のすべてのブラウザで動作し、YouTubeなどのビデオサービスにアップロードすることもできます。 HTML5ビデオ要素を使用した埋め込みビデオ HTMLでMP4ビデ

HTMLタグとHTML要素の違いについて学びます。 多くの開発者は、HTMLタグとHTML要素という用語を同じ意味で使用していますが、同じですか？ 完全ではありません。 タグは、HTML要素を定義するために使用されます。これを行うには、作業しているコンテンツのタイプに一致するHTMLタグ名を開いたり閉じたりしてコンテンツをマーク（ラップ）します。例えば。 <p>Content</p> 。 HTML要素は、コンテンツ+HTMLタグの結果です。 以下はではありません 段落要素： I’m just a piece of a text content right no

HTMLはHTML5と呼ばれることもありますが、同じですか？ はい、いいえ。 HTML（Hypertext Markup Language）は、Webサイトの構築に使用される標準言語であり、90年代初頭にリリースされました。 HTMLバージョン1は1993年にリリースされました HTML2は1995年にリリースされました 1997年1月のHTML3 1997年12月のHTML4 次の17年以上の間、HTML4がHTML標準でしたが、ついに2014年10月に、HTML5がリリースされ、それ以来HTML標準になりました。 HTML5はHTML4に似ていますが、開発者とエンドユーザーの両