市川 雄大

Youtube動画の埋め込み方法

Youtube動画の埋め込み方法

Youtube動画の埋め込み

サポート部の市川です。
通販サイトでは動画を活用することで、ユーザーの購買意欲を高めることができます。
実店舗で商品を見たり触れたりすることができない代わりに、動画を見ることでユーザーは商品を擬似体験することができ使用感・イメージを高めることができるからです。
今回はYoutubeにアップロードした動画をサイトで活用できるようサイトへの動画埋込方法についてご紹介します。とても簡単なので積極的にご活用ください。

Read More

スマホ用サイトから電話発信できるようにする方法

スマホ用サイトから電話発信できるようにする方法

スマホ用サイトから電話発信できるようにする方法

昨今ECサイトのスマホ対応化が急速にすすむ中、閲覧ついでに気になった商品について、あるいは配送や決済方法について電話問い合わせをしたいというお客様がいらっしゃいます。今回はそういったニーズに備えて、タップで即時に電話ができる「電話発信用リンク」を設置する方法をご紹介します。
Read More

テキスト入力・メニュー選択どちらもできるdatalist要素を使ったフォームの作り方

テキスト入力・メニュー選択どちらもできるdatalist要素を使ったフォームの作り方

datalist要素を使ったフォームの作り方

今回はHTML5に新しく加わったdatalist要素を使ったフォームの作り方を紹介します。datalist要素とはinput要素にサジェスト機能を追加する要素です。

フォームを作成するとなると<input type=”text”>や<select>を使うことが多いですが、datalist要素を使うことで、これら両方の入力形式を一つのフォームで併せて実現することができます。

Read More

【表示速度改善】画像を圧縮してECサイトの読込を速くする

【表示速度改善】画像を圧縮してECサイトの読込を速くする

画像圧縮で読込速度改善

昨今のWebサイトではUX(ユーザーエクスペリエンス)や離脱率低減やのためにページ表示速度が重要視されています。サイト表示速度が遅いと顧客満足度は大幅に低下し、離脱してコンバージョンの機会が失われてしまいます。

よってサイトの表示速度のいかに速くするか対策することは、デザインやコンテンツの充実化に優先して取り組まなければならないと言っても過言ではありません。
Read More

【jQuery】開閉可能なアコーディオンパネルを作ってみよう

【jQuery】開閉可能なアコーディオンパネルを作ってみよう

開閉可能なアコーディオンパネル

タイトルをクリックすることで本文が表示されたり閉じたりを切り替えることのパネルをJqueryを使って作成することができます。様々なサイトで定番として利用されることが多いですが、画面領域が限られたスマートフォン上で複数のコンテンツを効率よく表示させたいといった場合にこそ威力を発揮する実装となります。

扱うコード量も比較的少なく簡単に実装できるので是非とも使っていただければなと思います。

Read More

jQueryUIを使って便利で見栄えのよいUIを作ってみよう

jQueryUIを使って便利で見栄えのよいUIを作ってみよう

jQueryUIを使ってみよう

こんにちは、サポート部の市川です。リオデジャネイロパラリンピックの盛り上がりが地球の裏側の日本までやってきて、競技中継を見ていると毎日寝不足になりがちです。

さて今回はjQueryUIとはjQueryが用意している便利な機能を使うためのライブラリの一種(プラグイン)です。名前の通りユーザーインターフェースに関わる機能を提供します。

Read More

【jQuery】コンテンツの表示順を簡単に入れかえる方法

【jQuery】コンテンツの表示順を簡単に入れかえる方法

JQueryを使ってコンテンツの表示順を入れかえたい

こんにちは、サポート部の市川です。毎日暑い日が続いていますが、体調などは崩されていませんでしょうか。

さて、Web制作をしていると、ページのテキストや画像といったコンテンツの順番を入れかえたいという状況がでてくるかと思います。

多くの場合、HTMLを単に書き換えるだけでよいのですが、例えばCMSでの会員登録画面の「名前」や「会社名」、「住所」といった項目の表示順を入れかえたいといった場合にシステムの都合上、設定で簡単に入れ替えることができない場合もあると思います。

今回はそのような時に、Jqueryを使って簡単にコンテンツの表示順の入れかえするための方法を紹介します。
Read More

HTML5 「Canvas」で更新可能なグラフを作る3つのステップ

HTML5 「Canvas」で更新可能なグラフを作る3つのステップ

CanvasとJavascriptでグラフを描いてみよう

今回は「HTML5 API」の機能の1つである「Canvas」の使い方を紹介します。

Canvasとはブラウザ上で図を描くためのHTML5が用意している機能です。通常グラフをコンテンツとして扱う場合、jpegやpng形式の画像ファイルを用いることも多いですが、Canvasを使えばHTML/CSS/Javascriptを使って棒グラフ、円グラフといった図を描くことが可能です。
Read More