ホームページ と ブログの 違い そして、ギター教室の制作
^^v ギター教室 by ばーど
vx_bird_xv
ブログ(日記)は 特別な プログラムや 知識を 持っていなくても 大体 簡単に 記事の作成は出来ます。
ひな形を 利用して その日にあった 事を 記入するだけの 簡単な作業です。
HPとなると ゼロからの スタートで 全てが 自由に制作出来ますが・・
全てのパーツを揃えて 専用のプログラムで 制作しないと 出来ないのが普通です。
初めての いちページ が 大変な思いと 大変な苦労の上に 出来上がります。
同じ HPの 記事であっても 最初に作ったページと 2〜3年してからの ページでは まるで 内容の充実度が 変わって行きます。
その違いが あまりにも 大きくなった場合には 初期に作成したページを もう一度 作成しなおし・・ という 手順になります。
ブログ(日記)では 最初に書いた記事も 2〜3年してからの 記事も そんなに 変わりは無い筈です。
簡単に 考えたら 『りかちゃん人形』(ブログ) と 『色粘土』(ホームページ) の 違いかな??
りかちゃん人形は 最初から出来ているので 自分なりに 着せ替えしたら(記事を書いたら) 出来上がり!!
色粘土は 何を どう作るか 考えながらじゃないと 形にならないし・・
経験を積んで行くと 作成の仕方 そのものが 変化していきます・・
まぁ そういう風に考えて下さいね・・
さて・・
2011年 6月 現在の このページを制作する為の 大きな流れを 説明 いたします。
どの様な 内容を 書くか 決定したら パーツ制作にはいります。 (ここでは リズム読みの 3拍子系を モデルに 実際の作業を 振り返ってみます。) |
||
![]() |
譜面が メインなので 譜面の レイアウトを 考えながら 『シベリウス Sibelius』 という ソフトを利用して 打ち込んで行きます。 完成したら ページ毎に A4 の BMP で 出力します。 BMPの『モノクロ』 画像で 出力されてますので、 『フォトショップ Photoshop』 を利用して 『グレースケール』 → 『RGBカラー』 と 変換して jpgで 保存をかけます。 この譜面は DL用と 説明用の 2種類に使用される為 1段ずつ フォトショップにて 上手く切り取り、 必要のない部分は ホワイトで 消します。 |
|
![]() |
ちなみに こちらは DL譜面用に 使用するデータ 左側の 余白も 残し 左右全てを 残した形で 切り抜きます。 |
|
![]() |
こちらは HPでの 解説に 使用する データ HPに 載せた時に 出来るだけ 大きく見える様に 左右を Cut しますが・・ ここにあるように 右のスペースは最大幅の譜面の大きさに揃えて残しておきます。 高さは当然ですが 揃えてあります。 (注: ここに載せているパーツは A4サイズのままを 同じ大きさに見えるように適当に縮小してます。) |
|
![]() |
||
サイズをあまり考えずに 縮小した場合 こちら の様に 大きさがばらばらになります。 (この場合 下に 文字を置く為 わざと 大きさを 変えてあるのですが・・) 上が シベリウス 下が ノーテーター という ソフトで 作成されています。 シベリウスは 現行のソフトなので ウインドウズで 使用するには かなり 楽に使用出来ます。 ノーテーター は ATARI という PCのため ウインドウズとは 互換性が有りませんので、プリントアウトした後 スキャナーで取り込みという 手順になります。 |
全ての切り取り ホワイト修正を終えたら、いよいよ 縮小です。 | ||
![]() |
||
![]() |
||
『縮小専用』 という フリーソフトを 利用して HPに 載せられる大きさに縮小をかけます。 |
![]() |
その後 右側の余白を切り取り 音符の大きさは 変わらずに左右の長さだけ 変更された 写真が出来上がりました。 出来上がったデータは 好みで このまま 利用したり |
|
![]() |
ホームページビルダー 付属の『ウエブアートデザイナー』を 利用して 透過処理を施したりします。 ト音記号の周りに 白のゴミの点が 多く出てますが・・ これって、色々な方法で 試したのですが 修正出来ないんです・・ (泣・・・) ごまかす方法は 暗いところから 明るいところへ 移動させると 目立たなくは なります・・ ↓ なんとなく 綺麗に見えるでしょ?? 同じ 写真です! |
|
![]() |
||
![]() |
||
今 修正作業をしていたところ 完璧ではありませんが 無事 処理方法を 見つけました!! 上に比べて 下の 五線紙(ト音記号の周り) 大分綺麗でしょ?? ^^v (また、2〜30分 処理時間が増えるのですが・・ ww) |
![]() |
また それとは 別に DL用の 譜面に フォトショップで 文字を加え 体裁を整えて 出来上がり・・ ww (注: この譜面 DL用と 同じに見えますが サイズを縮小してあるため利用できないと思います。 ダウンロードは DL用ページを ご利用下さい。) |
|
この HPが
少しでも 皆様の お役にたてたら 幸いです!
^^v
2011・06・10(Fri) 9:30
ではでは
本日の講義はこの辺にしておきましょうか・・
テーマは あまり決めてませんが・・
次回を お楽しみに・・
vx_bird_xv