29 Great Free Textures | Abduzeedo - design inspiration & tutorials 壁紙や背景にも使えるグレイトなテクスチャセットが色々公開されています。 背景画像においてしまえばそれだけでカッコいい画像が作れてしまいそうです。 全部見る オリジナル風の壁紙も作れそうですね。 関連エントリ 木目、草原、砂漠、壁面などフリーのテクスチャ画像集 背景画像やテクスチャ画像のリソース13サイト 25のリアルな壁のテクスチャセット 紙、ペイント、メタルのテクスチャ画像集
『HTML Scout』は、Webページをまるごと分析し、ユーザーにソースコードを見せてくれるAIRアプリケーションです。HTMLはもちろん、JavaScriptやCSS、そのページに貼られているリンクや画像のアドレス、現在のサイトCookie情報も一覧化され、見ることができます。上下の2画面で構成されているので、非常に見やすいのが特徴です。 起動画面。デフォルトは真っ白なままだが、画面上部にURLを入力し、「Load」ボタンを押す すると画面上部に対象のサイト、画面下部に各種ソースコードが表示される。デュアル画面なので非常に見やすく、ページとソースの見比べがしやすい ソースコード表示欄には「Source」「Javascript Console」「HTML」「DOM」「CSS」「Script」「JS Objects」「Links」「Images」「Cookies」のボタンがあるので、ソース
CSS による段組レイアウト 文書構造を極力いじらずにレイアウトを変更できるようなフレームワーク。 以下の各サンプルでは分かりやすいように head 要素内の style 要素でスタイルを指定、先頭で defaultReset.css と common.css をインポート。 実際に使用する際には、style 要素ではなく link 要素で core.css などにリンクして、そこに defaultReset.css などとともに layout.css としてインポート。 この文書の詳細については、「CSSによる段組レイアウトのフレームワーク」を参照してください。 2 カラム 文書構造は以下の通り。メイン、サブの順番。 div.container -div#head -div.content --div#mainContent ---div.section --div#subContent
The Web Squeezeのエントリーから、ウェブデザインに役立つカラースキームのサンプルやジェネレーターを紹介します。 25 Color Palette Generating Resources for Web Designing!
Usability Postから、一枚の画像で、四隅が角丸のパネルを実装するスタイルシートを紹介します。 Scalable Content Box Using Only One Background Image demo 仕組みは、全体を囲む「div」と見出し「h2」に同じ背景画像を指定し、それぞれポジションを「bottom」と「top」にして配置するものです。 仕組みのイメージ 本文のテキストは、背景画像の長さ分(デモでは1000px)までテキスト量が増えても正常に表示されます。 見出しは、同じく見出しの長さ分(40px)までとなります。 追記: 下にある「Update」に、本文量がどれだけ増えても大丈夫なバージョンがあります。 demo 2
CSSとHTMLの知識は必須だが、慣れている人には超絶便利そうなツールのご紹介。 Drawterはブラウザ上でDOM要素を配置、さまざまなカスタマイズを施したあとにコードを生成してくれるツールだ。 つまるところ、CSSレイアウトに対応したサイト製作ツールといってもいいだろう。 要素ごとにさまざまな属性を直感的に追加していける点が素晴らしい。インターフェースもシンプルで職人ぽいので個人的に好みである。日本語も入力可能だ。 当然ながら作り終えたあとは「Generate Code」コマンドでコードを生成、そのまま使うことができる。 似たようなツールはすでにいくつかあるが、Drawterの完成度はかなり高いのではないだろうか。是非試してみてもらいたい。
15 Must-Have Bookmarklets For Web Designers And Developers WEBデザイナ/開発者が覚えておくと便利なブックマークレット集。 起動すると、その場で画像などの要素をドラッグ&ドロップでデザインできたりする便利なブックマークレット集です。 ReCSS - Reloads The CSS 起動すると、サイトのCSSが再読込みされ、リロードすることなく見栄えの更新ができる Edit Any Website - ブックマークレット XRAY - See Details Of Any Web Element 起動するとJavaScript製のDOMインスペクタが起動します。 MRI 起動してエレメントをクリックすると、クリックしたエレメントのセレクタが取得可能。 Design - Grid-Rule-Unit-Crosshair 起動すると、4
Webサイトのモックアップ(ワイヤーフレーム)を作る作業は面白い。実際の開発とは異なり、想像の羽を羽ばたかせてどんどん試すことができる。そうしたツールはこれまでにも幾つか紹介してきた。 手書き風モックアップ作成 この手のツールはあまり奇麗なインタフェースであってはならない。むしろ雑さが残るくらいがちょうど良い。そこで手書きで作るDENIMを紹介しよう。 DENIMはJavaで作られたモックアップ作成ソフトウェアだ。単一ページだけでなく、Webサイト全体を構築できるのが特徴だ。 DENIMはWindows、Mac OSX、LinuxやSolarisといったマルチプラットフォームに対応したソフトウェアだ。若干特殊なインタフェースで、まるでホワイトボードに書いていくかのようにモックアップを作成できる。 まずすることは鉛筆ツールで四角を描くことだ。これが自動的にページになる。メニューから選んで奇麗
60 Free Vector Icon Packs for Design Professionals - VECTORTUTS 高品質なベクターアイコンセットがいっぱい紹介されています。 ベクターということで拡大してもいいので、ラスター画像よりも使い勝手が向上しますね。 165 Lovely Vector Icons 135 Free Vector Icons Free Sticker Icons Free Vector Icon Set 30 Free Vector RSS Icons Free Vector Illustrator Icons Free Vector Icon Set Free Vector Icon Resources Free Vector Blue Icons 25 Free Vector Icons On-Stage Free Icon Set Finance
ページ内リンクをスマートにするsmoothScroll.js ページ内リンクをスムーズに行うjsライブラリ、smoothScroll.jsを作成したので公開します。 どういったものかはサンプルで確認してください。 <a href="#header">ページの先頭に戻る</a> などのページ内リンクをスムーズな移動に変更します。 これにより、エンドユーザーがページが遷移したという錯覚におちいることはありません。 設置方法は簡単です。 smoothScroll.jsをダウンロードして、設置したいページで取りこみます。 <script type="text/javascript" src="./smoothScroll.js"></script> 特定のリンクはスムーズさせない smoothScroll.jsは#(ハッシュ)付きのリンクを全てスムーズスクリプトに変換します。他のライブラリなどで#
Black [179] 2012:05:16:17:04:02 Blue [157] 2012:04:13:11:04:19 Brown [97] 2012:06:18:17:30:29 Gray [79] 2012:05:15:16:37:52 Green [94] 2012:07:19:16:43:42 Orange [40] 2012:06:06:11:30:52 Pink [50] 2012:02:27:12:50:45 Purple [23] 2012:04:23:19:11:41 Red [79] 2012:02:08:18:45:51 White [185] 2012:07:20:11:19:25 Yellow [49] 2012:06:11:16:16:45 Bibit [22] 2012:06:11:16:16:45 Clean [54] 2012:07:19:16:43
収入無しの専業主婦が融資を受けるためには 30代の専業主婦をやっています。主人は出張が多いので、わたし一人家にいることが多く、時間を持て余しているので、資格を取ろうと考えています。取ろうと思っている資格は難関な資格なので、自分で勉強するだけでは合格は難しそうなので、スクールに通おうと思っているのですが、一括で支払うと50万円近くかかるようです。主人に話しましたが、まったく聞く耳をもってくれません。私はウチでじっと家事でもしてれば良い、と思っているようです。こうなったら、自分でキャッシングでもして、と思っていますが、わたしのような収入なしの専業主婦が融資を受けるためにはどうしたら良いのでしょうか? 専業主婦の方がお金を借りるには銀行です 正直いいまして、現在専業主婦の方がお金を借りるのはかなり難しくなっています。以前は消費者金融も専業主婦相手にお金を貸してくれったのですが、いまではそれが難し
随分前に、Ver2の見直しをして3になってたんですけど、公開してなかったので今更ながら公開です。 中身は2を使ってみて、社内のマークアップエンジニアからフィードバックもらったり、自分でも違和感が有った部分を調整してます。 それなりの期間使ってみて、問題をあんまり感じていないので、完成度としては大分良くなったかなぁって思います。 新規でサイトを作るのに使えそうな一式。Ver 3をDL(zip:40kb) Ver 3を見る Ver.3の中身ご説明 主な変更点を。 style.cssのwidthなどのプロパティをまとめていたのをVer1と同じに。 default.cssに書かれていた、p要素のmargin-bottomの指定をstyle.cssに移動。 default.cssのfont-familyの指定を若干変更。 index.htmlにGoogleカスタムサーチ用に使えるソースを記入。 Ja
Web Design Toolbox: 130 New Tools to Make You a Better and Faster Designer ウェブデザイン用便利ツール集 ブロックレイアウトなんかをウェブ上から簡単に作れるツールなんかをまとめたエントリがあがってました。 YAML Builder - 複雑なカラムレイアウトもGUIで簡単作成 Sky CSS Tool - CSSオーサリングツール The Box Office - イメージにあわせて以下のようにテキストの位置を指定したページをジェネレート CSSTXT - CSSでのテキスト整形をプレビュー付で確認しながら生成できる izzyMenu.com - メニューを簡単作成 pForm - フォームを簡単作成 Roxer - ドラッグ&ドロップでページを簡単作成 Wirenode - モバイルサイト作成 doodleki
これまで多数のCMSを見てきたが、ここまで完成度が高いと言えるものに出会ったことはなかった…そう言えるくらい凄い。このどきどき感はDekiWikiに触れた時に感じたものに近い。 見たまま編集できるCMS CMSと言えば、ユーザ画面と管理画面に分かれていて、管理画面はモジュールやテーマの設定、各項目の並びを指定するのが通常だ。実際の出力結果はシステム任せで、その点が柔軟性に欠ける点でもあった。 しかしこれは違う。見たまま編集でき、さらに高い柔軟性を維持している。 今回紹介するオープンソース・ソフトウェアはconcrete5、デザイン、管理、コンテンツ作成全てが高度なCMSだ。 相当個人的な感情が入ってしまっているのは、同じようなシステムを構築する予定があったからだ。だがconcrete5は完成度も高く、多少の改造さえ施せば十分な気がする。やはり下手に開発コストをかけるよりもオープンソースで探
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く