「丁目、番地が全角しか入力できない」「何の入力チェックでエラーが出ているのかわからない」みんながネットでイラつく#クソ入力フォーム選手権 開催中米村歩@日本一残業の少ないIT企業社長 @yonemura2006 ・丁目、番地が全角しか入力できない ・電話番号が全角しか入力できない ・建物名が全角しか入力できない ・生年月日がカレンダーで果てしなきページ送りを要求される ・何の入力チェックでエラーが出ているのかわからない ・入力チェックエラーになると入力内容が全部消える #クソ入力フォーム選手権 2021-09-06 22:44:39
Web制作者は要チェック！最近のランディングページで見かけるデザインやアイデアのまとめ -SaaS Pages
最近のラインディングページで見かけるデザインやアイデア、コピーライティングがまとめられたSaaS Pagesを紹介します。 ヘッダやフッタのデザイン、ナビゲーションのアイデア、CTAや価格一覧やFAQのコンポーネントなど、インスピレーションが刺激されます。
拝啓、お客様。Webサイト制作のコストはここにかかります。 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
令和ですね。こんにちは。バックエンドエンジニアのまさくにです。ゴールデンウィークで休んでいたら、シュワシュワと筋組織が融解し、「自然に帰ろう……自然に帰ろう……」と遺伝子に刻み込まれた内なる声が僕を光射す方へ誘いました。もはや社会復帰は難しいかもしれない。 さて。さてさて。 皆さま、いかがお過ごしですか。新しい期に入り、心機一転したい気持ちでしょうか。何ならアレですか。お持ちのWebサイトをリニューアルしたい、そんな気持ちをそろそろお持ちでしょうか。 失礼ながら、そのお気持ち、 たぶん5ヶ月、遅いです！ 仕事としてWebサイトの制作に携わってから、5年くらいが過ぎました。現在はバックエンドの作業を行いながら、TD（テクニカルディレクション）やPM（プロジェクトマネージャー）として、プロジェクトに関わることも増えてきています。その観点から言って、お客様と我々の間には「Web制作」の考え方にお
WEBデザインが独学で身につく！WEBデザイナー必見の神サイト20選
2023年2月17日 Webデザイナー1年生はもちろん、Web製作に携わるものなら絶対に知っておきたい神サイトを完全収録しました。 独学でWebデザインを勉強したい人、優秀な先駆者たちの知恵を吸収し飛躍したい人は要チェック。 WEBデザイナー必見の神サイト20コリスWebクリエイターボックスコムテブログかちびと.netバンクーバーのうぇぶ屋ホームページを作る人のネタ帳creive【クリーブ】BlackFlagDesignDevelopArchAteitexe アテークゼウェビメモWebparkNxWorldデザイナーのイラストノート株式会社LIGMdN Design InteractiveドットインストールProgateschooコリス コリス サイト制作に関する最新の情報をご紹介 サイト構築、WordPressのTipsを得られます。ただし、Webデザイナー１年制が、今からの更新情報を受
バナーデザインのコツ11選！初心者が気をつけるべきポイント、ビフォーアフターも紹介 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
はじめまして。デザイナーののっちです。 好きな業務の1つがバナー制作なのですが、最初の頃は「決められた空間に文字と画像を詰めて、さらには綺麗に見せて……」と、まるでジグソーパズルのようなあの作業にもの、すごーーく時間がかかっていました。これは新米デザイナーなら、誰でも一度は通る道だと思います。 そこで今回は、新米デザイナーが知っておきたい“美しい”バナーを“効率的”に制作するためのフローについてまとめます。 独学でつまずいていませんか？ バナーデザインの作り方を効率的に学びたい、プロに教えてもらいたい……という方は、「スクールでの勉強」もおすすめです。LIGでもWebクリエイター育成スクール「デジタルハリウッドSTUDIO by LIG」を運営しております。「今すぐスクールの概要を知りたい！」という方は、ぜひこちらより資料をご請求ください。 ※この記事は2022年2月に編集部が情報を更新し
ガーリーデザインに使える！可愛い商用可フリー素材・素材サイトまとめ
可愛らしいものが大好きです、Kanaです。 私がガーリーなデザインをする際によく使う素材や、素材サイトをまとめました。 可愛らしいレース柄や、お花、パターン素材など、使い勝手のよいものばかりです。 ガーリーデザインのポイントをまとめた、ガーリー好きがお届けするガーリーデザインのポイント5つもあわせてご覧ください:) 2015/12/4：写真素材カテゴリを追加しました！ それでは、素材を提供してくださる方々に頭を下げつつ、ご紹介したいと思います。 商用可のサイトや素材を集めていますが、詳細な規約は、ご利用の際ご自身でご確認ください。 1.イラスト素材2.レース素材3.フレーム素材4.パターン素材5.テクスチャ素材6.写真素材 ガーリー素材 やさしい色使いの、かわいいイラスト素材がいっぱいのサイト「ガーリー素材」。非常に完成度が高くて、いつも利用させていただいてます！ eps、png形式で配布
Appleが利用するフォントを徹底解剖 | ブログヘラルド
アップルが広告や宣伝にどのフォントを利用しているのか気になったことがあるだろうか？コンピュータのキー、MacのUI、iPhoneにはどのフォントが利用されているのだろうか？以下にアップルが利用するフォントを挙げていく。 ブランドアイデンティティ 全ての広告素材、プロモーション、アップルのウェブサイト、そして、光り輝く製品の箱には、アップルはミリアド・プロ・セミボールドと呼ばれるミリアドのバリエーションを利用している。サンセリフの書体であるミリアドは1992年にアドビによって初めてリリースされていた。現在、アップルだけでなく、グーグル（Gmailの最後の3文字）、リンクトイン、ロールスロイス、そして、ウォルマートもミリアドを採用している。アップルは2002年からミリアドの利用を始めている。 それ以前は、アップルはギャラモンの利用に拘っていた。アップルが利用していたフォントはアップル・ギャラモ
作業時間を10分の1にできて、デザイナーとコーダーのお互いが幸せになれるプラグイン「SPECCTR」が素晴らしい。
ややうさんくさい感じのするタイトルですが、ホントの話なんです。 海外のサイトを見ていてたまたま見つけて試してみたところ「このプラグインを使えばデザイナー自身、そしてコーダーのお互いが幸せになれるっ!」と思ったので全力でご紹介したいと思います。 SPECCTRについてごく簡単に説明すると… フォント名やオブジェクトのサイズ、間隔、色などをボタン一つで建築の設計図のようにデザインの仕様を書き出せる というものです。 これまで、デザインからコーディングに取りかかる際に、ボタンのサイズやレイアウト間隔を正確に調べたりするには元データをいちいち開いたりしなければならず、地味ながら非常に手間のかかる作業が必要で、それらを一覧にできる良い方法が無いのが実情でした。 また、デザイナーからコーダーにデータを渡して、いざあがって来た時のレイアウトをみると、ところどころ変わっている部分があったりして、相互の無駄
初めてPhotoshopでWeb制作する前にやっておくといい設定8(CS6/CC含む) | Design Color
はじめに 先日ちょうどAdobe Creative Cloudを申し込みました。 Photoshopをまっさらな環境にする必要があるため、今回はまさに新品状態のCS6/CCの画面で解説をします！ もくじ 定規などの単位はpxで統一 「自動選択」で図形からレイヤーを選択する 「バウンティングボックス」を表示して選択や変形をしやすくする 「ピクセルにスナップ（エッジを整列）」で端がぼやけるのを解消 レイヤーコピー時に「〜のコピー」とつけないようにする スライス書き出し時に「images」フォルダを作成しないようにする 【CS6/CCの場合】カラーテーマをグレーにする 【CS6/CCの場合】切り抜きツールを「クラシックモード」にする 起動画面。か、かっこいい…！ CS6/CCはUIが黒いのですね。ちょっと慣れない。 従来のグレーにする方法も後ほどお伝えしますので、どうぞおつきあいください！ 1.
商用利用も無料！手書き風アイコン122種類！
今日は私が集めているアイコンのいくつかを紹介させていただきます。今回は商用利用も無料(商用フリー)でOK！という気前のいい手書き風のアイコンをまとめました。ここで紹介するアイコンは全てリンクも不要で使えますが、ダウンロードして使うときは念のためライセンスの確認をしてくださいね！ ではどうぞ。 19 Freehand drawn sketch icons ダウンロード先:Visit site 実際に手書きで作成したものをスキャンしてイラレでクリーンアップしたものです。 HAND DRAWING ICONS SET ダウンロード先:Visit site まさに手書き中の手書きといったアイコンです。 Handycons 2 ダウンロード先:Visit site メディア関連の手書き風アイコンです。油絵っぽい感じが実にクールですね。 FreeHand ColorStroked icon pac ダ
今月のダウンロードしておきたいフリーのデザインフォントのまとめ -2012年4月
最近リリースされたものを中心に、高品質なフリーのデザインフォント・タイプフェイスを紹介します。 Subtle Sans 個人・商用利用無料。 Valentina 個人・商用利用無料。 Sports W
デザインの引出しを203%拡張させる神Webサイトデザインギャラリー | 秒刊SUNDAY
前回このＷＥＢサイトギャラリー特集を行った際には、フルFlash,フルスクリーンのカッコイイサイトが主流でした。当たり前のようにウインドウが最大化 し、当たり前のようにヌルヌルとＦｌａshが動く。時代は変わったもので、もはやFlashのフの字を聞くだけで『iPadじゃ見れないからねー』が付き まとう今日、ＷＥＢデザインはどのように設計したらよいのでしょうか。今回はそんなＷＥＢサイトデザインに役立つサイトをご紹介したい。 ◆Webデザインポータルサイト ■Webデザインのリンク集 Webデザインポータルサイト S5-Style スタイリッシュで非常に見安いサイト。次々に事例を見て行っても苦にならない。 ◆Webデザインリンク集・ソーシャルブックマーク ■Webデザインリンク集・ソーシャルブックマーク - 最近ページングではなくスクロールローディングに変更された。わざわざページングしなくても良
ウェブデザインにおけるヴィジュアルのバランスを実現する5つの方法とその要因
エレメント同士を水平に配置したり、垂直に配置したり、またそれが対称だったり非対称だったりなど、ウェブデザインでヴィジュアルのバランスを実現する5つの方法とバランスに大きな影響を与える5つの要素を紹介します。 Developing Balance in Web Design [ad#ad-2] 下記は各ポイントを意訳したものです。 はじめに バランスの5つのタイプ バランスの5つのプロパティ はじめに もしあなたのウェブサイトのデザインがヴィジュアル的にバランスがとれていないなら、あなたのサイトは混乱に陥っているようにユーザーは感じるものです。そして、心地悪く感じさせるでしょう。 あなたのデザインは魅力的であり、ユーザーにリラックスして見回してもらえるようにするべきです。それを達成する最も良い方法はヴィジュアルのバランスです。 ヴィジュアルのバランスとは、デザインエレメントのバランスをとるだ
日本語もOK ! テキストにかっこいいカーボンのエフェクトを与えるPSD素材
Psd Soft Carbon Text Effect [ad#ad-2] エフェクトはレイヤースタイルでセットされており、テキストを変更することで簡単にカーボンのエフェクトを与えることができます。
WEBデザインの参考にしているまとめサイトをまとめました[ほぼ国内編：24サイト+追加2] | HTML5でサイトをつくろう
皆さんいつもWEBサイトのデザインをする際に何を参考にしていますか？ 気にいったサイトがあったらブックマークをしてストックしておく、WEB系の本を見る、あとはWEBサイトのまとめサイトを見るですよね？ 自分もまとめサイトを見つけるとブックマークして定期的にチェックしていたのですが、いろいろなまとめサイトがありましたのでまとめサイトをまとめてみました。 このほかにもこんななのがあるよというのがありましたら是非教えてください。 TheFWA http://www.thefwa.com/ High Floater http://www.highfloater.com/ ABM | AnotherBookmark™ – Webデザインブックマークサイト http://www.anotherbookmark.com/ Webデザインのリンク集 Webデザインポータルサイト S5-Style http
![WEBデザインの参考にしているまとめサイトをまとめました[ほぼ国内編：24サイト+追加2] | HTML5でサイトをつくろう](https://cdn-ak-scissors.b.st-hatena.com/image/square/b0366a92f40229090fad09f8bcea2cb9d905fb02/height=288;version=1;width=512/http%3A%2F%2Fwww.html5-memo.com%2Fwp-content%2Fuploads%2F2011%2F08%2FA29.jpg)
ホワイトスペース使ったウェブデザインの考え方
ウェブサイトの要素をレイアウトをする際に非常に重要な ホワイトスペースの考え方について、すこしまとめてみました。 私が人にウェブデザインを教えるときは、まずここから始めます。 boxとboxとの空間の開け方、要素と要素の「間」は、音楽でいうところの「リズム」だと考えています。 リズムが整っていれば、他の要素が主張したことが上手に伝わります。 リズムが整っていなければ、けんかしあい、不協和音＝見づらい状況を作り出します。 自分なりのリズムを見つけていけば、それが個性・ジャンルになるのです。 どれが間違っている、というお話ではなく、どんな風に感じたかを大事にして読んでみてください。 とてもとてもシンプルな例を出してみます。 AとBを比較してみてください。 どちらのほうが読みやすいように感じますか？ どんなふうに感じましたか？ この例では、Bのほうに大きな余白を与えました。 ４隅すべて同じぐらい
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
新着記事
ダウンロードしておきたいフリーのデザインフォントのまとめ -2012年5月
[CSS]永遠にスクロールしていたくなる、気持ちいいエフェクト -CSS Scroll Effects
創造力と遊び心がくすぐられるHTML5でつくられたウェブサイトのまとめ