最新の記事
アクセシビリティデザインを作ることのメモ-Web Accessibility Guide
2015.11.15 WEBデザイン アクセシビリティデザイン今月はクライアントのターゲットユーザーが高齢者が多いウェブサイトを作ることになりました。 書籍と買ってきたり、図書館へ出向き高齢者（シニア）に向けての本の作り方など関係しそうな書籍類を借りてきて読んでおります。これから私もおじいちゃんになるわけで、おじいちゃんが作るホームページがおじいちゃんに使いにくいデザインになったら笑ってしまうのである程度基本的なことはわかっていないとね。。。 そんで...
DreamweaverでWordPressのコードヒントがでない時
2015.10.8 adobe dreamweaver ワードプレスDreamweaver CCを使っていますがyosemiteからコードヒントがでなくなりました。 というよりもこれまで通りに「Ctrl + スペースキー」を打つとSpotlightがでてしまう。。。 なので以下の設定で解除してあげるだけでおっけーです。 1.メニュ ＞ システム環境設定 2.メニュ ＞ システム環境設定 ＞ ショートカット 3.メニュ ＞ ...
OS X EI Capitanの日本語の自動変換 ライブ変換を停止する方法
2015.10.4 MacOS X EI Capitanにバージョンアップして登録していた変換機能が全て削除されて途方にくれてます。バージョンアップには気をつけてください。 あとライブ変換機能。私はどうも慣れない。。。 もっさりしている感じもあるし。 それで探してみたら停止するのは簡単です。 環境設定 ＞ アクセシビリティ ＞ キーボード ＞ 入力ソースチェックするを外すだけでした。 1....
世界初のwwwウェブサイトはこれ。
2015.9.26 ネット社会このサイトは再公開されました。しかも同じドメインで登場です。 しかも見ていただければわかるように、文字だけ。 作ったのはTim Berners-Leeさん。（ティム・バーナーズ＝リー） イギリス人です。 ホームページの生みの親ですね。 サイトはこちらです。ソースコードもご覧ください。 The World Wide Web project http://info.cern....
Adobe Edge Reflow CCとEdge Inspect CCでレスポンスが数分で。。。
2015.9.25 Adobe Edge Inspect CC Adobe Edge Reflow WEBツールEdge ReflowはPhotoshopでデザインをしてブラウザでのカンプが必要なときに役に立ちそうなソフトです。 Edge Inspect CCはライブビューができるソフトですがEdge Inspect CCについては長くなったのでこちらの記事にかきました。「Adobe Edge Inspect CCのスマホでライブプレビュー」 ただ、プロが使えるか！？となるとさすがにこれでは納品でき...
コーディングの注意点-HTML5のシンプルな基本構造を作成
2015.9.24 CSS HTML5HTML5のテンプレートを作成しようと思います。Photoshopでデザインする際にレイヤー名をいつも悩んでいたので調べていたところ結局HTMLのタグまで作ってしまいました。 参照記事 テックレポート - TechReport https://www.cyberagent.co.jp/techinfo/techreport/report/id=7926#section10 Goog...
Adobe Edge Inspect CCのスマホでライブプレビュー
2015.9.24 Adobe Edge Inspect CC Adobe Edge ReflowAdobe Edge Inspect CCを使うと簡単にiOS、Androidでの端末で確認ができます。 iOS、Androidをそれぞれ別々にしかも同時にライブプレビューをしてくれます。 すごい便利ですねー。 まずはこのイメージをみてくれると簡単に説明ができます。（画像が荒いですがご勘弁。。） [fvplayer src="http://www.yoshidablog.com/wp-...
Adobe Photoshop CC 2015の細かい画像出力について
2015.9.23 Adobe Photoshop ◯◯の方法 勉強会の資料Adobe Layer NamerですがAdobe Photoshop CC 2015では使えないのでしょうか？ 私のAdobe Extensionにはインストールしているのに、Photoshopのエクステンションには表示されません。 同じ現象の方いますか？？？ ただ、もっと簡単な方法を見つけました。「Adobe Layer Namer」の代替え方法です。それがパラメーターでの出力です。...
photoshopで「 Font Awesome」アイコンを利用する（フォントインストール編）
2015.9.21 Adobe Photoshop ◯◯の方法1.ダウンロード Font Awesome http://fortawesome.github.io/Font-Awesome/ 2.解凍したファイルの中のフォントをインストール 3.Photoshopを再起動しフォントを「FontAwesome」にして、チャートシートからコピペするだけでオッケー。 Cheatsheet http://fortawesome.github....
photoshopで「 Font Awesome」アイコンを利用するプラグイン。
2015.9.21 Adobe Photoshop ◯◯のインストールAdobe CCになってから表示されなくなりました。フォントとして利用するのが正しいようです。 photoshopで「 Font Awesome」アイコンを利用する（フォントインストール編）の方をご覧ください。 もしくは、同じようなアイコンでプラグインとして利用できるflaticonもおすすめです。 photoshopでアイコンを使いこなすプラグイン「flaticon photoshop」の...
Sass
gulp
Emmet
PHP7
WEBフォント