Chapter 6

メディア

写真:手に持たれたスマホ

ユーザーを考えた設計で満足な体験を

提供するサービスやペルソナによって、webサイトの設計は異なります。サービスやペルソナに合わせた設計を行うことにより、訪問者にストレスのないよりよい体験を生み出し、満足を高めることとなります。
わたしたちはお客さまのサイトに合ったユーザビリティを考えるため、分析やヒアリングをきめ細かく実施、満足を体験できるクリエイティブとテクノロジーを設計・構築し、今までにない期待を超えたユーザー体験を提供いたします。

拡張パターン:逆位置

写真:手に持たれたスマホ

ユーザーを考えた設計で満足な体験を

提供するサービスやペルソナによって、webサイトの設計は異なります。サービスやペルソナに合わせた設計を行うことにより、訪問者にストレスのないよりよい体験を生み出し、満足を高めることとなります。
わたしたちはお客さまのサイトに合ったユーザビリティを考えるため、分析やヒアリングをきめ細かく実施、満足を体験できるクリエイティブとテクノロジーを設計・構築し、今までにない期待を超えたユーザー体験を提供いたします。

バリエーション:画像半分サイズ

写真:手に持たれたスマホ

ユーザーを考えた設計で満足な体験を

提供するサービスやペルソナによって、webサイトの設計は異なります。サービスやペルソナに合わせた設計を行うことにより、訪問者にストレスのないよりよい体験を生み出し、満足を高めることとなります。
わたしたちはお客さまのサイトに合ったユーザビリティを考えるため、分析やヒアリングをきめ細かく実施、満足を体験できるクリエイティブとテクノロジーを設計・構築し、今までにない期待を超えたユーザー体験を提供いたします。

カード

写真:HTMLコードが写っている画面

webサイト制作

ユーザーにベストな体験を提供するクリエイティブとテクノロジーを作り上げます。

拡張パターン:バッジ付き

New
写真:HTMLコードが写っている画面

webサイト制作

ユーザーにベストな体験を提供するクリエイティブとテクノロジーを作り上げます。

拡張パターン:リンク

拡張パターン:3カラム

※右端の要素のmargin-rightの打ち消しにnth-of-typeを使用していますが、カラム内の各カードに要素が混在する場合(divとaが混在しているなど)、打ち消しが意図どおりに適用されません。書籍及び下記サンプルコードではnth-of-typeとなっていますが、nth-childへの書き換えを推奨します(続く4カラムも同様)。

写真:HTMLコードが写っている画面

webサイト制作

ユーザーにベストな体験を提供するクリエイティブとテクノロジーを作り上げます。

写真:SNSアイコンが写っている画面

デジタルマーケティング支援

自社のマーケティングを支える最適なデジタルマーケティングツールの導入をサポートします。

写真:解析レポート

解析・レポーティング

ユーザー行動を分析し、より良いサイトを作り上げるためのアイデアをご提案します。

拡張パターン:4カラム

写真:HTMLコードが写っている画面

webサイト制作

ユーザーにベストな体験を提供するクリエイティブとテクノロジーを作り上げます。

写真:SNSアイコンが写っている画面

デジタルマーケティング支援

自社のマーケティングを支える最適なデジタルマーケティングツールの導入をサポートします。

写真:解析レポート

解析・レポーティング

ユーザー行動を分析し、より良いサイトを作り上げるためのアイデアをご提案します。

写真:都会の夜景

多言語webサイト構築

グローバル視点での戦略から、構築まで一貫してサポートします。

テーブル(水平)

名前 半田 惇志
所属 株式会社24-7/株式会社パンセ
職種 テクニカルディレクター/シニアエンジニア
得意分野 CSS設計、HubSpot CMS

拡張パターン:メディアクエリ時のスクロール

名前 半田 惇志
所属 株式会社24-7/株式会社パンセ
職種 テクニカルディレクター/シニアエンジニア
得意分野 CSS設計、HubSpot CMS

テーブル(垂直)

名前 所属 職種 得意分野
半田 惇志 株式会社24-7/株式会社パンセ テクニカルディレクター/シニアエンジニア CSS設計、HubSpot CMS
長澤 賢 株式会社パンセ エンジニア Vue.js/Nuxt.js
海老江 優太 株式会社パンセ エンジニア Adobe XD

テーブル(交差)

名前 所属 職種 得意分野
半田 惇志 株式会社24-7/株式会社パンセ テクニカルディレクター/シニアエンジニア CSS設計、HubSpot CMS
長澤 賢 株式会社パンセ エンジニア Vue.js/Nuxt.js
海老江 優太 株式会社パンセ エンジニア Adobe XD

ページャー

タブナビゲーション

CTAエリア

お気軽にお問い合わせください

弊社のサービスや製品のことで気になることがございましたら、お気軽にお問い合わせください
→問い合わせする

料金表

  • STARTER

    6,000 円/月

    初めてインバウンドマーケティングを行う企業向けのスタートアッププラン

    費用に含まれるコンタクト数
    1,000件
    月間サイト訪問者数
    3,000
    月間Eメール送信数上限
    最大コンタクト数の5倍
  • PRO

    96,000 円/月

    マーケティング担当者の欲しい機能が網羅されたおすすめプラン

    費用に含まれるコンタクト数
    1,000件
    月間サイト訪問者数
    無制限
    月間Eメール送信数上限
    最大コンタクト数の10倍
  • ENTERPRISE

    384,000 円/月

    マーケティングチームでインバウンドマーケティングを行える高機能プラン

    費用に含まれるコンタクト数
    10,000件
    月間サイト訪問者数
    無制限
    月間Eメール送信数上限
    最大コンタクト数の10倍

バリエーション:料金表テーブル

 

STARTER

6,000 円/月

PRO

96,000 円/月

ENTERPRISE

384,000 円/月

費用に含まれる
コンタクト数
1,000件1,000件10,000件
月間サイト
訪問者数
3,000無制限無制限
月間Eメール
送信数上限
最大コンタクト数の5倍最大コンタクト数の10倍最大コンタクト数の10倍

FAQ

Q どのようなCMS開発の実績がありますか?
A

WordPress、Movable Type、HubSpot CMS、Sitecoreの開発実績がございます。

Q 普段使用しているCSSの設計手法を教えてください
A

OOCSSをはじめ、SMACSS、BEM、FLOCSS、PRECSSなど一通り対応可能です。どの手法を使用するかは、案件の特性を考慮し都度選定しています。

アコーディオン

WordPress、Movable Type、HubSpot CMS、Sitecoreの開発実績がございます。

WordPress、Movable Type、HubSpot CMS、Sitecoreの開発実績がございます。

ジャンボトロン

貴社のビジネスに適切な戦略をご提案し
「成果」に貢献いたします。

ポストリスト

順序なしリスト

  • webコンサルティング
  • デジタルマーケティング支援
  • CMS構築
  • CSS設計

拡張パターン:横並び

  • webコンサルティング
  • デジタルマーケティング支援
  • CMS構築
  • CSS設計

バリエーション:ネスト

  • webコンサルティング
  • デジタルマーケティング支援
  • CMS構築
  • CSS設計
    • BEM
    • FLOCSS
    • PRECSS

順序ありリスト

  1. webコンサルティング
  2. デジタルマーケティング支援
  3. CMS構築
  4. CSS設計

バリエーション:ネスト

  1. webコンサルティング
  2. デジタルマーケティング支援
  3. CMS構築
  4. CSS設計
    1. BEM
    2. FLOCSS
    3. PRECSS