Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                

タグ

webdesignに関するkirifueのブックマーク (368)

  • Objective-C不要! - 書評 - iPhoneアプリケーション開発ガイド : 404 Blog Not Found

    2010年08月03日21:30 カテゴリ書評/画評/品評iTech Objective-C不要! - 書評 - iPhoneアプリケーション開発ガイド オライリー矢野様より献御礼。 iPhoneアプリケーション開発ガイド Jonathan Stark / 増井俊之監 / 牧野聡訳 [原著:Building iPhone Apps with HTML, CSS, and JavaScript] これだ! こういうが、欲しかった! iPhone向けに何か作りたい。でもObjective-Cは敷居が高い。App Storeで大もうけしたいわけじゃない。でもiPhone向けのWebサイトを作るだけじゃちょっと物足りない。 そんな私のような人のためにうってつけの一冊が、これだ。 書「iPhoneアプリケーション開発ガイド」という題名は、ちょっとミスリーディングだ。原著の"Building i

    Objective-C不要! - 書評 - iPhoneアプリケーション開発ガイド : 404 Blog Not Found
  • 非デザイナーのためのデザイン基本テクニック その1 | 07design.blog

    デザイナーではない方も趣味でサイトを作っていたり、デザイナーに頼むほどでもない画像を作ったりする機会があると思います。デザイナーはセンスでサクサクと制作するイメージがあるかもしれませんが、実はデザインというものは数々のルールによって成立しています・・・デザイナーではない方も趣味でサイトを作っていたり、デザイナーに頼むほどでもない画像を作ったりする機会があると思います。 デザイナーはセンスでサクサクと制作するイメージがあるかもしれませんが、 実はデザインというものは数々のルールによって成立しています。 そのルールの知識があればデザイナーレベルとはいかないものの、見た目がきれいなグラフィックは作れるはずです。 デザインという言葉の定義やソフトの使い方から始めてしまうとややこしくなるので、 今回はあくまでも「とりあえず見た目をキレイにする」ということに重点を置いて説明します。 記事内で

  • Firebugの意外と知られていない機能紹介(プログラマ向け) - KAYAC Engineers' Blog

    羊毛布団を洗濯機にかけられないことを知りました。ago(@kyo_ago)です。 意外と知られていない機能が多い!?Firebugの使い方を見て、プログラマ向けも欲しくなったので書いてみました。 1. ショートカット一覧 以下のページでFirebugのショートカット一覧が公開されています。 http://getfirebug.com/wiki/index.php/Keyboard_and_Mouse_Shortcuts 取り合えず以下の二つだけでも覚えておくと効率的かもしれません。 F12でFirebugの有効、無効の切り替え 広いコマンドラインモード時にCtrl+Enterでコードを実行 また、以下のメニューからショートカットの変更も行えるので、他の拡張等とショートカットがかぶった場合でも別のキーで使用することが出来ます。 2. Firefox体のツールバーに「要素を調査」ボタン Fi

    Firebugの意外と知られていない機能紹介(プログラマ向け) - KAYAC Engineers' Blog
  • マイコミジャーナル|【レポート】iPhone 4でもPCでも画像を綺麗に表示するCSSの使い方(2010/07/23)

    SitePoint: New Articles, Fresh Thinking for Web Developers and Designers WebデベロッパやWebデザイナにとって差し迫った課題のひとつに、WebサイトをどうやってiPhone 4に対応させるか、といったものがある。iPhone 4の画面解像度はiPhone 3GSの4倍。縦が2倍、横が2倍の解像度になっている。このため、スケーラブルなデータを表示させた場合、iPhone 4とiPhone 3GSでは表示されるデータの美しさに大きな違いが現れる。iPhone 4の表示は美しい。 しかし、PCiPhone 3GS向けに用意した画像はiPhone 4では従来通りの見た目で表示される。サイズのバランスをとるために1x1ピクセルを2x2ピクセルに拡大して表示するためだ。これではiPhone 4のRetinaディスプレイの性能

  • CSSで犯しがちな5つの誤ち | エンタープライズ | マイコミジャーナル

    Nicole Sullivan, a web developer living in California. Webページのパフォーマンスを向上させる方法のひとつに、CSSファイルを最適化するというものがある。CSSはプログレッシブレンダリングをブロックする効果があるため、最適化しないでおくとページのレンダリング時間に影響を与える。Stubbornella ≫ Blog ArchiveTop 5 Mistakes of Massive CSSAlexa Top 1000サイトを調査した結果が掲載されている。CSSに関して使うべきだが使われていないCSSテクニックがあり、その上位5が紹介されている。紹介されているテクニックは次のとおり。 42%がCSSをGZIP圧縮で提供していない。 44%が2つをこえるのCSS外部ファイルを使っている。 56%がCSSをクッキーとともに提供している

  • 【レビュー】斬新な機能を多く盛り込んだ福岡パルコのWebサイト | クリエイティブ | マイコミジャーナル

    弊社刊行の雑誌『Web Designing』のサイトレビュー記事「WD Website Front」から気になるサイトをピックアップ。今回は、2010年6月号に掲載された2010年3月に新しくオープンした福岡パルコのWebサイトを紹介する。 福岡PARCO Webサイト クレジット □クライアント:パルコ □制作:ラナデザインアソシエイツ CD、AD、Pl:木下謙一/D:岩藤芙美/D、TD:吉田政秀/De、Il:麦田光/Fl:児玉温子/HT:戸室順一/Pl、CW:榎賢治/モバイルサイト制作:モバイルコマース/So:高木正勝 3月に新しくオープンした福岡パルコのサイト。トップページはメディア機能に特化しており、パルコからのニュースのほかに、ショップからの告知、Twitterの最新記事が並列的に流れる。特に、館内154店舗のスタッフが携帯電話から投稿した情報が店舗案内のページにblog形式

  • Webレガシーへの道

    6月15日に始まった「iPhone 4」の予約は初日に60万台を超え、日でも米国でも過去最高になったという。米AT&Tでは、初日の予約数が前機種iPhone 3GSを10倍上回り、予約の受付を停止した(関連記事)。ソフトバンクモバイルでも、孫正義氏のTwitterによれば「3GS予約実績の10倍の申込に耐える容量でしたがそれ以上の申込でした」。混乱を招いたことを非難する声も上がっているが、結果としてならば「3GSの10倍」というすさまじい勢いでの普及をもたらした。1カ月前のiPad発売のにぎわいと併せて、2年前にiPhone 3Gが発売されるまでは想像もできなかったモバイル環境が整いつつある。 iPhone/iPadが注目されるのは、単に端末のデザインや機能だけではなく、ユーザーと開発者いずれの目にもアプリケーション稼働のプラットフォームとして魅力的に映っているからだ。これまではどちらか

    Webレガシーへの道
  • CSS+HTMLのみで実装出来る、クロスブラウザ対応のWebデザインテクニック集 - かちびと.net

    cssHTMLタグのマークアップ のみで実装出来るテクニック集 です。クロスブラウザ対応のみ をcss-playから探したので、 ついでにご紹介します。 jsが使えない環境でデザインする機会があったのでメモがてらエントリー。css-playを中心に、あとはググったりSBMで探したり。マークアップはリンク先をご確認下さい。css-playはソースを。 シンプルなドロップダウンメニュー シンプルなドロップダウンメニューです。マルチレベルのメニューも可能。 demo 縦並びのフライアウトメニュー 横に出るフライアウトタイプ。画像を使用しています。 demo クロスブラウザ対応のグラデーション webkit系でもmozでもIEでもcssのみでグラデーションを実装。 Cross-Browser CSS Gradient ハック、テーブルも使用しないドロップダウンメニュー シンプルなドロップダウンメ

    kirifue
    kirifue 2010/06/16
    CSS+HTMLのみで実装出来る、クロスブラウザ対応のWebデザインテクニック集。 #開発
  • キャズムを超えろ! - 団塊~シニア層向けのWeb設計 やっちゃいけない10のUI

    一時期パソコン教室の講師をやっていたことによる経験と、昨今Webサービス運用にあたって中高年層からのクレームなどを自分なりにまとめた結果として、50代以上のユーザに対するWebサービスPCアプリケーションのUI設計における以下10のTIPSを公開してみたいと思う。...といってもたかだか10個で収まる簡単な話ではないので、思いついたら都度追加して行きたい。 ID,ニックネームを考えさせてはいけない。半角英字開始限定は論外 IDやニックネームが思いつかない方が多い。これはシニアに限らず、ITリテラシーがそれほど高くない若年層についても言えること。作る側の人間も「過去にWebで使ったID,Nicknameは全て使っちゃダメ。何か新しいのを考えて入れてみて。」と言われると結構悩んじゃうもの。それと同じ状態に陥ると思っていただけるとわかりやすい。「IDのかわりに電話番号でもいいですよ」というと結

    キャズムを超えろ! - 団塊~シニア層向けのWeb設計 やっちゃいけない10のUI
  • もう、class名やid名で悩まないんだからっ!!|CSS HappyLife

    class名やid名って付ける時悩みませんか? 今でもボクは結構悩むんですが、そんな悩みを解決する為に、人さまのソース覗きまくってよくあるclass名とid名を拾ってきました。 これで、チョットだけ作業効率アップ!? 2010年6月10日追記: この記事自体、2007年 1月15日に書かれてるんでかなり古いです。 あくまでも参考程度に留めてもらうのが良いかと思います。 今だったら、html5の要素を参考にしたりして付けるのが、今後の事を考えると良いのかなーと思います。 また、善し悪しの判断はせずに公開しているものですが、位置に関するのは仕様変更に弱くなるのでオススメはしません。 全体に使えそうな感じ wrap wrapper top-wrapper wrapperAll frame mframe all-frame container page pagetop all allContent

    もう、class名やid名で悩まないんだからっ!!|CSS HappyLife
  • より早くcssやhtmlのコーディングが行えそうな情報いろいろ - かちびと.net

    Web制作を少しでも効率化しよう と思って(今更)いろいろ便利そう な情報を探しました。既に使って いる情報の方が多かったのです が、折角調べたのでシェアしたい と思ってエントリーです。 コーディングをもっと円滑に、という旨の情報です。順不同。あんまり多いと逆効果なので量は絞りました。一応これでも絞りました。絞ったつもり。 zen-coding 話題になったzen-coding。だいぶ慣れて来た方もいらっしゃるのでは。 zen-coding(家) HTMLコーディングが3倍速くなる?「Zen-Coding」 秀丸Zen- Codingマクロ コーディングの効率化を図るZen codingをDreamweaver cs4に入れる方法 WP Zen-Codingが凄く便利 初期設定とかTipsとか 制作前に知っておくと便利なコードとかTipsいろいろ。 css書く前にチェック。 もう、cla

    より早くcssやhtmlのコーディングが行えそうな情報いろいろ - かちびと.net
  • 初心者さんのためのWebサイト制作に役立つリンク集

    2017年6月29日 Webサイト制作 「Webサイト勉強するのにおすすめのサイトを教えてください!」との声が多いのですが、日のWeb関連チュートリアルサイトをあまり見たことがなかったので、今までおすすめできませんでした…。ということでちょっとググって初心者さんによさそうなサイトをいくつか紹介します。小難しい単語が並んであるようなサイトは避けているつもりですが、わかりにくかったらすみません。他にもおすすめサイトがあればぜひコメント欄にて教えてください! ↑私が10年以上利用している会計ソフト! Webサイトを作る流れ まずはWebサイトを作る目的を考える 誰のため?何のため?Webサイトを作り始める前に。 サイトマップと呼ばれる構成図を作成 Webサイトの構成図を簡単に作れる便利ツール ワイヤーフレーム(Webサイトのレイアウト)を作成 Webサイトの骨組み: ワイヤーフレームを素早く・

    初心者さんのためのWebサイト制作に役立つリンク集
  • 定番Web APIを知る

    何といってもWeb APIを利用する醍醐味は,各種のWeb サービスを組み合わせて新しいWebサービスを作成するマッシュアップです。 国内でもマッシュアップのコンテスト「Mashup Awards(http://mashupaward.jp/)」などが開催され,大盛況のうちに幕を閉じました。このようにWeb APIに対する関心は,日に日に高まっています。Mashup AwardsのWebページからは,参加企業が提供するWeb APIのリストやマッシュアップの例を見ることができます。その中から,代表的なWeb APIをいくつか紹介しましょう。 Yahoo! JAPAN Web API http://developer.yahoo.co.jp/ このYahoo! JAPAN Web APIは,開発者向けに展開するサービス「Yahoo!デベロッパーネットワーク」(図1)で提供されるWeb API

    定番Web APIを知る
  • 新着記事

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

    新着記事
  • http://www.designwalker.com/2010/05/css3.html

    http://www.designwalker.com/2010/05/css3.html
  • iPadのブラウザをPCで利用する - iPadのSafariをエミュレーションする方法 - クラウディア

    5月10日にiPadの予約が開始され、発売日の5月28日が待ち遠しい人も多いでしょう。僕もその一人です。僕はWi-Fi 16GBを10日にApple Storeで早速予約しました。Apple Storeを見ると予約が殺到しているようで、現在(5月14日)は出荷予定は6月7日までとなっています。 さて、待ち遠しい方々や、インターネットサービスを提供している方々は、iPadのエミュレーターでサイトがどのように表示されるか、確認してみてはどうでしょう。 僕らフィードパスもクラウドアプリケーションのプロバイダーなので、提供するクラウドアプリケーションがiPadでどのように表示されるか大変興味のあるところです。早速、フィードパスが提供するグループカレンダーのfeedpath Calendarの表示を確認してみました。 方法はAppleが提供するSDKである「 iPhone OS 3.2 SDK be

    iPadのブラウザをPCで利用する - iPadのSafariをエミュレーションする方法 - クラウディア
  • 画像は一切使ってない!?CSS3だけで描いた“ドラえもん”がすごい - はてなニュース

    こちらの“ドラえもん”のイラスト、どうやって描かれていると思いますか?PhotoshopやIllustratorなどの画像編集ソフトで描かれているようにも見えますが、実はこのイラスト、なんと画像を一切使わずに「XHTML」と「CSS3」のソースコードのみで描かれているとのことです。 ▽CSS3 ドラえもん インターネット上でイラストを公開するには、JPGやGIFといった画像ファイルでアップロードするのが一般的。しかしこちらのドラえもんはそういった画像ファイルではなく、Webサイトを構築する際に使われるXHTMLCSS3のソースコードのみで作られています。そのため“右クリックで保存”ができなかったり、ブラウザの種類やバージョンによって見え方が異なるのが特徴です。 こちらはFirefox3.6の場合です。FirefoxやGoogle ChromeCSS3に対応しているので、グラデーションま

    画像は一切使ってない!?CSS3だけで描いた“ドラえもん”がすごい - はてなニュース
  • Photoshop Vip » 保存版、合計1万個以上のベクター素材をダウンロードできるサイト21個まとめ

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

    Photoshop Vip » 保存版、合計1万個以上のベクター素材をダウンロードできるサイト21個まとめ
  • 少しのコードで実装可能な20のCSS小技集

    2019年5月17日 CSS CSSハックに続き、このCSS小技集も私のブックマークにずらりと並んでいたので、整理も兼ねて記事にしてみました。CSSのお勉強を始めたばかりの頃にブックマークしておいたものも多数。。ということで初心者さんからベテランさんまで参考にしてみてください! ↑私が10年以上利用している会計ソフト! コードはサンプル内の「HTML」や「CSS」タブをクリックしてくださいね! 少しのコードで実装可能なCSS小技集 シリーズ 【第2弾】少しのコードで実装可能な20のCSS小技集 【第3弾】少しのコードで実装可能な15のCSS小技集 まずはCSS基礎編 1. divを中央揃えにする ほとんどのサイトが基準となるdivを画面の中央揃えに設定しています。左右のmarginをautoにして中央揃えに。 See the Pen Center Div by Mana (@manabox

    少しのコードで実装可能な20のCSS小技集
  • [JS]IE6/7/8でもCSS3が使えるようになるスクリプト -IE-CSS3

    <textarea name="code" class="css" cols="60" rows="5"> .box { -moz-border-radius: 15px; /* Firefox */ -webkit-border-radius: 15px; /* Safari and Chrome */ border-radius: 15px; /* Opera 10.5+, future browsers, and now also Internet Explorer 6+ using IE-CSS3 */ -moz-box-shadow: 10px 10px 20px #000; /* Firefox */ -webkit-box-shadow: 10px 10px 20px #000; /* Safari and Chrome */ box-shadow: 10px 10px 20