ARCHIVE  ENTRY  COMMENT  TRACKBACK  CATEGORY  RECOMMEND  LINK  PROFILE  OTHERS
<< October 2017 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 >>
2016.02.05 Friday

スポンサーサイト

一定期間更新がないため広告を表示しています

2014.04.23 Wednesday

ホームページリニューアル

スティーブン・セガールの沈黙シリーズをコンテンツにしたホームページを作っていたのですが、このたび、リニューアルしました。
http://under-siege.appspot.com/

技術的なところでは、以下を使ってみました。
bootstrap
jQuery
magnific-popup
jQuery social button
timeQuery.js
google map api
google app engine
google analytics
 
2014.03.01 Saturday

canvasでウラムの螺旋

html5のcanvasでウラムの螺旋を書きました。
ウラムの螺旋とは、1を中心に続く数字を螺旋状に描いていき、素数に印をしていくと、不思議な形が見えるという素数の視覚化の手法です。

こんな感じ。○付数字が素数。
161514  
18ィ喚12
械僑鵜↓  
20В牽10  

2014.02.18 Tuesday

chromeのモバイルエミュレータ

先日のsencha touchハンズオンで教わったchromeのモバイルエミュレータの起動方法をメモ。

1.デベロッパーツールを起動(F12キー)
2.デベロッパーツール右上の歯車アイコン(settings)を選択
3.「overrides」を選択し、「Show 'Emulation' view in console drawer」をチェック
4.settginsを閉じる(XボタンまたはESC)
5.デベロッパーツール右上のアイコン「>三」(Show console.)を選択
6.コンソールからEmulationタブを選択
7.Deviceを選択し、emulateボタンを押下
8.デベロッパーツール右上のアイコン「□」を長押して、デベロッパーツールを右に表示させると見やすい

これをやると、こうなります。
他にnexusとかkindleとか選べます。
chromeすげえ。
2013.07.01 Monday

canvasでリンク

また作ってしまいました。
そろそろ新しいこともやらないと。。

2013.06.29 Saturday

canvasでルイージ

マリオの配色を変更。
これは、html5、canvasです。

2013.06.28 Friday

canvasでスーパーマリオ

ドットインストールでcanvasを勉強したので、使ってみました。
これは、html5です。
ドットインストールは面白いなあ。
2013.03.06 Wednesday

emmet

ドットインストールでzen-coding入門をみました。
特別な記法でhtmlを効率的に書けるツールで、zen-codingの次期バージョンがemmet。
cssの記法など、かなり拡張されているようですが、zen-codingを使っていなかったので、そこはよく分からない。

sublime text2にインストールしました。(emmet)

サクラエディタにもインストール(zen-coding)

emmet(ctrl+Eで展開)
■基本
・htmlひな形
html:5

・css読み込み
link:css

・favicon読み込み
link:favicon

・script
script

・リンク
a:link

・メール
a:mail

・input
input:hidden

■階層と繰り返し
>:1階層下る
^:1階層上る
+:同階層
*:繰り返し

div>div>div>p^^hr

div>div>p+hr

ul>li*3

■id、クラス、連番など
#:id
.:class
$:連番

ul#menu>li.item-$*5

select[name=city]>option[value=$]*5

a[href="http://under-siege.appspot.com"]

div{menu}*5

a[href="http://under-siege.appspot.com"]{沈黙の研究}

ちょっとずつ使ってみます。
2012.11.28 Wednesday

htmlでプレゼン

htmlのプレゼンテーションのクラウドサービス。
アカウントを使って、サーバにデータを置いておけます。
オンラインなら、どこでも使えるし、ファイル出力もできるようです。
デザインもクールでよさげ。

紹介記事
2012.10.18 Thursday

HTMLベースで作成できるプレゼン用スライド

まとめがありました。
こういうのたまに見かけていたんですが、テンプレートがたくさんありました。
ネットがあればドコでもプレゼンできるし、公開も楽チンだし、カッコいいですね。
いいと思いました。
2012.07.29 Sunday

CSS Nite in Shinagawa「HTML5+CSS Web Camp 2012」

HTML5のセミナーに参加してきました。
web制作者を対象にしたセミナーですが、テーマが面白そうなので参加してきました。
内容は、
1.HTML5が拓く未来
羽田野太巳さん

2.HTML5セクションによるWeb制作の基本
益子貴寛さん

3.CSS3で変わるWeb制作
鷹野雅弘さん

4.開発支援ツールを使った最新IEへの互換対応
物江修さん

5.Internet Explorer10とマイクロソフトにとってのHTML5
春日井良隆さん

6.Productivity Future Visionを読み解く

5時間半ものセッションでしたが、興味深いテーマ、面白トーク、快適なセミナールームで充実した時間を過ごせました。


セミナーのメモ
・hgroupタグ
要らないのではないかと議論がなされているので、使用しないほうがいい。

・パララックス
webページをスクロールしたときに背景となる要素を異なる移動量で制御して奥行き感を見せる手法がいま流行。

・レスポンシブルwebデザイン
1ソースでスタイルシートを切り替えることにより、PC、タブレット、スマートフォン向けのデザインを実現すること。
それぞれの幅の境界は、
PC 768px以上
タブレット 767px - 321px
スマートフォン 320px以下
とするとよい。

が、スマートフォンで表示が変わることが、必ずしもよいことではないのではないか。
PCサイトと勝手が変わることにより、情報が探しずらくなったり、そもそも情報が減ってしまい、見たい情報がないということで、ユーザにストレスを与える場合もある。
なるほど、そういう経験あるよね。

オンラインからcss3のパラメータを設定して、形状を確認できる。
ソースも出力してくれます。

・F12開発者ツール
Internet ExplorerでF12キーを押すとjavascriptのデバッグ等が使用できるF12開発者ツールが起動する。

・IEのHTML5対応
バージョン10でだいぶ対応されるとのこと。
マイクロソフトは仕様策定がある程度、決まらないと導入しないというスタンスであったため、他のブラウザより対応が遅いみたい。
バージョン6は日本では4%程度のシェアであるため、もう無視していい。

・未来のpc

動画はマイクロソフトのビジョンなんですが、2、3年の将来には、最近、発表されたmicrosoft surfaceのようなキーボードとディスプレイが分離するタイプのPCが主流になるだろうといわれていました。
取り外したときは、タブレット端末として使用できる。

・タッチパネルの視覚障害者サポート
iPhoneやiPadは触っている部分のアプリ名やオプションを読み上げてくれる視覚サポート機能がある。
これ、優しいね。

全盲の人がiPhoneでtwitterでつぶやくまでの動画

Powered by
30days Album
PR