モモンガの森

モモンガの森ではwebデザイナーを目指している方を応援してます。

2009年11月7日土曜日

中国瀋陽と日本のポータルサイト

今年の夏休みは中国の瀋陽という都市へ旅行してきました。
瀋陽(しんよう)と言ってもなじみのない方も多いかもしれませんが、旧満州の中心地だったた奉天といえば「ほぉほぉ!」と思う方もいらっしゃるかもしれません。
うちの畑の面倒をみてくれているおじいさんは「奉天かぁ、戦争中は奉天の工場で働いておったに。死ぬ前に一度行ってみたい」と言われていました。
そう・・・日本人には満州というと戦争の想い出があるので胸が痛む方も多いかもしれませんが、現地中国の方は意外なほど親日家も多いそうで、日本に行ってみたいという若者も多いそうです。

さて、、どうしてこんなマニアックな場所に旅行したかと言いますと。
このサイト 中国遼寧省/瀋陽ガイド の制作をしたので、夏休みの旅行がてら、あちこち歩き回って取材をしてきたんです。




主催者様は、「七星桜(ちせいおう)」という中国に本社を置く会社なのですが、日本にも支社があり、日本と中国瀋陽を結ぶポータルサイトが作りたいということで、ご依頼を受けました。
といってもリニューアルなんですが、旧サイトは、主に中国のお嫁さんと日本の男性を結ぶ国際結婚サポートをメインにしていましたが、
中国で暮らしたい、ビジネスしたい、中国に旅行したい、中国のお嫁さんが来てくれたが、語学が心配、そんなすべての方に役に立つポータルサイトとして生まれ変わりました。

国際結婚サポートのサイトは、ただ紹介だけしてフォローをまったくしてくれない不親切なサイトもありますが、このサイトは、中国に本社があり実際に中国在住の日本人スタッフさんが女性の方と面接して、本当に結婚を希望されている真面目な方しか登録されないそうなので、興味のあるかたは覗いてみてください。

中国と日本の国際結婚サポート

せっかく婚約したり、結婚しても言葉の壁があるという国際結婚で困っている方が多いといことを七星桜の社長さんが心配して、在日の中国人の方にもオンラインで日本語を学べるようにしているそうなので、興味のある方は、中国語学講座のところをご覧下さい。


楽しかった中国旅行についてはもう一回日記書きますね、ほんと楽しかったです(・∀・)


(このオフィスもたずねてきました。瀋陽の中心地の高層ビルにあります)

2009年10月13日火曜日

信州飯島の料理の美味しいお宿



長野県飯島町の旅館サイトを紹介します。「信州いいじま温泉 ホテル陣屋
実はwebの森のほんとに近所にありまして。
ここ飯島は花畑がひろがる花の里として有名です。南アルプスと中央アルプスが両側にそびえている本当にきれいな景色の町です。

そこにあるホテル陣屋さんは、飯島に古くからあるお陣屋屋敷(昔の代官様のお屋敷を復元して今資料館になってる)から名前をとっただけあって、古くからの老舗旅館です。
古くからあった旅館はいま、合宿専用の格安のお宿になって残っていますが、
こちら「ホテル陣屋」は平成5年にアイタウンがオープンしたときに新築リニューアルしてオープンしました。

旅館がある場所は、普通の街中なので(といってもアルプスの眺めはきれいですが)
観光地の真ん中にある宿泊施設よりは安いし、とても美味しいお料理が食べられると評判です。
駒ヶ根高原、高遠城址、木曽の奈良井宿、天竜峡など南信州・伊那谷の主要な観光地のちょうど真ん中なので、
信州観光の拠点としてちょうど手軽で良いかもです。

お料理はクチコミサイトの評判通り、本当にお得で美味しいので。
あまり高い費用はかけられないけど、美味しい料理旅館に泊まりたい・・・という方にもおすすめです。
信州いいじま温泉 ホテル陣屋
姉妹旅館:格安合宿の本館陣屋


2009年10月10日土曜日

WordPressで企業サイトCMS

WordPressで企業様のCMSサイトを作りましたのでお披露目します。

有限会社エレシン研究所様



中央アルプスがそびえる駒ヶ根高原の麓にある小さい研究所ですが、会長さんが宮崎学と旧知の仲で、昔から宮崎が撮影する動物写真の無人ロボットカメラのオリジナル基盤を発注して作ってもらっていた会社です。
なんとあのけもの道シリーズは、この会社が影の力として協力してくれていたんですね。

今まで主にB to Bで企業から各種検査装置やマイコン、モーターなどを開発していましたが、このたびオリジナル自社開発製品も増やして、一般にも売っていきたいとうことで
ホームページを作って欲しいとご依頼いただきました。

Home/販売ページ/実績/開発環境/会社概要/求人/特定商取引法/プライバシーポリシー/お問い合せフォーム
という基本9点セットの小規模企業サイトの見本になりそうなサイトですが、
社長さんご自身が写真も好きだし、サイトも更新していきたいとのことで、ブログをくっつけて、
全体をWordPressで構築、すべてのページを自分たちで更新できるように計画しました。

WordPressはインストールするだけでブログとして使えますが、ちょっとチューニングするだけで普通のホームページに変えることができるとてもありがたいツールです。
ブログは時系列で記事が並ぶので、いつも出しておきたい記事があっても新しい記事を投稿すればだんだん記事が下がっていってしまいます。
WordPressの一番の特長は、PAGEという機能があること。時系列で並ばないので、例えば今回の例でいうと、上記の会社サイトの基本9点セットをPAGEで作ってしまえば、もうそれで1本ホームページができちゃう・・というわけです。




さて、、エレシン研究所様のオリジナル開発商品『ラジコンカー用DCブラシレスモーター』ですが、ラジコンのヘビーユーザーさんなら必ず興味を持ってくれるすぐれものとのことなので、興味のある方はのぞいてみてください(,,・∀・)
パソコンだけで、ラジコンの性能が測れるという、「ラジコン性能評価装置」も面白そうですね。
ちなみに1点ずつの手作り装置だそうですので、手に入れたい方は問い合わせフォームから聞いてみてください。

  

2009年9月25日金曜日

美味しいお米(玄米)の予約が始まりました

我が家が家族ぐるみで長年おつきあいしている、大きな農園さんがあります。
そこで、21年度の新米の予約受付が始まりましたのでご案内します。


信州くだもの村 富永農園


長野県、中川村にある、信州くだもの村・富永農園という場所ですが、南アルプスの麓にあって、水がとーっても美味しくて、お日様がいっぱいあたるとても豊かな土地です。
本職はリンゴ農家さんなので(近所では有名な大きな農園です)お米は家族用に作っていたんですが、評判がよくて分けてほしいと言われることが多く、今年はネットを始めたので、ネットで一般の方にもお分けしましょう・・ということになりました。
販売可能なのは玄米のみなので、近くに精米所があり精米可能な方のみへの販売になります。

予定数が予約になり次第締め切りだそうですので、もしご希望の方はお早めにお問い合わせください。
新米コシヒカリの予約はこちら




ブログは、若大将のそおじさんが、楽しい農園日記を更新しています。
ファーマーズサポーターなども募集してますので、農業に興味のある若い方にも参考になるのではないでしょうか。

デザイン・制作/webの森 (WordPressで作ってあります)

2009年9月5日土曜日

まず自活・・・働けるようになりたいティーンズのための・・

フリースクール元気学園の姉妹サイト「自活館」の紹介です。



フリースクール元気学園さんのサイトは以前こちらの記事で紹介させていただきました。
今回は姉妹サイトの紹介です。

元気学園が主に、中学生・高校生を対象として、不登校の生徒さんの学校復帰を目標にしたフリースクールであるのに対して、自活館は、対象年齢が15歳以上20歳までの、働けるようになることを目的とした施設です。

ブログを更新してくれるのは、生徒さんたちに人気の先生。
毎日熱心に教育の傍ら、研究もこなし、生徒さんたちともクラブ活動を楽しんだりしながら、熱心にブログの投稿もしてくれています。
そんな先生方に、学園の思いや、自活館の目的などをご自分で更新していけるように、ホームページはWordPressというブログツールを使って作りました。

小さなブログサイトですが、元気学園の先生方の手作りのあたたかさを感じていただけると思います。

ホームページは大きく分かれて、3つになっています。

<自活館について>
WordPressのPAGE機能を使い、主催者様が自分でカテゴリをつくり、記事を投稿していくことでページが増えていきます。

<ブログ>
ここは通常のブログといっしょです。
新着のタイトルが表紙にも出るようにしています。

<元気Shop!>
フォームメールのプラグインを使い、自分で記事を投稿して、そこにフォームをくっつけることで簡単ですが、お買い物をしていただけるように計画しました。

生徒さんたちの作品や、お茶畑で働いて作ったお茶とか、作業で作った製品などを、自分たちで紹介して、少しでも売れていったらやりがいにつながるのでは・・・
そんな思いで作った小さなショッピングページです。
これから徐々に活動していきたいと思うのであたたかく見守ってくださいね(*^_^*)

>自分に力をつける!元気学園姉妹館 自活館

企画・制作/webの森 デザイン協力/杉田純子さん WordPress制作/フォーエイト
 

2009年8月29日土曜日

ボックスを全体のセンターにしたいんですが・・

今日の解説は、CSSを勉強し始めた方が、最初のほうでまずつまずくパターン。


Q「ブラウザのサイズをかえても、サイト全体は真ん中にしたいとき、どうすれば?」



昔ながらのやり方ではこんな方法がありました。

<center>ここにボックス</center>
これはcenterタグを直接書く方法。
でも非推奨タグなので使わない方が良いとされています。

Dreamweaver8には、テキストのプロパティに中央揃えボタンがあるので、それを使うと
<div align="center">ここにボックス</div>
このタグが入ります。手軽なのはこの方法ですね。
ほかにも
<div style="text-align:center">ここにボックス</div>
こんなやり方もありましたが、styleは、今後非推奨になるそうなので、xhtmlで書くなら、こちらもなるべく使わないようにしたほうがいいですね。


というわけで、ここからがxhtmlで書いて、スタイルシートで指定する正しいやり方の話です。

正統派の方法は、センタリングしたいボックスのマージンの左右にautoを指定する方法です。
ただし、この方法は最近のブラウザでは有効ですが、IE6は言うことを聞いてくれません。
そこで、IE6のために、<body>にtext-algin:centerを指定して、ボックスにmargin:0 auto;
そして、もう一度、text-algin:leftを指定して、文字を左寄せに戻してあげる
・・・・・という一手間かけたことをしないといけません。



サイト全体をブラウザの真ん中に表示しているホームページは、たいていこの方法を使っているので、覚えておきましょう。

このタグを、DreamweaverCS4を使って書く方法を動画マニュアルで紹介しました。
Dreamweaverの使い方にも慣れていない初心者の方は、よかったら見てください。

>Dreamweaverでギャラリーを作る [13]ボックスを中央配置する


2009年8月16日日曜日

画像が表示されないと困ったら(HTML初心者の方へ)

「画像が表示されません!どうして???」
HTML初心者の方によく質問をされるんですが、いくつか理由があると思いますが、
一番理由で多いと思われる「ファイルへのパスが合ってない」という件について、なるべくわかりやすく図で解説してみたいと思います。

下記の図は、HTMLファイルと画像が同じ場所(同じ階層)にある場合。

index.htmlとspring.jpgは同じ階層なので、imgのタグは(画像ファイルへのパスは)
<img src="spring.jpg" width="250" height="166" alt="リス" />
になっています。
同じ階層ってどういう意味?という方は下記をみてください。



次に、画像が、imageフォルダの中に入っている場合です。

index.htmlとspring.jpgは同じ階層ではなく、imageフォルダの中にspring.jpgが入っているので、imgのタグは(画像ファイルへのパスは)
<img src="image/spring.jpg" width="250" height="166" alt="リス" />
となります。

エクスプローラーでみてみると

こうなっています。

ここをミスしていると、ブラウザでプレビューされても画像が×になってしまいどうして???となってしまいます。

ドリームウィーバーCS4を使って、画像を挿入する方法と、画像パスのリンク切れを防ぐ方法を動画マニュアルで紹介してますので、興味のある方はこちらもみてみてください。


初めてDreamweaverを使う [3] 画像の挿入
初めてDreamweaverを使う [4] 画像のパス



ほかにいくつか、画像が表示されない場合の原因を出しておきますね。

○ファイル名に日本語を使ってないか?
○gifかjpgで保存しているか?(PNGでも表示できますが、今回はその話は割愛)
○CMYKで保存してないか?(RGBになっているか?)
○画像を保存した場所は、サイトの中か?(サイト定義の中)
○HTMLファイルから、画像へのパスは合っているか?
○サーバにアップロードしたときに、画像だけを転送し忘れていないか?
○画像だけアップして、HTMLの方をアップし忘れていないか?
○キャッシュを見ているだけで、更新ボタンを押したら表示されるということもあるようです。