大規模サイトにおける本当は怖いCSSの話WDF.Vol.8で話したCSSについてのスライドです。 HTMLの見た目を制御するCSS。 CSS3やsassなど技術的な話題を目にすることは多いですが その運用方法について多くは語られていません。 大規模サイトを大人数で制作する状況でCSSはどうあるべきか。 DMM.comという巨大サイトの運用を通じて得た経験を話したいと思います。
コードカキタイ | プログラミングの学習・情報サイト
プログラミングスクール 忙しい社会人におすすめプログラミングスクール15選！失敗しない選び方も詳しく解説
[JS]スクロールするのが楽しくなる！多彩なパララックスのエフェクトを簡単に実装できるオープンソースのスクリプト -Jarallax
Loodsmedia ディスプレイ内のコンテンツもパララックスします。 Jarallaxの使い方 「Demo 3」を例に、実装方法を簡単に紹介します。 外部ファイル 「jquery.js」と当スクリプトをhead内に外部スクリプトとして記述します。 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="jarallax-0.2.3b.js"></script> HTML HTML自体は通常通りに実装し、アニメーションのエフェクトを適用するエレメントには参照できるようid, classなどを付けます。 <h1 class="logo">Jarallax</h1> <div class="container" id="slide1"> <h2>見出し：slide
知らない人は遅れてる？新Zen-Coding Emmet
頭の中のページ構成図をリズムで書いてHTMLに展開してくれるZen-Coding。 もはやHTMLコーダーで使っていない人はいないであろうZen-CodingがHTML5/CSS3の広まりと共にEmmetという名前に変更し、進化をとげているようです。 まだ開発中で公式アナウンスはまだのようですが先行して試すことが可能です。 Zen-Codingおさらい Zen-Codingは経験済みとして話しますが、まだ使ったことがないという方はまずこの映像から。 早速EmmetをSublime Text 2にインストール 1. Package Controlのリポジトリに追加 Sublime Text 2の標準リポジトリにはまだ入っていません。Cmd + Shift + Pで入力ボックスにadd repositoryを入力、下記のリポジトリを追加します。 https://github.com/serge
＆nbsp; は半角スペースではないというお話 (フェンリル | デベロッパーズブログ)
いかがでしょう？ WEBブラウザにもよりますが、結構実際の見た目も違うように思います。 で、冒頭の「半角スペースと 」の件ですが、ちゃんと意識しておかないと「あれ？」と思うことがあります。 「 を半角スペース (0x20) に置き換える」プログラムがあるように、「 を半角スペースに置き換えず、nbsp (0xC2A0) に置き換える」プログラムもありますから、WEB ブラウザのように 0xC2A0 を表示できる場合はいいですけど、表示できないプログラムだと困りますよね。 冒頭の画像は、わが愛するテキステエディタ Emacs だとこんな感じになります、というサンプルでした おまけとして、 を 0xC2A0 に置き換える例を。雰囲気をお楽しみください。 use HTML::Entities; use Encode; use Data::Dumpe
GTK3アプリをブラウザで使う、GTK3 HTML5バックエンド登場 | エンタープライズ | マイコミジャーナル
GNOME is a large and complex system, and thus requires some learning to use to the fullest. To make that easier, we've provided some very useful documentation. GNOME開発者のひとりであるAlexander Larsson氏が、次期GNOME3とともに開発が進められているGTK3に興味深い機能を追加した。GTK3 HTML5バックエンドと呼ばれるもので、GTK3アプリケーションがブラウザの上で動作するように振る舞う。実際にはバックエンドで実行してレンダリングやイベント処理をブラウザとやりとりするというもの。すでに開発リポジトリに追加されており、開発者やユーザの反応を見て今後の対応を検討していきたい意向とみられる。 GTK3 HTM
HTML5 canvasのテクスチャマッピング「Projective」 - 秋葉秀樹 個人ブログ
canvasで画像を歪ませる、例えばActionScript 3.0のdrawTriangleのような、メッシュを作ってマッピングするにはどうしたらいいんだろう？と思い調べてたら、やはりありました。
HTML5 Watch
# Portal for mobile/desktop browsers Full Writeup Keyboard Controls: It’s AWSD or arrow keys for movement and mouse button and mouse movement for the portal gun. On mobile, it’s hold down your finger to run toward your finger and hold down above you to jump, tap to aim and fire the portal gun, and second finger (multi-touch) to move the portal gun without firing (like to maneuver a held box).
Zen-Codingで楽々コーディング! + コツ1つ
話題のHTMLやCSSコーディングあしすとツールのzen-codingを触ってみました。すごい楽ちんこ! zen-codingって何？使い方は？という人は以下のページを見てくださいね。 Zen-Codingでできるあんなことこんなこと 知らない人は損してる？コーディングが3倍速くなるZen-Codingを導入してみた ある程度HTML/CSSのコーディングに慣れた人なら、ビジュアルデザインを含んだ文書があれば、それをもとに脳内でHTML構造に置き換えられますよね。デザインから興す人は、Photoshopを触りながら、同時に頭の中でHTMLを組み立ててる人も多いんじゃないでしょうか。 たいていの文書は、小さなパターンと大きなパターンの繰り返しだし、コンテンツに関しての試行錯誤はあっても、HTMLの記述で試行錯誤するってことは無いんですよね。(CSSのブラウザの実装の関係とかこの際忘れよう)
知らない人は損してる？コーディングが3倍速くなるZen-Codingを導入してみた - EC studio デザインブログ
最近になって急に盛り上がってきているZen-Codingをみなさんご存知ですか？ Zen-CodingはHTML/CSSをショートカット＋スニペットで簡略化してコードを書くことができるライブラリです。 独立したテキストエディタソフトではなく、既存のHTML/CSSエディタにプラグイン的に導入するものです。 Zen-Codingというのもがどういうもので、どんなすごいものなんだ、というのはこちらの動画を見てください。 ※音が出ますのでご注意ください。 Zen Coding v0.5 from Sergey Chikuyonok on Vimeo 一体何がおこわれているのか？という感じだと思われますが、今回の記事ではこのZen-Codingの導入方法と使い方の一例を紹介します。 Zen-Codingに対応しているエディタは色々あるのですが、今回は弊社の開発環境しているAptana Studio
唯一の正しいURL、カノニカルリンク? | エンタープライズ | マイコミジャーナル
Canonical Link Element Google、Yahoo!、Microsoftの検索3大手がCanonical Link要素(正規リンク)の導入で一致した。Canonical Linkは正規化された唯一のURLを情報として提供するというもので、あるコンテンツに対して複数のURLが存在する「重複ページ」に対するひとつの回答となるものだ。 Canonical Link Element: presentation from SMX Westより抜粋 Canonical Linkがどういったものであるかは、Matt Cutts氏の発表内容がCanonical Link Element: presentation from SMX Westに編集されて掲載されたため、ここを参考にするのがわかりやすい。たとえば次のURLがすべて同じコンテンツをさしているとしたら、どうすれば重複を判断でき
pisa-l10n - knok - Trac
pisaの日本語サポート pisaについて pisaは、HTMLから直接PDFに変換するソフトウェアです。 Pythonで書かれており、html5libを使ってHTMLを解析し、ReportLab?でPDFにレンダリングします。 ローカルファイルだけでなくURLを直接指定することもでき、HTML中に埋め込まれた画像ファイルも 取得、埋め込みをしてくれます。 日本語化パッチ pisa-3.0.10+jp1.diff pisa 3.0.10に対応しています。ライセンスはpisaと同じ(QTライセンス)です。 制限事項 helveticaをHeiseiKakuGo?-W5に無理やり割り当てています html5lib/reportlabの制限から変換できないページがあります 文字コード判別は、HTML内部のmetaタグによるcharset指定に頼っています パッチの内容 UnicodeCIDFon
窓の杜 - 【NEWS】WYSIWYG編集可能なHTMLエディター「Nvu」の後継「KompoZer」v0.7.10が公開
オープンソースのWYSIWYG型HTMLエディター「KompoZer」v0.7.10が、8月30日に公開された。Windowsに対応するフリーソフトで、編集部にてWindows XP/Vistaでの動作を確認した。現在、作者のホームページからダウンロードできる。 「KompoZer」は、WYSIWYG編集機能を備えたHTMLエディター。HTMLタグを手書きで記述する必要がなく、複雑なテーブルや入力フォームをマウスドラッグなどで簡単に作成できるのが特長。また作成中のHTMLソースをリアルタイムでプレビューすることもでき、プレビュー画面でタグを修正することも可能。 「KompoZer」は、「Mozilla」から派生したHTMLエディター「Nvu」の後継版。「Nvu」はv1.0公開以来更新が止まってしまっており、いくつか発見された不具合も未修正のままとなっている。そこで本ソフトは、これらの不具合
ふつうに横三角 - ぼくはまちちゃん！(Hatena)
ＣＳＳで横三角。「半キャラずらし」 (インターネット帳面) 今回はお題の通りインターネット帳面でもやってる「ＣＳＳで横三角をやる方法」。２バイト文字の三角記号は▲や▼しかないので横方向を示すことができませんでした。これをなんとかどーにかできんものかと。 ↑こんな記事があって、ちょっと面白かったので、 参考までに、ふつうの横三角のコードも書いておきますね！ » (») « («) ▷ (▷) ▶ (▶) ◁ (◁) ◀ (◀) そうそう、この中でも » って結構使えるよ！ よくサイドのメニューとかで、CSS を使って <li> の背景左端に、三角っぽい画像を設定したりするよね！ でも » をつかえば、画像がなくてもこんな感じ！ » Diary » Bookmark » Fotolife »
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
[CSS]永遠にスクロールしていたくなる、気持ちいいエフェクト -CSS Scroll Effects
The W3C Markup Validation Service
HTML5.JP - 次世代HTML標準 HTML5情報サイト
CSSでWii風のシンプルで角がまるいボタンを作る - GIGAZINE
Use standard redirects - don't break the back button! - Quality Web Tips