IDEA * IDEAドットインストール代表のライフハックブログ
JavaScriptでHTMLをレンダリングするDSL·blingbling DSL MOONGIFT
blingbling DSLはJavaScriptでHTML構造をレンダリングするDSLです。 HTMLでは表示（HTML）とデザイン（スタイルシート）、そしてプログラミング（JavaScript）が混在して動作します。それらを全て一つにまとめあげ、高速に動作するDSLがblingblin DSLです。 デモのコードです。Hello Worldと表示されています。 HTMLソースです。出力の記述はありません。 出力はJavaScriptで行っています。JavaScriptがそのままHTML構造と出力内容を兼ねています。 出力されたHTML構造です。一つ前のコードの内容が出力されています。 blingblin DSLにはblingbling HTMLとblingbling CSSの二種類があります。blingbling CSSを使えばより可読性の高い構造化されたスタイル記述ができるでしょう。
納期間近でIEで崩れてる！ そんな時にも慌てないCSS開発のワークフロー
まだまだIE7、そしてIE6のユーザーをターゲットに考えているウェブサイトは多くあると思います。 そんなIEユーザーをターゲットに含めたウェブサイトを制作する上で、より効率的にCSSの開発が行えるワークフローを紹介します。 Cross-Browser CSS Development Workflow [ad#ad-2] 下記は各ポイントを意訳したものです。 1. リセットかノーマライズか 2. 基本的なレイアウトはIEで 3. 最後の確認もIEで 4. 最後の手段：IEのみスタイル 5. 問題に取り組み続ける 6. おわりに 1. リセットかノーマライズか IE, Firefox, Chrome, Safari, Operaなどのブラウザには各要素ごとのデフォルトのスタイルが用意されており、制作する際にはこれらの相違を見出し、各要素を整える必要があります。 CSSリセットとは CSSリセッ
WEB色見本 原色大辞典 - HTMLカラーコード
原色大辞典とは 原色大辞典は1997年にオープンしたネットの色見本サイトです。 9種類の色見本と色に関する各種サービスから構成されています。 色見本コンテンツは ブラウザで定義されているHTMLカラーネーム、 日本の伝統色、 世界の伝統色、 Webセーフカラー、 パステルカラー、 ビビッドカラー、 モノトーン、 地下鉄のシンボルカラー、 国鉄制定の塗装色 の9つから構成され、特に日本の伝統色は古来伝わる先人の色彩感覚を現代に伝えるものとして多くの方々から支持をいただいています。 文字列と背景色の組み合わせを試せる配色大辞典、 規則性のある組み合わせから色を選べる配色パターン。 色見本の他にも、今日のラッキーカラー、 コトバから色を解析して調合する成分解析、 ストライプを生成するストライプメーカー、 グラデーションを生成するグラデーションメーカー、 あなたの好きな色と色を調合する色調合、 サ
これがあればWebアプリケーションのデザインがすいすいできる·Bootstrap MOONGIFT
Bootstrapは今風のWebアプリケーションを開発するのに最適なデザインパーツを提供するCSSテンプレート。 BootstrapはCSS製のオープンソース・ソフトウェア。ITエンジニアが苦手にするのがWebデザインだ。作るのは良いが、それを奇麗に配置していくのがとても難しい。Webサービスが流行るか否かに技術が及ぼす影響は良くて半分だろう。残りの半分以上は見た目にかかっている。 グリッド それもあって奇麗な画像を生成したり、何かのサービスを模したデザインに人気が集まったりする。Appleの作るデザインのような、今風なWebサイトを作る際にはBootstrapが便利そうだ。 BootstrapはTwitterの開発チームが作成したWebデザインテンプレートだ。単なるHTMLのみならず、色々な機能がおり混ざっている。複数カラムのグリッド、高さの揃った複数カラムのレイアウト、基本的なHTML
Mixer2 – Beyond the JSP
Introduction For example, EC site that has multi tenant shopping mall or blog service site shuld have differrent design for each tenant/user but the functionality should be same. Or, for one site and one owner, but there is some request to continue changing web design for reason of marketing. Traditional approach of template engine such as JSP or velocity force you to write complex template that h
禅の心。機能美を探求したHTML5製音楽プレーヤ·ZEN-Player MOONGIFT
ZEN-Playerはシンプル、かつ必要最低限の機能を備えたWebベースの音楽プレーヤ。 ZEN-PlayerはHTML5製のフリーウェア（ソースコードは公開されている）。Webサイトやサービスは時間が経つにつれてどんどんリッチに、そして複雑になっていく。決して悪いことではないが、時にあまりの激しさに疲れてきてしまうものだ。 プレーヤはこんなにシンプル Webサイト側もそれを認識していて、時々リニューアルしては機能をごっそりと削ったりデザインをシェイプアップする。そうやって徐々にサービスが磨かれていくのだ。同様に磨き抜かれた、WebベースのオーディオプレーヤがZEN-Playerだ。 ZEN-Playerを表示すると大きな丸いアイコンだけが表示される。クリックすると音楽が再生されはじめる。再生中は円が回転し、再生されている様子が分かるようになっている。もう一度クリックすれば音楽が一時停止す
【レビュー】HTML5/CSS3対応のデザインテンプレート集「Free HTML5 Templates」 | エンタープライズ | マイコミジャーナル
170を越えるテンプレートからお気に入りを見つけて参考に - Free HTML5 Templates Free HTML5 Templatesにおいて、HTML5/CSS3を駆使したデザインテンプレートが数多く公開されている。このWebサイトは今年の2月11日(米国時間)に掲載されたテンプレートをはじめ、執筆時点で176のテンプレートが公開されている。掲載されている全テンプレートをサムネイルとして確認できる「Template Portfolio」はまさに圧巻だ。 Template Portfolioで登録されているデザインテンプレートを一望できる。画像クリックで拡大、more infoリンクをクリックしてテンプレート詳細画面に移動する これらのテンプレートはGoogle Chrome 5.0以上とFirefox 3.6以上に最適化されており、Creative Commons Attrib
HTML、CSSのリファレンス集·CodeBurner MOONGIFT
CodeBurnerはFirefox/Adobe AIR/Mac OSX用のフリーウェア。Webデザイナー、プログラマーであれば開発中にリファレンスが見たくなることが多いはずだ。都度Webサイトを検索しても良いが、手軽に使えるリファレンスが手元にあると便利だ。 HTMLタグの検索 特にブラウザ間の誤差があるプロパティなのか否かといった情報は重要だ。そうした情報をつかんでおけばデザインが開発がスムーズになる。多様なプラットフォームに対応しているのがCodeBurnerだ。 CodeBurnerはHTML/CSSのリファレンスを多数のプラットフォームを使って提供している。FirefoxとFirebug向けをはじめ、Adobe AIR、OSX Dashboard、Operaが現在提供されており、今後Dreamweaver版が提供予定になっている。 ソースをクリックすると説明が出る 2ペインの画面
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
新人Webデザイナーに読ませたい、初心者向けの基礎を丁寧に解説している記事
HTML5の可能性を体験できる、すごいサイトのまとめ
CSS段組1：スタイルシートだけで段組を作る方法 - [ホームページ作成] All About![CSS段組1：スタイルシートだけで段組を作る方法 - [ホームページ作成] All About](https://cdn-ak-scissors.b.st-hatena.com/image/square/31482c59a0532bdfd65d75838f05b81f8275ed0e/height=288;version=1;width=512/https%3A%2F%2Fimgcp.aacdn.jp%2Fimg-a%2F1200%2F900%2Faa%2Fgm%2Farticle%2F2%2F3%2F8%2F3%2F6%2F201711261232%2Ftopimg_original.png)