タグ

*web制作に関するmorixmori18752のブックマーク (34)

  • ダミー画像を超手軽に生成出来るWebサービス・PLACEHOLD.ITがやたら便利

    昨日知ったWebサービスに久々に感激したので勢いでシェアします。Web制作で必ずと言っていいほど必用になるダミー画像を生成してくれるサービスなんですが、これが個人的にかなり便利でした。 PLACEHOLD.ITはダミー画像の生成サービスなんですが、凄く手軽に生成出来るのでかなりオススメです。 ダミー画像を生成する、というシンプルなサービスですが、これが想像以上に有用的でした。 使い方使い方は至って簡単。placehold.itというドメインの後にサイズを指定すればいいだけ。 例えば350×150ピクセルの画像が欲しいなら http://placehold.it/350×150 にアクセスすれば指定したサイズの画像が表示されます。 なので、 <img src="http://placehold.it/350x150" />これで以下のようにダミー画像を表示させる事ができます。 勿論、細かいサ

    ダミー画像を超手軽に生成出来るWebサービス・PLACEHOLD.ITがやたら便利
  • 落ちこぼれディレクターに贈る「失敗を回避する術=自分セーフティネット」の作り方 : LINE Corporation ディレクターブログ

    こんにちは、livedoor Blog担当の眞子裕介です。 今回は、さんざん失敗を重ねた落ちこぼれディレクターの私が、自らの経験を基に学んだ「失敗を回避する術=自分セーフティネット」について説明したいと思います。 この「失敗を回避する術=自分セーフティネット」を身につければ、いまより打率が上がるはずです! これまでの悲しい体験から私が学んだ技を生かして、皆さんのプロジェクト遂行に役立てていただだければ最高です。 経験の多い会社であれば、すでに先輩たちが作ってこられたフォーマットやチェックリストなどの資料、組織体系の中に「失敗を回避する術」がすでに折り込み済みなのかもしれません。私がライブドアに入社した2005年当時は、ライブドアは「谷底に突き落として、這い上がってこい」の精神が蔓延しており、ディレクターの技術を身につけていなかった私は、自ら失敗を重ねつつ、周りのひとの仕事をまねながら学んで

    落ちこぼれディレクターに贈る「失敗を回避する術=自分セーフティネット」の作り方 : LINE Corporation ディレクターブログ
  • 国産限定・Web制作時に覚えておくと便利な14のフリーのWebサービス

    最近、国産のWebサービスも かなり勢いがあるなぁと思ったので ちょっとまとめてみました。よく 紹介されるのは海外製ですが、 それに劣らないMade in Japanの Web制作者が知っておくと便利そうな フリーのWebサービスをご紹介します。 順不同です。日語が完全に通じる海外Webサービスも今回は省いて純国産のWebサイト制作に一役買ってくれそうなWebサービスをご紹介したいと思います。出来る限り高性能だったり多機能なWebサービスのみにしたつもりですが主観入ってます。 Color of Book 国産サービスで一番多用しています。AmazonAPIを使って雑誌の表紙を抜き出し、その表紙からカラーチャートを生成。アイデアが素晴らしいですね。雑誌は表紙のデザインや色で惹きつけるよう考えられている事が多いのでWeb制作時のカラー選定にかなり参考になるのでは。 Color of Book

    国産限定・Web制作時に覚えておくと便利な14のフリーのWebサービス
  • Webサーバから始めよう

    Webサーバから始めよう:いまさら聞けない!? Web系開発者のためのサーバ知識(1)(1/2 ページ) プログラマの弱点(?) ある程度の規模の開発プロジェクトでは、上流工程と下流工程、開発担当とサーバ担当、さらに開発担当のなかでもバックエンドのロジック担当とフロント周りの担当など、分業体制で進めていくのが一般的です。 ここまできっちりと分業されていない場合でも、コーディングはプログラマが行い、番向けのサーバ構築などは詳しい人に任せてしまうといったことは多々あります。 こういった分業体制はもちろん理に適ったことなのですが、開発者が常にプログラマに徹してしまっていると、どうしてもサーバ知識が不足しがちになります。アプリケーションを動作させるために必要な最低限の環境を自分のPC上に整えたら、あとはひたすらコーディングの日々といったことの繰り返しになるので、なかなかサーバ知識が深まりません。

    Webサーバから始めよう
  • ワイヤーフレームコミュニケーション研究会

    直前の告知になってしまい申し訳ありませんが、9月29日21時より @threepennie さん「Websig 24/7サイトマップ+ワイコミ研」ということでUStreamを行ないます。 サイトマップとワイヤーフレームの標準ガイドラインを考える会のキックオフ番組となります。 詳細はこちら http://ow.ly/2Js6t 配信は、 http://ow.ly/2Js6u にて行なわれますのでお楽しみに! ハッシュタグは#websigです。 第2回ワイヤーフレームコミュニケーション研究会が開催される2週間ほど前にTwitter上で、デザイナーの松原慶太さんとやりとりで、ワイヤーフレームのパーツをマグネット化できたらいいよねみたいな話し合いが行なわれました。 ホワイトボードとかに貼ったりしてアナログな状態でいろいろなブレストをやるためのアイテムという雰囲気です。 松原慶太さんは、標準Webデ

  • 解像度別のユーザー使用率を示したキャンバス – creamu

    Methodologie Web Canvasというページを見つけました。解像度別のユーザー使用率を示してくれていますね。 760 x 420px 100% 960 x 600px 92% 1210 x 630 50% 1370 x 730 11% とのことですね。これによるとwidth:960pxでもそれほど問題なさそうですね。 統計はhttp://thecounter.com/とhttp://marketshare.hitslink.com/report.aspx?qprid=17(2009年8月現在のデータ)から得ているようですね。 一度見てみてください。 » Methodologie Web Canvas ばりばり作業中。配送してメッセしてWindowsアップデートして・・・と昨日も知らん間に寝てたzzz

  • 【全部無料】 Web制作に役立つオンラインサービスやツール300+ - かちびと.net

    Web制作に使えるWebサービスやツールなどが様々なサイトでかなり 紹介されています。便利なものですが、多すぎて混乱するので、 備忘録的にローカルサーバーに入れたWPでリンク集を作っていました。 そろそろ数が落ち着いて来たので多くの方とシェアしたいと思い、公開してみます。 現在330ありますが、追加していく可能性があります。 リンク集は全て無料で使える事を条件に集めていました。英語が苦手な方もいらっしゃいますのでTwitterサービスのまとめ同様、日語で使い方などを説明してくれているサイトにリンクしています。無い場合は海外サイトにリンクしていますが、その場合はアメリカの国旗をつけてあります。サイトがアメリカのものかは知りませぬ。分かりゃいいんだ、分かりゃ。 無料といえどもライセンスの縛りもありますので自己責任でご利用下さい。 使えるかどうかは個人差が生じますので何とも言えませんが、お役に

    【全部無料】 Web制作に役立つオンラインサービスやツール300+ - かちびと.net
  • JPEG、GIF、PNG画像選択の指針まとめ | エンタープライズ | マイコミジャーナル

    SitePoint: New Articles, Fresh Thinking for Web Developers and Designers Jennifer Farley氏がSitePointにおいてGIF, PNG, JPG. Which One To Use?のタイトルのもと、Webサイトを作成するにあたってどの画像フォーマットを採用すべきかという指針を簡単にまとめている。まず氏はそれぞれの画像フォーマットの特徴を簡単に説明。 GIF - 256色のインデックス画像。写真には向かないが、ロゴであったりフラットブロックな画像には向いている。透過データを保持できるという特徴がある JPEG - クオリティによって圧縮率が変わる非可逆圧縮の画像フォーマット。透過は表現できないが、写真データの用途に向いている PNG - GIFに似ているが、GIFのようなぎざぎざを出さずに背景透過を実現

  • ディレクターなら押さえておきたいモバイルSEO34項目 : LINE Corporation ディレクターブログ

    ディレクターの渡邉雄介です。 ディレクターブログで以前に何度かモバイルSEOについて言及していますが、今回は、モバイルコンテンツ制作に関わるディレクターが最低限押さえておきたいSEOの進め方と、34個のチェック項目を紹介したいと思います。 SEO、その前に SEOを行うとき、まず最初に何をしていますか? 「さっそく実施する」とお答えになる方もいるかもしれませんが、私は最初は何も手を付けず、現状の数値の把握から始めています。 たとえば、ページ内に特定のキーワードの出現回数を増やして、そのワードの検索順位の向上を目指しているような場合、施策を実施する前に最低1週間は過去の順位の推移・平均をみておかないと、結果どれだけ向上したのか、適切な検証ができません。 モバイルはPCと違って、まだまだ解析できる項目が限られているため、SEOの実施後にどれだけの変化があったのかを適切に検証をするには、実施前の

    ディレクターなら押さえておきたいモバイルSEO34項目 : LINE Corporation ディレクターブログ
  • IE6から先へ行くための提案が必要

    YouTubeやDiggといった海外でアクセスの多いサイトが次々と IE6 のサポートを中止する動きを見せています。YouTube は他のブラウザに変更するメッセージの表示以外に具体的にどのようなサポートを止めるのかが分かりませんが、Digg では、コメントや Digg ボタンといったサイトのコア機能のサポートを止めることを考えているそうです。このニュースに影響されたのか、Twitter では、「IE6 Must Die」が、トレンドトピックにランクインしましたし、Twibbonを使った運動も展開されています。 ここ数年ほど、私は最新のブラウザで作りたい形を組み立てて行き、IE6 での表示をどう調整するかという進め方にしていますが、提案したいアプローチが場合によって IE6 では厳しい場合があります。JavaScript を使えば擬似的に CSS2.1 CSS3 のセレクタが使えるとはいえ

    IE6から先へ行くための提案が必要
  • サイト立ち上げ後2週間でやった基本的(?)な7つのSEO対策 | Kousyoublog

    このドメインは お名前.com から取得されました。 お名前.com は GMOインターネットグループ(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日のドメイン登録業者(レジストラ)(「ICANNがレジストラとして認定した企業」一覧(InterNIC提供)内に「Japan」の記載があるもの)を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2023年5月時点の調査。

  • 見出しを使わないサイトが58.5%!? | Web標準Blog | ミツエーリンクス

    Operaでは昨年より、MAMAと呼ばれるWebサイトの調査の結果を発表しています。 さて、一昨日にOpera Developer Networkで公開された、MAMAの新しい調査に関する記事が興味深かったので、ちょっと紹介したいと思います。 “Opera MAMA - a sneak peek at headings, images and summary - Opera's Developer Relations Team” 見出しの利用に関する統計 ページの見出し(h1-h6)がどのように使われているのかを調査したようですが、かなり面白い結果がでています。 見出し要素が利用されていない:58.5% h1が複数あらわれている:7.9% 最初の見出しがh1ではない:16.1% 見出しのレベルが飛んでいる:11.3% 見出しのレベルに順序がない:7.1% 記事のタイトルにもしましたが、見出

  • いま起きているWeb標準の進化、HTML5、CSS3、JavaScript 2.0

    が大型連休に入る少し前の4月23日、W3CはHTML5の新しいドラフトを公開しました。いつも最新のWeb標準化動向を伝えてくれるWeb標準ブログのエントリ「Last Callに向け進むHTML5 | Web標準Blog | ミツエーリンクス」によると、今回のドラフトから仕様書に大きく手が加わり、Webサイトを作る人向け(制作者に関係する要件)と、Webブラウザを作る人向け(実装要件についての要件)ごとに見やすくなるようなスタイルシートが用意されたとのこと。 これまでも何度かこのブログでは、HTML5やJavaScript 2.0などのWeb標準の動向を書いてきましたが、今回は分かりやすいようにその動きをまとめてみました。 HTMLHTML4でいったん進化が終了し、それ以後はXHTMLで進化していくことになっていました。しかし実際にはXHTMLは期待されたほど普及せず、XHTMLによっ

    いま起きているWeb標準の進化、HTML5、CSS3、JavaScript 2.0
  • Last Callに向け進むHTML5 | Web標準Blog | ミツエーリンクス

    HTML5の新しい草案が、日公開されました。 HTML 5 (2009年4月23日版) HTML 5 differences from HTML 4 (2009年4月23日版) いつもの通り、変更点の日語訳を更新しています。 HTML 5 ― HTML 4 からの変更点 前回の草案との差異から、気になったものを取り上げてみます。 spellcheck属性の追加。Chromeで実装されているようです。 SVGtext/htmlにおける処理の追加。追加されて間もなく、また提案段階ですので、実装はありません。 さて、前回の草案が2月12日公開ということから、2ヶ月ちょっとでの更新となります。前回の草案については8ヶ月も間があったわけですが、いったいこの早期の更新は何を意味するのでしょうか。 制作者のためのHTML5 ひとつは、仕様書に大きな手が加わったことです。 HTML5の仕様書は、「実

  • http://www.designwalker.com/2009/04/wireframe-2.html

    http://www.designwalker.com/2009/04/wireframe-2.html
  • IE1, 2, 3, 4, 5, 6, 7, 8の確認が同時にできる -Internet Explorer Collection

    Internet Explorerの異なるバージョン(1, 1,5, 2, 3, 4, 5, 5.5, 6, 7, 8)を同時に起動して、確認ができる「Internet Explorer Collection」を紹介します。 Utilu IE Collection 同時起動できるIEのバージョンは、インストールするWindowsのバージョンによって異なります。 当環境(XP SP3+IE7)では、上記のキャプチャのようにIE1.5, 2, 3, 4, 5, 5.5, 6, 7, 8を同時起動できました。 ※元のIE7には特に影響はありませんでした。 古いバージョンが必要ない場合は、インストール時にチェックをはずせばインストールしないと思います。

  • サイト公開前に役立つ25のユーザビリティチェックリスト:phpspot開発日誌

    25-point Website Usability Checklist | User Effect サイト公開前に役立つ25のユーザビリティチェックリストが公開されていましたのでメモしてみました。 サイトの公開前にチェックリストとして使うといいかもしれません。 アクセシビリティ 1. ロード時間が速いか?(60KBぐらいがベター) 2. テキストと背景のコントラスト調整(差異が低く見にくくないか) 3. フォントサイズが読みやすいサイズか?行間、文字間は適切か? 4. Flashやアドオンは控えめか? 5. 画像に適切なALTタグが指定されているか? 6. カスタマイズした404ページがあるか?デフォルトは非常に不親切 7. カンパニーロゴが分かりやすい位置におかれているか? 8. キャッチフレーズが適切に設定されているか? 9. 5秒で大体どんな内容が分かるものになっているか?ユーザは

  • あなたのウェブサイトを高速化する方法 - builder by ZDNet Japan

    そして同氏は、世界で最も高速なウェブサイトの1つであるGoogleのパフォーマンスにかかわる仕事をしているのである。 ウェブのパフォーマンスには2つの重要な側面、すなわち効率性と応答時間がある。効率性は、世界ランキング100位に入るようなウェブサイトを構築する際に出てくるスケーラビリティという難問に取り組むための武器である。あなたのウェブサイトが何百万人単位のユーザーと、何十億単位のページビューを擁するような規模のものである場合、バックエンドアーキテクチャ全体に対する理解を深めておくことが重要となるだろう。 ページの速度というものは、HTMLドキュメント内に記述する一連の指示によって決定されると言っても過言ではない。 iGoogleを例に挙げると、バックエンド処理に費やされる時間、すなわちデータがキャッシュされていないために毎回リクエストされることで費やされる時間は、ページ全体の処理時間の

  • http://e0166nt.com/blog-entry-571.html

    http://e0166nt.com/blog-entry-571.html
  • 2008年、ウェブのデザイナー・開発者がおさえておきたいリソース集 | コリス

    2008年、ウェブのデザイナー・開発者がおさえておきたいデザイン、Photoshop&Illustratorのチュートリアル、ブラシやベクター素材、JavaScriptCSSWordPress、タイポグラフィ、フォント、素材、リソースなどをnoupeのエントリーから紹介します。 2008 Most Popular Design posts, Tutorials and Resources デザイン関連 Photoshopのチュートリアル関連 Illustratorのチュートリアル関連 Photoshop&Illustratorのブラシやベクター素材 JavaScript関連 WordPress関連 CSS関連 フォント&タイポグラフィ関連 ツール&素材関連 デザイン関連 42 Awesome Business Card Designs 20 Beautiful HDR Pictures