優れたデザインで話題となっている、国内外の最新Webデザインをまとめてご紹介。 インスピレーションやアイデアの参考になるのはもちろん、2024年のWebトレンド動向も見えてきます。 目まぐるしいスピードで新しいトレンドや技術が生まれるWebデザインだからこそ、できるだけ多くのサイトを実際に訪れ、あらゆる角度からアイデアを吸収できるかが鍵となります。 ここでは、制作の見本にしたい31点のWebサイトを選んでいます。
良質なWebデザインを集めているギャラリーサイト18+1選Update2023.03.07Release2022.10.17Design UI HatenaにシェアするTwitterにツイートするPocketにストックするFeedlyに登録する Web制作の現場では、制作側はクリエイティブの参考に、クライアントは要望を伝えやすいように、Webデザインギャラリーサイトを利用する機会は多いです。そこで今回は、良質なWebデザインを集めているギャラリー18+1サイトを紹介します。あなたの現場でぜひ参考にしてみてください。 ちょうどいいWebデザインギャラリーちょうどいいWebデザインギャラリー限られた条件の中で、最良のクリエイティブを『ちょうどいい』と定義して、キュレーターがそれぞれのWebサイトのちょうどいいポイントを端的に紹介していている『ちょうどいいWebデザインギャラリー』。 サイトをス
フロントエンドエンジニアの平尾誠です。 Webデザイナーやフロントエンドエンジニアにとって海外Webデザインアワードを獲るのは憧れであり、目標のうちの一つでしょう。 今回は秀逸なサイトを紹介する海外Webデザインアワードを紹介します。 私たちWebサイトを作る人たちはこの機関に本当に表彰されたいんですよ。 掲載されるだけで世界から一斉に注目を浴びることができますからね。表彰されたくてされたくてたまりません。 わかりやすいように、受賞の難しさごとに☆をつけています。重賞は☆☆☆です。 また、受賞した際にもらえる証明証も記していますので皆さんこぞってエントリーしましょう。 まだ知られていないマイナーな海外Webデザインアワード WEB GURU AWARD 受賞証明書:表彰状 http://www.webguruawards.com/ ロゴのデザインが。。。ねぇ。これ以上は黙る。 BECT C
2022年7月20日 CSS, Webデザイン, スマートフォン モバイルは幅が狭く、デスクトップは幅が広いので、それぞれのデバイスにあわせてWebサイトの幅も可変させたりしますよね。しかし最近、デスクトップで見てもモバイル幅のまま表示させている国内のWebサイトをちょこちょこ見かけます。今回はそんなモバイル幅のWebサイトを見ていこうと思います。 ↑私が10年以上利用している会計ソフト! モバイル幅Webサイトの特徴 デスクトップで見ても狭いコンテンツの幅 よくあるWebサイトでは、コンテンツ部分の枠がデバイスの幅によって変化します。例えばモバイルサイズでは幅が狭くなり、デスクトップサイズでは幅が広がって画面中央に表示されます。このブログでもそうですよね。しかし、昨今見られるようになったレイアウトでは、デスクトップサイズで見てもコンテンツ枠の幅は狭いままで表示されています。画面中央に表示
ウェブサイト制作には、常に新しいアイデアやインスピレーションが必要ですが、決まらずに悩んでしまうことも。 そんな状況を打開するには、たくさんの優れたデザインの実例を見ることで、次のアイデアを生み出してみましょう。 ここでは、最新ウェブデザインをいち早くチェックできるオススメWebギャラリーサイトを厳選してご紹介。 インスピレーションとしてはもちろん、クライアントの打ち合わせやイメージの共有にも活用できます。 積極的にインプットを増やし、デザインの引き出しを増やしてみましょう。 このリストは2年ぶりにまとめ直したアップグレード版となります。 コンテンツ目次 【2024追加分】最新Webギャラリーサイト landing.love Design Spells Godly BentoGrids 404s Footer Navbar Gallery 国内Webギャラリーサイト SANKOU! URA
Webデザインのアイデアがほしいときに、クリエイティブな想像力をかきたてる最新の良質おすすめサイト30選をご紹介。 国内外のウェブギャラリーでも取り上げられている、世界中からセレクトされたホームページやWebサイトは、レイアウトや配色、フォントえらびなどに困ったときにも役立ちますよ。 これからどうなる?おすすめ世界の最新ウェブデザイン30選 Welcome to Marmoset 90年代風のノスタルジックでレトロなイラストを多用した、ユニークで楽しい雰囲気のウェブサイト。各パーツに動きが加わることで、オリジナリティーのある一度見たら忘れないデザインに。 Peter Tarka 圧倒的な立体感の3Dアニメーションを制作するデザイナーのポートフォリオ。細部まで作り込まれたアニメーションは、世界的大企業がこぞってコラボレーション中。 すべてのお母さんに、ありがとう 母の日に合わせて公開された特
コーポレートサイト ブランドサイト・サービスサイト ECサイト・オンラインショップ キャンペーン・特設・プロモーションサイト ポータルサイト・メディア・情報サイト プラットフォーム・コミュニティサイト 採用サイト・採用ページ ポートフォリオサイト スタイリッシュ オーソドックス ユニーク 遊び心がある・作り込まれている イラストを使用 3D表現・3Dイラストを使用 シズル感・訴求力のある写真・動画使用 写真少なめ・写真以外のビジュアル表現 さりげない動き・動きなし やや動きあり ダイナミック・印象的・細やかな動き 日本語メイン ノーコードツール「STUDIO」で制作 スマホ特化・モバイルファースト Web・IT・AI・デジタル・テクノロジー・通信関連 サービス・アプリ・ツール 病院・クリニック・歯医者・医療・薬 学校・教育・幼稚園・保育園・スクール 金融・投資・保険・士業 カフェ・飲食店・
この記事では、普段のホームページ制作で直面しがちな課題を解決するCSSテクニックをまとめて紹介しています。 クライアントからの要望も多いCSSの小技テクから、「これがCSSだけでできるの?」と疑いたくなるような最新の使い方まで、実例やサンプル用ソースコードと一緒に確認できます。 ここで紹介されているCSSテクニックを利用すれば、これまで頭を抱えていた問題や課題も、一発で解決できるかもしれません。 コンテンツ目次 1. 入力フォームをカスタマイズしたい 2. ナビゲーションメニューを使いやすくしたい 3. ボタンを目立たせたい 4. リンク用エフェクトにこだわりたい 5. スクロールバーをサイトの色で統一したい 6. ドロップシャドウの影にもこだわりを 7. グラデーションをビンテージ風にしたい 8. CSSで要素を中央寄せする5つの方法 9. ブラウザごとのデザインのずれを防ぎたい 10.
この記事では、Webデザインの引き出しを増やす、コピペで使える最新HTML/CSSスニペットをまとめてご紹介します。 Codepenで話題となっているものを中心に、今後のデザイン制作に活用したいアイデアがずらり揃った今回。新しいウェブデザインの可能性を感じるものばかりとなっています。 Webの進化が止まらない、コピペ可な最新HTMLスニペット40個まとめ CSSコピペで完成!押したくなるWebボタンデザインまとめ Webデザインの引き出しを増やす、コピペできる最新HTMl/CSSスニペットまとめ 「Run Pen」をクリックすることで読み込みが開始されます。右下に表示された「Return」で再読み込みし、左上のHTML/CSS/JSタブを切り替えることで、それぞれのスタイリングを確認できます。実際にカスタマイズしたいときは、右上の「Edit on Codepen」をクリックしましょう。 画
トレンドが目まぐるしく変わるWebデザインでは、できるだけたくさんの優れたデザインのサイトを見て、触れることが重要で、次のアイデアにもつながります。 この記事では、Webデザインの創造力を高める最新良質サイト36個をまとめてご紹介します。 Webサイトの雰囲気や印象づくりはもちろん、配色や利用フォント、レイアウトなどの参考にもぴったりで、Webデザインに関わる全てのひとにオススメの内容。 前回のWebデザインまとめも一緒にどうぞ。 Webデザイン力を鍛える最新良質ウェブサイト33個まとめ ; Webデザインの創造力を高める最新良質サイトまとめ Vita Architecture 七色に輝くヒーローイメージの他に、スクロール追従アニメーションを効果的に活用した要素の表示テクニックや、シンプルでミニマルなグリッドレイアウトなどデザインの参考に。 養老ミート 自社牧場をもつ飛騨牛をメインに扱う肉
「ウェブデザインのアイデアが決まらない」「なんとなくイメージはあるけど、どう作ればいいかわからない」「打ち合わせでのサンプル見本が欲しい」 この記事では、そんなときに役立つ世界中のクリエイティブな最新Webデザイン33個サイトをまとめてご紹介します。 すぐれたデザインをたくさん見ることで、アイデアやインスピレーションになるのはもちろん、Webデザイン力をあげるきっかけにもなります。 雰囲気やレイアウトはもちろん、配色やフォント選び、トレンド性のあるパーツの使い方など、用途に応じて参考にしてみるとよいでしょう。 Webデザイン力を鍛える最新良質ウェブサイト36個まとめ Kazuki Noda Portfolio まるで本物の木漏れ日がウェブサイトにかかっているようなエフェクトにはじまり、ブルーを基調とした落ち着いた配色、フォント選びまでセンスが光るポートフォリオサイト。 まるでペンキで塗り替
これまで平面的に捉えられていたウェブサイトやアプリに、吸い込まれるような没入感を演出するクリエイティブなアニメーションが、いま注目を集めています。 この記事では、ウェブデザイン制作で活用したい最新UIインタラクション、アニメーションをまとめてご紹介します。 Webサイトやスマホアプリのアニメーション実装参考アイデアに役立てみてはいかがでしょう。 アニメーションで魅せる!Web制作の参考UIインタラクション40個まとめ Juice Brand Website Menu フレッシュなフルーツジュースを選択する、フルスクリーン画面で展開するナビゲーションメニュー。ぼかしをつかい、遠近感をうまく表現したプロダクト紹介ページは参考に。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く