[B! Webデザイン] ntmukaiのブックマーク

ntmukai id:ntmukai

Webデザインに関するntmukaiのブックマーク (84)

ベタ組とツメ組。日本語の文字の並べ方を押さえよう｜モリサワ　note編集部
みなさんは日本語の文字の並べ方に﹁ベタ組﹂﹁ツメ組﹂という言葉があることをご存じでしょうか？実は日本語の文章は、読み手を意識して読みやすい間隔で文字が並べられています。今回はそんな日本語の文字の並べ方をご紹介します。ベタ組とツメ組﹁ベタ﹂という言葉の意味は﹁隙間なく物が並んでいること﹂だそうです。そういえば印刷用の絵や漫画の黒一色で隙間なく塗った部分を﹁ベタ﹂とも言っていますね。他にも﹁ベタ﹂は建築業界の⽤語にもあるようです。まずは日本語組版にもある﹁ベタ﹂を説明する前に、文字の設計についてお話しします。日本語で使われる漢字やひらがな、カタカナは一般的に正方形に収まるように設計されており、この正方形に相当するところを﹁仮想ボディ﹂と呼んでいます。そして﹁仮想ボディ﹂の中に実際の文字部分である﹁字面﹂が収まっています。仮想ボディと字面。pt? 級?号?文字に関する単位の話より
ntmukai 2024/06/06
組版

フォント

デザイン

webデザイン

あとで読む
リンク
「デザイン白書2024」を公開
公益財団法人日本デザイン振興会は、各都道府県や企業、行政などのデザインに関する多様な取り組みを網羅的に取りまとめたレポート「デザイン白書2024（WHITE PAPER ON DESIGN 2024）」を2024年6月4日（火）に公開しました。背景・経緯経済産業省と特許庁は2018年に『「デザイン経営」宣言』を発表し、日本の産業競争力強化のために、デザインを企業価値向上のための重要な経営資源として活用する「デザイン経営」を推進することを提言しました。その後、大企業や中小企業、スタートアップ、官公庁などでデザイン活用が進み、経済産業省デザイン政策室はデザイン活用をさらに拡大するために、2023年に「これからのデザイン政策を考える研究会」を開催しました。研究会では、2023年度・2024年度グッドデザイン賞審査委員長の齋藤精一氏が座長を務め、当会からは深野弘行理事長、柴田文江理事、田川欣哉
ntmukai 2024/06/06
webデザイン

あとで読む
リンク
デジタル庁デザインシステムβ版
デジタル庁デザインシステムは、スタイリングの考え方を提供するデザイン言語、情報の視覚表現とインタラクションを具現化するUIコンポーネント、ユーザビリティとアクセシビリティを踏まえた設計や実装のためのガイドラインから構成されるデザインアセットです。デジタル庁のミッションである「誰一人取り残されない、人に優しいデジタル化を。」の実現に寄与することを標榜し、官公庁や地方自治体などの行政機関や公共性の高い組織等のウェブサイト/ウェブアプリケーション/オンラインサービスまたはシステム等で利用することを念頭に置いて構築されています。
ntmukai 2024/05/31
webサービス

webデザイン
リンク
手芸用品・生地・ホビー材料専門店｜ユザワヤ公式ネットショップ
2024.4.6 更新＜能登半島地震による配送の影響について＞詳しくはこちらをご確認ください。 2022.8.27 更新ユザワヤ会員制度変更のお知らせを更新致しました重要なお知らせユザワヤを偽ったサイトにご注意ください重要なお知らせネット詐欺防止について重要なお知らせ 2024年 5/9(木)15:00で「リクルートかんたん支払い」を廃止いたします。 2024/4/1 4/1 12:00〜サブスクの受付を開始しました！ 2024/1/1 2024年毛糸福袋が販売開始しました！ 2023/10/1 10/1 12:00〜サブスクの受付を開始しました！ 2023/8/1 8/1 12:00〜サブスクの受付を開始しました！ 2023/7/1 7/1 12:00〜サブスクの受付を開始しました！ 2023/6/3 オンラインでもオーダーカーテンがお買い物できるようになりました
ntmukai 2024/04/21
Webデザイン

通販
リンク
これでもうUIデザイン用の高品質なSVGアイコンに困らない！商用利用無料、改変も自由な太っ腹ライセンス -blendicons
WebサイトやスマホアプリのさまざまなUIデザインにぴったりな、シンプルなソリッド・ベタ塗りからおしゃれなカラーまで揃ったSVGアイコンが完全無料で利用できるblendiconsを紹介します。アイコンはなんと、200,000個以上！ベーシックなUIをはじめ、ショッピングサイト、タッチジャスチャー、日用品や家具、飲食物、スポーツ、ミュージックなど、多種多様なアイコンが揃っています。 blendicons Blendiconsはデザイナーやデベロッパーが容易に必要なアイコンを手に入れられるように、200,000個以上の高品質なアイコンを作成し、ダウンロードできるようにしたサイトです。アイコンの利用にあたっては個人でも商用でも無料で、Webサイトやスマホアプリをはじめ、プレゼンや印刷物などあらゆる用途に利用できます。アイコンをカスタマイズして利用することもOKです。ただし、アイコン素材をそ
ntmukai 2023/10/25
アイコン

webデザイン
リンク
シェアNo.1の電子請求書システム-BtoBプラットフォーム請求書
請求書の発行だけでなく、受け取り、支払金額の通知など、請求業務全体をデータ化する電子請求書︵WEB請求書︶シェアNo.1のサービスです。時間・コスト・手間のかかる経理業務を大幅に改善。電子帳簿保存法に対応しているためペーパーレス化、そして経理のテレワークを実現します。請求書データは社内システムとスムーズに連携するため、月次決算が早期化され、経営判断のスピードアップにつながります。現在紙やPDFでの請求書をやり取りしているお客様にも、郵送代行サービスやAI-OCR等をご利用いただければ、電子請求書︵WEB請求書︶にて一元管理が可能です。
ntmukai 2023/09/19
web

IT

Webデザイン
リンク
2022年のモダンCSS改
7/27（水）開催の「TechFeed Experts Night#1 〜 Web標準 / CSS / Webアクセシビリティを語ろう」で発表した内容です https://techfeed.io/events/techfeed-experts-night-20220727 スライド内のリンクがクリックできるPDF版はこちら https://drive.google.com/file/d/1fc98v082exdGcCuxS73wEN_Qe2COvdTW/view?usp=sharing 各デモURL ■ 上下左右中央揃え https://codepen.io/tonkotsuboy/pen/qBbpYzj ■ スムーススクロール https://codepen.io/tonkotsuboy/pen/NWyNMOo ■ すりガラス https://codepen.io/tonkotsuboy
ntmukai 2022/07/28
css

webデザイン
リンク
なかもと耳鼻咽喉科クリニック
ntmukai 2022/06/03
webデザイン
リンク
本当は教えたくないWebデザイン参考ギャラリーサイト37選
ウェブサイト制作には、常に新しいアイデアやインスピレーションが必要ですが、決まらずに悩んでしまうことも。そんな状況を打開するには、たくさんの優れたデザインの実例を見ることで、次のアイデアを生み出してみましょう。ここでは、最新ウェブデザインをいち早くチェックできるオススメWebギャラリーサイトを厳選してご紹介。インスピレーションとしてはもちろん、クライアントの打ち合わせやイメージの共有にも活用できます。積極的にインプットを増やし、デザインの引き出しを増やしてみましょう。このリストは2年ぶりにまとめ直したアップグレード版となります。コンテンツ目次【2024追加分】最新Webギャラリーサイト landing.love Design Spells Godly BentoGrids 404s Footer Navbar Gallery 国内Webギャラリーサイト SANKOU! URA
ntmukai 2022/05/19
web制作

webデザイン
リンク
2022年のモダンCSS - TechFeed Conference 2022
ログイン読み込んでいます…
ntmukai 2022/05/14
css

webデザイン
リンク
無料コーディング練習所 | 未経験からWebデザイナーへ！【2024年版】
『無料コーディング練習所』では、完全無料のコーディング教材を提供しています。入門編から上級編まで６サイトをコーディングすることで、 HTML・CSS・jQueryの基礎スキルがしっかり身につくカリキュラムになっています。デザインカンプと完成版コーディングデータ付きです。この教材は制作会社の新人コーダーの教育にも使用されています。さぁ、楽しみながら一緒に勉強していきましょう♪
ntmukai 2022/04/27
webデザイン

勉強
リンク
CSSのみのボタンデザイン – 現場で使ってきたボタンアイデア30選 | BUILD Journal
Web制作の現場でよく使ってきたCSSのみで実装するボタンデザインを紹介します。hover時のスタイルも合わせて公開しているので、そのまま利用することができます。主に自分用のデザインストックとして投稿しますが皆さんも使えるボタンデザインがあるかもしれません。ぜひあなたの現場でもご活用ください。背景色と矢印のボタン HTML<div class="button01"> <a href="">ボタンデザイン</a> </div> CSS.button01 a { display: flex; justify-content: space-between; align-it ems: center; margin: 0 auto; padding: 1em 2em; width: 300px; color: #333; font-size: 18px; font-weight: 700; bac
ntmukai 2021/07/09
css

webデザイン
リンク
WebアプリのUIデザインを洗練させるための７つのヒント - NRIネットコムBlog
こんにちは、UI/UXデザイナーの東影です。 NRIネットコムで様々な会社のUI/UXの検討・デザイン制作をしていたり、HTMLのレビューなど、コンテンツ制作の領域で幅広い業務を担当しています。普段の業務ではWebアプリケーションを制作することが多いです。今回はデザインのクオリティを高めるときに、制作の過程で特に気をつけていることをまとめていきたいと思います。今回はPCのブラウザで使う、↑こういう感じのWebアプリについてお話しします。 UIとは？冒頭で﹁UI/UXデザイナー﹂と自己紹介をしましたが、簡単に﹁UI/UX﹂についてご説明します。 UIは﹁User Interface︵ユーザーインターフェース︶﹂の略です。﹁Interface﹂とは﹁接点・接触部分﹂などを意味します。つまりユーザーがWebサイトやアプリと触れる部分、レイアウトや文字のフォント、ボタンの操作性など、画面
ntmukai 2021/05/18
web制作

webデザイン
リンク
Hello! | party.js
You can use the following objects in this codeblock: party, mouseEvent, codeblock, runButton. Just include the library in your HTML file, or install it via npm, and you're ready to go! All of the setup is done internally, without you having to break a sweat.
ntmukai 2021/05/13
js

webデザイン
リンク
Flexboxで決まり！ | Webクリエイターボックス
2017年5月25日 CSS FlexboxとはFlexible Box Layout Moduleのことで、その名の通りフレキシブルで簡単にレイアウトが組めちゃう素敵ボックスです。前々からあった技術ですが、ブラウザーによって書き方が違ったり、仕様がころころ変わったりと、イマイチ一歩踏み出せない感があったFlexbox。しかしようやくモダンブラウザーでの利用に難がなくなり、実務にも充分使えるようになりました。今回はそんなFlexboxの魅力と使いドコロを、デモ付きで紹介していこうと思います！ ↑私が10年以上利用している会計ソフト！対応ブラウザー Can I use…で紹介されているように、現行のモダンブラウザーでは問題なく利用できます。ただし、Safari用に -webkit- のベンダープレフィックスが必要です。IEについては11から正式に対応。IE10にも対応していますが、書き方が
ntmukai 2020/12/24
flexbox

css

webデザイン
リンク
2020年のCSSのまとめ、FlexboxやCSS Gridの使用状況、よく使用するプロパティや単位、人気のフレームワークやツールなど
CSSを10年以上書いてきた人にとって、この2020年は今までとは全く違ったCSSになったと感じた人も多いと思います。レスポンシブはブレークポイントの代わりにCSS Gridでより簡単に実装できるようになり、グローバルなスタイルシートに頼るのではなく、CSS-in-JSでスタイルをコンポーネントに配置してテーマ性のあるデザインシステムを構築できます。フレームワークではTailwind CSSが浸透し、ユーティリティ・ファーストのCSSが使用されるようになりました。2020年現在、CSSの使用状況を調査した﹁The State of CSS 2020﹂を紹介します。 The State of CSS 2020 The State of CSS 2020は、The State of CSS Surveyでアンケートを行った調査結果をまとめたものです。私も1票分参加しました。ちなみに、代表
ntmukai 2020/12/07
css

flexbox

webデザイン
リンク
human pictogram 2.0 (無料人物ピクトグラム素材 2.0)
ヒューマンピクトグラム2.0は、非常口のあの人のピクトグラムをTopeconHeroesダーヤマの好みで拡張、ストックしていくページです。このサイトにストックしたピクトグラムは、WEB制作や会議の資料、企画書などのデザイン素材として無料で利用可能です。ただし素材そのものの再配布、販売はNGっす。なお2.0だからって拡張元のピクトグラムに比べ優れている訳ではありません。犬の散歩のピクトグラムその3飛び膝蹴り社長、部長ショートカット手荷物検査略奪婚結婚式のピクトグラム神父、牧師ちゃぶ台返し　2水球　ピクトグラムシンデレラサムライ3サンタクロース2サンタクロースバーテンダーのピクトグラム2バーテンダー銅鑼銅鑼をドーン虫取り少年少年時代やり投げ食事をするピクトさん演説するピクトさんエスカレーター下校する子供
ntmukai 2020/09/18
webデザイン

Illustrator

material
リンク
イラストがすべて無料「イラストAC」　トップページ
イラストをダウンロードするには、イラストACにログインしてください。初めての方は無料登録を！会員登録後、ログインして、商用利用も可能な約4,040,000点以上のかわいいフリーイラスト素材、無料画像がダウンロードできます。
ntmukai 2020/09/14
material

webデザイン

web制作
リンク
chot.design - 毎日ちょっとずつデザインを学ぼう
毎日ちょっとずつ、デザインを学ぼう毎日ちょっとずつデザインを学ぼうIT/Web業界のデザイン学習サイト
ntmukai 2019/12/22
webデザイン

学習

勉強
リンク
CSSセレクタのチートシート｜37パターンを一覧で解説
CSSセレクタのチートシートでは、要素セレクタ / classセレクタ / idセレクタ / 属性セレクタ / 複数セレクタ / 子孫セレクタ / 兄弟セレクタ / 隣接セレクタ / 擬似クラス / 擬似要素 / 全称セレクターから37パターンのセレクタの説明と実際のコードで使い方サンプルを紹介しています。
ntmukai 2019/02/08
めちゃくちゃ見やすい。

css

Webデザイン

チートシート
リンク
1 2 3 4 5 次のページ