sprouthead blog

ｊQuerymobileのblogページにて。 １０月２８日の記事です。 「ThemeRoller for Mobileが発表されました（ベータ版）」

ThemeRoller for Mobil

続きを読む

今回は

iOS・Androidのハイライト表示の設定について

紹介します。

（以下　iOS→iOSのMobile　Safari、Android→Androidの標準ブラウザ）

リンクをタッチした時に出る(iOSでは)影だったり、(Androidでは)枠。
その色が設定出来るんです。

今回はCSS３を使った方法とjsを使った方法を紹介したいと思います。

iOS・Androidのハイライト表示の設定について

まず初めに。

今回CSS３とjsを使う方法を紹介しますが、iOSとAndroid同じ記述で同じ動きをするものはｊｓを使用するもの、のみになります。
CSS３を使用する方法では、iOSとAndroid別々の方法を紹介しています。

続きを読む

HTML５のセクションについて

HTML５ではコンテンツの構造的な区切りにsectionを使うのが基本である。
それらの中でも特定の役割を持つものにはnav、article、aside、hgroupなどを用いる。
これらはセクションという性格を備えつつ、さらに特定の役割を持つことに理解をしておこう。
セクション定義要素の中では、通常のブロックレベル要素で内容をマークアップすればよい。
divはCSS適用の為に限定的に使い、構造を示す目的では使わない。
(WebDesigning 2011 11月号より)

こんな感じで、マークアップについてはその他いろいろあるのですが、
HTML5ではこれまでより、
よりマークアップについて細かく記述しなければならなくなりました。
今回は、ページの構造を示すセクションについてお話を。

続きを読む

ｊQuerymobileのblogページにて。

１０月１９日の記事です。
「ｊQuerymobile1.0RC2がリリースされました」

とのことです。

そして、そこに、以前「jQuery mobileでiphoneぽい日時セレクト画面。」で書いた
日付・時間をいっぺんに選択でき、iphoneのようにくるくる選択出来る仕様のものが！

←クリックでブログページ行けます。

しかも今回はHTML５を使用したinputタグの入力タイプで出すことができるようです。

続きを読む

中身の量が違うボックスを指定するだけで、
そのボックスのheightを同じ高さに揃えられるというjsを紹介します。

equalbox.js

 

サンプル

続きを読む

私がコーディングするときにいつもお世話になっているDreamweaver。
いろんな機能があって、便利ですよね。

私は全て使っているわけではないですが、自分なりに使いやすくカスタマイズしています。
その中で、「こんな機能があったらいいのになあ・・」と思っていた?機能。

KAYACが作っていました！

Dreamweaverで閉じタグコメントを挿入出来る拡張機能

続きを読む

スマートフォン向けサイトのコーディング　「viewportについて」

これまで、スマートフォン向けサイトのコーディングについて勉強してきたのですが、
いざ、作ってみるとちゃんと理解しきれていなかった部分や、方法がいろいろあって、
結局どれを使えばいいのか・・・など土壇場で迷ってしまいました。

スマートフォン向けサイトは、もう結構数も増えてきましたし
コーディングの仕方が書いてあるサイトや本も出てきています。

ですが、まだまだやり方が定まらず日々勉強中です。
なので、勉強していく中で学んだことなどを少しずつ書いていきたいと思います。

まず初めに、スマートフォン向けサイトをコーディングする上で。

スマートフォンに搭載されているブラウザはHTML５を積極的にサポートしています。なので、ぜひ！HTML５で書いてみてください。 また、容量を抑えるために画像はできるだけ控えて、できるだけCSS３などで表現する。

私もHTML５で書きます。HTML５慣れていくためにも・・。
CSS３に関して、画像はできるだけ控えて・・というのも結構難しいですよね。
でも、角丸など、今までよく出てきた、悩まされたような部分には使えそうですね！
その他、画像や図形をCSS３で表現する！とかになると大変だろうなあ・・。とおもいます・・。

前置きが長くなりましたが、今回の本題。 私が一番悩まされたもの。いえ、悩んでるもの。

viewportについて。

続きを読む

先日、読んだ本の紹介。

「効率的なサイト制作のためのDreamweaverの教科書（CS5.5対応版）」

とりあえず、読む人は
HTML・CSSなどが分かっていることが大前提。
そして、DWを使ったことある、サイト制作をしたことがある、という人のが分かりやすい
といった内容でした。

一言でいうと、「読みやすい！」本でした。

続きを読む

デフォルトスタイル・リセットスタイルについて

・ブラウザには、初期状態で適用されるスタイルがある
・各要素に対して文字の装飾やマージンなどの指定がされる
・強制的なスタイルがオリジナルスタイルの邪魔になることがある

などなど。

そんなデフォルトで適用されてしまうスタイルを”リセット”するのがリセットスタイルです。

続きを読む

高さが異なるボックスをきれいに並べる際、便利なプラグインです。
このようなデザイン、たまに見かけます。
cssではちょっと工夫が必要なレイアウトですが、この、「jQuery Masonry」を使うと、きれいに・簡単に出来るんです。

jQuery Masonry

ちょっと見にくいかもしれませんがサンプルを・・・

サンプルページ

 

続きを読む