HTML404を作成します! エラー Webページ

ユーザーがwebサイトにアクセスできない理由はたくさんあります。 これらのうちの1つは404として知られています！ エラー。 簡単にHTML404！ エラーメッセージは、サーバーが要求されたwebサイトを見つけることができなかったことを示すHypertext Transfer Protocol(HTTP)ステータスコードです。 つまり、webブラウザはサーバーに接続できますが、アクセスしようとしている特定のページには到達できません。 このチュートリアルでは、訪問者がそこに着陸したときに表示されるものをカスタマイズするために、HTML404エラー webページを構築します。 私たちは、さらにページを強化するために、同様にいくつかのCSSを使用します。

エラー

なぜ404！ HTMLエラーが表示されます

HTTP404が画面に表示されると、サーバーは到達可能ですが、探している特定のページは表示されないことを意味します。 Webページが壊れているか、存在しなくなりました。 404エラーコードは、使用しているブラウザの種類に関係なく、どのブラウザにも表示されます。

HTTP404コードを取得する理由はいくつかあります:

• エラー404メッセージの典型的なトリガーの1つは、ページがwebサイトから削除されたときです。
• ページが別のURLに移動され、リダイレクトが正しく行われませんでした。
• 間違ったURLアドレスを入力しました。
• 非常にまれに発生しますが、サーバーが誤動作することがあります。
• 入力されたドメイン名はもう存在しません。

残念ながら、ページが削除または移動された後、壊れたリンクが長時間残っていることがよくあります。 Web所有者がwebサイトを維持している場合でも、所有者がサイトを削除したり、サイトの名前を変更したりすることがあります。 これは、誰かが”古い”リンクをクリックすると、そのサイトを見つけることができなくなることを意味します。 残念なことに、多くの人々が場所中のwebサイトへのURLを入れているため、最終的には実際にどこにもリンクしていないリンクがあります。

ウェブサイトの所有者は、外部リンクを定期的にチェックしないことが一般的であり、ユーザーはデッドリンクにアクセスしようとします。 このため、Webメンテナンスは不可欠です。

“ページが見つかりません”HTML Webページを作成します

あなたのウェブサイトへの訪問者が古いと存在しないwebページに到達した場合、そのwebサイトをホス サーバーに当たり障りのないデフォルトのエラーページを表示させる代わりに、独自のエラーページを作成して、必要に応じて創造的にすることができます。

私たちは私たちのチュートリアルのステップ一つにジャンプしてみましょう。

ステップ1:HTMLランディングWebページを作成する

単純に基本的なHTMLページを作成することから始めましょう。 これは、より刺激的で有益な404を作成するための基盤になります！ 訪問者が着陸するためのエラー webページ。

テキストエディタを開き、ファイルを”shorelinesurfteam.html”と以下のHTMLコードを入れます。 完了したら、ファイルを再度保存します。

この”存在しない”ページに上陸した人を支援するために、あなたは正しい道にそれらを導くためにいくつかの有用な情報を追加することができます。 おそらく、ページがもう存在しない理由についていくつかの情報を追加します。 このようなものをHTMLに追加します。 次のコードを自由にコピーして、htmlファイルを再保存してください。

次の図は、ページをより有益にするために追加したテキストを示しています。

テキストフォントをパンチアップするには、私たちはスタイルを追加してみましょう。 次のコードをコピーし、HTMLファイルを再保存します。

画像を参照するHTMLを追加して、必要に応じて画像を追加し、テキストの色をカスタム16進数の色に変更します。 画像はルートディレクトリにも配置できます。

ステップ2：HTML404を使用するようにサーバーに指示します！ エラーページ

“を作成します。htaccess”ファイル。 このテキストファイルは、サーバーに命令を渡す目的で使用されます。

すでにあるかもしれません。あなたのwebホスティングスペースのルートフォルダ内のhtaccessファイル。 存在する場合は、それをダウンロードし、それを修正します。 隠しファイルである可能性があります。 その場合は、このファイルを表示できるようにサーバー設定を調整する必要がある場合があります。

この中に”.htaccess”ファイルこの行を追加する必要があります:

これはあなたが追加する必要があるすべてです。 HTMLコードを追加する必要はありません。

これは、404エラーが発生したときにshorelinesurfteamをロードする必要があることをサーバーに伝えることです。ルートフォルダ内のhtmlファイル。

ステップ3：保存します。htaccessファイルをルートディレクトリ

に保存します。htaccess”ファイルをアップロードし、webサイトのルートフォルダにアップロードします。 サーバーが見つからないエラーが発生すると、エラーページが表示されます。

これで、訪問者がwebページを見つけたとき（上記のコードに従って）

これを見る代わりに:

作成した次のより有益でわかりやすいエラーページが表示されます。

緑のテキストをより目立つようにするには、次のように色の背景を持つdiv要素を追加できます:

これにより、次のような結果が得られます:

今、あなたはあなたの空想、有益な404を作成するために好きなように芸術的にすることができます。htmlページ。 常に彼らの経験を強化するために心の中でページへの訪問者を保ちます。

テキストを強化する方法についてはHTMLフォントファミリを参照し、WEBページの背景を強化する方法についてはCSS Background Tutorialを参照してください。

次はどこへ？

この404ページエラーの紹介は、webページ管理とHTMLが提供する無制限の創造的な側面についてのさらなる調査の出発点を提供する必要があります。 次のブログでは、HTMLデザインの他の分野を探索することができます。 インスピレーションを受け続け、さらに探求し、webデザインの世界に深く潜ります。

今日のプログラミング入門に登録してください！

学習開始