AMP編！WEBデザイナーが覚えて損無しのHTML コーディング！ | WEB CREATION NUMB
こんにちは！太偲@WEB屋です。今日は、WEBデザイナーが覚えて損無しのHTMLコーディング「AMP – Accelerated Mobile Pages」についてお送りします！AMPに関しては、SEO対策の為だけの話には留まりませんので、その辺りも含めてAMPの基本をまとめました。 WEBデザイナー、フロントエンドエンジニア、プログラマーの方々。 最近SEOやWEBマーケ担当者から、モバイルページの表示速度高速化の一環として「スマホサイトのAMP対応」について相談をされた事はありませんか？ 今回の記事では、AMPに関する基本の知識（対応コンテンツ・構造化マークアップ・HTML対応一覧・CSS）から現時点での情報まとめやAMP化（モバイル高速化）はするべきなのか？という点と、その他SEOだけではない、スマホサイト制作時の今後の方向性まで、一通りまとめてお話をしたいと思います。 AMP（アン
バズったコンテンツで集客したユーザーが、どれぐらい定着してるのか確認するには？ （第43回） | Googleアナリティクス セグメント100選
ソーシャルメディアからバズったコンテンツに集客した新規ユーザーの定着率を確認して、その後のコンテンツ制作の方向性を決めるのに役立てたいサイトによってはブログやTwitter、Facebookなど各種ソーシャルメディアから多くのユーザーが来訪することだろう。しかし面白いタイトルやユニークなコンテンツなどで集客できたとしても、それはビジネスには何の役にも立たない、一時的なアクセス増をもたらしただけかもしれない。 たとえば以前にご紹介したこちらのサイトの例では、バズった記事から他のコンテンツへの回遊はまったくなく、実質的に直帰率が100％という惨憺たる結果だった。 バズったコンテンツに押し寄せた新規ユーザーは、単なる通りすがりなのか、見込み客なのか？（第40回）ほとんどのユーザーはせっかちだ。目的以外のコンテンツまで見てもらおうというのが甘いのかもしれない。しかし、そのときに回遊してくれないとし
Googleのマテリアルデザインで使える色が並び、クリック一発でカラーコードのコピーも可能な「Material UI Colors」
Googleが提供しているモバイルOS「Android」の最新バージョン「Android - 5.0 Lollipop」にも採用されている、新しいUX体系が「マテリアルデザイン」です。マテリアルデザインの発表後、Googleは自社サービスに続々とマテリアルデザインを採用しており、サードパーティ製のアプリなどでもこれを採用したものが次々と登場しています。そんなマテリアルデザインでは使用可能な色が指定されているのですが、これで使えるカラーを並べたカラーパレットを表示してくれ、使用したいカラーをクリックすればそのカラーコードが一発でコピーできてしまうというウェブサイトが「Material UI Colors」です。 Material UI | Material Design | Material UI Colors http://www.materialui.co/ 「Material UI C
無料で使える！Webマーケティングツール＆サービス【厳選39選】
Webマーケティングに活用できるツールとサービスをご紹介します。 主要なマーケティング手法別に無料で使えるものを39個ピックアップしていますので、気になるマーケティングツールやサービスがあれば、ぜひ活用してみてください！ 検索エンジンマーケティング(SEM)全般向けツール 消費者の多くが商品・サービスの購入や申し込みに検索エンジンを利用する現在では、検索エンジンからの集客は欠かせない存在です。検索エンジンマーケティングには大きくSEOとリスティング広告がありますが、どちらにも使えるおすすめのツールには以下があります。 1.Google AdWordsキーワードプランナー GoogleAdWordsキーワードプランナーは、Googleが提供するキーワードツールです。 GoogleとGoogleのパートナーとなっている検索エンジンから、キーワードの検索回数や過去の統計を取得できるほか、リスティ
FINDJOB!終了のお知らせ | FINDJOB!
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
ここまで出来る！覚えとくと便利な「プログラム」サンプルまとめ
作成：2013/08/5 更新：2014/11/01 Web制作 > 食材を扱っているお客さんから、「ECサイト」を作ってくれと頼まれたので作成しました（事情により、CMSは使えず）。さらにメンテンスが楽になるように更新やSEOを自動化しました。今回は、CMS（WordPressとかEC-CUBEなど）を使わず仕組みを作るときに参考にした「プログラムサンプル」のまとめです。 プログラムの勉強にもなり、「へぇ～こんなことも出来るんだ」と思ったもの。今回は（PHP／jQuery／js）です。 エンジニア速報は Twitter の@commteで配信しています。 一般 画像／PHP １．画像リサイズ ２．画像に字を書く ３．画像の拡大・縮小・サムネイル出力 ４．グラフの描画 ５．画像エフェクト２５個 URL／PHP ６．ページのURLを取得 ７．URLの中身（HTML）を取得 ８．URL自動リン
［目標到達プロセス］レポートを見てみよう | Googleアナリティクスとは／衣袋教授のGoogleアナリティクス入門講座 | Web担当者Forum
まずは、目標を選択できるプルダウン（図7赤枠部分）で、見たい目標を選択しよう。目標は最大20個まで設定できるので、複数の目標を設定した場合は、そのうちの1つを選択する。図7と、次の図8では、先ほど設定した「目標1：注文完了」が選択されている状態になっている。 レポート上部（図7）では、選択した1つの目標（図7赤枠部分）に関して、期間全体のコンバージョン率（図7青枠部分）と日別のコンバージョン率の推移グラフ（図7緑枠部分）を見ることができる。 例によって設定後から集計が開始されるので、過去に遡って集計されるわけではない。いま設定したばかりの人は、設定後、しばらくしてデータが溜まってから見てみよう。 閲覧ページ移動図の見方を覚えようそして、［目標到達プロセス］レポート下部が、閲覧ページ移動図（図8）になる。図8も先ほど設定した「目標1：注文完了」が選択されている状態になっている。 目標完了まで
インストールするだけ! お手軽サイト高速化ツールGoogle mod_pagespeedはスゴかった | 初代編集長ブログ―安田英久
どれぐらいスゴいかというと、「サーバーにインストールするだけで、あとは設定ファイルをちょちょっといじれば、かなり高速化できちゃう」というぐらいスゴいのです。しかも、どんなサイトでも、どんなCMSを使っていても「インストールするだけ」。 Webサイトを高速化すると、ユーザーに優しいし、場合によっては検索結果での順位にも良い影響が出るかもしれない……それはわかっていても、なかなか本格的にサイトを高速化するのは難しいものです。 サーバー側の高速化に加えて、HTMLのつくりや画像のファイルサイズ最適化、さらにはCSSを調整しての画像スプライト化やCSS/JSファイルの結合・最適化によるブラウザとサーバーの通信本数削減などなど、実はやらなきゃいけないことがたくさん。 グーグルの提供するmod_pagespeedは、そうしたことの、かなりの部分を自動的に行うものです。 mod_pagespeedはこん
Google Analyticsでサイトの課題発見＆気付きに繋がる4つのカスタムレポート | nanapi [ナナピ]
はじめに 今回は、「カスタムレポート」というGoogle アナリティクスの機能を紹介いたします。 「カスタムレポート」とは、一文でまとめると「自分で好きな項目を選んでレポートを作成できる」機能です。自由度は非常に高いのですが、どのように設定すればよいかわからず、利用していない方も多いのではないでしょうか？ 今回は筆者が利用していカスタムレポートの中から、使用頻度が高い4つを紹介いたします。また、カスタムレポートは「共有」機能があるため、誰でもワンクリックで自分のアカウントに反映することができます。 カスタムレポートそのもの具体的な作成方法は本記事では省略しています。作成方法が気になる方、こちらの記事（gaforum.jp）をご覧ください。 カスタムレポート１：集客分析レポート サイトにとって課題となる流入元、成果に貢献している流入元などを把握する事ができます →自分のGoogle Anal
![Google Analyticsでサイトの課題発見＆気付きに繋がる4つのカスタムレポート | nanapi [ナナピ]](https://cdn-ak-scissors.b.st-hatena.com/image/square/85f3b527756dd73192fd1bd73c22fd909088f9b7/height=288;version=1;width=512/http%3A%2F%2Fp.cdnanapi.com%2Fr%2F2012%2F10%2F14%2F21%2F20121014212726_507aafaeee1c3.jpg%3Fquality%3D85%26size%3D650)
アクセス解析に苦手意識を持つディレクターまたは別業種の人のための アクセス解析具体的やり方
先日「アクセス解析しました！」と言ってPVとVisit、アクセス元検索ワード上位25件のアナリティクス画面印刷データ"だけ"を渡されて、思わず切れそうになったナカムラですこんにちは。 今回はそういう意味不明なことをして恥をかかないようになるためのアクセス解析（主にGoogleアナリティクス）の基本について書きたいと思います。また、割とディレクター歴の浅い人向けの内容になる予定ですので、アクセス解析バリバリ！な方には少々物足りない内容になるかと思います。 なんでアクセス解析なんて面倒なことをするんだろう？ それは、ざっくり言い切ってしまえば、以下のような事を考えるため。もしくは考えるための指標を探すためです。 ・サイトの「良くないところ」を探して、改善する理由を見つけ出すため。 ・ユーザーが本当は何をしたいのか？を把握して「次このサイトでなんかやるとしたら 何しよう？」を考えるため。 ・ユー
Facebookページをブログのようにボリボリ作れるサービスを作ってみた [ファンゲーター]：村上福之の「ネットとケータイと俺様」：オルタナティブ・ブログ
要するにFacebookページの追加ページをブログのようにボリボリ作れるサービスです。 『「いいね!」を押さないと見えないページがあるfacebookページ=ファンゲート』を簡単に作れます。 通常必要なレンタルサーバーを借りる必要やスクリプトの設置がいりません。 プログラムやスクリプトを作る必要もありません。 Google様のクラウドサーバー(GAE)に設置します。 Google様のクラウドなので何百万アクセスが来ても自動的に負荷分散をします。 法人様のページでも使用できます。 無料です。 導入するとファンページにHTML編集画面が出てきますので、HTMLを編集したり、画像をアップロードしたりするだけです。 単純にFacebookページの配信サーバーにも使えます。 通常必要なIFRAMEのAppをファンページに乗せるために必要なクレジットカードによる本人認証もしないで作れます。こっち
![Facebookページをブログのようにボリボリ作れるサービスを作ってみた [ファンゲーター]：村上福之の「ネットとケータイと俺様」：オルタナティブ・ブログ](https://cdn-ak-scissors.b.st-hatena.com/image/square/26932adb821eaf3a91b51e02a17c795c309cdb41/height=288;version=1;width=512/https%3A%2F%2Fblogs.itmedia.co.jp%2Fmt-static%2Fsupport%2Fassets_c%2Fuserpics%2Fuserpic-172-100x100.png)
アクセス解析を使ってサイトの課題を発見する12のステップ - Real Analytics （リアルアナリティクス）
アクセス解析ツールを導入して数カ月。いまいち使いこなせていないあなたへ。私が初めてサイトを分析する時に行う12のSTEPを紹介いたします。GoogleAnalyticsで全て対応出来るレポートです。ここで紹介するのはアクセス解析業界（？）における標準でもなんでもなく、私なりの分析手法ですので、他にも様々な方法やバリエーションがあります。 ※アクセス解析用語の基本的な知識と、GoogleAnalyticsを使ったことがある（出来ればアドバンスドセグメントを使ったことがある）人向けの方法になります。 2つの事前準備 分析に入る前に、以下の二つの事前準備を行いましょう。 A.サイト全体をじっくり見る サイトマップや主要の導線をたどってみたり、実際にコンバージョンしてみたり。自分なりにサイトの良いところと悪いところを見つけて箇条書きにしておきましょう。また、それが数字にどう反映されるか？を想像して
Googleに学ぶ、ウェブページのパフォーマンスを最適化する方法
Web Performance Best Practices 下記、ウェブページのパフォーマンスを最適化するポイントをまとめたものです。 キャッシュの最適化 往復遅延時間を減らす HTTPリクエストを減らす ロードサイズを減らす レンダリングの最適化 関連書籍 1. Optimize caching キャッシュの最適化 ブラウザのキャッシュを活用 JavaScriptやCSSファイルや画像などのスタティックなリソースは、HTTPヘッダを使用してキャッシュをロードするようにします。 アドバイス スタティックなリソースは全て、積極的にキャッシュにセットします。 時々更新するリソースのキャッシュには、ファイルパスにフィンガープリントを埋め込みます。 IEでも確実にキャッシュされるように、Varyヘッダは削除します。 URLを自動生成している場合は、Fxのディスクキャッシュで使用している8文字のラ
費用をかけずにウェブページを最適化 Googleウェブサイトオプティマイザー活用術
『MarkeZine』が主催するマーケティング・イベント『MarkeZine Day』『MarkeZine Academy』『MarkeZine プレミアムセミナー』の 最新情報をはじめ、様々なイベント情報をまとめてご紹介します。 MarkeZine Day
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
グーグルで「スマホ対応」ラベルを出すために僕がやった3つのこと | 初代編集長ブログ―安田英久