タグ

web制作に関するindigoworksのブックマーク (227)

  • 【無料配布】Web制作設計手順書 | 毒舌プランナーの異論持論

    皆さん、長らくお待たせ致しました。 先日からお話に上がっていた 【Web制作設計手順書】 を配布致します。 下記よりダウンロードして下さい。 PowerPoint用とKeynote用とがありますが PowerPointに関してはアニメーションなど上手く動作しなかったりしますので その点についてはご了承下さい。 ※追記:単純に閲覧用、印刷してお使いになる方用にPDF版も用意しました。 ※追記2:PowerPoint版の5Pと14Pがおかしかったのを修正しました。 ※追記3:「色彩」の部分で黄色と白が見辛かったので全体的に修正しました。 基的にはMaciPadをお持ちの方はKeynoteでの閲覧を推奨いたします。 また注意事項としましては 無料配布ではありますが、著作権は放棄しておりません。 編集する、再配布、商用利用などご自由にして下さって構いませんが 「自分が作った」 等と豪語するのは

    indigoworks
    indigoworks 2011/10/07
    なんでKeynoteにする必要があるんだろう。アニメが冗長で最初の章で読むのあきらめた。この人には拙スライドセミナーにぜひ来て欲しい
  • WordPressを使ったFacebookページ作成と更新:基礎編

    WordPressを使ったFacebookページ作成と更新:基礎編:WordPressでFacebookページを作ろう(1)(1/6 ページ) BtoCをメイン事業とする中小企業にとってFacebookは有効活用したいソーシャル系サービスの1つです。 どうにか活用したいけれども、どうやって作るのか、どうやって運用すればいいのかなど分からないことだらけだと思います。 この記事では、Web担当者とWeb制作者を対象に多くのWebサイトで利用されているWordPressを使ったFacebookページ用コンテンツの作成について紹介します。 Facebookページとは Facebookページ(旧「Facebookファンページ」)とは、企業やブランド、サービス、または有名人やアーティストなどが顧客やファンなどの個人と交流を図ることのできるFacebook上のページを指します。 Facebookページの

    WordPressを使ったFacebookページ作成と更新:基礎編
    indigoworks
    indigoworks 2011/09/06
    あとでゆっくり読む
  • まったくのゼロから、Webデザイナーになる方法 - ウェブデザイナーになるには

    この記事は2011年に書いた記事です。2015年に書いた増補改訂版があります。 「Illustrator、デザイン - まったくのゼロから、独学でWebデザイナーになるためのロードマップ【Vol. 1】」(2015年3月) 前にも「独学でWebデザイナーになるのにまずやること」というエントリーをかいたが、簡易的な内容だった。 今回も大筋の考え方はかわらない。Webデザイナーになるには、たくさん作品を作って人にみてもらうことである。 今回はもっと踏み込んで、全くの未経験の人がどうすればWebデザイナーになれるのかの具体的なステップ(行動プラン)をまとめてみたい。すでに学校やスクールでWebを学んでいる人や会社でデザイン部門をあらたに設立したい人にも役に立つだろう。 ステップ1 制作環境をつくる まず最初にやることは制作環境を揃えることである。以前だと、FAXとスキャナーは必須だったが、いまは

    indigoworks
    indigoworks 2011/09/06
    ずーっと読み進めててなんか言葉に出来ない違和感を覚え続けてたんだけど、わかった、これ、たしかにデザイナーになれるけど、食えるデザイナーになれる、とは書いてないね。なら正解だわ。
  • デザインどや!?|海外カジノ オンラインのWEB作成

    Webページレイアウト、ナビゲーションプラグイン、フォーム、スライダー&カルーセルプラグイン、チャート&グラフプラグイン、イメージエフェクトプラグイン、ビデオプラグインなど。チェックしておきたいです。海外カジノ オンラインサイトの制作はワードプレスのプラグインを利用して様々な機能を付け加えて完成させることができます。2012年のjQueryプラグインまとめでは、デザインの一新や個別のカスタムにも対応した国際的で魅力的なサイト作成に役立つ情報を紹介しています。

    indigoworks
    indigoworks 2011/08/20
    スクショ撮るやついいなあ
  • 素人っぽさを感じるWEBサイト5つの特徴 - おかねがない(゚∀゚)ッ!!

    インターネットをしていると、いろんなWEBサイトに出会います。 気になるアーティストのサイトだったり、趣味に関連したサイトだったり・・・ そんな中で 「なんかこのサイト素人っぽい」 って、感じたことありませんか? でも、「素人っぽい」と感じはしたものの、そのサイトのどこに素人っぽさを 感じたのか、じっくり考えてみることってあまりないのではないでしょうか。 そこで今回は、WEBサイトのどういう点に素人っぽさを感じるのか、 「脱素人っぽいサイト」を目指す私が感じた、「素人っぽいサイト」の特徴を、 まとめてみたいと思います。 (8/19追記) 以下の内容はあくまで素人muggles0812が感じた、個人的な意見であり、該当する項目が あったからといって、必ずしも他の皆さんが「素人っぽい」と感じるとは限りません。 画像処理が甘い せっかく時間をかけて作ったサイトでも、使われている画像の処理が甘いと

    indigoworks
    indigoworks 2011/08/16
    こんなのまだマシなほうだと思う。阿部寛の公式サイトはこのレベルにすら到達してないと思う
  • デザインが素敵な日本語Facebookページ 10選

    Facebookページは2012年3月30日にタイムラインを採用した新デザインに全面移行するのに伴ない、デザインが素敵な日語Facebookページ10選も新デザインに移行したページから再選出させていただきました。 2012年3月17日時点で、新デザインに移行している日語Facebookブランド・企業ページは上位200位のうち、33ページに過ぎません。後2週間を切ってますので、以下のガイドを参考にしていただき、新デザインへの準備を怠りなく。 新Facebookページ 使い方・移行方法 目次 1. 新Facebookページ 使い方・移行方法 まとめ 2. 新デザインをプレビューし、準備が出来れば切り替えましょう 3. カバー写真などイメージを変更しましょう 4. Facebookの自己紹介(基データ)を書きましょう 5. トップ掲載する写真、アプリを整理しましょう 6. 大事な出来事を設

    デザインが素敵な日本語Facebookページ 10選
    indigoworks
    indigoworks 2011/08/11
    そんなに言うほど素敵か? アートディレクションがちゃんとしてる、ってだけでしょ?
  • ウェブ業界は人材が余っていて人材が不足している

    ある企業サイトの作成に関わっていた。サイトに真剣に向き合いながら、一度決めたことをひっくり返すようなことは言わない、よいクライアントだった。 作成に関わったので贔屓目もあるかも知れないが、よくできたサイトだった。好みの違いはあっても、誰に見せても「合格」をもらえるデザインだったと思う。 作ってから何度か改修があり、若干テイストが変わることもあったが、一貫して企業サイトとして恥ずかしくないデザインだった。改修のたび、担当のディレクター・デザイナーが愛情を持って頑張っているんだな、と思っていた。 そのサイトのトップがまた改修した。 ダサい配色、適当なグラデーション + 角丸 + ドロップシャドウ、カーニングが調整されていない文字……。 素人のようなデザインだった。 これでクライアントのOKが出たことに驚いた。と同時に、それを提出したディレクターが許せなかった。それ以上に、これでデザイナーとして

    ウェブ業界は人材が余っていて人材が不足している
    indigoworks
    indigoworks 2011/08/07
    元増田は入った会社を間違えた。自身のセンスやスキルはどの程度のものか知らんがそれに見合った会社に行くべき。後半の本屋にいた女子2名もそれなりの会社にしか行けないだろうしそれなりの仕事しかできないだろう
  • 新MacBook AirはWeb制作のメインマシンになり得るのか

    この記事は、2011年版の MacBook Air について書いています。2012年版の MacBook Air については以下の記事をご覧ください。 MacBook Air 2012のレビューとWeb制作者のための設定など 先日、新しい MacBook Air(13インチ・SSD 128GB)を購入しました。 私は Web制作 のメインマシンにするために購入したのですが、購入するまでは正直「こんな薄いマシンをメインにして大丈夫かな…」と不安でいっぱいでした。 結論から言うと、私の使い方(Web閲覧・Web制作・PhotoshopによるWebデザイン・動画閲覧等)であれば全く問題なく、今まで使っていた MacBook Pro 13インチ(2010年モデル・2.4GHz・メモリ8GBに増設)や、昨年使っていた DELLデスクトップPC(Core 2 Duo・メモリ4GB)よりも明らかに動

    新MacBook AirはWeb制作のメインマシンになり得るのか
    indigoworks
    indigoworks 2011/08/03
    webの人は大してスペック要らないからいいよね。印刷解像度のPSD編集とか映像編集やりだすと、これでは足りないけれども
  • IDEA * IDEA

    ドットインストール代表のライフハックブログ

  • PNGとGIFとJPEG…Web用画像の書き出し、どんな風に使い分けていますか?[2011年7月現在] – VIVID COLORS + BLOG -福岡から東京に出てきたデザイナーのブログ-

    PNGとGIFとJPEG…Web用画像の書き出し、どんな風に使い分けていますか?[2011年7月現在] – VIVID COLORS + BLOG -福岡から東京に出てきたデザイナーのブログ-
    indigoworks
    indigoworks 2011/07/25
    Web屋じゃないけど、サムネ・カンプ出力にお世話になってます。イラレで作った名刺などは、等倍で書きだすと小さすぎたりするので、サイズを書き出し時に拡縮できるWeb用に保存は便利
  • Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot

    Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot Seperti yang kita pahami waktu ini ada sangat banyak permainan slot online paling sederhana yang dapat dimainkan dalam sekejap hanya cukup masuk di sana saja ojekslot terunggul. Di sini dapat ada sangat banyak bermacam permainan luar biasa yang pastinya dapat anda temukan dengan ringan. Beraneka permainan terbaik di sini dapat and

  • Webデザイナーさん、デザインを複数案作るとき、どんなことに気をつけてますか?

    ☆ご注意☆ この記事は 2011年7月23日 に書いたものです。情報が古い可能性がありますのでご注意ください。 デザイン案についていつも考えてる事、悩んでる事などをまとめてみました。 いつも孤独に作業してるので一般的にどうしてるのか知りたい!! デザイン案っていくつ作ってますか? 私は毎回2案作っています。 理想としては2~4案だと思うのです。 でもちょっと今の環境では時間的、コスト的に2案出すのが限界で、、、(´・ω・`) 前の制作会社にいたころはデザイナーの人数も多かったので3人×2案の6案、コンペ形式っていうのもありました。 同じトップページでもデザイナーによって同じ条件でも出来上がるものは全く違いますから、自分とはぜんぜん違う方法で表現したりしていて、デザイナー同士もすごく勉強になって、個々の引き出しが増える技術力UPになります。 クライアントにとっても、たくさん判断材料があるし、

    Webデザイナーさん、デザインを複数案作るとき、どんなことに気をつけてますか?
    indigoworks
    indigoworks 2011/07/25
    CIが無い中小零細がクラだと、ブランディングまでWeb屋さんが面倒みないといけなくて、そのWeb屋さんもブランディングは素人。クラにそのデザイン価値を説明して説き伏せられなければブランディングとは言えない
  • スマフォ向けサイト構築等に便利そうな、指定サイズに応じてclass名を加えてくれる軽量jsライブラリ・Selector Queries

    これはかなり便利そうだったので備忘録。 ディスプレイサイズに応じて指定した要素 にclass名を加え、そのclassを使ってデザ インする事でレスポンシブなWebデザイン を設計出来るようにする為のライブラリ。 かなり便利そうです。 この発想はちょっと素敵でした。指定したサイズに応じて要素にclassを与えるので、Media Queryを使用したPCとスマフォ向けサイトで見た目をまったく別のものにすることも出来そう。 特にjQueryやmootoolsといったスクリプトに依存してないのもいいですね。イメージ的には部分的にMedia Queryを手軽に使える、という感じでした。 わずか5KBほどの非依存型軽量ライブラリです。ディスプレイサイズ等で要素が指定した数値になると、class名を与えてくれるので、環境によってデザインを簡単に変更できるようになります。 上記はMedia Query T

    スマフォ向けサイト構築等に便利そうな、指定サイズに応じてclass名を加えてくれる軽量jsライブラリ・Selector Queries
    indigoworks
    indigoworks 2011/07/21
    んんんんん… 一見便利そうではあるが… 使いどころ悩む
  • TAKASHI INABA

    works

    indigoworks
    indigoworks 2011/07/18
    いや、需要が足りなかったんじゃないの? そういう紹介サイトで、動的に動かす理由があるのかどうかと…
  • Media Queries を使って、Webサイトをスマートフォンに対応させるときの注意書き

    今回このブログ - Webデザインレシピを、iPhone などでも見れるようにリデザインしました。使用したのは CSS3 の Media Queries(メディアクエリ)。メディアクエリの使い方や感想、気をつけたい注意書きをまとめてみました! 遅ればせながらこのブログ – Webデザインレシピを、スマートフォンでも見れるように改修しました。このブログは WordPress で書いているので、スマートフォンや iPad への対応方法はいくつもあるのですが、今回は CSS3 の Media Queries(メディアクエリ)を使って、iPadiPhone など、いろんなデバイスに対応(対応というか、一応見れる程度)にしてみました。 なので Media Queries を使ったスマートフォン対応と、リデザインしながら思ったことなどをまとめてみました。 CSS3 Media Queries 目次

  • 日記 | ヨモツネット

    blog移行しました。新しいblogで更新を続けています。 XMLェ… text ja 2012-07-08 http://www.yomotsu.net/wp/?p=603 XMLェ… 日々の出来事2012年7月8日日曜日 ブログ作りなおそうかなーと思って、この Webサイト をみなおしてたら、Web ページのメタ情報としてダブリンコア (RDF) を混在させていたことを思い出した。バリデーターにかければ、グラフも取り出せて みたいな感じになる。でも結局あまり意味なかったです多分。いまは OGP とかありますしね。 Web ページは XHTML にしてたけど、ブログのコメントで参照先のない数値参照とか混ぜられると XML パースエラーになるし、XML だから他の語彙混在できるけど、RDF くらいしか混ぜてなかったし、XHTML 意味なかったです多分。いまは HTMLSVG 混在でき

    indigoworks
    indigoworks 2011/07/12
    こういうコーディングに長けている人にかけて、デザインセンスがアレなかんじ。本文でしねきゃぷしょん使うとか読みにくくてしょうがない
  • h1〜h6で作った文書の階層を元にメニューを自動生成してくれるjQueryプラグイン「pageMenu」:phpspot開発日誌

    h1〜h6で作った文書の階層を元にメニューを自動生成してくれるjQueryプラグイン「pageMenu」 2011年07月07日- $ pageMenu plugin 0.0.2 | jQuery Plugins h1〜h6で作った文書の階層を元にメニューを自動生成してくれるjQueryプラグイン「pageMenu」 HTMLでH1〜H6で綺麗に階層的に文書を記述しておくと次のようなページメニューを自動で作ってくれてページ内リンクしてくれるというものです。 自分で作ると文書追加の際に修正しなくてはならず、漏れも発生しそうですが自動でやることでその心配や手間はゼロになります。 初期化もカンタン。 jQuery('h2').pageMenu(); 綺麗にHTMLを書いている方はこの1手間でかなり使いやすくなりますね 関連エントリ iOSのシェイクイベントを取得できるjQueryプラグイン「gS

    indigoworks
    indigoworks 2011/07/08
    Wikipedia的なアレ
  • [CSS]チェックしておきたい、スタイルシートのテクニックのまとめ | コリス

    実用的なものから実験的なものまで、最近リリースされたものを中心にスタイルシートのテクニックを紹介します。

    indigoworks
    indigoworks 2011/07/07
    クロスブラウザのことを考えないといけないとはいえ、もうAdobeいらねえんじゃねえの、みたいな気にもなってくる
  • CSS3のtext-shadowを使ったテキスト装飾のサンプル集

    たまに使うので自分用にメモします。 css3のtext-shadow等を使用した テキスト装飾のサンプルコードの 備忘録です。工夫すればいろいろ と作れるんでしょうけど、とりあえず よく使うものをピックアップします。 自分用のコピペ用サンプルです。用途は限られますけど、iPhone用サイトなどでも使えるので覚えておいて損は無いかなと思います。テキストだけだと管理が楽でいいですよね。 CSS3 text-shadow sampleいろいろ。フォントGoogle font APIを使用しています。付けてるネーミングは無いと不自然だから付けた的なものですので気にしないで下さい。 Default

    CSS3のtext-shadowを使ったテキスト装飾のサンプル集
    indigoworks
    indigoworks 2011/07/07
    Letter Pressはやりすぎ
  • スマホ用JavaScriptフレームワーク5つ+1を徹底研究(1/5) - @IT

    スマホ用JavaScriptフレームワーク5つ +1を徹底研究 jQuery Mobile、iUI、jQTouch、 Sencha Touch、Wink toolkit、PhoneGapとは アシアル株式会社 鴨田健次 2011/6/22 スマートフォン向けJavaScriptフレームワーク/ライブラリを使うと、スマートフォンアプリっぽい見た目のページデザイン、UI(ユーザーインターフェイス)パーツやページ遷移アニメーションを簡単に実装できます。多くは、おのおののフレームワークのルールにのっとったHTMLを書くことで、それらの機能を実現します。 稿では、jQuery Mobileを筆頭として、いくつか発表されているスマートフォンサイト向けJavaScriptフレームワークを紹介します。 ■ PCサイト向けJavaScriptフレームワークについて PCサイト向けJavaScriptフレー