このページで紹介するのはHTML4.01で定義されている特殊な文字です。 これらの文字を表示させるには、｢&キーワード；｣、｢&#番号；｣という2通りの記述方法があります。 キーワードは、大文字と小文字が区別されます。 ※OSやブラウザの種類・バージョン等の環境により、表示されない場合があるので注意してください。
特殊文字リファレンス
このページで紹介するのはHTML4.01で定義されている特殊な文字です。 これらの文字を表示させるには、｢&キーワード；｣、｢&#番号；｣という2通りの記述方法があります。 キーワードは、大文字と小文字が区別されます。 ※OSやブラウザの種類・バージョン等の環境により、表示されない場合があるので注意してください。
2016年これからのWeb制作業界の流れ、注目されているテクニックやツール、Webデザインのトレンドなどのまとめ
数多くのブログで2016年のトレンドをさまざまな切り口でポストしているので、その中から特に印象的で共感がもてたものをまとめて紹介します。 注目キーワードは、UI/UXはユーザーありきを忘れずに、洗練されたUIパターンとコンポーネント、旧バージョンIEのサポート終了、静的ページのジェネレーター、ページの肥大化。 淡いピンクとブルーは、今年のトレンドカラーのローズ クォーツとセレニティ 参考: 2016年のトレンドカラーはやさしい色、春の10色も素敵なカラーが揃ってる！ 2016年、Webとグラフィックデザインのトレンドと今後の展望 2016年、Web制作業界全体の流れ 2016年、注目されている新しいテクニック・コンセプト 2015年に定義されたレスポンシブWebデザインの8つのトレンド 現在のトレンドから見た良いこと、良くないこと、そしてダメなこと 2016年に学ぶべきプログラミング言語と
Bootsnipp
Bootsnipp Design elements, playground and code snippets for Bootstrap HTML/CSS/JS framework What is this? Bootsnipp is an element gallery for web designers and web developers, anybody using Bootstrap will find this website essential in their craft. Stay updated, Subscribe to Bootsnipp mailing list (only important updates will be sent, your email is never shared or sold to anyone else)
全くの未経験が独学でWEBデザイナーに転職するまで | SHIROMAG
私はWeb制作会社を経営しており、2023年現在で36歳になります。 28歳の時にWebデザイナーに転職してWeb業界でのキャリアをスタートさせ、32歳で独立しました。 この記事では、私が28歳の時に未経験から独学でWebデザイナーに転職した方法を紹介しています。 効率的な勉強方法や習得すべきスキル、転職活動のコツなど、Webデザイナーを目指している人におすすめの内容になっています。 また、今はWebデザイナーを採用する立場になっているので、「こんな人を採用したい」という視点も加わっています。 28歳（当時）の未経験がWebデザイナーに転職 Webデザイナーになるまでは、Webデザインどころか、デザインの仕事やプログラミング、Web関係の仕事すらやったことがありませんでした。 最初からデザインのセンスがあったわけでもなく、今見るとWebデザインの勉強を始めた頃作ったサイトは酷いものでした…
UIデザインにおけるナビゲーションのデザインパターンまとめ | ベイジの社長ブログ
前回エントリーでは「UIデザイナーが理解しておくべき11種類のナビゲーションと特徴」として、ナビゲーションの種類を、機能的な側面から分類し、ご紹介しました。 続編となる今回は、ナビゲーションをデザイン的な側面からとらえ、形状、ふるまい（動き）、階層というの3種類の表現軸に分けて、ナビゲーションでよく使われているデザインというものを整理してみました。 形状のデザイン UIにおけるナビゲーション要素が、主にどのような形状でデザインされているか、というパターンをここではご紹介しています。 メニューバー メニューをボタン化し、バー状にまとめたデザインです。PCサイトのグローバルナビゲーションやローカルナビゲーションなどによく採用されます。 一覧性に優れ、一目でナビゲーション要素と分かるため、ユーザビリティに優れます。一方、ある程度の表示スペースを必要とするため、スマートフォンではあまり用いられない
サイトやアプリのユーザビリティを向上させる35のポイント | ベイジの社長ブログ
デバイスがどのように進化しようが、アプリの時代になろうが、ユーザビリティは変わらず求められるものです。Web/IT業界では「使いやすさ」という意味で気軽に使われる言葉ですが、奥は深く、原論を解説した書籍もいくつか出ています。 学術的な解説はそういった書籍に任せるとして、ここでは、経験の浅いデザイナー、あるいは非デザイナー（ディレクター、Web担当者、エンジニアなど）向けに、ユーザビリティの向上に繋がる基本的な要点をまとめてみました。 ボタン、テキスト、コピーなど ボタンやテキストのデザインは、ユーザビリティを左右する大きなポイントです。表面的な美観に流されず、ユーザ視点で考えていきましょう。 1：ボタンじゃない要素は、ボタンと似たデザインにしない ボタンのデザイン次第で、サイトやアプリの使いやすさは大きく変わります。特に、ボタンでない要素にボタンのようなデザインを施すことは、どこが押せるの
iPadに最適化したサイトがつくれるかもしれない5つの方法（基本編） - EC studio デザインブログ
<link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" /> /* 好ましくない例 */ これを使うことで横幅1024px以下のデバイスでアクセスされた場合に、ipad.cssを読み込むということはできるんですが、PCの場合でもこの程度の解像度のものはありますし、なおかつ利用しているブラウザが最近のものであれば、このコードを理解してしまいます。 つまり、「iPadだけ」に適用させるということは実質できないということになります。 この点はご注意ください。 デバイスの幅に左右されないリキッドレイアウトにする 前述のユーザーエージェントの話に次いで、レイアウトの話です。 iPadのデバイスとしての画面サイズはポートレート（縦向き）であれば 横
簡単に使えて、コンバージョン率が高まるUI Tipsまとめ | Goodpatch Blog
しっかりと考えられたUIのアプリやWebサイトはとても使いやすいく、使っていてとても楽しいですよね。この記事を見ているデザイナーやディレクターの方の中でショッピングサイトや登録型サービスを担当し、UI設計をしている方もいるのではないでしょうか。UI設計をする上で必ず考えるのが「ユーザーが使いやすいUI」だと思います。しかし前述したショッピングサイトや登録型サービスの場合は使いやすさと共に、「ショッピング購入数」や「登録者数」にも気を配る必要があります。そこで今回は「ショッピング購入数」や「登録者数」を示す、”コンバージョン率” を高めるUIとはどんなものか、海外の記事を参考に考えてみたいと思います。 （この記事はGoodUIから翻訳抜粋したものです） GoodUIには簡単に使えて、コンバージョン率を高めるUIのアイデアがいくつかまとめられています。その中から6つ、素晴らしいアイデアをピック
タブレット向けサイトの文字サイズは16pxがいいとの調査結果……イマドキの文字サイズの話 | 初代編集長ブログ―安田英久
今日は、タブレット端末でユーザーが好むWebサイトの調査結果を紹介しながら、昨今のユーザーがWebサイトを見るのに使っているデバイスにどう対応するかを少しだけ考えてみます。 タブレット端末で使いやすいサイトとは？「タブレット端末でのサイトユーザビリティ調査」というレポートを、IMJさんが発表していました。 ・ IMJ調査レポート「タブレット端末でのサイトユーザビリティ調査」 → http://www.imjp.co.jp/press/release/20130515_000959.html （リリース） → http://www.imjp.co.jp/press/assets/201305/imj20130515.pdf （調査データPDF） ざっくりその内容をまとめると、こんな感じです。 7インチタブレットユーザーの最大34％はスマートフォンサイトを支持 （でも大半がPC向け表示を支持）
Browse Fonts - Google Fonts
Making the web more beautiful, fast, and open through great typography
見通しの良いスタイルシートを維持するために重複した定義を見つけよう·csscss MOONGIFT
csscssはスタイルシート上の重複定義をチェックするソフトウェアです。 スタイルシートの便利なところは多少間違っていたとしてもWebブラウザ側が良いように解釈してくれて描画してくれることです。そのため、更新を繰り返すと徐々に不要な定義ができたり、重複したりして思わぬミスにつながったりします。それを防ぐのに使えそうなのがcsscssです。 例です。複数のスタイル定義が重なっているとのことです。 csscssを使うと複数のスタイルシートについて、その重複度合いをチェックできます。ローカルのファイルはもちろん、URLを指定してリモートのファイルに対してチェックを行うこともできます。さらに最小のマッチ回数も指定できますので、重複が多い箇所だけを洗い出すと言った目的にも使えます。 csscssはRuby製、MIT Licenseのオープンソース・ソフトウェアです。 MOONGIFTはこう見る 決ま
HTML5やCSS3を使った次世代表現を学ぶのに役立つコードサンプル
わずか280行程度のJavaScriptで作られ... / JavaScriptで作るいろいろな物理シミュレ... / JavaScriptによる波の物理シミュレーショ...他...全14件
最初に勤めたWeb制作会社で教えてもらったコンテンツの見やすさを作るポイント
最初に勤めたWeb制作会社で教えてもらったコンテンツの見やすさを作るポイント 2013/01/24 | カテゴリー: Creative | タグ: tips, 考え方 タイトルとURLをコピーする Tweet これについては色々な意見があるかと思いますがｗ デザイン未経験の私はそんな風に教えてもらいました。 デザイン途中で息抜きする際、 ぬわーっと入り込んでいたディスプレイから離れてみて、 「伝わりやすいように」というのを意識しながら、 俯瞰というかユーザー目線で見直してみるというのをやったりしてます。 1. タイトル コンテンツごとに、タイトル（見出し）を入れていくことによって、 文章にリズムが生まれ読みやすくなります。 タイトルも改行もなく、 ただただ文字が並んでいる文章を読むのは、 かなりのストレスです。 また、タイトルの装飾によって、 さらに見やすいページにすることが可能です。 2
[JS]多彩なアニメーションを備えたスライドショーがスクリプトを一行も書かずに実装できるスクリプト -Cycle.js
スクリプトもスタイルシートも書かずに、多彩なアニメーションで画像がスライドするスライドショーを実装できるスクリプトを紹介します。 こういう実装方法がこれから増えてくるかもしれませんね。 Cycle.js Cycle.js -GitHub 対応ブラウザは下記の通り。 IE8+ Chrome Firefox Safari Opera TODOとして、ARIAのサポート、キーボード操作、IE7対応、エフェクトの追加を予定しているそうです。 いつもは、デモ、使い方、の順番で紹介していますが今回はデモと使い方を併せてご紹介。 Cycle.jsのセットアップ Cycle.jsのバリエーション Cycle.jsのセットアップ ベースとなるHTMLは非常にシンプルです。 スタイルシートをhead内に、スクリプトを</body>の上に外部ファイルとして記述します。 <title>Cycle.js</titl
『Fireworksを使った大規模ウェブサイトのデザイン設計』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 こんにちは。アメーバ事業本部 デザイナーのパジェロです。 現在、スマートフォン版Amebaのデザインを担当しています。 今回は、大規模なウェブサイトのデザインファイルをAdobe Fireworksで制作・管理する方法を、実際に現場で使用しているファイルを元にお話したいと思います。 スマートフォン版Amebaとはスマートフォン版Amebaとは、Amebaがスマートフォン向けに展開しているサービスの中心となるプラットフォームサイトです。 Amebaにはたくさんのゲームやコミュニティサービスがあり、プラットフォームサイトはそのハブになっています。 それぞ
Webサイトをもっと万人に対してアクセスしやすくするために·HTML_CodeSniffer MOONGIFT
HTML_CodeSnifferはウェブアクセシビリティ改善のためのブックマークレットです。 Webは限られた人たちのものではなく万人向けのものであるべきです。そこで考えられるべき項目として障害のある人に対するアクセシビリティです。そのチェックに使えるブックマークレットがHTML_CodeSnifferです。 実行すると右上にフローティングウィンドウが出ます。エラー、警告、通知の3つに分けてポイントが出ます。もちろんポイントが少ない方が良いです。 各項目の説明を見られます。これらはW3Cのウェブコンテンツ・アクセシビリティ・ガイドラインに則っています。 指摘されている箇所を確認できるマーカーも出ます。 MOONGIFTの場合…がっくりするくらいのエラー数です…。 アクセシビリティと漠然と言われてもなかなか具体的な施策が思いつきませんが、エラーや警告という形で表してくれれば対応もとりやすくな
2012年北米でWEB制作者として生きてきた僕にとって絶対に無くては成らなかった英語圏サイト全部！ | バンクーバーのうぇぶ屋
This is my roundup post of online information sources, such as technical blogs and trend websites, that helped me a lot as a web designer through out this year. Massive thanks to those pages, and you all! さて、僕の年末感謝祭（？）もいよいよ大詰めです！前回は2012年を振り返って 僕にとって無くては成らないアプリやWEBサービスの数々を大感謝の思いでご紹介させて頂きました。 今回は2012年の僕にとって知識や情報の宝庫となってくれたサイトの数々を今回は英語圏に絞って超感謝の意を込めて全部一気にご紹介させて頂ければと思います！ この一年、僕の Facebookや Twitterで何度も何度
売れるサイト作成に必須！たった４つのWEBデザインの基本法則
ユーザーに届ける価値を徹底的に追求する マーケティングを提供します © Copyright 2022 バズ部. All rights reserved. インターネットをビジネスに活用することが当たり前になり、競合他社がひしめく現在のWEB市場において、WEBデザインは以前よりも遥かに重要性を増している。 なぜなら、WEBデザインそのものが、コンバージョンを大きく左右する要素の１つとなっているからだ。 しかし、デザイン的に素晴らしいスキルを持っているデザイナーは数多くいるが、デザインとコンバージョンの双方にフォーカスしているデザイナーはまだまだ少ないように思う。 そこで、本日は、私自身の経験から、WEBデザイナーの方にも身につけておいて欲しい、コンバージョンを生むためのWEBデザインの考え方をシェアさせて頂こうと思う。 それでは、早速始めよう。 また、私たちバズ部は12年で400社以上のメ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://monosy.com/blog/6
CSSでボタンを手軽に作るなら「CSS Button Generator」が便利 | ライフハッカー・ジャパン
