【スゴ本】ITエンジニアの「武器」を増やす5冊

2024/04/09 426 users 武器 ITエンジニア スゴ本 ５冊 Dain

Dain 古今東西のスゴ本（すごい本）を探しまくり、読みまくる書評ブログ「わたしが知らないスゴ本は、きっとあなたが読んでいる」の中の人。自分のアンテナだけを頼りにした閉鎖的な読書から、本を介して人とつながるスタイルへの変化と発見を、ブログに書き続けて10年以上。書評家の傍ら、エンジニア・PMとしても活動し... 続きを読む

CSSでボタンを実装するときに記述しておくと便利なスタイルのまとめ

2024/04/09 107 users CSS ズーム 実装 誤動作 テキスト

Webサイトやスマホアプリの実装に、ボタンは欠かせない要素の一つです。そんなボタンの実装に設定しておくと便利なCSSのスタイルを紹介します。 スマホでボタンをタップした際にズームなどの誤動作が起きないようにするCSS、ボタンのテキストが選択されてハイライトにならないようにするCSS、フォーカス時のアウトライン... 続きを読む

CSSだけでif～else文と同じことができる！ しかもすべてのブラウザでサポートされています

2024/03/12 170 users CSS else ブラウザ すべて

CSSでif～else文が使えたら、と思ったことはありませんか？ もちろんifとかelseはCSSにはありませんが、CSSだけでif～else文と同じようにスタイルを設定できます。 CSSでif～else文を実現するには...記事の続きを読む 続きを読む

これは覚えておきたい！ CSSの:has()疑似クラスを使うと、こんな面倒な実装も簡単なCSSだけできる

2024/02/14 63 users Has Firefox CSS 疑似クラス 実装

CSSの:has()疑似クラスは去年末にFirefoxでサポートされ、これですべてのブラウザにサポートされました。2024年は、:has()疑似クラスを使用する機会が増えますね。 CSSの:has()疑似クラスは指定した要素がある場合にのみスタイルを適用できる、if文のような非常に便利なCSSの機能です。この:has()疑似クラスの基本的な使... 続きを読む

モダンCSSで実装する、テーブル（<table>）のさまざまなスタイルのまとめ

2024/02/08 128 users table ポパー 四隅 モダンCSS テーブル

モダンCSSでテーブルをゼブラストライプしたり、テーブルの四隅を角丸にしたり（昔はかなり面倒でした）、列や行を分割したり、ホバーでハイライトやアウトラインを表示したりなど、表のデータを読みやすくするテーブル（<table>）のさまざまなスタイルを紹介します。 A Guide to Styling Tables by Mads Stoumann 下記... 続きを読む

勝率が段違い！米国株投資の魅力とリスクへのアプローチ - たぱぞうの米国株投資

2024/02/02 209 users 勝率 歳月 最適解 アプローチ リスク

投資の最適解とはどういうことか ２０１０年に米国株投資を始め、１５年近くの歳月が過ぎました。米国株に１本化してからはおよそ１０年です。この間、コツコツと再投資を続けてきましたが、これほどまでの資産の増加は私自身想像をしていなかったことでした。 この間、個別株中心からETF中心に投資のスタイルも変わりま... 続きを読む

いいこと聞いた！ CSSのデフォルトとして記述しておくと便利、img要素に設定するスタイルのまとめ

2023/12/12 159 users CSS img要素 リセットCSS デフォルト ターゲット

最近ではモダンブラウザをターゲットにした場合、リセットCSS自体は必要ないかもしませんが、設定しておきたいスタイルや一部のブラウザ用に設定しておきたいスタイルがあります。 その中の一つとして、img要素に設定しておくと便利なスタイルを紹介します。 最近のリセットCSS、また設定しておきたスタイルや一部のブラ... 続きを読む

指示したUIをAIがTailwindベースで実装してくれるv0が凄い

2023/12/02 210 users Shad tailwind shadcn ヘッドレスUI 言語

v0とは v0は自然言語で作りたいUIをAIに指示するとそのUIをTailwind (shadcn/ui)ベースで作ってくれるサービスです。 shadcn/uiとは shadcn/uiはRadix UIというUIをもたないヘッドレスUIに対してスタイルを当てたコンポーネント集で、TailwindというCSSライブラリを使ってRadix UIに対してスタイルを当てています。 shad... 続きを読む

【カオス】無人店舗のオリジンに行ったらヤバイ状況に遭遇した / 人がいることの意義のデカさを思い知らされた話

2023/11/15 357 users 中澤 オリジン パク カオス 無人

店頭にスタッフを配置しないスタイルの無人店舗。完全に無人ではなく一応裏にスタッフがいる店でも、そう呼ぶのだそうな。恥ずかしながら私（中澤）はセルフレジまでしか経験がなかったのだが、先日フラッと入ったオリジンデリカが無人店舗であった。 こういう店って商品をパクられたりしないのだろうか？　確かに監視シ... 続きを読む

認知言語学から小説の面白さに迫る『小説の描写と技巧』

2023/11/03 300 users 技巧 文体 オリジナリティ 深み 描写

小説の面白さはどこから来るのか？ 物語のオリジナリティやキャラクターの深み、謎と驚き、テーマの共感性や描写の豊かさ、文体やスタイルなど、様々だ。 小説の面白さについて、数多くの物語論が著されてきたが、『小説の描写と技巧』（山梨正明、2023）はユニークなアプローチで斬り込んでいる。というのも、これは認... 続きを読む

古いリセットCSSからはもう卒業！ モダンブラウザに最適化された新しいリセットCSS -A (more) Modern CSS Reset

2023/10/05 201 users 知見 MORE CSS リセットCSS ターゲット

モダンブラウザをターゲットにしたWeb制作では、リセットCSS自体が必要ないかもしれません。とは言っても、設定しておきたいスタイルや一部のブラウザ用に設定しておきたいスタイルがあります。 現在のWeb制作に合わせて制作されたリセットCSSを紹介します。なぜそうするのか、なぜそれを使用しないのか、CSSの知見やテ... 続きを読む

教科書制作からYouTuberに転身し、ヒットを連発。人気チャンネル「ゲームさんぽ」の着眼点

2023/09/29 397 users YouTubeチャンネル YouTuber 探偵 気象予報士

YouTubeチャンネル「ライブドアニュース」にて2019年にシリーズ化された「ゲームさんぽ」。気象予報士や弁護士、精神科医、探偵といったさまざまなジャンルのプロとともにゲームの中を散歩するというスタイルが話題を集め、スタート時から100万再生越えの動画コンテンツを量産する人気企画です。 当初から中の人として「... 続きを読む

スタイルも機能も変わったiPhone 15/Pro。USB-Cの使い勝手はいかに【西田宗千佳のRandomTracking】

2023/09/19 74 users RandomTracking 西田宗千佳 使い勝手 機能

続きを読む

なぜドラクエの女性の重要キャラは「（実年齢に関係なく）若く見えるスタイルの良い美女・美少女」なのか？？女性像の偏りについて語る人たち

2023/09/17 223 users ドラクエ 重要キャラ 実年齢 女性像 美少女

しお（汐街コナ） @sodium 確かに日本はメディアでもエンタメコンテンツでも、女性像ってかなり偏ってるんよな。 私いま大好きなドラクエの10やってんすけど、四人いる賢者のうち女性は１人で外見は若い美女。残り三人の男性賢者は普通に見た目も老人なんよね。（賢者マリーンはオチがあれなので外します…）… twitter.co... 続きを読む

Figma for VS Codeを使ってCSS実装する時のおすすめポイント - Goodpatch Tech Blog

2023/09/01 153 users CSS実装 Goodpatch Tech Blog 池澤

Goodpatchエンジニアの池澤です。デザインツール「Figma」のスタイルや値を、テキストエディタ「VS Code」上で閲覧できる「Figma for VS Code」機能拡張が2023年6月よりFigma公式から提供されています。 この記事ではその「Figma for VS Code」について、実際に試して感じたことをまとめてみました。 ※ Figma Dev Modeや... 続きを読む

前提として、性欲抜きでも「人から見て、人の裸体は美しい」んだよ

2023/08/25 301 users 裸体 ランウェイ 種族 性欲 前提

異性愛者の男から見ても、男の整った筋肉は惚れ惚れする対象だし、 異性愛者の女から見ても、スタイルのいい女性の身体は見惚れるもの。 「自分たちと同じ種族の、健康でバランスよく整った肉体」を美しいと感じるのは、別に性欲抜きでも自然な本能だと思うよ。 『ランウェイで笑って』という服飾デザイナーの世界を描い... 続きを読む

出版業界は本当に斜陽？　本を“読む”ではなく“聴く”が若年層のスタイルに「このままいけば、電子書籍を猛追する可能性もある」（オリコン） - Yahoo!ニュース

2023/08/07 172 users 音声 反響 昨今 読書 電子コミック

出版業界に新たな風が吹き始めている。話題の電子書籍、電子コミックはもちろん、昨今では「音声で本を聴く」という形で本が読まれ始めているのだ。かつて目が悪くなった方やろうあ者向けのものが多かったが、現在では音声で読書を聴くことが新たな読書形態の一つになってきている。音声で本を楽しむことの反響とは実際... 続きを読む

【CSS】まだホバー時のスタイルを :hover だけで指定してるの？

2023/08/07 267 users hover enabled Summary Button 結論

はじめに結論から ホバースタイルは、 :hover だけで指定するのではなく、次のように指定しましょう！ @media (hover: hover) { /* リンクの場合 */ a:any-link:hover { } /* ボタンの場合 */ button:enabled:hover { } /* 特定できない場合 */ .button:where(:any-link, :enabled, summary):hover { } } ポイント 1 マ... 続きを読む

メモアプリの知見のお返しにきた

2023/06/09 523 users メモアプリ anond.hatelabo.jp 増田 知見

去年の大晦日に「メモアプリの知見を貸してほしい」という増田を書いた者です。750超のブックマークと注目をいただきまして大変感謝しています。 https://anond.hatelabo.jp/20221230142549 あれから半年経過してみて自分の使うメモアプリが定まってきただけでなく、メモの意識およびスタイルに変革が生じました。これを... 続きを読む

UIデザインに最適！ シンプルなSVGアイコン素材が7,000種類以上揃っていて、完全に商用利用無料 -Phosphor Icons

2023/05/18 125 users ソリッド SVGアイコン プレゼン SVGアイコン素材 成果物

WebサイトやスマホアプリのUIデザインをはじめ、プレゼンなどのさまざまな成果物に使用できるSVGアイコンのセットを紹介します。 アイコンのスタイルも豊富で、ソリッド・ベタ塗り・デュオトーンなども揃っており、さまざまなデザインに適用できると思います。 Phosphor Icons Phosphor Icons -GitHub Phosphor Iconsの... 続きを読む

サイモン・シネックから学ぶリーダーシップ 12の極意 デザイン会社 ビートラックス: ブログ

2023/04/24 210 users サイモン ビートラックス リーダーシップ シネック パーパス

TEDで大人気になったトークや、著書『WHYから始めよ! インスパイア型リーダーはここが違う』で有名なサイモン・シネック。成功する会社とそうでない会社の違いや、ビジョンやパーパスの重要性を説く彼は、アメリカをはじめ世界中でリーダーシップを学ぶ多くの人々から支持を得ている。 彼の提唱するスタイルは「サーバン... 続きを読む

CSS-in-JSのパラダイムシフト

2023/04/05 119 users CSS-in-JS パラダイムシフト React 筆者 選択肢

2023年現在、Reactでは多種多様なスタイリング手法が用意されています。 代表どころで言うとCSS ModulesやTailwind、CSS-in-JSなどが有名です。筆者の個人的な好みでは、これらの選択肢の中でもCSS-in-JSを用いたスタイルが特に好きですが、CSS-in-JSライブラリ群の中にはランタイムでスタイリング処理がなされる為にパ... 続きを読む

Media Queryでminやmaxはもう使いたくない。全ブラウザ対応した範囲記法が直感的で便利

2023/03/28 100 users ＭＡＸ min Safari CSS Media Query

筆者が CSS を学び始めたとき、media query で画面サイズに応じてスタイルを変える方法が大変ニガテでした😭 min？ max？ 未満のときはどうするの？ and で繋げなきゃいけないの？ 長くない？ と疑問に思いながら、今日まで長い年月を過ごしてきました。 本日（2023/03/28）、Safari 16.4 がリリースされ、 media query ... 続きを読む

CSSの進化がすごい！ スタイルクエリの基礎知識と使い方を解説、親要素の「スタイル」に応じて子要素のスタイルを適用

2022/10/27 160 users CSS コンテナクエリ スタイルクエリ Safari コンテナ

Chrome 106, Safari 16でサポートされたコンテナクエリは、親要素（コンテナ）のサイズに応じて子要素のスタイルを設定できる新機能です。しかし、これは機能の一部です。親要素のスタイルに応じて子要素のスタイルを設定できるスタイルクエリを紹介します。 たとえば、下記は右のカードの親要素に特定のスタイルが設定... 続きを読む

Webページの見栄えをよくするたった58バイトのCSS

2022/10/20 138 users 見栄え CSS プロパティ ボーナス オプション

ほとんどのWebページの見栄えをよくするたった58バイトのCSSを紹介します。 3つのプロパティだけですが、Webページを実装する時の最初のスタイルとして用意しておくとよいかもしれません。 また、ボーナスの100バイト版とオプションのさらに100バイト版も合わせて紹介します。 58 bytes of CSS to look great nearly eve... 続きを読む