きっとトラブルが起きにくい！ウェブデザインの制作順序を書きました。 | バニデザノート
ウェブサイトの制作には、いくつかのフェーズがあります。 企画→制作→構築→公開を何度もくりかえすこともあり、スパイラル方式なんて言われることもあります。 今回は、ウェブサイトの制作順序を書いてみたいと思います。 むかしはこういった文章をブログなどで書く方が多く、本もたくさんあったのですが 今は知識や技術に偏ったものがおおく、目に触れることが少なくなったのかもしれません。 もしくは、あたりまえのことだから言わなくなったのかもしれません。 しかしながら、ウェブを気持ちよく制作するために基本というのは重要なことだとおもい 再確認もこめてかきました。 ウェブ制作を行なっている人、 これからウェブの業界に入りたいとおもっている人、 これからウェブを発注する予定のある企業の方に読んでいただければいいなぁと思っています。 ・ヒアリング どんなサイトにしたいのかをお客様へお伺いします。 対象となるブラウザ
北米WEB屋なら誰でも知ってるんじゃないかって思うサイトをまとめてみた - バンクーバーのWEB屋
他人のブックマークって気になりませんか？特に同じ業界の人のブックマークってすごく気になりますよね。 興味本位でWEB屋友人のブックマークしてるサイトを教えてもらうことも多いですが、なんだか狙いすましたように、いろんな人が同じようなサイトをブックマークしていることに気がついて、「あぁー、このサイトはみんな良く見てるのかも」って思ったサイトがいくつかあったんですね。 そこで、WEB屋のブックマークをまとめて、北米WEB屋ならこれはたぶん皆みてるんだろうなってサイトをまとめてみましたので（独断と偏見で）ご紹介。 海外でWEB屋をやる方、いち早く海外のWEBデザイン情報をゲットしたい方、知っていて損はないと思います。 Smashing Magazine まずは王道？Smashing Magazine。このサイトは日本でも有名かなと思います。よくWEBまとめ記事とかで取り上げられてますよね。WEBの
WEB標準デザイン、はじめの一歩 ～デザインからマークアップまで～
第6回 岡山WEBクリエイターズのセッション1で発表したスライド内容を全文掲載。第6回 岡山WEBクリエイターズ セッション1『WEB標準デザイン、はじめの一歩 ～デザインからマークアップまで～』 岡山WEBクリエイターズ勉強会でお話した内容を、スライドとともに全文掲載しています。 テキストはあくまで原稿そのままですので、実際に喋った内容とは幾分異なる場合があります。 スライドのPDFをダウンロード 講師概要 SKPRODUCT代表。 デザイン、コーディング、PHPによるシステム構築、ActionScriptを使用したFlashなど、WEB制作全般を行うWEBアーキテクトです。 岡山の大手企業・学校などを中心にWEBサイトと独自に開発したCMSフレームワーク『SEED』の提供を行っています。 本日は、WEB標準デザインはじめの一歩です。 WEB標準というと、技術的なことを想像される方
ユーザーにとってはUIがすべて：UIデザイン原則をソシオメディアが語る - builder by ZDNet Japan
シーネットネットワークスジャパンは9月29日、builderとしては2回目のイベントとなる「builder tech day」を開催した。今回は「User Interface & beyond」をテーマに、ソシオメディア、マイクロソフト、アドビシステムズ、カールのスピーカーが登壇し、ユーザーインタフェースの現在と未来について講演した。 本稿では、ソシオメディア取締役である上野学氏の基調講演「ユーザーにとってはUIがすべて」を紹介しよう。 トイレにひそむUIのヒント 講演の冒頭、上野氏は米国の著名なデザイン・コンサルティング・ファーム、Adaptive Pathに2008年まで在籍していたDan Saffer氏と対話した際のエピソードを披露。 Saffer氏が「トイレにはユーザー・インタフェース・デザインの様々なヒントがある」と話していたことを紹介し、下の画像を示した。 上野氏は赤色の注意書
IDとclassを使わないで、HTML5とCSS3でコーディングしてみた。
IDとclassを使わないで、HTML5とCSS3でコーディングしてみた。 2011-05-02 Webサイトをコーディングする時に、IDとclassを考えるのが面倒臭くなったので、IDとclassを使わないでコーディングしてみました。 シンプルなサイトなら簡単でつまらないので、IDとclassを使っても難しそうなデザインにしています。 今回もJavaScriptは一切、使用していません。 完成したサイト ID, classなしで組んだサイトを見る。 サイトでやってみたHTML5 HTML5では、html, head, bodyタグを完全に省略しても構わないとされています。 省略してもDOMツリー上に存在しているので、 body {background:#f00;} というCSSの記述も認識してくれました。 サイトで使用したCSS, CSS3の簡単なまとめ Child Selector 結
サイトのデザインは54%が「好みで決定」、27%が最後に上司にひっくり返され、90%は消費者の意見を参考にせず／デザイン決定プロセス調査 | Web担当者必見！ リサーチ データ&市場調査レポート
参考意見としてターゲット消費者の意見を取り入れているのは10%に過ぎず、90%が消費者の意見を聞かずにデザインを決定している。 デザイン決定のポイントは、「発注側の経営者・上司・担当者の好み」が54%。「サイト制作のゴールを達成できそうだから」（20.7%）の倍以上の割合で「好み」を優先。 27.3%が「発注側の経営者や上司の独断的な意向で最終決定の直前にデザインがひっくり返った」ことで困った経験がある。 これは、デザイン決定のプロセスをビジネス目的に対して最適化するための消費者評価（アンケート）ソリューション「CREATIVE SURVEY」を提供する株式会社フォーデジットとWeb担当者Forumは、共同で行った、「Webサイトのデザイン決定プロセスに関する調査」の結果のハイライトだ。 この調査は、企業サイトの制作において、デザイン決定がどのように行われているのかを調べることで、ビジネス
ログインフォームに大切な7つの要素と重要な1つの機能
ログインフォームを実装する際に、大切な7つの要素と重要な1つの機能を紹介します。 元記事では下記のCSS3で実装されたフォームもダウンロードできます。 フォームのタイトル このフォームが何についてのものであるか手短に説明されたタイトル。特に、ウェブサイトの名称を記すことは非常に重要です。 非メンバー用のリンク 非メンバーが偶然、このページを見つけてしまうことがあるかもしれません。そして、メンバーを増やすチャンスもあるので、登録ページへの誘導も行っておきます。 ラベルとフィールド ログインフォームは通常、2つのフィールドで構成されていますが、ラベルは読みやすいようにします。 パスワードを忘れた場合 これは同じく、非常に重要なリンクです。多くのユーザーは多数のアカウントとパスワードをもっているものです。そして、しばしばそれはあなたのサイトでどれなのか忘れてしまうことがあります。 また、配置する
[CSS]今、そして近い将来に使用するであろうスタイルシートのテクニック集
CSS3のテクニックはさまざまなものがありますが、その中からまさに今、そして次のプロジェクトに使用したくなるテクニックを紹介します。 The Bright (Near) Future of CSS [ad#ad-2] 下記は各ポイントをピックアップして意訳したものです。 はじめに Styling HTML5 Classing like HTML5 Media Queries Styling Occasional Children Styling Occasional Columns RGB Alpha Color HSL and HSL Alpha Color Shadowy Styles Multiple Backgrounds 2D Transforms はじめに ここでフォーカスするのは、今、そして近い将来に使用するであろうスタイリングのテクニックです。HTML5の要素のスタイリング
国内Webサイト参考デザイン一覧集 | Maka-veli.com
ん？タイトルの日本語、なんかおかしい？(笑) 自分用に、国内のWEBサイトサンプル集をメモ。 やっぱ国内のが参考にしやすいですよね。 ズロック http://www.zzrock.net/ 一番お世話になってます。 検索も楽です。 そしてサイト自体のデザインも好きです。 (黒×黒のロゴとかやっちゃうとこがまた良い) iKeSai.com http://www.ikesai.com/ なんか気楽に見れる。見やすい。 WEBdeDB http://www.webdedb.com/ 更新減ってきたけど、数多い。 (Faviconつけてほしいー…) WEBデザインの見本帳 http://www.web-mihon.com/ 印象から検索できるのは嬉しい。 サイトがかわいい。 webselection http://web-selection.com/ シンプル。み
ウェブ制作に役立つ、便利な最近のオンラインサービスのまとめ -2011年1月
最近リリースされたものを中心に、デザイン、スタイルシート、ワイヤーフレーム、データベースなどに役立つオンラインサービス・ウェブアプリケーションを紹介します。
Webデザイナー必読？！著作権について知っておくべき10のこと - kojika17
Webデザインに限らず、制作したものに発生する「著作権」を知っておかないと、トラブルの元になるかもしれません。 特にWebデザインの場合は写真、文章、素材。 場合により動画など多岐の著作物を扱う場合が多々あります。 自分の頭の整理のためにも、Webデザイナー、ディレクターが知っておくべき著作権のことについて、まとめてみました。 1、著作権の基礎知識 著作権とは、知的財産権の一つです。 日本の著作権は「無方式主義」と呼ばれる方式で、制作物を制作すると自動的に著作権が発生します。 この時、著作者人格権と**著作権(著作財産権)**に分かれます。 「著作者人格権」と「著作権(著作財産権)」について 著作者人格権 簡単に言えば「制作者」 公表の時の手段、方法を決定できる権利です。 法律上、制作者の同意がなければ公表できません。 著作権(著作財産権) Webデザイナーにとっては、Webサイトなど制作
Webデザインやプログラミングなどの勉強に良さそうな国内のブログ記事やWebサイトいろいろ - かちびと.net
いよいよ2011年がスタートしました。 今年も去年同様、勉強することが 沢山あります。まだモチベーションが そこそこあるうちに勉強になりそうな 国内の記事をリンク集にしました。 迷ったときに見てみようかなと思い ます。 より最適な方法というのはあると思いますが、まずは扉を叩かない事には何が悪いかも分かりません。ということで、内容に拘らず、否の意見をスルーしてここに色々まとめさせて頂きました。 勉強したい気持ちはあるけど出来ない理由は「何を始めればいいのか分からない」という方も、何が出来るのか、どういった勉強法で出来るようになるかが分かればやる気が起きるかも知れません。 5分で分るシリーズ 以前も流行ったんですね。Web関連以外も含めてここにまとめられています。 5分で分かる PHP を知らない人が PHP の便利さを学べる記事を書いたよ 5分でわかる Ruby を知らない人が Ruby の
年末年始にWebデザインを学び直すための3つのステップ
この記事は、以下のような方を対象にしています。 現在Webデザインを仕事にしていて、さらにデザイン力をつけたい方 今はプログラマー、ディレクター、コーダーなどデザイン以外の仕事をしていて、来年はデザインも手がけたい方 ※この記事は、2010年末に公開したものを、文章と参考サイトなどのリンク先を修正し、2019年末に再公開したものです。 私は元々Webデザイナーなのですが、デザイン以外の仕事が連続したときなどデザインスキルの低下が心配になってくるので、年末年始など時間があるときは自己流のWebデザイン勉強法をしています。 もしかしたら他の方にも役立つかなと思い、公開しました。 今回は、主にWebデザインの中でも「レイアウト」について書いています。 まずは「知る」こと 私がWebデザインについて基礎からきっちり勉強したいと思い、Webデザインスクールに見学に行ったり「Webデザイン」と名の付く
Webデザイナーな私の勉強方法まとめ – VIVID COLORS + BLOG -福岡から東京に出てきたデザイナーのブログ-
私の勉強方法まとめてみました。 といっても 「いい情報をとりこんで、実践して、その結果をアウトプット」 をひたすらしているだけなのですが、実際にどのようなサイトや本を見てインプットしているか、どんな風に実践して、何をアウトプットしているかなどまとめてみました。 インプット 情報が美しくまとまっているサイトのフィードをチェック 国内外のWeb系の情報を丁寧にまとめてくれているブログがたくさんあります。 そういうブログのフィードをチェックしています。 デザインTipsやトレンド紹介、便利なプラグイン、プログラムなど、毎日どんどん新しい情報が出てきます。 全部読んで理解してその場で実践する、というとは不可能に近いので、へー、こういうことも出来るんだー、とさらっと頭に入れて、特に気になったものだけはてなブックマークなどでタグをつけて保存したりしています。 そうしておくことで、いざ●●しないといけな
CSSレイアウトの肝！ 表示・配置のプロパティ、14選
詳しくはコチラ→ position ボックスのレイアウト方法を指定するpositionプロパティ topプロパティ topプロパティは、ボックスを配置する場合に上からの距離を指定します。基準位置の上端から配置するボックスの上端までの距離を示します。positionプロパティが「static」以外のときに有効となるプロパティです。 詳しくはコチラ→ top ボックスを配置する場合に上からの距離を指定するtopプロパティ bottomプロパティ bottomプロパティは、ボックスを配置する場合に下からの距離を指定します。基準位置の下端から配置するボックスの下端までの距離を示します。positionプロパティが「static」以外のときに有効となるプロパティです。 詳しくはコチラ→ bottom ボックスを配置する場合に下からの距離を指定するbottomプロパティ leftプロパティ leftプ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
新着記事
AssistOn / アシストオン
HugeDomains.com
http://designaholic.cc/2011/02/post-82.html
css-lecture.com