みかづきブログ その3

本ブログは更新を終了しました。通算140万ユーザーの方に観覧頂くことができました。長い間、ありがとうございました。

👆

引越し先はこちらです!

HTML

2分で消えるウェブページをつくろう。

おかげさまでブログをはじめて100日が経過しました。 アナリティクスで確認したところ、ブログの平均滞在時間は2分13秒でした。 なので今回はの記事は2分13秒かえてだんだん消えていき、最終的にはすべて消えてしまう仕様にしてみます。 とりあえず、スピー…

はてなブログでカスタムURLを設定しよう。

先日投稿した この記事 のURLが、 http://kimizuka.hatenablog.com/entry/http%3A//cdn-ak_f_st-hatena_com/images/fotolife/k/kimizuka/20140120/20140120101050_png_1 となっていて、「なんだかいつもと違うなぁ」「なんだかおかしいなぁ」「なんだかいつ…

インタラクティブな投稿を試してみよう。

google+のインタラクティブな投稿機能を試してみました。

metaタグをつかって検索結果に表示されないようにしよう。

Googleさんはサイトを巡回してページをランクづけしています。 そしてページランクが検索結果に反映されるのです。 まあ、ミシュラン調査員が店を回ってランク付けしていくようなものでしょうか。ときには、検索結果に表示したくないサイトをつくるときもあ…

ブログを勝手に書き換えてみよう。

今回のブログの本文は誰でも編集可能です。 テキストをクリックして適当に編集したあとに保存ボタンを押せば、つぎにアクセスした際も編集後の文章が表示されます。 結果はブラウザごとに保存されるため、別のブラウザには編集結果が反映されませんのであし…

スタイルシートをhtmlの外に追いだそう。

前々回 は、 <html> <head> <meta charset="UTF-8" /> <title>僕が考えた最強の打線。</title> <style> li {color: red;} </style> </head> <body> <h1>僕が考えた最強の打線。</h1> <p>僕が考えた最強の打線を発表します。</p> <ol> <li>遊 小坂</li> <li>二 西岡</li> <li>一 福浦</li> <li>右 サブロー</li> <li>指 初芝</li> <li>捕 里崎</li> <li>三 今江</li> <li>左 大塚</li></ol></body></html>

セレクタをつかってタグに呼びかけよう。

前回 は、文量の関係で、スタイルの記述を、 スタイルをあてたい要素名 {プロパティ: 値;}と説明してしまいました。我ながら誠に遺憾です。正確には、 セレクタ {プロパティ: 値;}というように記述します。 なので今回はセレクタについて説明します。 セレク…

styleタグをつかってみよう。

前回まで のあらすじ。一昨日の記事 内で、突然姿を表した styleタグ 。 登場するや否や速攻で大活躍。彼は味方なのか敵なのか。 あと、突然こんなはじまりかたをして、この記事はどうやって着地するのだろうか。 乞うご期待であります。はい。そんなこんな…

要素の親子関係を探ってみよう。

前回 の説明の中で、突然 親の要素 という言葉がでてきました。今回は要素の親子関係、兄弟関係について説明したいと思います。 親要素・子要素 以前 解説しましたが、htmlではタグの中にタグを記述することができます。 すなわち要素の中に要素をいれること…

マークアップをはじめよう。 style属性編

前回 はstyle属性をさくっとした感じで解説しました。間が開いてしまったのでさくっと復習しましょう。 前回の復習 スタイル属性とはすべてのタグが持っている属性で、スタイルを書き込む為の場所です。 タグのスタイル属性にスタイルを書き込むことによって…

style属性で文章の見た目を整えよう。【font-size, color 編】

前回 は架空のタグと架空のstyle属性のプロパティでスタイルとはなんたるかを解説しました。今回は実際に存在するプロパティを変更してみましょう。文章は前回と同じものを使いますが、一旦pタグでマークアップしておきます。 <p>「全くアメリカ人好みの浅まし</p>…

style属性で文章の見た目を整えよう。

前回 、 前々回 はタグを使って文章に意味を与えていきました。 今回はstyle属性を使って、文章の見た目を調整していきたいと思います。 style属性とは タグの見た目を調整する為の属性です。以前、「」が台詞を表すタグのようなものという話をしましたが、…

すこしずつタグを覚えよう。【olタグ, ulタグ, liタグ 編】

前回 のつづきです。今回も頑張っていきましょう。ファイティン。

すこしずつタグを覚えよう。【h1 ~ h6タグ, pタグ 編】

前回 までの記事でマークアップの基本的な部分は伝えられたんじゃないかと思っています。 基本さえわかっていれば、あとは文章を的確なタグで囲んだり、タグに適当な属性をつけたりしていけば良いだけです。そんなこんなで、今回からはbody要素の中に書ける…

ブラウザに表示するのではなくブラウザに表示していただくという概念をもって生きていこうではないか。

ブラウザのしごと 前回 マークアップした、 <html> <head> <meta charset="UTF-8" /> <title>ゆう子の日記</title> </head> <body>四郎くんは「こんなもの本当の寿司じゃない」と言いました。</body> </html> というhtmlファイルをもとに解説します。 上記ファイルをブラウザで開くと、こんな感じになります。それはブラウザにこんな感じで…

マークアップをはじめよう。 爻ノ篇

漸ノ篇 のあらすじ。 四郎くんは「こんなもの本当の寿司じゃない」と言いました。という文章を、 <html> <head></head> <body>四郎くんは「こんなもの本当の寿司じゃない」と言いました。</body> </html> とマークアップしましたが、ブラウザには謎の文字列(?)が表示されました。 今回はこれを読…

マークアップをはじめよう。 漸ノ篇

2回ほど脱線した記事を書いてしまったので、3日ぶりの「マークアップをはじめよう」編です。 前回 は架空のタグである、発言タグをつかってマークアップを説明しましたが、今回は実際にHTMLでつかえるタグをつかってマークアップをしていきましょう。HTMLに…

hatsugenタグをつくろう

今回は「マークアップをはじめよう」シリーズ 番外編です。スピンオフです。前回、人の発言を意味するhatsugenタグというものを定義してタグとはなんたるかを説明しました。 四郎くんは<hatsugen>こんなもの本当の寿司じゃない</hatsugen>と言いました。本来HTMLにはhatsugenタグ…

タグについて理解しよう。

前回は「」や()をタグに例えてマークアップの説明をしました。 今回はそのつづきとしてタグについて説明していきたいと思います。 タグとは マークアップに使う記号をタグと呼びます。 タグで囲まれた文章は意味がある文章になるわけです。例えば、 四郎く…

マークアップをはじめよう。

こんにちは。きみづかです。 突然ですが、今回からマークアップについて記事を書いていきたいと思います。 ことの発端 先日職場の後輩(ディレクター)に、『自分。本気(まじ)でマークアップを覚えたいっす。押忍。』と若干体育会系な感じで頼まれたことが…