株式会社キトヒトデザインでユーザビリティ、UI/UXデザインなどを手がけている萩本さんがご自身で体験したデザインのお話を不定期更新でお届けします。
HTML+CSS+JavaScriptでつくるサイトの定番演出「高級ペライチ」! HTMLファイ部の「HTML5の鬼」ことほんだです。 カヤック社内では「高級ペライチ」という愛称で呼んでいる縦や横に長い1ページサイト。 スクロールに合わせたパララックスやアニメーションの演出が印象的ですよね。 今回は「高級ペライチ」とググると1位に表示される、 僕のはてブ「高級ペライチ」タグから厳選32サイトを紹介します! まずは王道!縦に長い高級ペライチ
Webサイトの待ち時間の80%はフロントエンドの処理によるもの なんて言われるとドキっとしちゃいます。どんな素敵にデザインして綺麗にコーディングしても、ページが重くてイライラしてるユーザーがいたら台無しです。なのでスマホ向けサイトのデザインに入る段階から、高速化・軽量化を意識するために、いくつか項目をメモしておきます。 デザインの段階から軽量化を意識する 画像を極力使わないで魅せる努力をする 当たり前ですが、画像を使えば使うだけレスポンスは遅くなります。背景画像にドデーンと写真を使ったり、見出しを使うたびに大きなアイコンを入れるなど、わざわざページを重くさせるようなデザインにする必要はありません。 多少シンプルになったとしても、色のメリハリ・1pxの線などでカバーしましょう。テキストも可能な限り画像にせず、デフォルト文字にするべきです。Webデザイナーの腕の見せ所ですね。 HTML5+C
Ich begleite den Entwicklungsprozess von Produkten an der Schnittstelle von Film, TV und Internet. Neue Geräte, Technologien, Plattformen und Produktionsweisen führen zu veränderten Geschäftsmodellen und Strukturen. Die Gestaltung von Produkten in diesem Umfeld umfasst viele Aufgaben von der Strategie, Konzeption, Umsetzung bis zur Distribution. Den kompletten Prozess oder einzelne diese Schritte
最近のトレンドでブラウザ幅に合わせたサイト幅決定のサイトが増えていると思うのですが。 例えば 名古屋デザインウィーク とか ISOLATION UNITとか とか 丸の内.com とか KAYACさんのサイトのどこかでも見かけたような気がしたけど見つからない。 海外だとこの辺? CreativeDepart.com 一番最初に見かけたのはこれとは別の海外のブログサイトだったのだけど今見つからない。 リキッド一番ビビったのがこれ。 Wilkommen bei EMPREIS 中はこんな感じ Width1680まで、イメージも合わせて伸びる。しかも画像のレンダリングも綺麗。どの幅で見てもバランスがいい。 リキッドレイアウトの持つ「閲覧の主権はユーザーにある」という考えはとてもインターネット的で、この流れは個人的に興味深い。いわゆる平面デザインとして紙メディアが代表的だけれども
Excelは基本的に表計算ソフトなわけですが、計算の不要な普通の表を作成するソフトとしても優れています。 Webページで表を作成する場合、tableタグ・trタグ・tdタグを使ってHTMLソースを書く必要がありますが、こんなときにも 「Excelで表を作っておいて簡単にHTMLにできないかなー」 と考えたことのある方は少なくないでしょう。 そのため、ExcelからHTMLソースを吐き出すようなツールを作っている方も少ないないようです。 ですが、そんなツールを利用することなくマクロを組むこともなく、相対参照と絶対参照を利用して簡単にテーブルタグを生成する方法を、2ちゃんねるのWeb制作管理板の中で先日みつけました。 ・エクセルでテーブルを組んでますが馬鹿ですか? ↑こんなタイトルのスレッドですが、馬鹿なんてとんでもありません。とても賢い方法だと思います。 ▼操作手順:ExcelでHTMLのテ
Frequently asked questions How do I find a font from an image? To identify a font from an image, use a font finder or font identifier. These tools are great for finding the name of a font or similar alternatives. All you need to do is upload an image of the text by having it readily available on your device or taking a photo. Is there an app I can use to identify fonts? Yes, WhatTheFont is a simpl
Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い!情報の正確性は自己責任で判断してください。 サンプルは透過PNG。テキストの上に、透明度36%の矩形を重ねてある。IE6とFirefoxでは見え方が違うことが解るだろうか? 左がIEで見た場合、右がFirefoxで見た場合。バージョン6までのIEはPNGのアルファチャンネル(半透明)に対応していないので、普通に使うと透過部分が灰色っぽくなり、期待はずれな結果に終わる。IE6でも透過PNGを表示するには、次のように記述する。 #overlay { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="./overlay.png", sizi
画像位置 横位置 縦位置 正方形 スタイル バックグラウンド 白バック 切り抜きパス付き コピースペースあり パノラマ データの種類 ベクターのみ hana QxQ IMAGES 素材辞典 LIP imagenavi CREATOR RF IN RF Values アフロRF a.collectionRF absodels RF AID ARC RF Artbox Images Aurora Photos ビブロス Blend Images BLOOM eyes BLOOMimage Blue Jean Images RF Caiaimage Cpalette creator's farm Cultura RF d.collection DAJ digital images Design Pics RF DEX IMAGES EGAOIMAGES Foodcollection Fotose
世界で最も先進的な オペレーティングシステム。 Mac OS X Leopardは、300以上の新機能を搭載した史上最高のMacオペレーティングシステムです。 iTunesで音楽を選ぶようにファイルをブラウズ、画像もテキストファイルも開かずに内容を確認、過去にさかのぼってあらゆるデータをワンクリックで復元、といった革新的なツールが盛りだくさん。Macなら、やりたいことが何でもスピーディに。 OfficeもWindowsもラクラク。 PCの友達に差をつけよう。 どのMacでもMicrosoft Officeが使えます。もちろんWindowsユーザとのファイルのやりとりも。 またMac OS Xを使用しながら、Windows XP、Vistaを同時に動かすこともできます。3どんなWindows アプリケーションが必要になっても、まったく問題ありません。こんなことができるコンピュータは、世界でM
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く