※学校パックログイン方法 学校パックを詳細までご覧頂くためには、ログインが必要になります。
ログイン方法は、サイトの右上にある ”ログイン” をクリックしてください。
◆ ログインID:otamesi パスワード:otamesi
学校様向けテンプレートの無料お試しのお申込みはこちら
 
NXC県NeXtCommons教育委員会       NeXtCommonsで教育委員会のホームページを簡単に構築!
管轄の学校にも複数導入可能で地域全体のWEB運用が快適に!
 
ホーム > TIPS > 画像加工の仕方とお知らせモジュールでの画像の貼り付け方
 

画像加工の仕方とお知らせモジュールでの画像の貼り付け方

  1. 画像の加工方法
  2. 画像の貼り付け方


1.画像の加工方法】

<1-1>

Windowsの「スタート」メニューから「プログラム」→「アクセサリ」→「ペイント」をクリックします。

サンプル



<1-2>

ペイントソフト起動後、「編集」メニューの「ファイルから貼り付け」をクリックします。
加工したい画像を選択し、「開く」ボタンをクリックします。

サンプル



<1-3>

デジカメで撮影したままの写真だとサイズが大きいので調整を行います。
「編集」メニューの「すべてを選択」をクリックします。

サンプル




<1-4>

写真左上にマウスカーソルを合わせると「黒い矢印」アイコンに変わります。
その状態で写真のカドをつまみ、ドラッグをしながら写真を任意のサイズに調整します。

サンプル



<1-5>

完成イメージに近い大きさに写真を調整したら、「変形」メニューのキャンバスの色とサイズ」をクリックします。「キャンバスの色とサイズ」ダイアログが表示されますので、それぞれ以下のように設定を行います。

②「幅:920」「高さ:150」に設定します。
③単位は「ピクセル」を選択します。
④「色」は「カラー」を選択します。

設定ができたら「OK」ボタンをクリックします。

サンプル


任意のサイズに写真がトリミングされました。
微調整を行いたい場合には、再度「編集」メニューの「すべてを選択」をクリックし、
写真左上をつまみながらドラッグをしてサイズを調整します。

また、フリーハンドでサイズを調整する以外にも、オブジェクトのサイズを変更することも可能です。
「変形」メニューの「サイズの変更/傾斜」を利用すると、縦横比率を維持しながらオブジェクトの拡大縮小ができます。

サンプル




<1-6>

最後に加工した画像の保存を行います。
「ファイル」メニューからの「名前を付けて保存」をクリックします。

次にの「ファイル名」に任意の名称を付け、保存先を指定します。ここではファイル名を「サンプル加工済み」と設定します。「ファイルの種類」は「JPEG」を選択します。

の「保存」ボタンをクリックします。

これで画像の完成です。

サンプル




<画像加工のポイント>


●完成イメージ(サイズやデザイン)を頭に描いてから作成する
●アプリケーションソフトの特性を覚えて活用する
●何度も反復練習をする

今回はWindows標準搭載の「ペイント」というアプリケーションソフトを利用しましたが、
この他にもデジタルカメラの購入時に付属で付いてくるアプリケーションソフトなど、
無料の画像加工ソフトはたくさんあります。

色々なアプリケーションソフトを体験・練習をしてみて、
使いやすいもので画像加工を行うことが、テクニック上達のポイントです。



【2.画像の貼り付け方】

<2-1>

管理者権限にてログインし、セッティングモードにします。
モジュールの追加メニューから『お知らせ』を選択します。



<2-2>

の「画像の挿入」アイコンをクリックします。
画像の挿入画面が表示されますのでそれぞれ以下のように設定します。

の「参照」ボタンをクリックし、先ほど作成した加工した画像を読み込みます。
の「代替テキスト」には「サンプル」と設定します。
の「画像の挿入」ボタンをクリックします。

画像が挿入されたら「決定」ボタンをクリックします。

サンプル




<2-3>

お知らせモジュール右上の編集ボタンをクリックし、「ブロックスタイル」タブ内の「一般」タブをクリックします。
ここでは画像のみ配置するのでの「ブロック名称」は「空」にします。の「最小の広さ」は「920」に設定し、「決定」ボタンをクリックします。

サンプル



<2-4>

これでデモサイトのようなヘッダー画像の設置は完了です。

サンプル



<お知らせモジュールの使い方のポイント>

お知らせモジュールは利便性の高いモジュールです。
ホームページに画像だけを配置したり、レイアウトを少し変更したり、自由に作成できことがポイントです。

ある程度、NeXtCommonsの使い方に慣れてきたら
このお知らせモジュールを活用してオリジナリティ溢れるコンテンツ制作にチャレンジしてみてください!