デザイナーの野田です。 前回書かせていただいた「必読！5分でわかるレスポンシブWebデザインまとめ」が、大変好評だったため、今回も続編を書かせていただきます。 今回は、応用編のつもりでしたが、前回だけでは足りていない事が多かったので、もう少し基本となる部分を固めていきたいと思います。 本当に基本的な事ですが、大切な事ですので、少しでも皆様のお役にたてればと思います。 レスポンシブWebデザインで必ず考えなければならない事 「レスポンシブWebデザイン」で制作する際には、必ず考えなければならない事がいくつかあります。 これは、考えていなければ制作する際に必ずつまずく事でもございます。 ■対応デバイスの確認 まずは、対応デバイスの確認をしましょう。 現在、様々な解像度を持つデバイスがございます。大体のサイズとして下記のものが挙げられます。 ※PCの解像度に関しては、今回は省略させていただきます

主にDribbbleで見かけたAdobeの各ソフトや様々なファイルタイプのアイコンセットのまとめです。 テンプレートやUIデザイン等でも最近フラットデザインを多く見かけると思いますが、アイコンも同様でフラットな感じのものがほとんどです。 紹介しているアイコンを使用する際は、ライセンス等は各自で確認してください。

この前「英語圏のWEB屋な人たちが読んでそうなブログ教えて」って具合の、まぁいつも通り取り留め無く唐突な質問がありまして、コレまた僕にとってはいつも通り『北米WEB屋なら誰でも知ってるんじゃないかって思うサイトをまとめてみた』って記事を共有しようとしたんですが、コレもう2年前の物じゃーないですかってことに気付いたわけです。 結構僕はこういう質問に返答するノリで書いた記事のリンク送るってコトが凄く多いので、じゃぁこの記事も古いし、リバイスするかって軽い気持ちで書きだしたんですが、コレが意外とめちゃめた大変。大変って言うか、量が半端ないことになっておりまして… 正直、去年くらいからだいぶ暇な時間が出来てしまい、購読するブログの数もだいぶ増えていて、うーんって感じなんですが、まぁ良い機会なので僕が『これは読んどいていんじゃね？』ってオススメするブログやら記事やらを色々共有させて頂こうかなと思いま

これは覚えておきたい感じのサービス。「リバ邸九州」が早速使ってますね。 Typeform | Try the next generation of web form and online survey builder 超オシャレで使い勝手の良いオンラインフォーム リバ邸九州入居者応募フォームを参考に、使い勝手を見ていきましょう。 デザインは超シンプル＆クリーン。 選択形式の質問も可能です。 自由記述も。 アンケートの回答状況はゲージで表現されます。 デモ動画より。画像を使った質問もできます。 解析機能も充実。デバイス別の回答時間なんかも見れるんですね。これはすごい。 今まではGoogleのスプレッドシートを使っていましたが、これからはこいつを利用してみようと思います。料金が気になりますが、とりあえずβ版のうちは完全無料で使えるようです。うーん、これはいい。 Typeform | Try t

サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。

はじめに 今回は、画像を「正方形にして200px×200pxの大きさで保存」という処理を一括で行いたいと思います。たくさんサムネイルを作りたい場合などに便利です。 Firewroksでバッチ処理機能を使う 1.「コマンド」を作る はじめにコマンドを作ります。「コマンド」とはPhotoshopのアクションと同様の機能で、一連の流れを記録させておくことができます。 まずは画像を「正方形にする」処理を実行します。(FireworksにはPhotoshopのような「記録を開始」というものはないので、普通にファイルを開いて実行します) そうすると、ヒストリーに先ほどの処理が残っていると思うので、これを選択し、そのままの状態で右下の保存マークをクリックします。 ※今回は処理がひとつだけですが、処理が複数ある場合はshiftキーを押しながらまとめて選択することが可能です 「コマンドとして保存」というダイ

『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。

【１】展開したアーカイブは自動でゴミ箱へ OS Xの標準設定では、Zipファイルをダブルクリックして展開すると、展開前のファイルと展開後のファイルの両方がデスクトップに残る（下図参照）。しかし実際には、展開前のファイルは不要という場合がほとんどだろう。これをいちいちゴミ箱に捨てる作業が面倒な場合は、「アーカイブユーティリティ」の環境設定を変更すればいい。 「アーカイブユーティリティ」とは、Zipファイルの作成／展開を実行するOS X標準のアプリ。ただし、「アプリケーション」フォルダーには入っておらず、「システム」→「ライブラリ」→「CoreServices」フォルダーの中に格納されている。これをダブルクリックして起動し、環境設定を開こう。 あとは、「アーカイブユーティリティ」の環境設定ウィンドウの「展開後」欄で、「アーカイブをゴミ箱に入れる」を選べばOK。ここで「アーカイブを削除」にすれば

http://zzhh.jp/ ゼゼヒヒは、生活における様々なことについて賛成か反対か、どちらがいいか等の決とその理由を投稿する生活に関する投稿サイトです。 SoundGator ジャンル：音声 種別：素材サイト SoundGatorは、フリーで効果音を視聴・ダウンロードし制作に使う事が出来る音声に関する素材サイトです。 楽しいBADUIの世界 ジャンル：デザイン 種別：情報サイト 楽しいBADUIの世界は、世の中にある使いづらいUIのものを紹介するデザインに関する情報サイトです。 ブコメヨム！ ジャンル：情報収集 種別：webサービス ブコメヨム！は、はてなブックマークで話題になった記事のブックマークコメントを手軽に読める情報収集に関するwebサービスです。 paprika　images ジャンル：写真 種別：素材サイト paprika　imagesは、カメラマンが撮影したあまり出回らな

二度目まして。デザイナーの野田です。 レスポンシブWebデザインについて、僕なりにまとめてみたのでご覧下さい。今回は、制作に関することではなく、最低限知っておかなければならないことの基本編になります。 独学でつまずいていませんか？ Webデザインを効率的に学びたい、転職・就職を目指している、誰かに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。どんなスクールがあって、どんな内容が学べて、費用はどれくらいするのか、情報として持っておいて損はないはず。下記におすすめスクールを集めてみました！ レスポンシブWebデザインとは 「レスポンシブWebデザイン」とは、PC、タブレット、スマートフォンなど、複数の異なる画面サイズをWebサイト表示の判断基準にし、ページのレイアウト・デザインを柔軟に調整することを指します。 現在はPCやスマートフォンなど、デバイス毎に各HTMLファイル

先日、長谷川恭久さんとの共同プロジェクト、“Patch Project”がスタートしました。これはUIデザインの新しいワークフローを作るために立ち上がったプロジェクトです。これまでのワークフローを見直して、より良いUIを作っていくためにはどうするべきなのか、実際に何かのUIをデザインしながら模索していきます。そのプロセスや結果はどんどんオープンにしていきますのでお楽しみに！ まず今回はその導入部分として、ワークフローの提案について長谷川さんに話して頂いた内容を記事にしました。前編では、デザインカンプをやめてプロトタイプを作るべき理由を中心にまとめています。 そもそもUIとは何か UIの話というと多くの人がビジュアルデザインの話をしますが、そもそもUIとは人間とコンピュータの関係を円滑にするためのものです。人がコンピュータと関わるとき、そこには必ずインプットとアウトプットがあります。その中で

昔からサイト自体も考え方も好きで何かの機会に使ってみたいと思っていた「HTML5 Boilerplate」を、ようやく触ってみました。出来る事とか内容を解説します。 http://html5boilerplate.com/ HTML5 Boilerplateは、web上で利用者が必要な機能を選択した上で、その要件を満たすHTML、CSS、.htaccess、favicon等の各種ファイルをダウンロードできるHTML5のフレームワークです。 実はポップ？なデザイン(いまはそうでもなくなっていますが、前は★マークの目立つデザインとレトロな配色で、親近感を持っていましたｗ)と考え方がすごく気に入っていて常々使ってみたいと思っていたんですが、全く使い機会がなくてですね…ｗ HTML5 Boilerplateの特徴 何も考えずにサイトトップのダウンロードボタンをダウンロードするだけでも全然良いと思い

凄くシンプルなアイコンが好みだったので備忘録。商用でも無料で利用出来るそうです。ファイルもPNGの他にPSDが同梱されていますので調整しやすいのでは。 とってもシンプルなアイコンのセットです。ちょっと塗り絵っぽい。 こんな感じでラインのみで作られたシンプルなアイコンです。PNGで用意されたサイズは16pxから512pxまでの7通りに加えてPSDも含まれています。 ライセンスはAvailable for Personal and Commercial Projectsとの事で、個人利用でも商用でもOKとの事です。 ダウンロードはメールアドレスが必要です。金額を0$入力し、メールアドレスを入れて送信すればメールが届きます。ご利用は以下より。 Simplicity Vector Icon Set

LayoutIt!hは、D&DでBootstrapのレイアウトを作成出来るWebツールです。まだベータ版で若干バグ的なものも確認出来ますが、それなりに作成出来るようです。フォームやボタン、プログレスバーなどのコンポーネントなども追加、スタイルの変更が可能です。動作も軽いし、将来期待出来そう。 LayoutIt!

レスポンシブWebデザイン対応サイト向けのドロップダウンメニューを実装する為のスクリプト・FlexNavのご紹介です。なかなか使い勝手も良さそうな印象でした。 PCサイトではマウスホバーによるドロップダウン、スマフォではタップで降りるコンパクトなメニューに切り替わります。 ネストされたメニューにも対応していますのでこのまま利用しても大丈夫・・かな。（まだ詳しく見てないです） <ul class="flexnav" data-breakpoint="800"> <li>Menu01</li> <li>Menu02</li> </ul>カスタムデータ属性でブレークポイントを設定します。em単位でもセッティングできるみたい。 $(".foo").flexNav({ 'transitionSpeed' : '0.4s', 'itemHeight': 50 });降りてくるスピードなどはオプションで

GridwaxはWebページのベースラインをチェック出来るブックマークレットです。起動させると、ラインが表示されます。グリッドの高さはshift+↑や↓で、位置はshift+→や←で調整できます。グリッドの色は起動後に下部にメニューが表示されるのでそこで調整します。 Gridwax

こんにちは。今日も元気にPhotoshopと戯れます井畑です。 今回はPhotoshopの文字詰めに使うツールについてちゃんと調べてみました。 今では息をするように文字詰めをしていますが、デザイン初めたての時は勝手が分からず苦労しました…Photoshopの文字詰め♪ 基本的なことがほとんどなので、知ってる人にとっては当たり前のことですが、おさらいによろしければご覧ください。 それではどうぞ！ ちょっと待って文字詰めって何？ まずは文字詰めが何か分からない人の為に軽く説明しておきますね。 ワンランク上のデザインにはかかせない文字詰め 文字詰めとは読んで字のごとく、文字と文字の間を詰めてバランスをとる作業のことです。 通常文字を打っただけでは「ベタ組み」と呼ばれ、基本的に文字と文字の間が空きすぎています。それを詰めてデザインのバランスをとります。 WEBの性質上テキストデータの文字詰めは難し

もはや今ではTwitterでつぶやく際にURLは自動で短縮されたり あえて短縮URLを生成するツールを使用することも少なくなって 必要性もなくなってきていると思いますが 勉強がてら「bit.ly」のAPIを使って短縮URLを生成するツールを 試しに作ってみたので紹介してみます。 URL短縮 [URL SHORTNER] 短縮させるURLを画面上にあるフォームに入力し「URL短縮」ボタンをクリックすると すぐ下に短縮されたURLが生成されます。 短縮されたURLはコピーすることが可能。 一緒に表示される「リンク確認」の部分をクリックすることで 生成された短縮URLのリンク先を確認することができます。 「bit.ly」APIの詳しい使い方などに関しては、 「PHP & JavaScript Room」さんの記事を参考にさせていただきました。 【参考記事】bit.ly API｜短縮URL｜Web

MacBookAirを無線ルーター化したいことってありますよね。 そんなエントリーです。 見出し macbookairのbluetooth(PAN)を有効にする macbookair側のbluetooth設定 iPad側のbluetooth設定 ※PINコードを、macbookairとiPadで確認しあったり、 する箇所は飛ばしてます。要望があったら、頑張ってキャプチャとります。 macbookairのbluetooth(PAN)を有効にする ※どうやら、最初の設定では、macbookairはbluetooth(PAN)が有効になっていないと思う。 いじった記憶がないため。 システム環境設定→共有を起動する。 macbookair側のbluetooth設定 共有する接続経路：AirMac 共有する接続経路→ここでMacBookAirでのインターネット接続方法を指定します。 AirMac以外

Web Colour DataはURLを入力すると、そのWebサイトで使われている配色を取得してくれるWebツールです。少々重いかもしれませんが、なかなか面白い。CSSからのみ所得するツールというのはよく見かけますが、こちらはCSSだけでなく、スクショを取ってそのスクショから色を取り出してから配色を作り出しているようなので、既存の類似ツールよりは全体的な印象に近いカラースキームが作れるかもしれないですね。 Web Colour Data

『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。

『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。

『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。

最近、Google Chrome のデベロッパー ツールにスマートフォンでの表示を確認する機能があることを知りました。 いままでは、レスポンシブデザイン Web デザインをするときに、ちまちまとブラウザーのサイズを変えたり、Web サービス (Responsive Design Testing とか Responsive Web Design Test Tool とか) を使っていたのですが、こちらの手順のほうがお手軽なので紹介します。 設定は超簡単！！ Google Chrome のデベロッパー ツールを開いて、右下の歯車のアイコンをクリックします。 左側から [Overrides] を選んで、[User Agent] と [Device metrics] にチェックを入れます。 これだけです！ Google Chrome 32 からは設定方法が変わっています。ちょっとややこしい。 右上

pick up 2024年アニバーサリー特集 2024年に周年を迎える人物や出来事をまとめました。 東京駅開業から110年、サルバドール・ダリ生誕120周年など 充実したアーカイブ写真や貴重な動画でご覧いただけます。 今すぐ見る pick up 海と地球の研究所「JAMSTEC（海洋研究開発機構）」 国立研究開発法人 海洋研究開発機構（JAMSTEC＝ジャムステック）の コンテンツ提供を開始しました。JAMSTECが撮影した様々な生物や地質、 調査船・探査船等の貴重な写真や動画をご覧ください。 今すぐ見る 215207366 pick up 2024年アメリカ大統領選挙 現職のジョー・バイデン大統領や、 前職のドナルド・トランプ氏らが立候補を表明している米大統領選挙。 関連する写真をまとめました。 今すぐ見る 240995434

『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。

デスク配線がスッキリ。Ankerの全部入り12 in 1モニタースタンドが突然8,250円OFFされてた #Amazonセール

High Quality Printing for professionalsアイデアを最高品質でかたちにする。すべてのプロフェッショナルのために。 株式会社シルクマスターはグラフィックデザインとアパレルプロダクトのちょうど間に立ってデザインをかたちあるモノにしてゆくプロセスを担っています。詳しくは、シルクスクリーンをはじめとした印刷技術を使ってグラフィックTシャツを中心にアパレルプロダクトの印刷・加工を行っています。現在まで、様々なブランドやクリエーターとパートナーシップを結びアイデアの実現をお手伝いしてきました。その中で培われてきたファッション性と高度な印刷技術という視点の異なる二つをバランス良く相乗させ完成度の高い製品づくりを行っています。アパレルブランドはもとよりグラフィックデザイナーやイラストレーターの皆様により広く当社の印刷技術を知っていただきたく、プロフェッショナルな現場で働

みなさん、こんにちは。 さあ、年1回のブログ更新タイミングがやってまいりました。 今年は、私も開発してたりしてなかったりする、KUSANAGI。まあ自社製品ですね。 これの Advent Calendar ができちゃったりしたもんですから、さらっと登録してみた次第です。 なに書こうかなーなどと、直前まで悩んでたりしたのですが、KUSANAGI 誕生前夜あたりの黒歴史（？）とかを、ボロっと暴露してしまおうかなって思います。 KUSANAGI のネーミングですが、これは、まあみなさんご想像の通りです。切れ味鋭いあたりとか、あやかりたかったんですね。 まあ、そんなんでKUSANAGI の名前の由来なのですが、実は直前までKUSANAGIって名前じゃなかったんですね。では、なんだったかっていうと、やはりそれ系にあやかったものでした。 じゃーん。 ONIMARU HESHIKIRI HABAKIRI

WordPressのテーマやプラグイン作成において、よく利用する関数やグローバル変数などを個人的に整理したコンテンツです。 各関数やグローバル変数は、情報別（データの種類）と目的別（機能の種類）に分類しています。 なお、ほとんどの情報はソースコードを見ながら書き留めた内容であり、確認不足による誤りや更新の遅れによる不正確な内容を含んでいる可能性があります。あらかじめご了承ください。

このブログを2010年10月に立ち上げてもうすぐまる6年。小学生ならもう卒業です。 さて、私といえば「サボテンの人」とか「サボテンダーの人」って認識してくださる方が多いのですが、「実はあれサボテンじゃないんですよ」っていう説明も最近面倒に… Read more

Code Note Description 画像のURLからその画像のアタッチメントIDを取得するコード。カスタムフィールドに格納した、どこにも紐付いてない画像の他のサイズのパスを取得する際にどうしても必要になった時に...

タグ: Wordpress WordPressで運営していた記事をJAMStackサイトに移行したり、GitHubで管理したいというとき、記事数が少なければチマチマ手作業でも問題なさそうですが、数十、数百の記事を手作業するのはさすがにしんどいですよね。今回はたまりにたまったWordPressの記事をMarkdown形式に一括で変更、ダウンロードする方法を紹介します。 続きを読む 最近はReactをベースにしたフレームワーク、Next.jsをいじっております。今回はWordPressに登録した投稿をNext.jsで表示させてみようと思います！ 続きを読む WordPressの最新バージョン、5.9がリリースされましたね！それにあわせて！新たに『1冊ですべて身につくWordPress入門講座』という本を執筆しました！2022年3月23日発売です！今回も予約・早期購入者の特典がありますよー！ 続

WordPressユーザーに朗報🎊 TCDの有料の国産テーマファイル「Rebirth」が無料でダウンロードできます Post on:2022年9月5日 個人向けのブログから企業向けのサイトまで、WordPressのテーマを数多くリリースされているTCD様から、ブログメディア向けWordPressの有料のテーマファイル「Rebirth」を無料プレゼントしているので、紹介し ...記事の続きを読む 速報！WordPressから重要なお知らせ、次のバージョンでIE11のサポートを終了します Post on:2021年5月19日 WordPressの公式ブログによると、7月リリース予定のWordPress 5.8でIE11のサポートを終了する、とのことです。これにより、IE11を使用しているとダッシュボードで警告が表示されるようになり、最適に機能 ...記事の続きを読む 商用でも完全無料！日本語

2024年6月29日（土）に開催された「Open Source Conference 2024 Hokkaido」で、WordPressの手戻りやトラブルを抑えるための制作の流れについて話してきました。 WordPres […]

【PR】 2012.11.02 転職 「クラウドソーシング」。今年に入ってよく耳にするようになった言葉ではないだろうか。 Wikipediaによると、「不特定多数の人に業務を依頼する新しい雇用形態」とあるが（参照元）、特にWebサービスの開発やデザインの世界で、制作会社に外注するのではなくクラウドソーシングサービスを利用して個人に発注するというトレンドが生まれつつある。 その代表格といえるのが、『CrowdWorks（以下、クラウドワークス）』だ。 2012年3月にオープンした国内有数のクラウドソーシングサイト。「質の高いクリエイターに仕事を発注できる」との声多数。2012年11月現在、登録者は約7000名。発注依頼は2000社ほどから寄せられ、これまでの累計の仕事依頼額は6.7億円を超えている（うち1億円強が成約） クラウドワークスには、質の高いエンジニアやデザイナーなどのクリエイターが

<body> <a href="#" class="button normal">ボタン</a> </body> body { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; margin: 0; padding: 0; } a { /* サイズ指定 */ width: 200px; height: 50px; display: block; box-sizing: border-box; margin: 20px; /* 縦横中央揃え */ text-align: center; line-height: 50px; /* 色指定 */ background-image: -webkit-linear

twitter facebook hatena google pocket リンクなどをクリックする前にどんなページか示したりしたいですよね。 また、画像に付加情報を省スペースで出したくもなるものです。 そんな時、Tooltipster - The jQuery Tooltip Pluginを使用すると吹き出しを与えてくれます。 sponsors 使用方法 Tooltipster - The jQuery Tooltip Pluginからファイル一式をダウンロード。 <link rel="stylesheet" type="text/css" href="tooltipster.css" /> <script type="text/javascript" src="jquery-1.9.1.min.js"></script> <script src="jquery.tooltipster.

美大目指そうかなと思って。女子美ってどんな大学で、どこにあるんだろう。あと、どんな就職先があるのかも気になってる。 詳しく見る

採用情報【短大・生活科学科】ファッション・プロダクト分野の助手を公募します（締め切りを3/15まで延長しました） 2024.03.04

明治大学について 明治大学について 大学紹介 学長室 ビジョン・計画 キャンパス案内 情報公開 明治大学の取り組み 支援をお考えの皆さま 施設貸し出し 採用情報 ガイドブック・広報紙誌 教育／学部・大学院 教育／学部・大学院 学部 法学部 商学部 政治経済学部 文学部 理工学部 農学部 経営学部 情報コミュニケーション学部 国際日本学部 総合数理学部 大学院 専門職大学院 資格課程 共通科目・教育支援 留学 学年暦・シラバス・科目ナンバリング 生涯学習 図書館 情報サービス（パソコン・ネットワーク） 付属高校との連携 研究 研究 研究・知財戦略機構 研究の企画推進 産官学連携 研究機関 学内教員・研究者用サイト 社会連携・社会貢献 社会連携・社会貢献 社会連携機構 地域社会との連携（地域連携推進センター） 生涯学習の拠点（リバティアカデミー） 震災等復興活動 国際連携・留学 国際連携・留学

あなたが、まだ自分でも気づいていない、 新しい可能性に出会えるように。 そして、心に思い描く理想の未来を、 もっと大きく広げられるように。 これからのグローバル社会を見すえ、 どこよりも幅広く深い学びのチャンスをつくる。 そうして真に世界で活躍できる個性を育てていく。 それが、私たち学習院女子大学です。

2024.03.07 イラストコース教員のあおきひろえによる絵本『はるなつあきふゆ おいしい おてつだい』が出版。原画展が開催されます。

さあ、次は何を始めようか。 新しい一年、新しい季節、新しい環境、新しい挑戦。始まりはいつも心が躍り、でもどこか心細い。まだ誰も足を踏み入れたことのない場所。目の前に広がる途方もない自由はワクワクする反面、空恐ろしくもある。それでも何かを始めようとする人たちの強さを、気高さを、清らかさを、心から祝福したい。どんな困難に直面しようともたとえ道半ばで挫折しようともわたしたちは何度でも始めることができる。さあ、次は何を始めようか。

αMプロジェクト2023–2024「開発の再開発 vol.5 奥村雄樹｜我を忘れる身構えの手解きの跡形（我々は数多の知る由もない先行きの面影に湧き立つ）」

大学のWebサイトといえば、かっちりとした企業サイトみたいなデザインが多いですが、最近はデザインに凝ったおしゃれで動きのある大学サイトも多くなってきました。 今回は、国公立、私立問わず、特におしゃれだと感じた大学サイトをピックアップしてみました。 武蔵野美術大学 [browser-shot url=”http://www.musabi.ac.jp/” width=”550″] 一見、大学のサイトには見えない、クリエイティブで洗練されたデザイン。 数の多いメニューも、上手く配置することによってユーザーにとってわかりやすくなっています。 デジタルハリウッド大学 [browser-shot url=”http://www.dhw.ac.jp/” width=”550″] フラットデザインを取り入れたとても今風なデザイン。 UIも分かりやすく、さすがデジハリという感じです。 京都精華大学 [bro

「Colour Code」は、誰でも簡単にきれいな配色パターンが作れるWebサービス。色のコードも表示してくれるので、そのままデザインやプログラミングで使えて便利です。動きもサクサク軽快なので、使っていて楽しいです。 Colour Code 色を選ぶ 使い方はとっても簡単。画面上でマウスを動かすと位置に合わせて色が変わります。 ・マウスの上下 → 明るさ ・マウスの左右 → 色 に対応しているので、好きな色になるように調節しましょう。 気に入った色になったらクリックすればその色で保存できます。そのままどんどん追加して行けるので色の組み合わせを探すのも簡単。

中型ライダー（二輪）免許を持っているライターの内藤です。 本日は、ライダーキック並みの強烈さで役に立つ見本サイトをまとめてみたいと思います。 Web屋さんはご存じの方も多いかもしれませんが、ブログをしている一般の方、Webデザイン・DTPに興味のある方、お店を持っている方なども必見です！ 部品に特化した見本 部品に特化した見本サイトをご紹介します。 見出しデザイン（h1,h2,h3……その他DTPでも） はじめは見出しデザインに特化した見本サイトまとめ。 見出しデザイン.com http://midashi-design.com/ 見出しタグ（h1,h2,h3……）のデザインの見本ですが、DTPなどでもヒントになるものがたくさんあります。 カテゴライズは、グラデーション・テキストのみ・テキスト非画像・上線・下線・丸・四角・囲み線・斜線・点線・角丸。 ヘッダー部分に凝っても見出しが適当だと全

はてブ ツイートする シェアする 他のギャラリー ファビコンギャラリー 見出しデザイン ウェブコレクション このサイトについて いろんなWEBサイトのフッター（ページ下部も含む）部分を集めました。デザインの参考に。掲載サイトがリニューアルした場合はご紹介のフッターが使用されていない場合があります。 連絡先：manage.hp+footer@gmail.com copyright © footer-design.com All Rights Reserved.

正確な位置を示すはずのガイドが見当違いなんて意味ないですよね。ピクセル単位なら、ピクセルグリッドにピッタリ合ってほしいし、ミリメートル単位なら、ピクセルグリッドの制約を受けない自由な位置に配置したいです。 このような異なる用途でも、ガイドを正確に配置する技こそ、［shift］キーの併用です。［Photoshop（編集）］メニューから、［環境設定］→［単位・定規］を選択して、［単位］の［定規］を設定しておきましょう。

【マイクラ】参加型サバイバル始めます….【マインクラフト/まいくら/Minecraft/ゆっくり実況】