HTML5

Webサイトのスマホ対応方法 2種類の仕組みと特徴を解説

こんにちは、デジタルマーケティングチームの林です。

スマートフォンやタブレットが普及し多くのウェブサイトが様々な端末で閲覧されるようになったことから、近年のウェブサイトは閲覧環境に合わせて最適な表示をすることが求められています。

サイト訪問者のほとんどはPCからの閲覧者だから…
スマホ対応したいけど、お金かけられないから…

と、PCサイトのままにしていたけれど、そろそろスマホ対応を考えているという方も多いのではないでしょうか。

今回はWebサイトをスマホ対応するときの方法について、スマホ専用サイトの作成とレスポンシブWebデザインについて解説します。また、レスポンシブWebデザインの中でも代表的なレイアウト3種をとりあげます。

  1. スマホ専用サイト
  2. レスポンシブWebデザイン

– リキッドレイアウト
– フレキシブルレイアウト
– 固定幅レイアウト(部分的レスポンシブWebデザイン)

自力でスマホ対応をしたいけどどうしたらよいのか分からない方、Web制作会社に依頼する前に基礎知識を得たい方におすすめの記事です。

続きを読む


WebGL、three.jsでワクワクしてみた

この記事は 『CRESCO Advent Calendar 2018』 19日目の記事です。

こんにちは、UXデザインセンターのsgi-changです。

2018年もあと少し、気持ちも慌ただしくなってきた師走にちょっとワクワクしてみたいなと思い、

気軽にブラウザで3Dコンピュータグラフィックス(以下3DCG)を実装できる、WebGL、three.jsの記事を書いてみました。

とりあえず、今日はテキストエディタだけあればコピーandペーストで実装できる超簡単3DCGを実装してみます。

WebGL、three.jsとは?

実装の前にざっくりとWebGL、three.jsについて説明します。

続きを読む


1dayインターンシップでのJavaScriptプログラミングゲーム Sourcer の活用紹介

この記事は 『CRESCO Advent Calendar 2017』 20日目の記事です。

こんにちは。スマート・ソリューション・センターの benishouga です。

今回はクレスコで行っている 1dayインターンシップの取り組みとそこで利用している JavaScriptを使ったプログラミングゲーム Sourcer の作りについて紹介します。

続きを読む


「HTML5感。~HTML5の最新動向ともっと使いたいHTML5のノウハウ~」に参加してきました

こんにちわ、ビジネス開発室の ton です。

2/11(土)にLPI-Japanさま主催のイベント、「HTML5感。~HTML5の最新動向ともっと使いたいHTML5のノウハウ~」に参加してきました。このイベントは”HTML5の最新情報を楽しんで聴けるセミナー”として、定期的(3か月毎くらい)に開催されているもので、今回が5回目の開催になるそうです。ちなみに私は約1年ぶり、2回目の参加になります。

開催概要
http://html5exam.jp/newsdetail/seminar20170211/

プログラム

初級者向けセッション 中級者向けセッション
ディスプレイの中のバーチャルな世界からリアルな世界に広がるHTML5
有限会社futomi / 株式会社ニューフォリア 羽田野 太巳 氏
プロジェクトを殺さないCSS設計
株式会社 ピクセルグリッド 高津戸 壮 氏
CSSの便利機能で楽しちゃおう!
NTTソフトウェア株式会社 鈴木 雅貴 氏
HTML5 Web アプリケーションのセキュリティ・マネジメント編
株式会社シーピーエス 村地 彰 氏
<input>は地味だが役に立つ
株式会社フォーク 棚澤 優介 氏
SCSSの関数機能を利用した効率的なCSS作成
株式会社コムセント 関口 和真 氏
HTML5を使った開発にも役立つVisual Studio Code
日本マイクロソフト株式会社 戸倉 彩 氏

初級、中上級者向けに分かれているところは、中上級者向けのセッションを聴講してきました。
聴講したセッションについて、概要と個人的にポイントだと思った点をお伝えします。

続きを読む


<input type=”file”>の話

こんにちは、技術研究所の ton です。
今回は、以前ご紹介した社内イベント「クレスコフェア」の出展作品開発時に、びみょーに苦戦した<input type=”file”>について語ります。

HTML5+JavaScript+PHPで<input type=”file”>を使ってファイルアップロード機能をつくります。
途中のサンプルコードはそれだけで(たぶん)動くようになっているので、よろしければお試しください。

続きを読む