タグ

Web制作に関するpoginのブックマーク (19)

  • ナビゲーションの3クリックルールは誤り

    重要な情報にアクセスしやすくすることは重要だが、3クリックルールはデータの裏づけのない恣意的な目安である。 The 3-Click Rule for Navigation Is False by Page Laubheimer on August 11, 2019 日語版2020年4月9日公開 3クリックルール どんなページもアクセスするのに3回以上のクリック(またはタッチスクリーンでのタップ)を必要としてはならない、という3クリックルールは、根強く残る、正式には認められていないヒューリスティックである。このバリエーションに、最も重要な情報には3クリック以下で到達しなければならない、というのもある。デザイナーはこのルールをWebサイトのナビゲーションや情報探索タスクによく適用するが、中には、(フォームやウィザードの入力など)他の種類のタスクにもこのルールを用いるデザイナーもいる。 タスク

    ナビゲーションの3クリックルールは誤り
  • WebSlides - 多彩な表現が可能なHTMLプレゼンテーションフレームワーク MOONGIFT

    プレゼンテーションというとPowerPointやKeynoteで作ることが多いですが、HTMLでのプレゼンテーションも使われるようになっています。しかし表現力があまり高くなく、シンプルなスライドが多かったように思います。 そこで使ってみたいのがWebSlidesです。これまでにないほど表現力の高いHTMLスライドが作れるフレームワークです。 WebSlidesの使い方 例えばこんな表示。大きな画像を背景に当てています。 クラスも多数用意されています。 2つのカラムでの表現。ソースコードをハイライトできます。 上下左右、どこでも自由に記述できます。 左寄せ。 3カラムでのグリッド表示。 地図表示の例。 ナビゲーション。 Apple風のクラスが用意されています。 なんとなくそれっぽいですよね。 こんな表示も。HTMLならではですね。 Webサイトにも使えそうなデザインです。 表現という意味にお

    WebSlides - 多彩な表現が可能なHTMLプレゼンテーションフレームワーク MOONGIFT
  • can I use... Support tables for HTML5, CSS3, etc

    Test a feature Our partnership with BrowserStack now lets you test your website for compatibility across 2,000+ real browsers and devices. Test on: Did you know? Next If a feature you're looking for is not available on the site, you can vote to have it included. Better yet, if you've done the research you can even submit it yourself! You can import usage data from your Google Analytics account and

  • ナビゲーションバーのボタンのデザインで犯しやすい5つの間違い

    UX Movementの著者、編集長。明快で効果的なデザインを愛し、ユーザのために日々奮闘しています。 ナビゲーションバーは、サイトでもっとも大切な要素の1つです。ユーザーは必要なコンテンツを探し出すとき、ナビゲーションバーを頼ります。ナビゲーションバーのボタンを正しくデザインしなければ、ユーザーに無駄な作業をさせてしまうかもしれません。 間違ったデザインだと、ユーザーがナビゲーションフローのどこにいるのかわからなくなり、困惑してしまうことがあります。また、ラベルやクリックボタンが読み取れないような間違いもあるでしょう。 これからナビゲーションバーのボタンのデザインで犯しがちな間違いを5つ紹介します。これらの間違いを犯している場合は、ナビゲーションバーをすぐに修正しましょう。 1. 選択したボタンが強調されない 多くのデザイナーは、ナビゲーションバーで選択したボタンを強調するようにデザイン

    ナビゲーションバーのボタンのデザインで犯しやすい5つの間違い
  • WEBデザインが短期間で上達した方法

    この記事は、Webデザインが短期間で上達した2つの方法として、新たに書き直しました。 WEBデザイナーとして10年ちょっと経過。 未だにデザイナーとして足りないものは多いですが、 どうにかクライアントにも満足してもらえる デザインが提供できるようになったと思います。 これは、自分が新米デザイナーだった頃にやっていた、デザインの上達方法です。 「上手くデザインができない!」「上手くなるにはどうすればいいの?」など、 どうすればデザインが上達するのかわかならい人の参考になれば幸いです。 新米デザイナーの頃、ダメなデザインをして先輩からよく叱られていました。 クライアントからデザイナーを交代してくれと言われ、 激しく落ち込んだこともあります。 いまになると恥ずかしいですが、 その頃の自分には、 プロのデザイナーとして最低限の能力がなかったのです。 クライアントの満足するクオリティのデザインを 期

    WEBデザインが短期間で上達した方法
  • エンジニアやデザイナーになりたい大学生がチェックしておくと良いおすすめブログ8選!|キャリアバイトコラム

    最近は、Webエンジニアやデザイナーを目指す学生が増えています。 ネット上でも様々な学習サービスがある為、一気に敷居が低くなっとというのが大きいでしょう。 そんなWeb制作やデザインを学び始めた人が、書籍や学習サービスとともに、チェックしておくと良いブログをピックアップしてみました。 Webクリエイターボックス HTMLCSSWordPressなど、フロントエンド周りについて、非常にわかりやすく書かれているブログです。 運営されているManaさん自身は、カナダのバンクーバーでWebデザイナーをしており、最新の情報にも敏感で、初心者以外にも役立つ記事が多いです。 全くWebデザインをしたことがない、いまいち理解できない、そんな人には是非読んでほしいブログです。 【おすすめ記事】 ・WordPress オリジナルテーマの作り方 3.0+ ・実践で学ぶWebサイト制作ガイド

  • html5-memo.com

    html5-memo.com
  • インターネットでものづくりするときに役立つサイトまとめ

    先日、東京学生広告研究団体連盟の総会にて、 「インターネットでつくる人を増やす」というテーマでお話させていただきました! その時に紹介したサービスをまとめます。 この記事のターゲットは、インターネットでまだ作ったことがない人。 興味があってこれから始めよう!と思っている人向けです。 ポイントは、ブラウザだけで完結できるもの。PCさえあればOK。 アイデア・インスピレーションをストックしよう まずは、アイデアのストックやインスピレーションを高めるサービスを紹介します。 EVERNOTE 簡単なメモから、写真や動画まで記憶し、整理整頓ができるサービスです。 tumblr オンラインでできるスクラップブック。Web上の記事や画像・映像などを簡単にストックできます。 また他のユーザーの投稿もストックできるので、面白いユーザーをフォローするのがオススメです。 Pinterest 画像を貼りつけて共有

  • 非WEB屋でもサイトが作れる驚異的サービス/『サイトを作る』という敷居がどんどん低くなっていると実感する物色々 | バンクーバーのうぇぶ屋

    先週くらいのお話ですが、“カナダで留学した後自分たちでスモールビジネスをやるからサイトが欲しい、でもお金無いから自分たちで作りたい。”的な相談があって、「そんな、サイト作るだけのサービスなんぞ、腐る程あるわぁああ!!」と、半分ヤケくそになってお話したので丁度いい機会だからまとめてみようと思います。 まぁ、今日はどちらかというと、完全に非WEB屋な人に向けたサイト自体を作るサービス、問い合わせなどのフォームを作るサービス、ユーザーテストを低コストで行うためのサービス、そういう物をご紹介していこうと思います。 たぶん、趣味やとりあえずサイト作りたいと思っている人には朗報として、とりあえずサイト作れる人がWEBデザイナーだと思っている人へは啓発(的な?)として、記事を書かせて頂けると幸いです! 加えてたまに、「サイトが作れるようになりたい。」と僕の元に来てくれる人がいますが、もしそういった人が「

    非WEB屋でもサイトが作れる驚異的サービス/『サイトを作る』という敷居がどんどん低くなっていると実感する物色々 | バンクーバーのうぇぶ屋
  • アフィリエイトで稼ぎ、ネットで話題になったエントリー6選 | マネーハック 〜ネット副業から節約術までマネー情報の総合サイト〜

    お金を稼ぐ手段として「アフィリエイト」という言葉を効いたことがあると思います。 ネット上で話題になったアフィリエイトで稼いだ人が質問に答えているエントリーをまとめました。 アフィリエイトに興味を持っている方は、 ぜひ一度目を通してみてください。 アフィリエイトで稼ぐ方法全部暴露しようと 思う ちなみに今話題のステマ2chブログのアフィじゃなくて 商品専門のサイト作るほうのアフィね アフィリエイトだけで生活してるけど 質問ある? 30万くらい 一人暮らし アフィリエイトで月30万円以上稼ぎたい方向けの見 せ方テクニック アフィリエイトで月30万円以上稼ぐための、 購入意欲をそそる文章の書き方、いや、見せ方を書いていきます。 学生だけとアフィが今月ついに40万超えた でも学校の奴らは信じてくれない(´・ω・`) アフィリエイト詳しいけど何か質問ある? >いままでトータルどれ位稼いだ? 最高は月

  • デザイン上級者 21の特徴

    デザイン上級者は、中級者と初心者と何が違うんだろう?って思った時に、こちらのが役に立ちました。 『上達の法則 – 効率のよい努力を科学する –』というです。このには、碁や茶道など、あらゆる分野に共通する上級者の特徴がのっています。このを参考に、デザイン上級者の特徴と、上級者になるための実践方法を書いてみました。 デザイン上級者の特徴 1. 上級者は一つのデザインから読み取ることが多い 一つのデザインを見たとき、上級者の方が中級者、初級者よりも気づくことが多いです。例えば、背景に薄くグラデーションがかかっているとか、縦のグリッドのラインが揃っているなど。 また、そのデザインからたくさんの情報を引き出しているので、長く見ても退屈しにくいという特徴を持っています。 2. 上手なデザインをするということに高い価値をおいている 上級者は、デザインに対して気で取り組む度合いが高いため、上手な

    デザイン上級者 21の特徴
  • jQuery初心者(凡人)が1か月でjQueryを書けるようになった4つのポイント : 読書メモ・感想とWebマーケティング雑感

    2011年12月02日06:30 jQuery初心者(凡人)が1か月でjQueryを書けるようになった4つのポイント カテゴリWEB書評読書メモ mixiチェック シェア Tweet 独学でjQueryをはじめて、1か月そこそこで ベーシックなアニメーションを実装できるようになりました。 私なりにポイントだと思ったことを整理したいと思います。 ポイント1 jQuery初心者用のを買う 数か月前からjQueryを学びたい、学びたいと思い、はてぶのホッテントリに入る jQueryの記事を、ブックマークしては都度読んでいました。 しかし、一向に進歩が見られません。 いい加減、でも買ってみるかと思った最中 ひょんなことで出会ったこのにより、jQuery学習のスピードが一気に上がりました。 Web制作の現場で使う jQueryデザイン入門 (WEB PROFESSIONAL)西畑 一馬アスキ

  • HTML5&CSS3を利用した美しい40のフリーテンプレート集:phpspot開発日誌

    40 Beautiful Free HTML5 & CSS3 Templates HTML5&CSS3を利用した美しい40のフリーテンプレート集がまとめられていました。 HTML5とかCSS3をベースにしたサイトを作りたい方は参考にできそうです。 HTML5とかCSS3を使ったサイトのレイアウトの感覚をつかんで、そうしたサイト制作の際に参考にできますね これらがフリーとはすばらしい 関連エントリ HTML5+CSS3ベースのテンプレート集12 HTML5とCSS3を使ったフォームデザインのチュートリアル集30 HTML5+CSS3でクールなオーディオプレイヤー「ZEN」

  • サービス終了のお知らせ - NAVER まとめ

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

  • Loading...

  • ウェブにもっとウェルカムな笑顔の表情を - makitani.com

    面と向かったコミュニケーションにおいて、顔の表情、とりわけ「笑顔」は、雰囲気を和らげたり親愛の意を表現するというような、大きな役割を持っています。その役割を、ウェブでどう補っていくのか、というお話。 ぎこちないコミュニケーションも、笑顔ひとつで立て直せる 先日、小さなハンバーグ屋さんでランチをしていたときのこと。ホールでひとりでがんばっている若い女性の店員の接客は、どことなくぎこちない感じでした。まだこの店で始めて1か月とか、そんな感じでしょうか。お辞儀はとても気持ちがよいものでしたが、「そこで水とメニューを持って行けば効率よく動けるのに」「パントリーに入り込んでしまったら、客席からの声が聞こえにくいのに」など、ちょっとどきどきひやひやしながら、その女性の動きを観察していました。 実は、飲店でホールの店員さんを観察するのが趣味です。僕が飲業や接客業にしばらくいたことがあるからという職業

    ウェブにもっとウェルカムな笑顔の表情を - makitani.com
  • もしも10分の1の行数でHTMLが書けたら

    Zen-Codingとは 1年ほど前から、Zen-Codingが話題になっています。Zen-Codingを使うと、特定の省略された記法を展開できます。この展開が非常に強力で、ちょっとしたHTMLを記述するのであれば、Zen-CodingでHTMLCSSのマークアップを効率的に行えます。 Zen-Codingはさまざまなテキストエディタに対応したプラグインとして提供されています。プラグインには、公式対応しているものと、サードパーティの開発者が作成したものがあります。 それぞれのプラグインによって、実装機能が異なる場合があります。これらのプラグインの詳細はZen-Codingの公式サイトから確認できます。 基的な使い方 ここからはZen-Codingの基的な使い方を解説します。Zen-Codingをテキストエリアで利用できるサンプルを用いて、実際に試しながら読み進めてください。テキストエ

    もしも10分の1の行数でHTMLが書けたら
  • GPLやMITやCCなど主要ライセンスの内容と意味のまとめ

    WEB制作者にとっての強力な手助けとなる「無料素材」や、PCの作業効率を格段に向上させる「フリーソフト」。WEBの世界では、もはやタダで手に入らないものは無いんじゃないかとさえ思えるほど、さまざまなものが無料で配布・提供されています。 しかしそれらは「使用料金が無料なだけ」であって、「完全に自由に使用する事が可能ではない」のです。 世の中に無料で出回っている画像やプログラムソースやアプリケーションなども、そのほぼ全てが、なんらかのライセンス(使用許諾条件)に添った形で配布・提供されているのです。 著作権を有する制作者人が示す使用許諾条件を守る事は、制作者への敬意であると同時に、意図しない「著作権の侵害」を未然に防ぐ手段でもあります。 しかし、このライセンスというのが、なかなかに分かり難い。コムズカシイ文言の洪水だったり、そもそも英文だったり、GPLとかLGPLとかCCとか略語まみれだった

    GPLやMITやCCなど主要ライセンスの内容と意味のまとめ
  • 感性の高いプログラマは一度に三方を見る - 基本へ帰ろう

    プログラマのレベルは、プログラムの内容を観察すればある程度は検討がつきます。WebサービスのトップページのHTMLソースコードの完成度が低かったり、レスポンススピードなどが遅ければ、そのWebサイトのクオリティも同様に低く思われてしまうこともあるわけです。では、具体的にプログラマのどこを観察すればわかるのか。優秀なプログラマは、つねに以下の三方に感性のアンテナを張りながらプログラミングしているのです。 動作 保守 スピード それぞれ詳しく見ていきましょう。 動作 考えたアイデアの表現や与えられた仕様をちゃんと動作するプログラムを書くことです。これは至極当たり前のことですが、これが基です。プログラマの初心者は「後先考えずとにかく動くものを作る」大抵はここで精一杯です。 保守 長期的に保守しやすいクラス設計、データ設計、責任がしっかりと分かるクラス・メソッド、変数やクラス・メソッドの名前、オ

    感性の高いプログラマは一度に三方を見る - 基本へ帰ろう
  • 1