LogoMark.png

WebDesign/BasicOperations の変更点


#author("2021-08-03T19:18:54+09:00;2020-08-24T08:28:55+09:00","default:inoue.ko","inoue.ko")
*WebDesign|BasicOperations
実習をはじめる前に|実習室 iMac の基本操作
~


Webデザインに関わる実習では、ファイルとフォルダの管理、また、少なくとも[[ブラウザ>Browser]] に関する基本操作ができることが前提となります。ここでは、実習の前提となる、基本操作を確認します。
~
~

**iMacの文字入力とマウス操作
***キーボード
-基本的なキー配列はWindowsと同様ですが、一部の特殊キーが異なります。
--[ ⌘(コマンド) ]:Windows の [ CTRL(コントロール) ]と同様
--[ option ]:Windows の [ ALT ]と同様
--[ delete ] の挙動が Windows とは異なる 
~

***入力文字の文字種変換(ひらがな/カタカナ/全角英数/半角英数)
-モード切り替え [かな]キー / [英数]キー
--[ あ ] :日本語ひらがな入力モード(標準)
--[ A ]:英数入力モード
-IME(Input Method Editor)の切り替え
--Macの場合通常「ことえり」
--[[Google日本語入力>https://www.google.co.jp/ime/]]も無料でインストール可能
--メニューバー右側の「日本語環境の設定」で各種設定可能。

-MacのファンクションキーにはWinとは異なる機能があてられているので、
Windowsのように「入力後に [F7] でカタカナ」ができませんが、ひらがな入力を基本として、以下の操作で文字種を事後切り替えできます。
--[ CTRL ] + [ j ] ひらがな
--[ CTRL ] + [ k ] カタカナ (Windowsの[F7]相当)
--[ CTRL ] + [ l ](エル) 全角英数
--[ CTRL ] + [ ; ] 半角英数 (英数キーを2回押しでも可)
~

***マウス
-iMacの標準マウスは視覚的には一つボタンですが、実際には左右の区別が存在します。基本的な使い方はWindowsと同様に設定可能です。
--左クリック(主ボタン):選択
--右クリック(副ボタン):コンテクストメニュー
-右クリックが効かない場合は
>システム環境設定>マウス>「副ボタン」
~
~

**iMac におけるファイル・フォルダの操作
スマートフォンとは異なり、パソコンを利用する場合は、常に「ファイルやフォルダがどこにあるか」を意識する必要があります。また、それらを移動してフォルダに整理したり、まるごと複製してバックアップをとる・・といった作業が非常に重要になります。
~

***フォルダの作成
-デスクトップ上で 右クリック>新規フォルダを作成
~

***複数のファイル・フォルダの選択
-方法1)全体を囲むようにドラッグ
-方法2)[ SHIFT ] + クリックで追加選択
~

***ファイル・フォルダの移動
-同一デバイス上での ドラッグ&ドロップ > Window上で移動します。
-異なるデバイス間での ドラッグ&ドロップ > 複製ができます。
~

***ファイル・フォルダの複製
-方法1)ファイル・フォルダを選択して [ OPTION ] + ドラッグ
-方法2)ファイル・フォルダを右クリック > 複製
~

***ファイル・フォルダの名称変更
-方法1)ファイル・フォルダを選択して、名称の上でもう一度クリック
-方法2)ファイル・フォルダを右クリック > 名前を変更
~
~

**ショートカットキー

***コピー&ペーストのショートカット
コピー&ペーストのショートカットは、大半のソフトウエアで共通です。
-[ ⌘ (CTRL) ] + [C] コピー
-[ ⌘ (CTRL) ] + [X] カット(切り取り)
-[ ⌘ (CTRL) ] + [V] ペースト(貼付け)
~

***検索・置換
検索置換も同様、ほぼすべてのソフトウエアで共通です。
-[ ⌘ (CTRL) ] + [ F ] 検索窓の表示 
エディタ等では、同時に置換のためのテキストエリアも出現します。
~


***画面のスクリーンショット
-[ ⌘ ]+[SHIFT]+[3]
シャッター音とともに画面がPNG画像としてデスクトップに保存されます。
-[ ⌘ ]+[SHIFT]+[4]
カーソルが十字になります。囲んだ範囲がデスクトップに保存されます。
-[ ⌘ ]+[SHIFT]+[5]
選択した特定の Window のみがキャプチャーされます。
~
~

**ブラウザの活用
***ブックマーク 
頻繁に訪問するサイトは、ブックマークを利用すると、ワンクリックでアクセスできるようになるので、作業効率が向上します。
-アドレスバーに見えるURLの左端のアイコンをデスクトップにドラッグ
> デスクトップにショートカット(リンク)ができます。
-アドレスバーに見えるURLの左端のアイコンをブックマークバーにドラッグ
> ブックマークバーに登録されます。
~

***ソースの表示
大半のWebサイトは、そのHTMLを見ることができます。
-右クリック > ページのソースを表示 / 要素を検証
-開発メニュー > ページのソースを表示 / 要素を検証

''付記''
Safariはデフォルトのままだと「ソースの表示」ができません
環境設定>詳細タブ>開発メニューの表示 にチェックが必要です。
~

***画像のダウンロード
ブラウザ上に見えている画像の大半は、ダウンロード処理が可能です。
&small(ブラウザ上に見えているという時点で、すでにデータは取得できています。);
-画像の上で 右クリック>「画像を保存(ダウンロード)」
-通常は、個人領域の「ダウンロード」フォルダに落ちてきます。
~
~
~