ウェブデザイン・メディア勉強日記

ファビコンジェネレーターよりきれいなファビコンをつくる方法

ファビコンジェネレーターは便利だけど、塗り絵的な感じで、なかなか思うようなファビコンができない。いろいろググってましたら、Photoshopでプラグインを入れればカンタンにできるんですね♪

方法はサイトからダウンロードして、ファイルをダブルクリックして中身のプラグインをアプリケーションの所定場所に入れるだけ♪超カンタン!!

1. Photoshopを一旦終了
2. サイトから、お使いのCSのバージョンをダウンロード
3. ファイルを開いて、プラグイン（ICOFormat.plugin）を所定の場所に入れる。photoshopアプリケーション⇒Plug-ins⇒File Formats

「別名で保存⇒ico保存」これで完了です!!!

Photoshopファビコンのワンポイント

• ico保存形式が表示されない場合は解像度が大きい可能性有り、解像度を下げてみましょう。
• ファビコンを変更しても反映されない場合は、一度ブラウザの履歴・キャッシュを削除（自己責任でネ）

実際Photoshopでファビコンを変更してみた

■変更前
ジェネレーターで塗り絵的にしかつくれなかったので、それで何か表現できないか考え、商用フリー・無料素材が１秒でわかるイメージで「￥０」を作成

■変更後
きれいに表示されましたが、テキストが小さすぎて見えない。これだと変更前の１秒でわかるファビコンの意図は消えてしまう。

■完成!!
そこであいだをとって、食器フレームの中にゼロを目一杯に入れて作成。食器フレームはきれいだけど、最初の「￥０」のシンプルさには勝てないと思い、「無料」感は二の次にした。
▶︎食器フレーム無料素材

まとめ

きれいな、鮮明なファビコンをつくりたい方は、PhotoshopのICOpluginがオススメ！

いま勉強してる本

↑ちなみにプチ情報のボタンは上記の書籍をお手本に作成しました♪

一年程前永江さんのメルマガを読んでから実際いろいろやってみようと思い、コードアカデミーやドットインストールでhtmlはタグぐらいは学びましたが、なにか目標が「WEBに強くなる」みたいな漠然としていて、いつの間にかやめてしまいました。で、永江さんのtweetに無料ワードプレステーマのstinger3のつぶやきをみて、なかなか面白そうだなとはじめた次第です。

WEBに強くなるから、サイトを作ってみたい！に変わったわけです。

「WEBに詳しくなりたい」という漠然とした目標から、より具体的な目標「Webサイトをつくってみよう」に変わり、知識の蓄積から行動することになりました。

（詳しい経緯については以前書きましたので、関連記事「ユーWEB担当やりなよ♪」ををぜひ読んでみて下さい）
ド素人がWeb担当になって困ったこと怒ったこと

「分からない」からはじめるstinger3

「文系朗報〜」の記事で書いた通り、全くの初心者にも理解できるように、レンタルサーバーの紹介からインストール、セッティング→カスタマイズ、さらには質問コーナーまであるstinger3。

stinger3のナビゲーションの通りに進めていけば、普通にサイトが完成します。そこからカスタマイズ方法や他のstinger3を使用しているサイトをみて、「こうしたい」「ああしたい」が出てきて、そこから「なぜ？できない」の勉強に変わります。これによって壁がなく知識だけ詰めていた頃とは違い、具体的に改善策を探る勉強方法に変わりました。

現状わたしがstinger3で行ったカスタマイズをあげていきます。

注意）本来なら他のサイト同様コードを紹介すべきですが、わたしのソースの書き方が果たして合っているのかどうか、現状のレベルではわかりません。ですので、不便ではありますが、どのサイトを参考にしたかのみを記しております。

子テーマをつくる

ドレスデザイナーsakiyamaさんのサイト。きれいな背景画像です。まずこちらで子テーマの作成を勉強しました。
Saki Sugiyama/24歳ドレスデザイナー、もうすぐ一児の母。渋谷在住個人事業主の日々の記録

メニューの設定・ロゴ画像・背景色の変更

ほんとこの通りやったら素人でもできちゃう、さすがです！！

stinger3公式サイト

ファビコン・Aboutの文字を変更・コメント機能をDisqusに変更

りゅんたさんのサイト。こちらはstinger3のカスタマイズまとめもあり、わかりやすい！

Ryun’s Web Note

ロゴ画像を動かす・文字の装飾

女性ならではの目線でstinger3を楽しくカスタマイズされてます、オススメです！

札幌在住えけこの脳内探索メモ

Google検索窓に変更

記事タイトルの２ステップできるの通り、おかげさまでカンタンにできました♪

TFCC損傷で2度も手術した体験記と気になるものまとめ

フッター部分をメリハリ利かせたい!!

禅的なシンプルさがいいstinger3。「外に向けて発信するサイトコンテンツ」と「内部情報（プロフィールやSNS」を分けたかったので、こちらのサイトを拝見することで非常にスムーズにできました!

ブログの効果的な運営方法とマインドハック

新たな課題次のステップへ

現状のカスタマイズでこうやりたいという部分は完了しましたが、見た目はオッケーですが実際それがまずいコードの書き方なのかどうかが分かりません。これは次の課題として勉強を深めていこうと思います。下記は参考になった書籍など

ほぼ知識ゼロで役立った書籍

◉Web全般のことに書かれているから、興味が広がり、Webの勉強をはじめた人にモチベーションの持続としてオススメ。もちろんメルマガも

[amazonjs asin=”B00AQ3K4TI” locale=”JP” tmpl=”Small” title=”素人の顧客の意見は聞くな　永江一石のITマーケティング日記”]

◉タイトルの通り、超イージーで超分かりやすい書籍。どれ読んでも理解できないという方にマスト本

[amazonjs asin=”4899773420″ locale=”JP” tmpl=”Small” title=”12歳からはじめるHTML5とCSS3″]

◉stinger3も紹介されてるワードプレス初心者向け書籍

[amazonjs asin=”4798039705″ locale=”JP” tmpl=”Small” title=”はじめてのWordPressリデザイン&カスタマイズ (BASIC MASTER SERIES)”]

少しわかってきて、今役に立っているもの

ガンガン２冊！！

[amazonjs asin=”4798114073″ locale=”JP” tmpl=”Small” title=”検索にガンガンヒットさせるSEOの教科書”]
[amazonjs asin=”B00CPEDNN0″ locale=”JP” tmpl=”Small” title=”すぐに使えてガンガン集客！WEBマーケティング111の技”]

次に読んでみようと思っている本

◉ほぼ日サイトでも紹介されている山田ズーニーさんの文章本

[amazonjs asin=”4569617360″ locale=”JP” tmpl=”Small” title=”伝わる・揺さぶる!文章を書く (PHP新書)”]

CSSとか色の使い方に関しては、また後日書こうと思います。同じようにstinger3をはじめた方に少しでもお役にたてれば幸いです。

趣味程度に写真を撮るので、先日newspicksの電車スローモーション撮影の映像には思わず見入った。

なんか黄泉の世界、無の世界って感じでキアヌの『コンスタンティン』って映画を思い出した。これって、panasonicのGH2をハックしたヤツで撮ったのかなと思って調べてみたら、もろ自作のカメラで撮ってる。
（気になる方は「adammagyar camera」で画像検索してみてください、本格的カスタムカメラ!!）

３年前は遠い過去、商業カメラマンと営業カメラマンの写真を仕事にする難しさ

この方はサイトを拝見するとプロのカメラマンみたいだけど、自分で調べてなんだけど、それを生業としてるかどうかなんてどうでもよくて、もうプロとかアマとか境目が分からなくなってきた。

振り返ると３年前、商業カメラマンと営業カメラマンの二人から写真を仕事にすることについて興味深い話しを聞いたことを思い出した。商業カメラマン（コマーシャル関係）のベテランと話したときは「これからは職業カメラマンとして食べていくのは、ぼくらの時代と比べて難しくなってくるだろうねぇ、写真作家みたいなプロとアマの中間みたいなカメラマンがどんどん増えてくるんじゃないだろうか」とおっしゃっていた。３年前もそんな感じだったけど、あのときはまだメディアで取り上げられてドカンと表舞台に出るような感じがあったけど、今やハイアマチュア郡が大きすぎて拾い上げきれてない感じ。また〇〇の名工といわれる営業写真の大家と話したときは「昔は写真館には”お金を払って、写真をとっていただく”という構えがあったが、今やケータイやデジカメで撮影することが生活の一部になったため、そういう考えを抱くひとは少なくなってきた」

この話しで共通するのは、数ある中のひとつの視点として、プレイヤーが少ないことで専門的な職業として需要があったものが、みな多少上手下手はあれど簡単にそれなりにマネできる時代になり、結果くえなくなった。一つや二つヒットを飛ばして、そこからポジショントーク的に自分をブランドとして固めようとしても、くえなくなってきている。

食べ物とか薬とかも、成分を見える化できる簡易キットみたいものが出てくれば、一気に食べ物の選び方や薬剤師の資格などの必要性も問われるだろうし、専門職であっても、ある境目から急に必要性がなくなることも出てくる。自動運転や自動配達による運転手、運輸ドライバーなどは2015年（自動運転車リリース目白押し）以降どう変わっていくか注目している。
20世紀に栄えた産業がよくいえば成熟期、悪く言えば衰退期に入っている現在。どんな職業に就いていようが安心はできないわけだけど、ここ数年でひとつ答えが出たことは、「新しいことにふれること、情報収集も大事だけどそれよりも大切なことは体験すること」頭でっかちの食わず嫌いが、この時代真っ先に路頭に迷うということはハッキリしてきた。

[amazonjs asin=”B0009Z1B1S” locale=”JP” tmpl=”Small” title=”コンスタンティン DVD”]

いぜん孫正義さんがTwitterで自分の考えを発信し、即座に意見やアドバイスが返ってくることに「外脳（右脳左脳とは別の新たな脳）を得た」と言っていたが、NewsPicksは有名無名のさまざまな発信者の意見のたまり場、集合知として外脳新聞といえる。
一昨年から有料メルマガを多いときで10本ほど読んでいて、マンネリ化してくると読む箇所は共通していて、発行者の気になるニュースと読者に対するQ&A、この２つ。
有料メルマガで期待していたひとつが、大量に、それもタダで見れるのだからコレは本当に待ちに待ったサービスだと感じた。
NewsPicksが出るまでは一日のニュースにふれる頻度は、テレビのニュース番組＜紙の新聞＜gunosy,smartnewsだったが、NewsPicksがリリースされていまは一番接触頻度が高いメディアになっている。
今後NewsPicksがどうマネタイズしていくのか注目していきたい。
リクエストとしては有料メルマガのQ&A方式を有料にして有料会員には、質問と回答が見れるかたちにして、回答した識者に一定の配当が入るケースに期待したい。
ただどんな有料機能がついても、cakesの週150円より低めの設定じゃないと厳しいかなと思ってもいる。
メディアの接触頻度は高いけど、接触時間が少ないのがネック。ながらスマホとかすき間時間に重宝するメディアだと思うから、毎日数分のメディアに一週間で１００円払えるかどうか。cakesがいいのは、コンテンツ滞在時間が絶妙なところ。NewsPicksが有料化するのかどうかも全て個人の推測にすぎないのだが、いずれにしてもこれからも利用していきたい新たな新聞だ。

広告が広告として認識されたのは、それこそまだ数百年かもしれません。しかし考えてみれば、広く告げるという行為を大きく捉えると古代から植物、虫、動物、それに人間が縄張りとして目印や臭いをつけたりなど、あらゆる万物が生きる手段として続いているものであると考えます。
ただそうした目印やメッセージとしての広告は、インターネットで世界がつながってから、早くも絶対量を超えたのではないかと最近思うようになりました。

見せかけの終わりと広告の未来

そう思うきっかけは、昨年のステルスマーケティングと今年の食品偽装の問題。

ソーシャルメディアの台頭で、だれでも自分発信できる時代になり、ステルスマーケティングなる言葉も生まれ、文字通りなにがセールス広告か見分けがつかない。また食品偽装に関しては以前から基準が曖昧な点もあり、なぜ今？なぜこれほどまでにこの問題が取り上げられるのか？疑問に思っていました。二つに共通しているのは、見せかけ。ネットやあらゆる媒体で広告が溢れ絶対量を超え、これまで受ける側だった人々がSNSで配信する側に立ち、作り手が他者の作品の意図を探るように、そういう厳しい目線で広告に向き合う時代に入った。安い見せかけは通用しない時代になり、見せかけではない本物が伝わる時代に移行していく。量より質、それも深さのある質が求められていくのではないでしょうか。
そう考えていくと、現在進行形で質の深さを伝える広告として、ソーシャルメディアは一番大きな広告媒体になるだろうと考えます。来年はウェアラブルデバイス元年になり、AR広告などの問題も起き、広告アレルギーはますます敏感になる。広告は死にませんが、時代が進む程広告が自ら首を絞めている。そう遠くない未来、全ての広告は全世界共通のマークが入り、ウェアラブルデバイスで、見たくない広告は非表示にできるかもしれませんね。広告主の本意不本意関わらずに、消費者がみせかけと感じたものは一気に冷めてしまう。当面先はドキュメンタリー性の強いメッセージ広告、ストーリー性の強い広告は見せかけ感が薄いので効果がありそうだと考えます。

【オマケ】テレビのやらせと演出について

これも同じだと思います。従来のテレビメディアに飽きた点と、演出への拒否反応は作り手目線が無意識に働いているからでしょう。もういかに演出にこだわるかよりも、いっそ視聴者も作り手にしていくべきです。具体的に今やっているバラエティーでいうと、逃走中なら逃走者かハンターを動かせる参加型にすべきだし、テラスハウスも出演者それぞれにスマホやウェアラブルもたせてリアルタイムでファンと相談しながら進めていってはどうでしょう？テレビに映る役者（プレイヤー）を視聴者（オーディエンス）が動かす、その二つの間にケータイ大喜利のジュニアさんみたいなウォッチャーをはさめばなお良しです。

ある日紙媒体の広告営業がウェブ営業も兼務した話し

はっきりいって失敗の連続だった。

ここから先は少し長いエピソードになります。結論を知りたい方は目次から「ド素人がWeb担当者になっても困らない方法」に飛んでください。

ここからは、「ワードプレス」と言われたら「ワールドプロレス」と聞き返すぐらいのレベルだった男の、みっともない失敗例のはなしである。（プ◯ジェクトX風）

受注に関しては、広告屋やコンサルの必殺技「成功事例の使い回し」でそれほど難しいとは思わなかったが、

問題は制作から納品にあった…

紙媒体の広告屋がウェブを担当したときに気をつけること

何が売りで、それがどういう仕掛けは、売るものが変わっても心配は要らなかった。広告代理店がウェブ制作を外注先に気をつけないといけないのは、工数見積もりである。

どれだけ制作するのに時間が掛かるということなのだが、これが実に曖昧である。ネットでウェブ制作費の見積もりは山ほどあるが、そのひとつひとつの工程に制作時間がどれだけ掛かるか書いているサイトは少ない。それは内容によって当然違うし、エンジニアのスキルによる部分もあるからで一概に言えないからだろう。

問題なのは発注サイドが各制作過程でどれだけ時間が掛かるか肌感覚で分かっていないと悲劇は起こるということだ。

これが、ある程度しっかりしたウェブ制作会社ならば、「できないウェブ担当者」が発注してきても余分な時間を掛けないようなナビゲーションがしっかりしているのだが、悪いことに最初に依頼したのが個人エンジニア（後から分かって素人レベルだった）で、取引先⇒（わたし）⇒エンジニアの連携がうまく機能しなかった。

１で済むところを３の作業をしてしまい、「〇〇さんの頼みだからやりますよ」「徹夜で取組んだらできそうです」といわれ、いつの間にか（わたし）とエンジニアの立場が逆転する展開になり、こちらが「お願いするかたち」になってしまったのだ。あとで分かったことだが、「徹夜で取組んだらできそうです」の内容は5分もあれば変更可能な内容だった。

結局ウェブは完成したが、痛い思い出となった。偏に自分の能力の無さが招いたことである。

ド素人がWeb担当者になっても困らない方法

書籍で学ぶのも有効だが、なかなか実戦での苦い経験がない限り、あたまに入ってこない。

そこで第一にオススメしたいのが、永江一石の「何でも質問＆何でも回答」メルマガである。

ネットの商品開発からサイトビュー設計、集客を得意とする永江一石さんが、読者の質問に答えるメルマガ。これが実にイイ、ためになる。実際お困りの方が相談して永江さんがアドバイスする形式。参考書ではなかなかできないリアルタイムのかゆいところに手が届くのが非常にためになります。Webへの関心のモチーベーションが持続できることも重要です。

二つ目はつくること。実際ワードプレスでWebサイトをつくるのは、どんなものかやってみる。先日の記事で紹介したstinger3も永江さんのブログ経由で知った。やってみることで今まで制作サイドでブラックボックスだった部分が見えてくる。わたしのようにまだhtmlがそこそこなものでも、効果覿面だった。

オールドメディア専門の広告会社はWeb担当者を内部で新設するケースがある。

これはそもそも会社が今までWebエンジニアを雇ったことがなく能力の判断が難しく、また昨年までソシャゲー大手２社のエンジニア青田買いで、いい人材が集まらなかったことにあったからだ。

おさらい

紙媒体のオールドメディア専門の広告担当者はわたしのようなケースが今後あるかもしれないので、永江さんのメルマガを読むこと、あとは制作サイドに的確な依頼ができるように、実際stinger3をつかってWeb制作に少しでもチャレンジしてみることをおすすめしたい。

超ド素人にオススメの一冊

ワードプレスの参考書、ドットインストールや、codeacademyでも分からない人にマスト本。TENTO君のおやじギャグとともに気軽に学べます。タイトルがアレで書店で買うのは勇気がいりますけど…超オススメです。

[amazonjs asin=”4899773420″ locale=”JP” tmpl=”Small” title=”12歳からはじめるHTML5とCSS3″]

ソースコードが脊髄反射的にNGなひとへ☆彡

ワードプレスの勉強をあきらめたひとはstiger3を試すべき二つの理由

一昨日から開設した当サイトはenjilogさんがつくられたstinger3を使用しています。

stinger3は、ワードプレスはじめようとして挫折したひとは絶対トライすべきです。わたしはstinger3でソースコード拒否症がなくなりました。やる前から条件反射的に、みた瞬間に拒否反応というか条件反射的に”無理”と判断してしまうことって何でもあると思いますが、文系畑のわたしは一年前まではソースコードがそれでした。オススメする第一の理由、それは非常にわかりやすい解説が付いている点です。

ワードプレステーマを配布しているサイトは多数ありますが、ここまでひとつひとつ丁寧にダウンロードから設定、それにカスタマイズまでが事細かに書かれているサイトは見たことがありません。

ド素人のわたしでも簡単にサイトを立ち上げることができ、気軽にカスタマイズできました。stinger3導入後、ソースコードをいじりたくなってきます。無理矢理やろうとする姿勢をつくるのではなくて、じぶんから「こうしたい、ああしたい」となってくるんですね。

もう一点あげるとすれば、stinger3で分からないことがあれば解決しやすい点です。

いろんな方がカスタマイズ方法を披露していて検索すれば素晴らしいサイトがたくさんヒットします。（質問フォームでenjiさんに質問することも可能です）

stinger3がプラモデルだと感じたのは、

• パーツ交換が非常に簡単
• 分からないことが聞ける

stingr3はむかし遊んだガンダム系のプラモデルやミニ四駆のように誰でも簡単に使えて誰でも簡単にカスタマイズできる非常に優れたワードプレステーマです。

わたしと同じく、ワードプレスに挑戦するも、もう数字や英語の羅列で、お手上げ状態の方はまずここからはじめてみてはいかがでしょうか。ほんとうにオススメですよ♪

まだまだhtmlが少しわかったぐらいですが、これを機にコツコツやっていこうと思います。

stinger3公式サイト
enjilogさんのサイト