『ライターと制作者のメディアの作り方』wordcamp tokyo2015

22
ライターと制作者の メディアの作り方 WordCamp Tokyo2015 2015/10/31

Upload: hiroki-saiki

Post on 11-Jan-2017

12.561 views

Category:

Internet


2 download

TRANSCRIPT

Page 1: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

ライターと制作者の メディアの作り方

WordCamp Tokyo2015 2015/10/31

Page 2: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

登壇者プロフィール

Page 3: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

朽木誠一郎有限会社ノオト所属の編集者、ライター、メディアコンサルタント。 大学時代にフリーライターとしてキャリアをスタートし、卒業後はメディア事業をおこなう企業に新卒入社。オウンドメディアの編集長として企画・編集・執筆を担当したのち退社。 現在は編集プロダクション有限会社ノオトに所属し、記者・編集者として勤務しながら、Yahoo!ニュース個人などで執筆、PAKUTASOのフリー素材モデルとしても活動している。

Page 4: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

おおはらかずき「検索エンジンと共に生きる人生」を送ってます。

Web制作集客用サイトを自ら作り、クライアントのWeb集客を手伝ってきて12年のフリーランスWebデザイナー。 225記事時点で100万PV超えのブログやWebサービスなど複数のオウンドメディアを運営中。 !・フリーランスWebデザイナーの仕事 ・仕事旅 ・コワーキングスペースレポートマガジン ・日本全国フリーランスWebデザイナーHP集 ・日本全国フリーランスイラストレーターHP集

Page 5: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

齋木 弘樹(司会進行)

フロントエンドエンジニアを目指しているマークアップエンジニア。 大学卒業後、17年にわたってDucatiのチューニングショップでメカニックとして勤務。 腰痛のため退職の後、Webに関する勉強をイチから始め、その後制作会社に所属。 主にHTML・CSSのマークアップとWordPressの構築を業務とする。WordCamp東京、WordBench東京など主にWordPress関連の勉強会にスタッフとして参加。 今回のWordCamp Tokyo2015では全セッションの責任者を担当。

Page 6: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

『ライターと制作者のメディアの作り方』

Page 7: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

『メディア?』

Page 8: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

『なぜWordPressなの?』

Page 9: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

『更にスケールさせていく』

Page 10: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

『ここがポイント!』

Page 11: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

コンテンツを供給する側の立場になった!

Page 12: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

最も注力していること、 気をつかっていることは?

Page 13: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

ご清聴ありがとうございました

Page 14: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

【以下、登壇者のおおはらさんから補足いただきました】

Page 15: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

WordPressでのメディア作りのポイントを お伝えできればと思います。

!

外部への全文転載は控えめに?

Page 16: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

「なぜWordPressなの?」 ・Movabletype 3 でWeb制作の仕事と個人ブログを開始。  MTのライセンスがどんどん高くなっていく事と再構築にかかる時間が勿体ないのでWordPressへの変更を検討し始めました。 ・Movabletype 4 のマルチサイト機能が得意だったので、  WordPressのマルチサイト機能がいい感じになった2.8くらいでWordPressへ完全移行しました。  参考記事:http://webdesignerwork.jp/wordpress/multisite_blog/  (WordPress マルチサイト で検索) ・色んなレンタルブログサービスがありますが、WordPressは他サービスの制約に縛られず、  自由にカスタマイズできるのが良いし、再構築が無いので速い♪ ・WordPressは検索エンジンに強いと言われていますが、  レンタルブログよりも”優位にチューニングができる”のでおすすめ。 ・Movabletype でテンプレートタグの仕組みを知っていたので、WordPressのテーマも作りやすかった。  参考記事:http://webdesignerwork.jp/wordpress/wordpress_tag/  (テンプレートタグ で検索) ・数多くの”公式ディレクトリ掲載テーマ”が備わっているので、  予算によってはクライアントにテーマを選んでもらってWeb制作・ブログ制作ができます。  完全オリジナルを求められた場合は、テーマを自作します。  参考記事:http://webdesignerwork.jp/wordpress/wordpress_themes_directory/  (WordPress 公式テーマ で検索) ・数多くの”公式ディレクトリ掲載プラグイン”があるので、  プログラムがわからなくてもWebサイトやブログの拡張や改善用の調査などができます。 ・難しいと思われがちなWordPressですが、悩みごとは公式のフォーラムや  WordBenchなどの地域コミュニティにいけば、無償で解決できたりするので探してみて下さい。  しかし、教えて君にならないようには注意です。 ・WordPressの管理画面は、スマホでも見れます。  また、アプリもあるので、スマホで記事の執筆や更新ができます。  参考記事:http://webdesignerwork.jp/wordpress/wordpress_for_android/  (WordPress アプリ で検索)

Page 17: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

「(メディア作りの)ここがポイント」(1 / 4) WordPressブログを運営する上でのアクセスアップに繋がる初期設定・運営方法を箇条書きでお伝えします。 こうみえて西日本では「箇条書きの大原」と呼ばれる事も。 !・ドメインにもブログ名にもキーワードを入れる。独自ドメインは絶対!将来の資産になる! ・サイトやブログを作ったら「Googleサーチコンソール」へ登録しよう!  https://www.google.com/webmasters/tools/home?hl=ja  『Google XML Sitemaps』プラグインをインストールして、sitemap.xmlを用意。 ・専門的なサイトやブログにするのが良い。  色んなネタを書く場合は、カテゴリやタグを作ってしっかり記事をまとめる。  勿論、カテゴリ名やタグ名はキーワード。  (私は1つのブログを3つに分割した) ・自分の興味のある事を書く(興味が無いと続かない) ・ネタを思いつかなかったら、予測検索に出てきたキーワードで記事を書く。 ・ネタを思いつかなかったら、写真を1枚撮って感想を。 ・ネタを思いつかなかったら、自分の悩みを書こう。 ・ネタを思いつかなかったら、自分の喜んだ事をを書こう。 ・たくさんのPVを望む場合は、万人受けする内容を書く。 ・細かく書く。細かく解説する。 ・出し惜しみしない。 ・言葉に魔法をかけよう。 ・煽りネタ、ステマ、子育て、SEOの記事はだいたい炎上する...。 ・ブログ(メディア)立ち上げ開始時は、ユーザーにインパクトを与えるため、更新頻度は多めで。 ・1記事1テーマが重要。色んな内容を詰めるなら別記事に分けて書こう。 ・SEOの言葉は忘れましょう。記事内容の充実が一番。 ・(検索流入など)結果が出てない時は、タイトルの変更をしてみる価値はある。  いい時は変えないのが定石。

Page 18: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

「(メディア作りの)ここがポイント」(2 / 4) !・記事タイトルは”キーワード”を入れつつキャッチコピーのようにつける。  主語(第1キーワード)、述語、補足(第2キーワードで)。  SNSでの拡散を狙うには、感情を表す言葉を先頭に。 ・記事タイトルは、”キーワード プランナー”で”検索ボリュームや組み合わせ”を調べて決める  https://adwords.google.com/KeywordPlanner ・記事のURL(パーマリンク)にもキーワードを入れよう(半角英数字)。 ・記事のURLを短くしよう。  パーマリンクは、”カスタム構造”で「/%category%/%postname%/」  もしくは「/%postname%/」を設定。 ・結果(検索流入)の出てない長文があったら、別記事として分割してみるのも価値あり。 ・伝えたい事は前(冒頭)に載せる。スマホでもスクロール無しに結論がすぐわかるように。 ・記事の最後には「まとめ・感想」を入れる。ここを毎回楽しみにしている人が多い。 ・上手な書き方とすれば、主語を「あれ・それ」などにしない。キーワードを使う。 ・ブログのコンセプトによるが、一過性の記事は書かない(検索流入には繋がらないから) ・<h1>タグでタイトル。 ・<h2>タグで小見出し。 ・日付は大きく表示させると良い(ユーザーは意外に記事の鮮度を気にする)。  テンプレートタグ/the_time ・投稿日以外に、再編集した記事の更新日を表示するのも良い。  テンプレートタグ/the_modified_date ・ブログを覚えてもらう為、自分やキャラクターを出すのもポイント。  自分を出すことで、顔もブログも覚えて貰えるし、服装が気になってお洒落になれるw ・文字の強調は、太字<strong>よりも、CSSで文字に背景色と色を付ける  (文字を蛍光ペンでなぞる感じ)。 ・文字の色は、真っ黒でOK!(#000000、#111111など) ・文章を読みやすくする為に、3行で改行、大事。

Page 19: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

「(メディア作りの)ここがポイント」(3 / 4) !・フォント書体(CSS)の指定は下記。  font-family: 'Quicksand', "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "MS Pゴシック", "MS PGothic", sans-serif;  または、  font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, Osaka, 'MS PGothic', arial, helvetica, sans-serif; ・文字サイズは思い切って大きくしてみよう♪(16px~) ・長文の場合は、冒頭文の後に”目次”を設置する。 ・記事中の写真はできるだけ大きく表示させる。 ・長文の場合は、間に”写真”を挿入すれば飽きられない。 ・写真撮影のコツ?...ずばり、とにかく”明るく撮る”ことを心がける! ・関連ページの文言を変える。  関連記事部分の見出しタイトルをデフォルト(関連記事)から興味を引き付ける文言に替える。  「こちらの記事も良く読まれています」  「こちらの記事もおすすめです」  「もう1記事読みませんか?」など。 ・アイキャッチはできるだけ付ける  クリック率・PVアップ!  アイキャッチを毎回付けるのが面倒なら、『Auto Post Thumbnail』プラグインを使えば、  記事内の写真を自動で取得する。記事に1枚は写真を入れましょう♪  参考記事:http://webdesignerwork.jp/wordpress/auto_post_thumbnails/ ・OGP手動設定、SNSボタンのオリジナル化。  参考記事:http://webdesignerwork.jp/web/facebookogp/ ・記事を投稿したらSNSでも発信する。  フォロワーに見せるだけじゃなく、リアルタイム検索のユーザーにも目を向けて記事のツイート。  どんな媒体(ブラウザ・アプリ)から見られているかわからない。 ・SNSはメディアへの導線。  ブログへの導線作りの為、facebook、twitterはしておいた方が良い。

Page 20: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

「(メディア作りの)ここがポイント」(4 / 4) !・Webページ表示の高速化。  1. サーバーの移動。   WordPressの高速化に力を入れているサーバーに変えましょう。  2. 画像を圧縮するプラグインを入れよう。   『EWWW Image Optimizer』     L ソーシャルボタンの自作    参考記事:http://webdesignerwork.jp/wordpress/sns_count_cache_share_button/     L HTMLソースの省略・軽量化  3. 重くしてそうなCSS・JavaScriptファイルがあったら削除。  4. WordPress4.2から絵文字のソースがデフォルトで入るので、functions.phpにコードを挿入し削除。   その他不要なmeta情報を削除。   参考記事:http://webdesignerwork.jp/wordpress/wordpress_tag/  5. サイドバーをおもいきって無くしてしまおう。   ウィジェットを減らそう、無くそう(意外に重荷)。   スマホは1カラムなので、PCも1カラムで良い(軽量化になる)。   ※ ページ巡回率アップ、PVアップには繋がるけど、関連記事の表示数を増やすだけでも良い。 ・できれば自作のテーマを使うのが良い。  買ったテーマや拾ったテーマなど、パーツや機能を増やす事よりも”減らす事”を考える。 ・スマートフォン対策は必須。スマホファーストでも良いくらい。  レスポンシブ化:http://webdesignerwork.jp/web/responsivewebdesign/  スマホで見た時とPCで見た時の表示の切り替え便利タグ  関数/wp_is_mobile  他にも便利なタグを紹介しています。  参考記事:http://webdesignerwork.jp/wordpress/wordpress_tag/ ・ブログのデザインをメディアのようにデザインを変える。 ・記事ページのインデックスを最優先。

Page 21: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

「最も注力していること、気をつかっていること」 !・取材。自分で体験した事を書こう。ユーザーの心に響く。 ・自分で撮影した写真を使おう。ユーザーの心に響く。 ・記事の調査・改善。googleアナリティクスアプリで何のページが読まれているかわかる。  少ないアクセス、検索で上位表示されてなければ、記事内容やタイトルの変更。 ・未完成でも迷ったらいったん公開。リアクションが記事を完成させてくれる。 ・検索やtwitter検索で「エゴサーチ」。褒められても批判されてもありがたい情報。  記事完成のためになる。自分の間違いも直せる。 ・ネタ収集、投稿記事内容を更に充実させる為、リアルタイム検索を使おう。 ・仕事と思って書けば、実のある記事が生まれるよ♪ !----------------------------- !これらはあくまでもコンテンツを引き立てるサポート的な対策です。 !何より大事な事は、「ユーザーが探し求めている答え(コンテンツ)をあなた自身の言葉で書く事」 なので、ユーザーに共感される情報の発信をしていきましょう。 !ブログ(Webメディア)にも色んなタイプがあると思いますが、 私が力を込めていいたいのは上記の言葉ですw !そして、地道に続ける事で目的は叶っていく事と思います! !月間100万PVは夢じゃない!

Page 22: 『ライターと制作者のメディアの作り方』WordCamp Tokyo2015

《最後に、私が取り組んでいる想い》 !インターネット(検索エンジン)は、大手も個人も対等に扱ってくれます。 周りを気にせず、あなた自身の言葉でメディアを運営していきましょう。 メディアは人やモノ、地域に光を当てられる。 くすぶりもがく人やモノ、地域を、私はこれからも応援していきます。 自分のメディアで。 !by おおはらかずき WordCamp Tokyo 2015 (2015.10.31 SAT)