ブログ

ページ作成ツール"Marketo"を使ってみて。

こんにちは!インターン生の山田です。
今回は、“Marketo”について紹介します。

Marketoとは、ざっくり説明すると
「マーケティングに必要な機能をまとめたツール」です!
marketo_top

今回は、「デザインスタジオ」を使ってWebぺージ作成を行いました。

そこで自分が使用した機能と作成に至るまでの手順を簡単にですが説明したいと思います。


<作成手順>

まずは簡単に作成手順を説明します。

①「新規作成」のタブから、[新規ランディングぺージ]を選択

%e3%83%a9%e3%83%b3%e3%83%87%e3%82%a3%e3%83%b3%e3%82%b0%e3%81%ba%e3%83%bc%e3%82%b8

②名前、ぺージURL、を自分で決めて記入し[作成]

%e3%83%a9%e3%83%b3%e3%83%87%e3%82%a3%e3%83%b3%e3%82%b0_1
③左にある「ランディングぺージ」の項目の中に、先ほど自分で決めた名前のぺージが作られます。
%e3%83%a9%e3%83%b3%e3%83%87%e3%82%a3%e3%83%b3%e3%82%b0_2
④上の画面で、[下書きの編集]を押して、ぺージ作成開始です
 

<ぺージ編集:デスクトップ>
・基本的には PowerPointと同じ感覚で作れます
・「デスクトップ」と「モバイル」それぞれ別にぺージ作成が可能

最初は「デスクトップ」のぺージ編集を説明します。
編集ぺージ全体は下図のようになっています。
%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-11-21-13-55-30

I. 要素の挿入 → 挿入したいアイコンをキャンバスにマウスでキャンパスに引っ張て挿入

リッチテキスト:①のように、文字サイズ、フォントなど指定できる
画像     :②の画像は事前に「アクション」から画像をアップロード
拡大縮小してサイズを変更可能
長方形    :③④⑤のように、枠線の有無、透明度など変更可能
フォーム   :ページ内に自分で作成したフォームを埋め込める
 
II. ページ要素 → 挿入した要素を編集したときに使用
                              微調整、サイトの体裁を整えるときに便利
編集したい要素をクリックすると下図のようなタブが出てきます。
%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-11-28-10-21-48
例えば
③:”borderStyle”で枠付きの長方形が作れます
④:”opacity”で透明度を調整
⑤:文字と長方形を組み合わせて、見出しなどに利用
文字を2つ組み合わせて影を作成
のような使い方ができます。
また、要素の端や高さをそろえたいときは、
“left”、”top”の値を同じにすれば、体裁が整います。
 
III. アクション → ここで挿入したい画像をアップロード
「アクション」の機能は下図の通りです
%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-11-28-10-48-34
主な機能の説明をします
①画像またはファイルのアップロード:
”要素の挿入”の”画像”アイコンで画像をページ内に置くことができますが、その前にアップロードをする必要があります。
%e3%82%b9%e3%82%af%e3%83%aa%e3%83%bc%e3%83%b3%e3%82%b7%e3%83%a7%e3%83%83%e3%83%88-2016-11-28-10-58-37
 
 
 
 
 
②ガイドの表示:
図のような縦横のメジャーのようなもので、全体のバランスを見たいときなど使うと便利です
 
 
 
 
 


以上、簡単にではありますが、ぺージ作成と編集について説明しました。
今回は、自分がぺージを作成した時に使用した機能のみの説明になってしまいましたが、Marketoには便利で高機能なものがまだまだたくさんありそうです。
しかし基本的にこれだけできれば、簡単にサイトを作ることができるので、初心者でも上級者でも使えるツールだと感じました。
私も今回初めてwebぺージの作成をし、コードを書き込んだりもっと複雑なもので敷居が高いかと思っていましたが、Powerpointのように視覚的感覚で作れてかなり楽でした。
 
次回は、「モバイル版」のページ編集についてまとめたいと思います。

ピックアップ記事

  1. 最速で理解したい人のためのIT用語集

関連記事

  1. ブログ

    インドネシアのデジタルマーケティング

    こんにちは!インターン生の山本です!前回は東南アジアの…

  2. ブログ

    カスタマージャーニー作成

    こんにちは!インターンの藤本です。今日は私がここ数日間取り組んでい…

  3. ブログ

    FABフレームワークで「缶コーヒー」をビジネスマンに売る

    FABフレームワークとはFABとは、「Features=機能・特徴」…

  4. Tableau

    DirectionAPI+Tableauでドライブ時間の可視化(後編)

    だいぶ間が空いてしまいましたが、DirectionAPI+Tablea…

  5. ブログ

    正規表現について

    初めまして。インターン大学一年生の松本です。まだまだペーペーで役立たず…

  6. ブログ

    まぐれ

    こんにちは、インターンの安岡です。今回は「まぐれ―投資家はなぜ、運を…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


最近の記事

  1. 忘年会シーズンに「DCRごっこ」のご提案
  2. タグ監査ツールとは? 〜〜出来ることと導入のメリット〜〜
  3. 実はSEO以上の効果がある!?Webサイトの「監査」とは?
  4. Vertex AIのベクトル検索によってブログの検索エンジン…
  5. Google Cloud iPaaS 「Applicatio…
  1. KARTE

    KARTE:カスタムイベントでページの要素を取得して接客を出す
  2. Python

    わかりやすいPyTorch入門②(ニューラルネットワークによる分類)
  3. セッションリプレイ

    セッション・リプレイの機能強化
  4. IT用語集

    Java(ジャバ)って何?
  5. IT用語集

    UI、CUI、GUI、UXって何?
PAGE TOP