CSSが得意な渋谷のウェブデザイナーのウェブ開発メモ

[PR] Another American Dictionary Spanglish with us!

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Atomインストール後にする設定

Core

新規タブで開く

「Allow Pending Pange Items」のチェックを外す

プロジェクトサイドバーに表示させないファイル指定

「Ignored Name」にphotothumb.db, *.psd など

Editor

インデントの感じをnotepad++に近いように設定

Show Indent Guide にチェック

Show Invisibles チェックを外す

折り返し設定

Preferred Line Length 180 (解像度によって調整)

Packages

インデントの長さ設定

「Tab Length」 を4に

install

プロジェクト管理

project-manager

ダブルクリックした単語をハイライトさせる(notepad++のように)

highlight-selected

スポンサーサイト

Windows 10 スタートメニューレビュー

結論

Windows 7 のほうが使いやすい。

デメリット

キーボードでの操作がしづらい

電源シャットダウンまでのキーボード操作: windows ↑↑ Enter ↑↑ Enter

ジャンプリストを表示するのに必要なキーボード操作:→ Enter 

スタートメニューの設定できない

タスクバーのプロパティからスタートメニューの設定しようとしてもあるはずのスタートメニューの設定タブがない

ピン留めするとタイル式に移動してしまう

タイルに入るとキーボード操作するとき操作が増えて面倒

スタートメニュー関連以外の設定

言語設定

Google 日本語を設定している場合、Microsoft IME がデフォルトにるため再設定が必要。 言語設定を開く 関連設定の「日付、時刻、地域設定の追加」 言語の「入力方法の変更」 日本語「オプション」 入力方式Microsoft IME を削除 (あとで戻せる)

プレビュー無効にできない

Alt + Tab でのアプリ切り替え時のプレビューはwidnows 8 同様無効にできない

効率重視のウェブデザイナー Windows 8.1Pro 設定

Windows 8 を使いはじめました。思い通りの設定にするのに一日かかる。

インストールしたもの

  • Firefox
  • Google Chrome
  • Notepad++
  • WinSCP
  • Adobe PSD/AI
  • デスクトップ用skype
  • Start Menu 8(2日目に削除)
  • Google 日本語

ソフトの各種設定

Firefox

アドオン

  • Firebug
  • Analytics オプトアウト
  • Page Rank

Chrome

アドオン

  • Instant Translate
  • Analytics オプトアウト
  • Page Rank
  • User-Agent Switcher

Notepad++

こちら参照

WinSCP

上書き時に確認ダイアログを表示させる

Skype

タスクバーをシステムトレイにしまう タスクバーからSkypeを消去

Photoshop

環境設定 > 単位定規

 pixelに変更

Windowsの各種設定

アカウント

サインオプションからパスワード削除(ローカルアカウントだけにする):起動時毎回パスワードいれるのが面倒くさいから

フォルダオプション

拡張子を表示させる

パフォーマンスオプション

  • アイコンの代わりに縮小版を表示する:フォルダ内で写真などをプレビューさせるため
  • スクリーン フォントの縁を滑らかにする:Firefoxでのフォント表示がギザギザにならないように

各アプリ起動のショートカットキー設定

これわりと重要

  1. 8 のデフォルトのタイル式スタートメニューの四角いアイコンを右クリック
  2. ファイルの場所を開く
  3. アプリアイコンを右クリック
  4. ショートカットキーを設定(例)Ctrl + Alt + F
  5. これこれで一発で指定のアプリ起動。Macじゃこの設定をするためにアプリが必要らしい。

      Start Menu 8 のレビュー

      Start Menu 8 はWindows起動時に起動される設定になってるが有効になるまで30くらいかかる(SSD)。反応もwindows7のスタートメニューにくらべるとすこーしおそいし、たまにかたまる。

      スタートメニューの使いこなし設定

      設定次第ではいままでのようなスタートメニューでなくてもいいのかもしれない、設定次第では。

      よく使うソフトはショートカット設定したるのためスタートメニューから起動することはあまりないが、念のためおいておく。左したのすべてのプログラムを見るための矢印にキーボードでフォーカスできない....

      問題はPCのシャットダウン。シャットダウン(左の小さいアイコン)と再起動(その隣の水色アイコン)をキーボードだけでできるようにするには設定が必要。

      シャットダウン

      shutdown /s /t 0

      再起動

      shutdown /r /t 0

      設定方法:詳しくはこちらの参照サイト

      Windows 8.1 Pro の嫌いなところ

      • Aero プレビューが無効にできない:アプリ切り替え(Alt + Tab)でアイコンだけ見たいのに...
      • chrome のタイトルバーがシークレットモードの時も同じ色なので区別がつきにくい。firefox もデスクトップの個人設定から設定した色に統一されてるのでchrome を使ってるのかfirefoxを使ってるのかわかりづらい。

      Windows 8.1 Pro のいいところ

      • インターフェイスがフラットデザインでみやすい
      • フォルダをいつ開いてもプレビュー領域が同じ位置に固定されてる

      Windows 8.1 Pro にアップグレードするべきか?結論

      慣れれば同じ。いろいろ設定する時間やなれる時間を考慮するならまだ windows 7 を使いつづけるたほうが良い。

Notepad++ をインストール後する設定

ツールバーを隠す(シンプルが好きなので)

設定 > 設定環境 > 全般設定

ツールバーを隠す

Ctrl + Q でソフトを終了する

設定 > ショートカット管理 > 終了

ツールバーを隠す

Firefox 5 の設定 ミニマルウェブデザイナー編

Firefox 5 がリリースされ、機能やインターフェイスの変更でツールバー周りを変更しました。

firefox

表示するバーとアイテム

表示するバーはナビゲーションツールバーのみ。必要な全てのアイテムをそこにまとめます。

アイテムは左から:

  • 戻る進むボタン:ボタンは押すことはないが同タブ内でページ移動してきたのか確認のため。使用頻度:5/5
  • ロケーションバー:アドレスバーからの履歴検索はChromeよりFFはすぐれてる。設定は「プライバシー」から。使用頻度:5/5
  • RSSボタン:RSSを配信しているサイトか確認のため。使用頻度:5/5
  • ブックマークツールバー:使用頻度が中堅のサイトを登録。使用頻度:3/5
  • Firebug要素を調査ボタン:使用頻度:5/5
  • Google 検索:使用頻度:1/5

アドオン

Page Rankと翻訳、スピードダイヤルだけのためにいれていたGoogle toolbarは対応していないため。この際カット代用のアドオンはいれません。

  • Firebug:必須。
  • Google Analytics オプトアウト:Analytics のフィルターマネージャーをわざわざ設定しないで済むため。
  • ソース表示タブ:これを入れないといちいち別ウィンドウで開いてウザい。必須。

ウェブデザイナー Windows 7 の設定

効率よく作業をするためのPC設定。パソコンを買い換えたら、OSを入れ直したら、まずは設定から始めましょう。

Aero の無効化

デスクトップ右クリック→個人設定→ベーシックテーマを選択

Aeroを無効にする一番の理由はアプリケーション切り替え alt + tab 時にアイコンのみの方が見やすいから。

alt+tab

デスクトップはゴミ箱のみに

デスクトップ右クリック→個人設定→デスクトップアイコンの変更

視覚効果パフォーマンス

マイコンピュータ右クリック→プロパティ→システム詳細設定→パフォーマンス設定→視覚効果カスタム チェックを入れるのは以下の3つ。

  • アイコンの代わりに縮小版を表示する:フォルダ内で写真などをプレビューさせるため
  • ウィンドウとボタンに視覚スタイルを使用する:これは完全な好み。パフォーマンスに影響はあまりない。
  • スクリーン フォントの縁を滑らかにする:Firefoxでのフォント表示がギザギザにならないように

視覚効果

Skyep,メッセンジャーをシステムトレイに

各アイコンを右クリック→相互性タブ→相互性モードでこのプログラムを実行するにチェック→Windows Vista を選択→OK

システムトレイ

アプリケーションを開くためのショートカットを設定

アプリケーション右クリック→プロパティ→ショートカットキー

拡張子の表示

なんでもフォルダを開いてalt→ツール→フォルダオプション→表示→登録されている拡張子は表示しないのチェックを外す。

デスクトップ

Google Chrome 拡張機能実践レビュー

Googleクロムの安定版が公開され2週間。Chromeは急成長しブラウザ戦争の一部に加わり、Firefox, Internet Explorer, Opera and Safariから乗り換える利用者も増えています。Firefoxアドオンのような便利な、また必須のクロム拡張機能を紹介します。

WEB必須

PageRank
グーグルツールバーをFirefoxに入れる理由はこのためだけといっていいほどの機能。ツールバー機能とちがってバー形式と同時に数字も表示されます。

RSS Subscription Extension
IEやFirefoxではデフォルトでついているRSS表示機能。RSS配信しているか見分けたり、購読するときに便利。

Chrome Flags
アドレスバーに国旗でサーバの場所が表示され、クリックするとIPが表示され、Google Trends, Who Is, Alexaなどへのリンクも表示される。

Bubble Translate
グーグル翻訳を利用したアドオン。テキストレベルで簡易的な(辞書上の一番目の)意味をtooltip形式に表示。

Firebug Lite:WEB開発・制作必須機能。

Color Pick:Firefox Colorzillaのようにブラウザの色を抽出できる。

バージョンアップに期待

Chrome SEO:まだテスト版。サイトに対する各検索エンジンへのページインデックス数、被リンク数などが瞬時にわかる。

Firefox ウェブデザイナー用アドオンレビュー

firefox add-ons
Color Zilla
ブラウザ上の色をスポイトで抽出できる。

Firebug
ページのソースをマークアップに適応されているスタイル同時に閲覧できる。人の作ったページのソース解読はこれで10倍速くなる。

Web Developer
shift + ctrl +A で xhtmlの一発検証ができる。shift + ctrl +F で各要素の情報を表示。

Google Toolbar
Page Rank の確認用に必須。

WebMail Notifier
yahoo, hotmail, gmailの受信が即わかる。メールアドレスを多様している人には便利。

ソース表示タブ
簡易的にソースを見たい場合タブで開いてくれる。

デュアルモニター使い分け デザイナー編

ディスプレイ画面を2つ使って制作作業方法

Dell 1908FP (19inch)

dual monitors

右(メイン):firefox, photoshop, illustrator, サクラエディタ, flash, IE Tester
左(サブ):google chrome, next ftp, messenger, mail, photoshop,illustratorのツールウィンドウ, excel, フォルダ, 画像ビューアー

メインは右でフォトショ、イラレのツールウィンドウは邪魔なのでサブ画面に配置。それぞれのソフトは開くウィンドウの位置と大きさを決めて作業中右に行ったり左に行ったり移動させない。左のChromeは主に検索用、ソース表示用。
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。