
★新URL:http://20kaido.com/
★新RSS:http://20kaido.com/index.rdf
いままでFC2ブログで5年間、お世話になりました。感謝です。
移転先でもよろしくお願いいたします!
二十歳街道まっしぐら(FC2ブログ時代)人気記事TOP50まとめ
横幅と分割数を指定するだけで分割サイズを計算してくれるジェネレータ「Gridulator」

横幅に合わせてカラムを分けてくれる
「Gridulator」は横幅と分割数を指定するだけで、カラムの幅と余白を教えてくれるサイトです。
たとえば、横幅「960px」で「10個」のカラムに分割したいと設定すると、
「96px×10カラム」「87px×10カラム(余白は10px)」といった具合に分割方法を教えてくれます。
また、分割したPNG画像もダウンロード可能です。
以下に使ってみた様子を載せておきます。
たとえば、横幅「960px」で「10個」のカラムに分割したいと設定すると、
「96px×10カラム」「87px×10カラム(余白は10px)」といった具合に分割方法を教えてくれます。
また、分割したPNG画像もダウンロード可能です。
以下に使ってみた様子を載せておきます。
横幅を指定したカラム数で分割する
スポンサーサイト

そのサイトで使われているHTML5タグを可視化できるサイト「Periodic Table of the Elements」

HTML5の要素タグを周期表みたいに
「Periodic Table of the Elements」は、
指定したサイトでどれくらいHTML5の要素が使われているか調べられるサービスです。
サイトのURLを入力するだけで、使われてる要素をハイライトしてくれます。
面白いのが、各要素が元素記号の周期表のように並んでいるところ。
さらに、各要素が何回使われているかも調べられます。
以下に使ってみた様子を載せておきます。
指定したサイトでどれくらいHTML5の要素が使われているか調べられるサービスです。
サイトのURLを入力するだけで、使われてる要素をハイライトしてくれます。
面白いのが、各要素が元素記号の周期表のように並んでいるところ。
さらに、各要素が何回使われているかも調べられます。
以下に使ってみた様子を載せておきます。
HTML5要素どれくらい使ってるか

すごくユニークで真似したくなるような404ページデザイン37選

ユニークな404ページいろいろ
サイトやブログには、ページが存在しないことを示す「404」というページがあります。
リンクを開いたら「ファイルがみつかりません」ってなるやつがそれです。
味気ない404ページもあれば、ユニークにデザインされたものもあったりします。
以下の記事を参考にして、面白いなー、上手だなーと思った404ページを以下に紹介します。
・70 Unique Examples Of 404 Error Pages For Your Inspiration
・404 Error Pages: Reloaded
・50 Examples of Creative 404 – Page Not Found Pages
・50 Creative and Inspiring 404 Pages
・14 funny yet creative 404 error pages
・49 Nice And Creative Error 404 Pages
面白い404ページを作りたいって方は、こちらのサイトを利用してみるとよさそう。
→404 Enhancer
画像をクリックすると、該当する404ページに飛ぶようにリンク貼ってます。
(※一部音がでるものがあります。また、ブラウザによっては正常に表示されないものもあります。)
リンクを開いたら「ファイルがみつかりません」ってなるやつがそれです。
味気ない404ページもあれば、ユニークにデザインされたものもあったりします。
以下の記事を参考にして、面白いなー、上手だなーと思った404ページを以下に紹介します。
・70 Unique Examples Of 404 Error Pages For Your Inspiration
・404 Error Pages: Reloaded
・50 Examples of Creative 404 – Page Not Found Pages
・50 Creative and Inspiring 404 Pages
・14 funny yet creative 404 error pages
・49 Nice And Creative Error 404 Pages
面白い404ページを作りたいって方は、こちらのサイトを利用してみるとよさそう。
→404 Enhancer
画像をクリックすると、該当する404ページに飛ぶようにリンク貼ってます。
(※一部音がでるものがあります。また、ブラウザによっては正常に表示されないものもあります。)
洒落た404ページいろいろ

サイト内の「Robots.txt」の動作確認ができるサイト「Robots.txt Checker」

Robots.txtをチェックしてくれるサイト
「Robots.txt Checker」はサイトの「Robots.txt」を確認できるサイトです。
「Robots.txt」は検索エンジンやらにサイトをクロールさせるかどうかを制御できるファイルです。
詳細はrobots.txt とは?をご覧下さい。
Robots.txtを設置したときの確認などに利用してみましょう。
以下に使ってみた様子を載せておきます。
「Robots.txt」は検索エンジンやらにサイトをクロールさせるかどうかを制御できるファイルです。
詳細はrobots.txt とは?をご覧下さい。
Robots.txtを設置したときの確認などに利用してみましょう。
以下に使ってみた様子を載せておきます。
Robots.txtの内容を確認

CSS内のカラーコードを置換してくれるサイト「Replace CSS Colors」

CSSを簡単編集!色を変更できる
「Replace CSS Colors - Editor」は、CSSに使われている色を置換できるサイトです。
たとえば、サイトのデザインを少し変更したいと思って、
赤色を青色にしたいとき、このサイトを使えば楽々編集できます!
CSS読み込み→色を置き換え→新しいCSSをダウンロード→適用
この流れでOKです。
以下に使ってみた様子を載せておきます。
たとえば、サイトのデザインを少し変更したいと思って、
赤色を青色にしたいとき、このサイトを使えば楽々編集できます!
CSS読み込み→色を置き換え→新しいCSSをダウンロード→適用
この流れでOKです。
以下に使ってみた様子を載せておきます。
CSSの色を編集する

かっこいいメニューバーが簡単に作れちゃうジェネレータ「MenuBuilder」

知識いらず!誰でも作れちゃうかっこいいメニュー
「MenuBuilder」はメニューバーを作ってくれるジェネレータです。
グラデーションやマウスオーバーも実装できます。
色を選んで、パターンを指定したらおしまい!
簡単すぎ!
画像およびHTML(CSS)もダウンロードできるので、使い回ししやすいです。
以下に使ってみた様子を載せておきます。
グラデーションやマウスオーバーも実装できます。
色を選んで、パターンを指定したらおしまい!
簡単すぎ!
画像およびHTML(CSS)もダウンロードできるので、使い回ししやすいです。
以下に使ってみた様子を載せておきます。
かっこいいメニューアイコンをつくる

FC2ブログに「総記事数」「総コメント数」「総トラバ数」を入れる方法

総コメント数、総トラバ数、全記事の数をブログに入れる!
当ブログの最上部の黒いバーには、
「アクセス数」「総コメント数」「総トラバ数」「全記事数」が表示されています。
この中で「アクセス数」は1か月に1回、私が手動で更新しています。
その他の3つは、すべて自動で更新されるようになっています。
FC2のテンプレートで利用できる関数とJavascriptを用いて、出力しています。
特に難しくなく、コピペですぐに導入できますので、以下に紹介します。
(※コメント数、トラバ数は削除したものもすべて含んだ数が表示されます。)
(※全記事数は、削除したものは含みません。現在公開されているもののトータルが表示されます。)
「アクセス数」「総コメント数」「総トラバ数」「全記事数」が表示されています。
この中で「アクセス数」は1か月に1回、私が手動で更新しています。
その他の3つは、すべて自動で更新されるようになっています。
FC2のテンプレートで利用できる関数とJavascriptを用いて、出力しています。
特に難しくなく、コピペですぐに導入できますので、以下に紹介します。
(※コメント数、トラバ数は削除したものもすべて含んだ数が表示されます。)
(※全記事数は、削除したものは含みません。現在公開されているもののトータルが表示されます。)
FC2ブログに「総コメント数」を入れる
