close close close
![クリエイティブなWebデザインリンク集 -[ウェブアートノックARTNOC]-](https://cdn-ak-scissors.b.st-hatena.com/image/square/6a641442babbfb54f2b57a3b080bdb65fd49f0b6/height=288;version=1;width=512/https%3A%2F%2Ffanyv88.com%3A443%2Fhttp%2Fart-noc.com%2Fwp-content%2Fuploads%2F2017%2F11%2Ffillinglife-1024x598.jpg)
吹き出し方式のツールチップテキスト作成JavaScriptライブラリ wg:Bubble Tooltipsで紹介されている吹き出し方式のツールチップテキスト作成JavaScriptライブラリBubbleTooltips.jsですけど結構面白いです。 ただこのままだと実運用に微妙なのでちょっと改造。 まず既存のonloadアクションとバッティングする可能性があるので １行目に以下のコードを追加 (function(){enableTooltips("id名")})(); これで <script type="text/javascript" src="BubbleTooltips.js"></script> をボディー要素を閉じる直前に配置することで実行されます。 指定したidがないとエラーになるのでfunctionの前後に function enableTooltips(id){ if(do
![（余計な吹き出しを出さないように改変）吹き出し方式のツールチップテキスト作成JavaScriptライブラリ[to-R]](https://cdn-ak-scissors.b.st-hatena.com/image/square/a9717624309e36a795026e1b70982163687ccca2/height=288;version=1;width=512/https%3A%2F%2Ffanyv88.com%3A443%2Fhttps%2Fblog.webcreativepark.net%2Ficon_200x200.png)
クリスマスを手軽にイメージ化 Christmas Brushes - Free Photoshop Brushes at Brusheezy! DOWNLOADをクリックすれば導入できちゃいますね。 Christmas Brushes Set 2 by =Yasny-chan on deviantART こちらもDOWNLOADしたものをブラシの追加をすればOK。 Christmas Ornaments Brushes by =altergromit on deviantART 上のブラシ同様にDOWNLOADでOK。 こういうのをよくもまぁ見つけてくるものだなぁと思ってこの記事を書いていた矢先、これらブラシを『いっぱい』まとめているエントリがあった事に気がつきました。 それが・・・いつも見ているブログでしたorz さすがとしかいえないです。 » Christmas Photoshop B
CSS: Menu Descriptions | Mike’s Experiments | MikeCherim.com This is a CSS technique that could be useful if you want to give users accessible added content such as tool-tips, notifications, or alerts, without adding unnecessary clutter to your page. CSSだけでメニューにツールチップヒントを付けるテクニック。 次のようにメニューにカーソルを合わせるとヒントが表示できます。JavaScript不使用なので、JavaScriptが苦手な方も実装可能です。 JavaScriptは使わずにやりたい場合は覚えておきたいテクニックですね。 関連エントリ
アクア風なデザインの流行も収まったかと思うが、それでも様々なサイトで利用されている。透明感、丸みのあるデザインがクールなサイト、ポップなサイトどちらにも使えるのが便利だ。 そんなアクア風ボタンを作るTipsは各種あるが、一つのソフトウェアだけで簡単に終わらせてしまうのがこれだ。 今回紹介するオープンソース・ソフトウェアはButtonBuilder、アクア風ボタン作成ソフトウェアだ。 ButtonBuilderには黒、青、緑、赤、白をベースに細長、楕円、四角など様々な形のボタンが用意されている。後は文字色や配置を決めればごく簡単にボタンが出来上がる。 吹き出し風の画像や鉛筆、中止ボタン風の画像もあり、ボタンだけでなく様々な用途で使えそうだ。大きさや影、幅、文字の配置、背景色、フォントは自由に変更できる。 テキストは一行になっているが、Alt+Enterで複数行の入力が可能だ。サイトのアクセン
以前 Webデザインと黄金比の関係 でご紹介した、白銀比、黄金比、白金比、第二黄金比を使った美しいレイアウトを計算してくれるツールが、さらに再分割できるようになりパワーアップしました。 電脳狂想曲 レイアウトの小技 使い方と説明 実際に画像を表示しながら分割ができるので、サイドバーや画像の大きさを決めるときや、ロゴやメニューを配置するときに便利です。 【使用例】段組（２カラム）するとき 横幅780px の場合 黄金比：横幅 / 552px / 228px 白銀比：横幅 / 512px / 268px 白金比：横幅 / 571px / 209px 第二黄金比：横幅 / 565px / 215px ↓もしかして黄金比？ これまでテキトーに決めていたという方も、Webデザインだけでなく、プレゼンの資料などにも活用できそうなので、ぜひ一度お試しください。 参考記事 「見えない線」に沿ってページをレ
Общероссийский классификатор специальностей по образованию (ОКСО) представляет собой полный список всех утвержденных Минобразованием направлений подготовки и специальностей высшего и среднего профессионального образования, разрабатываемых в соответствии с Федеральным Законом Российской Федерации "Об образовании" от 13.01.1996 N 12-ФЗ. ОКСО содержит официальные наименования специальностей и их коды
Sosiaalisen median trendit 2017 April 10, 2017 sosiadmin no comments Sosiaalisesti mediasta on tullut mainostajien kultakaivos. Facebook, Youtube, Instagram, Twitter, ja jopa Snapchat täyttyvät kohdennetusta mainonnasta, ja käyttäjien tuottaman sisälllön ja mainostoimistojen kampanjoiden välinen raja hämärtyy. Pieni “sponsoroitu”-teksti Instagram-kuvan yläpuolella on niin huomaamaton, että välillä
Stu Nicholls | CSSplay | Cross browser flyout menu examples using only css CSSのみでクールな階層メニュー作成サンプル。 次のようなカッコいい階層メニューのサンプルが公開されています。 クールなのでそのままサイトに組み込んで流用できそう。 IE5.5 , IE6, IE7, Firefox, Opera 等で動作。 関連エントリ CSSでちょっと変わっているピル風の形をしたナビゲーションを作成 セクシーに動作するスライドメニューバー実装JSライブラリ クールにスライドするメニューを作成するJavaScriptライブラリ「Image Menu」 CSSのクールなメニューをオンラインで簡単生成「CSS Menu Generator」
webデザイナーには独学でなることも可能です。技術さえ持っていれば年齢や学歴にも左右されない強いカードになることでしょう。 残念ながら当サイトは2008年に作られたサイトなのでテーブルコーディングがところどころ採用されていたりとテクニックやデザイン的に古いです。今はDreamwerver等のウエブデザイン専門ソフトを使わなくても、簡単にホームページが作れる時代です。 webデザイナーになりたい！でもどうやって勉強したらいいの？そんな悩みを持つ君に、ホームページ制作課題を数パターン用意してみました。まずはチャレンジしてみませんか？ 仕上がったら展示場に投稿してみんなに見てもらおう。（現在は投稿機能は終了していますが、各自ぜひお勉強のためにトライしてみてくださいね） 現場のプロがやさしく書いた Webサイト運営・プロデュースの教科書 webサイトのプロデュースから、webデザイン、SEO、運営
グリッドシステムとは、スイスのグラフィックデザイナー：josef muller blockmann（ヨゼフ・ミューラー・ブロックマン）が考案したデザインの手法です。 1981年に刊行した「Grid Systems in Graphic Design/Raster Systeme Fur Die Visuele Gestaltung」は、さまざまなレイアウトにグリッドシステムを用いて、繊細にデザインが行われています。 このグリッドシステムは、エディトリアル デザインで広く利用され、今日ウェブデザインにも多くの影響を与えています。 グリッドシステムの概要 グリッドシステムの機能 グリッドシステムをサイトに導入するメリット グリッドシステムに関する書籍 グリッドシステムの概要 グリッドシステムとは、縦横線の格子（グリッド）を下地として、そこに出来たブロックごとに図版や文字を配置し、デザインを行う
その調和された比率は、トランプカードなどの日常的なものから、ギリシアのパルテノン神殿、ミロのヴィーナス、モナリザなどの芸術分野まで、多数存在します。 黄金比を使ったデザイン テクニックついては、下記も参考にどうぞ。 黄金比とは、黄金比を使ったすごいデザインテクニックのまとめ -Webデザイン・紙デザインに 黄金比を矩形に使用する 黄金比をマージンに使用する 黄金比をパーツに使用する 黄金比を矩形に使用する サイトで使用する画像などの矩形に黄金比を適応します。 サンプルでは、144pxと233pxの組み合わせを使用していますが、「1:1.6」を利用して100pxと160pxなど簡易なものでも効果はあると思います。 黄金比を横長の矩形に使用 黄金比をマージンに使用する レイアウトにグリッドシステムを取り入れマージンを使用した場合、数種類のサイズが必要になる場合が多くあります。 その際、１つの値
webデザイン webデザインはビジュアルさえ良ければいいものではありません、webマーケティングに基づいた設計を元にwebデザインができねばなりません。そんな中、このwebデザイナー日記は、1人のwebデザイナーとして日々葛藤しながら精進を続けているヒトミンのwebデザインコラムです。 当サイトでは、ウエブデザインの素材写真の撮影にも役立つこの小型カメラを応援しています。監視カメラとしても役立ちますし、USBカメラだとパソコンに接続して動画を録画することも可能です。小型カメラには色んな可能性があるのでぜひ活用してみてくださいね！（広告すみません・・・！） このブログは、某web制作会社にて現役でwebデザイナーとして活動しているヒトミンの日記です。しかし今はこちらの大阪のwebデザイナーのサイトで活動しています！webデザイナーになる為のコツや、仕事の裏話など・・・現役のwebデザイナー
サイト運用をしている人は誰もが悩むトップページのデザイン。もちろん超大手検索サイトのGoogleとYAHOO！もこれまで試行錯誤しながらトップページデザインを変えているのですが、いったいどのように変わってきたかがまとめられています。 詳細は以下から1997年から2007年までのGoogle。毎年デザインが変わっていますが、現在のようなロゴに変わったのは2000年から。 Google 10 years ride in images (Google) 1997年 1998年 1999年 2000年 2001年 2002年 2003年 2004年 2005年 2006年 2007年 そして以下が1996年から2007年までのYAHOO。どんどん情報量が増えていってるのがわかります。 www.yahoo.com back in 1996 AXT Magazine 1996年 1997年 1998年
jQuery、ProtoType、.Netなどのフレームワークを使ったサンプル、デモが豊富にあります。しかも、サンプルをダウンロード可能。サンプルやデモを見ているだけでも、インスピレーションが沸いてきます。 詳細は、以下から。AjaxRain かなりのサンプル数があるので探していた物を見つけることができるかも。タグで分別されているので、探すのは意外と簡単にできそうです。ちなみにサンプルの1ページあたりの表示数を変更できるのですが、100以上を入れると100にされます。 毎月このサイトでAJAXなどを使ったコードのコンテストをしているので、腕に自信のある方は応募してみては。詳しくはこちらから。 AjaxRain.com Rain Fest
Webに限らず、PC上で画像を作成しようと素材をもらったら、ラスタ画像で渡された経験はないだろうか。またはデジタルデータすらなく、紙でしか素材が存在しないこともある。スキャンして手作業でトレースしていく作業をしていると嫌になってしまう。 それらの苦労から開放してくれるソフトウェアがこれだ。 今回紹介するオープンソース・ソフトウェアはPotrace、オートトレースソフトウェアだ。 Potraceはコマンドラインで動作するソフトウェアで、PBM/PGM/PPMまたはBMPファイルを読み込み、EPSやPS、SVG/PDF/GIMPPATHといった形式に変換してくれる。かなりレベルの高いトレース結果が得られる事に驚くはずだ。 そのまま使ってみてもいいし、微妙な調整は閾値を直すことで行える。対応プラットフォームが数多く、Linux/BSD/Mac OSX/Windows等となっている。Mac OSX
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
