月別アーカイブ: 2016年2月

ファビコン作りに挑戦してみた その2

ファビコンは、軽いgifや透過情報を含むpngでも表示されるのですが、IE(インターネット・エクスプローラー)はサポートされていませんから表示されないとのことでした。IEをお使いの方は、まだまだおられますから、medaichiは、.icoで作ることにしました。

まずPhotoshopなどで背景を透過させたPNG形式の16px×16pxと32px×32pxの画像2枚を制作します。pngで作るのは、medaichiの様な隅の丸い角丸方型や丸型のファビコンだと、透過情報の入ったpingでないと隅っこが白い正方形になってしまうからです。

画像を用意したら、ファビコンファイルの.icoに変換し無ければなりません。「ファビコン 」で検索すると、無料で変換してくれるサイトがたくさん出てきますが、medaichiはこのサイトにお世話になりました。

▶http://ao-system.net/favicon/index.php

screenshot_c

使い方はとても簡単、左側の16×16用画像と、32×32用画像の2か所で画像を選択すると右側の様に2個のアイコンが表示されます。後はダウンロードボタンを押してダウンロード、medaichiの場合は、このブログも、野鳥園のサイトも同じレンタルサーバにありますから、サーバのルートディレクトリ(一番上のディレクトリ)にアップロードするだけで両方ともファビコンが表示されました。これはこれで簡単なんですが、サイトとブログで違う画像のファビコンを使う場合は、サーバ内の別のデータベースにblogを置かなければならなくなるみたいで、これはこれで面倒なことになるかもしれませんね(W)  多分やらんと思います。

ファビコン作りに挑戦してみた その1

screenshot_a

ファビコン: favorite icon(フェイバリット・アイコン:お気に入りアイコン)というものがあるらしいのだが、薄学非才の管理人は、寡聞にしてしりませんでした。上のPCのスクリーンショットにあるような、Google Chromeなどのブラウザのアドレスバーに出るアイコンのことで、ブックマークのアイコンにも使われますよね。そういえば以前から、商用サイトとかブックマークに登録するとオリジナルのアイコンがついてくるのはしってましたが「カッコいいけど有料?」ぐらいしか思ってませんでした。どうやら、自作して簡単にアップロードできるらしいんで挑戦してみることに・・・

screenshot_b

なんでも16×16pixと32×32pixの2種類作っておくのが一般的らしいが、「サイトのショートカットなんか普通デスクトップに置いたりしないよな~」とは思いつつ、まあ作ってみることに。最初はいつも使っている野鳥園のシンボルマークでいいかとおもっていました。ちなみに、この、波の上をトウネン等の小型のシギが飛んでいる野鳥園のシンボルマークですが、medaichiがデザインしたものですから、勝手に使って加工してもデザイナーさんが怒鳴り込んでくる心配はありません(W)

ところが単純にリサイズすると、ぼんやりしてなんだかわからないものに・・・。仕方がないので新たに角丸四角形のシンプルなデザインを作って試してみました。なんとか行けそうですが、まだ、ぼんやりした所をクッキリと修正しました。後は、pingで保存して、ファビコンファイルに変換し、サーバのルートディレクトリーにアップロードするだけでOKだそうです。

blogのfontを変更してみる。

ms_meiryo

blogをあちこち触っていて、まあ、だいたいイメージ通りになってきたけど、なんか違和感が・・・。blogデフォルトのfont(文字のスタイル)が、野鳥園のサイトで使用しているものと異なるのが原因と気づきました。野鳥園のサイトで使用しているfontは「メイリオ」です。管理画面からスタイルシートを開いてみると以下の記述が

/* =Basic structure
————————————————————– */

/* Body, links, basics */
html {
font-size: 87.5%;
}
body {
font-size: 14px;
font-size: 1rem;
font-family: Helvetica, Arial, sans-serif;
text-rendering: optimizeLegibility;
color: #444;
}
body.custom-font-enabled {
font-family: “Open Sans“, Helvetica, Arial, sans-serif;
}

実際にはMSゴシックとか代替フォントが表示されていると思うのですが、上の赤色で表示されたメインフォント”Open Sans”を”メイリオ”に書き換えてみると、あっさりと変更完了して、しっくりと収まりました。今回はフォントのサイズと色には手をつけていませんが、スタイルシートから変更可能と思われます。

余談ですがMSゴシックとか MSPゴシックとか、昔からPCやってる方にはおなじみのフォントなんですが。モニターの性能とかPCの文字表示がそれほど良くなかった時代に、モニター上での読みやすさ優先で作られた古いフォントなので、プリントした時の美しさは無論のこと、モニター上ですら「なんかゴツゴツして正直すっきり感にかけるなあ・・・」という感じがぬぐえませんよね。

medaichiもサイト書いてるとき、当初はデフォルトのMSゴシックを疑うことなく使っていましたが、今は基本「メイリオ」を使っています。ネットのGoogleChromeの設定も「メイリオ」に変更しています。

冒頭の画像は2種類のフォントを、webサイトに表示してみてChromeのスクリーンキャプチャー機能で画像として保存し切り抜いたものです。けっこう感じ変わりますよね。

 

 

野鳥園のblogを作ってみるお話の2

medaichi_00

blog作るにあたって、ひとつだけこだわった事がありました。それは、medaichiが写真を撮って投稿するのは、まぁ、当たり前として、blogの利用者さんにもコメント欄を利用して写真を送れるようにしておこうということでした。感覚的には、管理人室で写真を見せ合ってああでもないこうでもないとおしゃべりするような感じがでてきたらいいなと思ったからです。

先に、既成のテンプレートを使用したといいましたが、”twentytwelve” には、コメント欄に画像をUPする機能は付いていません。そこで探してきたのがComment imageというプラグイン(おまけの機能みたいなものか・・・)です。このプラグインをインストールして、サーバーのWrdpressのホルダーにup、管理画面から有効化すれば、コメント欄から画像を投稿できるらしいんです。そんな簡単にいくんだろうかと思いましたが、先の「大阪南港野鳥園website管理人室」という投稿のコメントらんに、そこらの画像をtest投稿、ちょっと設定をいじったらすんなりと投稿できました。コメント欄を開けないと見られませんけどね。

コメントの送信ボタンの下にファイルを選択というボタンが表示されています。クリックして投稿画像を選んでいただくだけですが、jpegだけです。サムネイルで幅600pixで表示されますが、画像をクリックすれば元画像が開きますから、1200pix以内にリサイズして投稿願います。

あとは、カレンダーを入れて、だいたい思っていたスタイルに近づいてきました。少しずつでもよくしていきますのでよろしくお付き合いください。

野鳥園のblogを作ってみるお話の1

さて、blog作成に挑戦・・・って、んなことやったことないし・・・。無料のblogって検索すると、まぁ、誰でも簡単に作れそうですが、これってCMがくっついてくるんですねえ。ショッピングサイトとか・・・、教育上好ましくない(W)サイトとか・・・。有料なら付かんみたいですが、予算の少ないNPOなもんで、お金使うと理事長に怒られそうだし、あれこれオプション付けるとさらに料金が加算されるようです。

結局、野鳥園のサイトを置いてるサーバー(レンタルサーバーだけど)に、インストールして揚げるしかないという結論に。野鳥やデジスコ業界の先輩のblogを参考にさせてもらうと、なんかWordpressというアプリがよさそうなんで入れてみました。medaichiは、何だかんだいってサイト管理人をやっているので、おかげさまで、けっこうすんなりとUP出来ました。後は、いっぱいあるテンプレートみたいなものの中から好きなスタイルをインストールすれば良いみたいです。

尊敬する先輩のblogのスタイル(テーマというらしい)をパクらせてもらおうと検索・・・、何故か出てきません。仕方がないので無茶苦茶たくさんあるテーマを検索して、なんかそれらしいフォトブログみたいな、カッコいい名前のテーマをインストールしてみました。後はこれらをカスタマイズして、ブログサイトをでっちあげればいいってことなんですが、便利で簡単・・・ってことは逆にできないこともいっぱいあるみたいですね。

結局、カッコいいテーマでも、外国の作者のがほとんどのようで日本語表記が不十分で、なんか使いにくそうです。困ったときはデフォルトに・・・、wordpress日本語版デフォルトの”twentytwelve”というテーマをチョイスすることにしました。

 

大阪南港野鳥園website管理人室

 

medaichi_blog

いつも、大阪南港野鳥園のサイトをご覧いただきましてありがとうございます。管理人をやらせていただいておりますmedaichiです。別に、「サイトのコンテンツがごちゃごちゃになるから書きたいことがあるならブログにして、そっちでやれ・・・」なんて言われたわけでもないのですが、まあ、便利なツールですし、揚げた画像とか記事のアーカイブになるし、利用者の皆様の利便性を考えたらblogもありかな・・・と思った次第です。現役の勤め人てもありますから、レンジャーやってた時ならいざしらず、フェイスブックだのツィッターといったリアルタイムなコンテンツは勘弁していただいて、こちらでも皆さんよろしくお付き合いください。・・・管理人室等とお気楽そうに銘うってますので、文字通りお気楽に書かせていただきます。

「お気楽に書き散らしたものや、面白いテーマがあったら編集してサイトのコンテンツにつかえるんじゃないか・・・」みたいな不埒なことも企んでいます。ブログなんて全くの素人ですから、見にくかったりご不満も多々あるかと思われますが、少しずつ良くしていきたいと思いますのでよろしくお願いします。

元が万事大雑把で適当な人間なもんで、メールチェックもろくにせず怒られてばかりいます(W)  ああだこうだありましたらコメント残しておいてください。管理人の手におえなくても、うちのNPOのほかのスタッフとか、親切な通りがかりの野鳥屋さんとかがコメントしていただけるかも・・・

それから、コメント欄に画像を添付していただけるようにしました。コメント送信ボタンの下、ファイルを選択をクリックしていただくと開きます。600picのサムネイルが表示されますが、画像をクリックすると大きな画像が開きますので、幅1200picまでにリサイズして投稿願います。jpegのみになりますがご了承ください。