ホームページにブログの記事を新着表示させる方法

ホームページに、ブログの新着記事を自動で表示する方法は・・・？
検索で出てくる参考サイトは難しいものが多いので、初心者向きに整理してみました。


ブログの利点はいろいろありますが、その中でも特徴的なのが「RSS」といって、ネットの世界に共通の形式で出力される信号のようなものを配信できることです。このRSSを自動で取得できるスクリプトをサイトに埋め込むと、あなたが書いたブログの新着日記が自動でホームページに表示されます。多少のタイムラグがありますが、手動でＨＴＭＬに新着表示を出している手間からすると雲泥の差。
新着日記を表示させて、訪問者に楽しんで貰ってもいいですし、サイトからのお知らせのような、更新案内に使ってもイイデスね。
下記のページで見本のソースを置いておきますので、使ってみて下さい。

難易度としては、
HTMLをソースの方で編集出来る　＆　スタイルシートがある程度わかる方なら設置可能かと思います。


※たまーに直接メッセージで質問が来るんですが、初対面の方にいきなり質問いだきましても対応しきれないので、このブログへのコメントでお願いします。

規約にも書いておきましたが、記事を見て参考になった方は、ご自身のブログで該当ページを紹介していただけると嬉しいです！

＞webの森：ホームページにブログの記事を新着表示させる方法

FC2 無料ブログのテンプレート変更方法

動画マニュアルで無料ブログの使い方を更新しました。前編はこちら


（４）デザイン（テンプレート）を変更してみる

今回は、テンプレートの変更方法です。
FC2は豊富なテンプレートがあるのが特長で、公式テンプレートと共有テンプレートから選べます。
共有テンプレートは、デザイナーやweb制作の有志の方が、自分で作ったオリジナルテンプレートを公開して、誰でもダウンロードして使えるようになっています。
無料ですが、それぞれ規定があるので（アダルトサイトは禁止とか、作者へのリンクは削除しないとか・・）守りましょう。
素敵なテンプレートを無料で使わせてくれる制作者の方には感謝です(´∇`)

また、テンプレートの中には「SEO対策済み」とされているものもあり、メタタグやタイトルタグの配慮だとか、ソースの記述の順序、自分でキーワードを増やすためのフリースペースをいれてあったり、そんな対策が行われているものもあるので、便利に利用できます。
（もちろんオーソドックスなテンプレートを利用して、自分でSEO対策になるようにカスタムすることもできます）

↓わたしモモンガがお世話になっているSEO対策の先生のサイトです
SEO対策講座・SEOセミナー　ハブネット
ブログを使った集客の方法についても、ここの講座でいろいろ学びました。
ブログを使いこなして、何か自分の目的が達成できたらいいですね♪

「無料ブログ」入門講座

動画マニュアルで、「無料ブログ入門」というシリーズを始めました。
（まだDwの方もやりたい機能あるんだけど〜・・・・移り気なもんで・スンマセン）


初心者対象の「無料ブログ」の使い方講座です。ブログ登録の仕方から、日記を投稿する方法、オリジナルっぽくカスタマイズする方法まで・・。

FC2ブログの使い方

（１）新規登録の方法

無料ブログサービスはいろいろありますが、まずはメジャーなところで、FC2ブログの使い方を紹介してみます。
FC2の良いところは、なんといっても豊富なテンプレートデザイン。おしゃれなテンプレートがたくさん登録されているので、デザインを選び放題。全部無料で使えるなんて素晴らしいですね。

新規ユーザー登録の前に、フリーメールを取得しておくことをおすすめします。
FC2からの重要なお知らせや、もしパスワードを忘れてしまったときなどは、この登録メールに届くので、忘れないように覚えておきましょう。



（（２）記事を書いてみる

（１）で、新規ユーザー登録、ブログの初期登録、初期のテンプレートの選択、ここまでやりました。
次に、とにかく記事を書いてみましょう。
ブログが表示できたら成功です。
ブログの良いところは、あれこれ悩むより先に立ち上げてしまった方が良い・・ということですね。
デザインもカテゴリもパーツも、ブログのタイトルさえ、あとから簡単に変更できるので始めていってやっぱりちがう・・と思ったらどんどん変えていっていいわけです。


動画では、すぐに管理画面に入れましたが、
パスワードを忘れてしまった人は、ログインのボタンの下にある「パスワードを忘れたら」という青い字をクリックして、メールアドレスを入れて送信してください。
そのアドレスにパスワードが届くはずです。


（３）日記に写真をつける方法

（２）では、日記を投稿してみました。
今回は、その記事に写真をつけてみましょう。
ログインして記事を書いたばかりのときは、まだログアウトされていないので、ブログの管理用というボタンから、再度管理画面に入ることができます。

写真は、デジカメから取り込んだままだと大きすぎる場合が多いので、事前に適度な大きさに縮小しておきましょう。（FC2の場合は500KBまで・・と指定があります）
デジカメからとりこんだ写真の上で右クリック＞編集　を押すと（ウィンドウズXPの場合）ペイントが立ち上がるので、メニューの「変形」から「伸縮と傾き」
100％になっているのを、縦30% 横30％　などと指定すれば縮小できます。

もちろん、最初からデジカメのモードを640pxなどにしておけば楽ですが。
今度は写真をプリント出ししたい時などに解像度不足だったら悲しいです。。。

＊＊＊＊＊＊＊＊

パソコンに不慣れな方は「とてもブログなんて〜・・・！難しそうだし書くこともないし・・・」と敷居が高い方もいるかもしれませんが、初めて見ると日常生活の中でも「あ、これブログのネタにしよ」などと思えるようになってくるし、案外簡単だし、面白いですよ。友だちもできるし。。。

ぜひ気軽にチャレンジしてみてください。

「いきなりだけど超特急でコーディングお願い！」

最近、とある女性ディレクターさんと知り合いになれまして・・「いきなりだけど超特急でコーディングお願い！」と頼まれたので引き受けました。
特急でゴメンゴメンとしきりに恐縮されたんだけど、時間が長引くような仕事ほど赤字になりやすいので、特急は返ってありがたかったりします。（もちろん他の仕事と重ならなければ。。）

てことで、木・金でコーディングして土曜日にはプログラマーに引き渡したいとの予定だったんだけど、木曜日待てど暮らせどデザインが来ない・・
仕方ないので昼寝して万全の体制を整えて（昔は連続徹夜くらい平気だったのに～。。。）やっとこさデザインが届いたのが木曜夜の11時くらい。
スカイプで打ち合わせして、０時頃から朝まで作業して、間に家事やら仮眠やらも挟んだけど、結局金曜深夜には全14ページ完了しました。＼(~o~)／お疲れさま～。。


そのディレクターさんと担当のデザイナーさんは、スタイルシートでの構築は初めてだったということで、「ぶっ飛びました～！！もう土曜は絶対無理って思っていたんだけど、こんな早いコーダーさん初めてみた！CSSで作るのってテーブルデザインでやる方法よりホントに早くできるんだねぇ」といたく感動してくれました。

「こんなに早くできて、しかもソースがめちゃきれいだし、プログラマーさんもマージしやすいって喜んでたよ。やっぱりスタイルシートの方法覚えたい」と言って、講習会に通うことにしたそうです。
なーんか普通に特急の仕事しただけですが、やたら感激して貰えて恐縮というか、いいお仕事が一緒にできてこちらほうが嬉しかったデス。。

担当のデザイナーさんとも初対面だったんだけど、「動画マニュアルのモモンガさんとお仕事ができるなんて～！モモンガさんを目指したいです！」なんて言ってくれましたが。
若いデザイナーさんですが、とってもきれいなボタンやらアイコンやら超スピードで作ってくれて、ファイヤーワークスのテクニックは私の方が勉強になったくらい。

ディレクターさんは、ものすごいパワーがあっていつもあちこち走り回っては、次々に新しいアイデアが浮かんでしまって「モモンガさん、今度こんなことやろう！」なんて携帯からメールしてくるような面白い人。
こういう元気が貰えるような人との出会いがあるとなんだか嬉しくナリマス。。。。


というわけで、楽しい仕事できたし、いい人たちと知り合えてほんとにヨカッタ。。信州の庭にも春が来たしなぁ・・・と、風景も気持ちもあったかくなった土曜の一日でした。

Fireworksのコマンドの使い方

例えば、デジカメから取り込んだ写真を、リサイズして、右と下に余白をつけて、ドロップシャドウで影をつけ、書き出し・・・同じ処理を複数のファイルに一括で施したいことがありますね。
そんなとき、いちいちファイルを開かなくても、Fireworksのバッチ処理機能で行えます。
順番としては、オリジナルでコマンドを作る、次にバッチ処理をする・・となるんですが、

Fireworksのコマンド（自動処理）の作り方は簡単です。
同じような機能で、Photoshopのアクションがありますが、それよりかなり簡単に登録できます。
ただ、Photoshopのアクションは、登録したあとに、間に作業を追加したり、一時停止したり細かい編集ができるんですが、Fireworksはその機能がないので、
物足りないというか不便と思いました。

コツとしては、細かい動作をひとつずつコマンド登録しておいて、
バッチ処理の時に、使いたいコマンドを編集（いくつも組みあわせたり、順番を変えたりできるので）すれば
かなり高度なことができると思います。

動画マニュアル「Fireworksの使い方」でこの方法を更新しましたので
興味のあるかたは覗いてみてください。

Fireworksのコマンド登録とバッチ処理
１〜３までで完結してます。

---

動画の例では、思いつきで一つ作業を登録してみたんですが、これはクリップボードに入っている記録をペーストするのであとで再現してみたら大いに不具合があることがわかりました。なのでそっくりマネしないでくださいね(^_^;
どんなことができるのかがわかっていただけるかと思います。

Fireworksでのスライス使用方法

Fireworksの使い方　動画マニュアルを更新しました。
今回は、ファイヤーワークスでのスライスの使用方法です。


一昔前のスライスの使い方というと、デザインを全面、画像作成ソフトで作って、それをスライスで１画面全部書き出ししてから、HTMLにテーブルごと取り込み・・・
という方法が主流でしたね。
とくにDTPなどのデザイン畑からweb制作に入ったデザイナーさんにとっては、ＨＴＭＬソースを覚えなくても自由自在にデザインができるという素晴らしい機能でした。
同時に、５年も前にはまだネットの回線の速度が遅く、どうやって軽い画面を制作するかに、とても神経を使わなければいけない時代だったので、大きな画像は、スライスで切り刻んで部分的に高画質で出力したり、広い余白はスペーサーを入れて無駄な画像が入らないようにするなど、
画面を軽くするテクニックも重要でした。

しかし時は流れ、今やWEB標準に合わせた制作方法が主流に・・・・
大きな画像は１枚で背景用に書き出して、そのうえにテキストやパーツを配置していく・・。
こちらが主流になってから、スライス機能の使用方法も使い方が変わってきました。

全画面テーブルで書き出ししてしまうと、修正があったときに大変ですが
後のメンテナンスを考えると、こういった背景画像にHTMLでテキストをのせるといった方法をとったほうがだんぜん効率が良いですね。

というわけで、作例では、１画面で作ったweb用背景を、ヘッダー用、フッター用、メイン部分用の３つに切り分けて、さらにロゴは別で書き出しする方法です。
（１）から（３）までで完結してます。

Fireworksのスライスの使い方 >> （１）背景画像用に切り抜きする方法

フォトコンテスト「伝えたいもの—無形文化遺産」

（財）ユネスコ・アジア文化センターが主催しているフォトメッセージ・コンテ
ストについてご案内します。
詳細は下記のURLをご覧ください。

ＡＣＣＵアジア太平洋ＥＳＤフォトメッセージ・コンテスト『明日への手紙２００７』

締切が2月15日（金）と迫ってますが、関心がありましたら是非ご応募ください。
テーマは「伝えたいもの—無形文化遺産」です。
「家族の記念行事や地域の祭りや芸能、受け継がれてきた手工芸、誇りに思う習慣や人々の暮らしなど・・・・・」の写真がテーマだそうです。

オンライン応募が可能です。入賞作品はパネル化され、アジア各国で巡回展示するそうです。

友人の友人が担当していて、日本からの応募者が少ないため締切を延長したものの、期待どおりに応募がないようです。
ぜひ、何か手持ちの写真があるかた、応募してみてください。