ウェブサイトマスターの為の覚書きウェブサイトマスターの為の覚書きウェブサイトの運営をしていて気のついたこと、発見したことなどの記録です。2016.12.08ウェブサイトは基本的には「HTML」という言語でテキストファイルを作ります。そのテキストファイルをウェブ閲覧ソフトの「ウェブブラウザ」で開くと、ホームページとか言われるビジュアルなページとして見ることが出来ます。目次htmlファイルをとりあえず作ってみるウェブサイトの構造はすべて同じウェブサイトを作る時の約束事~htmlの記述ウェブサイトを作る時の約束事~headとbodyの記述htmlファイルをとりあえず作ってみる「HTML」という言語で作るテキストファイルは簡単に作れます。有名な「ホームページビルダー」とか、アフィリエイトサイト作成ツールとして有名な「シリウス」などの専用ソフトを使う必要はありません。誰でも持っているパソコンに最初から入っているアプリケーションで作ることができます。そのアプリケーションは・・・Windowsアクセサリーの「メモ帳」とか「ワードパッド」です。このアプリは文字(テキスト)ファイルを作る「テキストエディター」の一種です。htmlファイルを作ってみましょう。メモ帳を開いて『マイホームページ』と文字を打ちこみます。『マイホームページ』の前後に「<html>」と「</html>」を入れることによって、このファイルは「htmlファイル」になります。保存する際には「****.html」というファイル名にします。ここでは「test.html」としてみます。ローカルのフォルダに「test.html」を保存します。Chrome」にしていますので、ファイルのアイコンはChromeのアイコンになっています。ローカルフォルダに保存した「test.html」をブラウザで開くと、ウェブサイトのように見ることができます。ウェブサイトの構造はすべて同じhtmlファイルをブラウザで閲覧するというこのサイトの構造は基本的にすべて同じです。FacebookやTwitterなどのSNSサイトも同じです。ユーザーが投稿したりコメントしたりするフォームに入力したテキストは、SNSのシステム内でコンテンツとして組み込まれHTML化されて出力されます。ウェブサイトを作るということは、htmlファイルを作ることということを覚えておいて下さい。次にhtmlファイルを作る時に必ずやっておかなければいけない約束事について説明します。htmlファイルの最初と最後に「<html>と</html>」を入れることはもうご存知だと思いますが、HTML言語にはバージョンがあり、現在使われているバージョンの中で最も新しいのが「HTML5」です。現在インターネットで私たちが閲覧するウェブサイトは次の3つのバージョンのどれかを使用しています。HTML4.01XHTML1.0HTML5そこで、htmlファイルの一番最初に「doctype宣言」というものをします。『html言語のバージョンは○○○○です』という宣言です。html>「doctype宣言」の次に<html>を入力しファイルの最後に</html>を入れます。ウェブサイトを作る時の約束事~headとbodyの記述htmlファイルにはウェブブラウザでサイトの内容として見ることの出来ない部分があります。外部デザインファイルへのリンクだとか、モバイル端末への対応方法だとか、サイトのコンテンツ以外の重要なことを記述する部分を「head」と言います。実際にコンテンツとして見ることの出来る部分を「body」と言います。<head>~</head><body>~</body>を1セットにして1ページが出来上がります。検索ページからのリンクでページを開くと「404エラー」と表示されることがよくあります。指定したURLのページが見つからない時に表示されるステータスコードは404です。同じようにページが表示できない時に表示される「410エラー」があります...2017.05.28デザインCodePenを使ってCSSをマスターするとサイトのデザインが自由にできるWordPressのテーマにはそれぞれテンプレートがあり、好みのテーマを使ってサイト作りをしているわけですが、デザイン的な要素をもっと自分好みにしたいという思いは、慣れてくるに従い強くなってきます。同一ジャンルで複数のサイトを運営してきましたが、一つのサイトが突出してきたので、内部回遊率アップによるPV大幅アップを期待して、サイトを統合してコンテンツを集中させることにしました。2018.03.28デザインCSS3で見出しなどのブロック要素をカスタマイズしてみたCSS3では画像を使わずに視覚的要素に装飾を加えることができます。見出しの文字に影をつけたり背景にグラデーションをつけたり、見出しの枠に影をつけることもできます。コピペで使えるコードを掲載していますので、ご自由に使って下さい。SiteOrigin」は投稿記事や固定ページのデザインを自由に組み立てることができるプラグインです。通常の記事投稿とは異なり勝手が違う部分もありますが、慣れるとおもしろそうです。2017.03.02デザイン最低限覚えておきたいウェブ関係のプログラミング言語の種類ウェブサイトのコンテンツ作成や、WordPressのカスタマイズをやる分には、先ほど上げた「HTMLとかCSS」さえ知っていれば何とかなるものですが、ウェブの世界は奥が深く、いろんなソースコードを使いこなそうとすると、知らないプログラミング言語に出会ったりします。コメントをキャンセルメールアドレスが公開されることはありません。コメント名前メールアドレスサイト上に表示された文字を入力してください。△△△の複合キーワードがほとんどですが、中には3つのキーワードの場合もあります。グラフがあればがあればみたいです。1位なったサイ...上位表示されるまでの時間に法則は無いが上位表示されないとアクセスは増えないは法則だ管理人2018.01.28SiteOriginButtonで作ったボタンは画像データでは無いので使い回しはできないようですね。幅についてはサイズの設定でWidthの数値を統一するといいと思います。あとボタンの幅を一定にしたいのですがどうすれば良いのか分かりません。△△△の複合キーワードがほとんどですが、中には3つのキーワードの場合もあります。グラフがあればがあればみたいです。1位なったサイ...上位表示されるまでの時間に法則は無いが上位表示されないとアクセスは増えないは法則だ管理人2018.01.28SiteOriginButtonで作ったボタンは画像データでは無いので使い回しはできないようですね。幅についてはサイズの設定でWidthの数値を統一するといいと思います。あとボタンの幅を一定にしたいのですがどうすれば良いのか分かりません。httpタイトルとURLをコピーしました。