ブログ

ページ作成ツール"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. ブログ

    ①DMPについて

    こんにちは!インターン生の藤本です。私は、最近”海外のDMP”の調…

  2. ブログ

    「Power BI」を使ってみよう!

    こんにちは、インターン生の山本です!前回私が「Power BI」の概…

  3. ブログ

    正規表現について

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

  4. ブログ

    アドテック東京2014

    こんにちは!インターン生の宮川です。本日は9月16~18日に行われた…

  5. ブログ

    レポートビルダーについて

    お久しぶりです!インターン生の藤本です。今回も前回に引き続き(10月…

  6. ブログ

    IPアドレスとは

    こんにちは。インターン生の藤本です!今日はIPアドレスについて説明し…

コメント

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

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

CAPTCHA


最近の記事

  1. 【GA4/GTM】dataLayerを使ってカスタムイベント…
  2. KARTE を使ってサイト外でも接客を
  3. 【GA4/GTM】dataLayerを活用しよう
  4. ジャーニーマップをデジタルマーケティングの視点で
  5. ChatGPT ProからClaude3 Proへ移行した話…
  1. Adobe Analytics

    Adobe Analytics: DWHレポートをAWSのS3バケットに配信する…
  2. Amazon Web Services

    System Managerを利用したVPC内Redshiftへの接続
  3. IT用語集

    CRM(Customer Relationship Management)って何…
  4. Adobe Analytics

    Adobe AEP SDKでReactNativeアプリを計測する (iOS編)…
  5. Tableau

    Tableau Tips〜INDEX関数〜
PAGE TOP