サクサク読めて、
アプリ限定の機能も多数！
アプリで開く
2015年7月14日の記事を再編集しています。CSSの新しいバージョンであるCSS3は、アニメーションなどの新機能が追加となったことで従来のCSSよりもグッと便利になりました。CSS3を使えば今までよりも様々な表現ができ、ホームページを魅力的に演出してくれます。 しかし「使ってみたいけれども難しそう……」という方も多いのではないでしょうか。そんなCSS3初心者の方には、サンプルコードを活用することをオススメします。コピペするだけでCSS3を使ったテクニックを取り入れることができますので、試してみましょう。 今回は、CSS3でオシャレなデザインのサンプルコードをまとめてご紹介します。CSS3で実装できるオシャレなサンプルコードまとめ 1.HTML5＋CSS3でデザインしたtableのCSS＆HTMLサンプルソース5点｜株式会社LIG https://liginc.co.jp/web/h
あなたのフォームは、ユーザーが簡単に利用できますか？ もし簡単でないなら、フォーム入力を完了するのも予想以上に難しいとも言えます。 ユーザーが入力しやすく、そして入力内容の確認も簡単なフォームについての考察を紹介します。 Why InfieldTop Aligned Form Labels are Quickest to Scan by anthony 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 フォームは入力前、入力後の分かりやすさが大切 最近のフォームで見かける問題 1つ目：ラベルとフィールドを上から順番に配置した場合 2つ目：ラベルをフィールドの内側に配置した場合 3つ目：ラベルをフィールドの内側のトップに配置した場合 ラベルの配置を内側トップに変えるとどうなるか ラベルを内側トップに配置するのが機能するフォームとは まと
Please contact the OCIO Help Desk for additional support. Your issue ID is: 10963929450413919597
700億円ほどのお金がかかっているといわれ，why-kaisan.comなんてサイトも作られ巷を賑わせた第四十七回衆議院選挙の投票日が今日でした．投票日と言うことはその後に来るのは開票で，開票と言うことは開票速報がはじまるわけです． 報道各社を見てみますと，各々工夫を凝らした開票速報ページを用意しておりまして，これがなかなかおもしろいということで，その比較でございます． まとめ 長いので先にまとめです． まずテレビと新聞で圧倒的に態度が違います．テレビはあくまで番組の補助だったり宣伝が目的．ウェブページではあまり情報を出したくない様子です．一方新聞各社は トップページ上段，ファーストビューのど真ん中を思いっきり使い，文字通り全面展開といったパターンが多い．フロントエンドの実装から見ると，基本的にグラフが必要な場面ではCSS，日本地図が必要な場面では「画像+mapで部分リンク」か「要素の絶
「15億人の人々のためのフォントソリューション」、これはなかなか大胆なものを！ パソコンを使って紙やらwebやらをデザインする人の間で話題になりまくっている書体をご存知でしょうか？googleとAdobeとで呼び方が違うので、ちょっとややこしいのですが、ここはグラフィックデザイナーぽく和名で呼びましょう。 源の角ゴシックことSource Han Sansです。 Source Han Sans「さん」をつけたい気分 ダウンロードは以下より。追記：ダウンロード先を変更しました。 Source Han Sans – Browse Files at SourceForge.net Source Han Sans の入手方法について – M59のブログ ▲この辺。 無料で使える書体は今までいくつもあったし、Macの人はもともと入っている「ヒラギノ」がなかなか和文・英文とわず優秀なので、フォントを（
Photo by oatsy40 今回のpaiza開発日誌は片山がお送りします。SIerについて語られる際に「人月商売」についての問題点が良く取り上げられますが、「人月商売」がエンジニアにとってどのような問題点があるのでしょうか？ その点について今回は少し整理してみました。 ■人月とは何か 「人月」について誤って認識している人々が多い。人月とは見積りとスケジューリングに使われる仕事の単位である。「コストは実際に人数と月数の積に比例する。が、進捗はそうではない。したがって、仕事の大きさを測る単位としての人月は、疑うべき危険な神話なのだ。人月とは、人と月とが互いに交換できるという意味だからである。」 人月の神話―狼人間を撃つ銀の弾はない 人月の神話―狼人間を撃つ銀の弾はない (Professional Computing Series) 作者: フレデリック・P,Jr.ブルックス,Frede
1日中座りっぱなしのアナタに HARAChair ニーチェ グレー HARAChair ニーチェのイスです。一昔前なら10万近い椅子でした。 この椅子は腰痛や痔にやさしい椅子です。 座面がまっ２つに割れている非常に珍しいタイプです。 その為、陰部の血の巡りがよく圧迫せず、職業病の痔や前立腺炎にも効果的です。 また、骨盤を正しい位置で抑えるので腰痛持ちの方にも最適です。 背中と座椅子の割れた座面が気持ちよく体を支えてくれますよ。 [amazonjs asin="B001N2ETG0" locale="JP" title="HARAChair ニーチェ グレー 30953"] たぶん一番安い最強パソコン レノボ・ジャパンLenovo まぁ、当たり前なのですがパソコンが無ければ話になりません。 で、今一番の注目で一番安いパソコンは「Lenovo」じゃないでしょうか？Windows8やDV
![Webで生きていくなら絶対にあった方が良い道具のまとめ[改訂版]](/image.pl?url=https%3a%2f%2fcdn-ak-scissors.b.st-hatena.com%2fimage%2fsquare%2fb792ceab25163d511322e761b62b3251283ef3a6%2fheight%3d288%3bversion%3d1%3bwidth%3d512%2fhttp%253A%252F%252Frentalhomepage.com%252Fwp-content%252Fuploads%252F2013%252F06%252Fmedium_322458462-e1373186659782.jpg&f=jpg&w=240)
作成：2013/07/1 更新：2014/11/01Web制作 > 先日ECサイトを制作したときに、動きのあるサイトにしないといけなかったので、色々調べて組み込んでみたんですが、jQueryでもう何でも出来ちゃいますね。近い将来ローカルで画像なんかを編集しなくても、ブラウザだけで色々できるようになるんじゃないでしょうか。今回は定番からちょっとマイナー（Google Analytics関係とか）なものまでjQueryの小技、プラグインを集めさせていただきました。エンジニア速報はTwitter の@commteで配信しています。 もくじ スクロール １．ページ内リンク／フッターまわり／トップに戻る ２．パララックス スライド ３．カルーセル ４．レスポンシブなスライダー ５．ヌルヌルサクサクなスライドメニュー ６．サムネイル付きクロスフェードスライドショー 補助 ７．Google Ana
「なんじゃこりゃぁあ！！」 とりあえず、コレ見た時の第一声でした。本当は昨日日本から帰ってきたばかりだったので、セミナー旅行の報告記事書くつもりだったんですが、それより先にこの興奮を伝えるのが先かなと思ったので即刻共有記事〜！ 以前『ヤバイくらい簡単にプロフェッショナルなサイトが作れるStrikingly.com』の記事を書かせて貰いました、これはこれでWEBページを作る上ではこれ以上は無いんじゃないか位の楽さとクオリティでした。 しかし、今回はWEBページというよりは完全にWEBサイトを劇的に簡単に作れるという意味でのヤバさ、あとショッピングカート機能、ブログ、その他様々なページを作って運営することが出来る「Squarespace」をちょっと簡単にご紹介させて頂きましょう！ このサイト自体は僕の記憶が確かなら以前に見たことがある気がするんですが、それにしてもその時はこんなヤバさは感じて無
ChromeやGmailのアイコンはシンプルであり、一度使うと見るだけでそのアイコンが何を示すのかわかりやすくデザインされているのが特徴的です。そんな企業秘密とも言えそうなGoogleのアイコンやロゴのデザインガイドラインをGoogleのグラフィックデザイナーであるロジャー・オドン氏がBehanceで公開しています。Google Visual AssetsGuidelines - Part 1 on Behance http://www.behance.net/gallery/Google-Visual-Assets-Guidelines-Part-1/9028077Google Visual AssetsGuidelines - Part 2 on Behance http://www.behance.net/gallery/Google-Visual-Assets-Guidel
スタンドアローンで動作する19KBの超軽量スクリプト。 さまざまなレイアウトに対応できるグリッド。 表示サイズごとのブレイクポイントの設定も簡単。 resetやbox-modelなどの有用なCSSのショートカットを用意。 プラグイン機能も備えているので、拡張にも対応。 skel.jsのデモ デモはシンプルな構成のページが表示が用意されています。 まずはデスクトップサイズとして、幅1200pxで表示してみます。 デモページ：幅480pxで表示 skel.jsの使い方 jQueryや他のスタイルシートなどを用意せずに、すぐに利用できます。 Step 1: 外部ファイル 当スクリプトを外部ファイルとして記述します。 <script src="skel.js"></script> jQueryもスタイルシートも他のファイルは必要ありません。 Step 2: スクリプトのセットアップ スクリプトのセ
外部サイトのJSファイルを読み込むときに、こういう書き方するのはやめましょう。 <script src="http://example.com/js/jquery.js"></script> 理由 あなたのサイトが、いつの日かSSLに対応することになったとき、そのscriptタグがバグの原因になります。 ご覧のとおり、HTTPSページの中でHTTP要素を読み込もうとすると、ブラウザによっては安全装置が働いて読み込んでくれないのです。 上の例ではjQueryの読み込みに失敗していますが、エラーメッセージ「Uncaught ReferenceError: jQuery is not defined 」を見てもHTTPS/HTTPのプロトコルが原因だとはすぐ気づかないので、わかりにくいバグになってしまいます。 結論 JSファイル(とかCSSとか画像とか)を読み込むときは、"http:"の部分を省
1リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
