自分用参考資料

WEBサイト制作のために、参考文献や素敵なサイトをブックマークさせてもらってます。たまに自分が書いたコードもメモ帳として投稿します。

[kedama-mz]

四国銘館 空と海｜高知市の四国特産品セレクトショップ

四国銘館 空と海は、四国と淡路島の特産品や銘品を取り揃えたセレクトショップ。贈り物に最適な商品やお土産を豊富にご用意し、全国にお届けしております。自然と文化の融合が生み出す商品を、店舗またはオンラインストアでお楽しみください。

最高

[kedama-mz]

かつてはJavaScriptで書かないと実現できなかったポップオーバーですが、popover属性を使うことでHTMLだけで実現することが可能になりました。 popoverの基本的な使い方からアニメーションの表現の仕方など実際に見ていきましょ

cssだけでpopoverをふわっと開閉させる。 animationでallow-discreteを指定。

[kedama-mz]

イラレの点線（破線）の作り方とデザイン例 - DESIGN TREKKER

基本設定を詳しく動画で説明。どんなデザインができるかという例も紹介しています。

丸い点線の作り方

[kedama-mz]

水平方向の無限スクロールを綺麗に実装しよう - Qiita

画像やテキストなどが永遠と流れ続ける水平スクロールは おしゃれなサイトでよく見かけると思います。 そんな水平スクロールですが、意外と手間取ることもあったので 実装方法を考え直してみました。 結論 先に結果辿り着いたコードを載せます。 細かい要件がなければこのコードで実装...

めちゃいい。ガタつかない

[kedama-mz]

2ステップで平面図を立体に！Illustratorで超簡単に立体的なイラストを作る方法 | Raccoon Tech Blog [株式会社ラクーンホールディングス 技術戦略部ブログ]

Webデザイナーですが、たまにイラストを描いたりします。少し前にラクーンが運営する越境ECサイト「SD export」3周年を記念するインフォグラフィックを作成しました。このイラストは「Isometric（アイソメトリック）」と言われる技法で、Illustratorを使って作成し

立体イラストの作り方

[kedama-mz]

VSCodeで.astroファイル編集中にEmmetが機能しない場合の対処 - doudemo.info

初期状態のVSCode上でEmmetは.astroファイルに反応しないので設定を変えてあげれば良い。

急にemmet使えなくなったと思ったらそもそもastro対応してなかった。設定ありがたや

[kedama-mz]

こういうボタンを作る時の参考

[kedama-mz]

NewsPicks Brand Design | 経済情報に心を動かすクリエイティブを。

経済情報に心を動かすクリエイティブを。

デカくて余白とかキレイで良い

[kedama-mz]

黒木テック工業株式会社｜遊園地の乗り物製造・設計

黒木テック工業株式会社は、兵庫県伊丹市に拠点を置く、観覧車やジェットコースターなど遊園施設向け乗り物製造の専門メーカー。半世紀以上の技術力と安全性で国内外の遊園施設に貢献しています。高品質な製品を通じて、遊園地体験を進化させ、「楽しさ」を創造するものづくりを展開しています。

めちゃかっこいい

[kedama-mz]

JavaScriptとハイボリッド・スクロール

ハイブリッドスクロールでは、従来の縦スクロールから横スクロールに移行し、シームレスに縦スクロールに戻ります。

スクロールホイールしてたらいい感じに横に移動したり縦スクロールに戻ったりするやつ

[kedama-mz]

【Astro】importエイリアスとは？メリットや設定方法を解説 | WebTech Media

Astroでimportエイリアスを使用することのメリットと、設定方法を紹介します。tsconfig.jsonファイルを編集し、実際にエイリアスを設定する手順を解説します。

[kedama-mz]

Next.jsの画像最適化をnext/imageを使用せずに活用する方法

widthとheightを指定したくなかったので参考に。

[kedama-mz]

【サンプルコードあり】noteの投稿をRSSフィードを用いてWordPress内に表示させる方法 - 株式会社TANE-be｜大阪にあるWebサイト制作

こんにちは。デザイナーの山田です。 私事ですが、最近テレビを購入しました。画質やらサイズやら、色々と悩みながら家電を探すのは楽しいですね。 今年はW杯もあるので、綺麗な映像で楽しみながら観戦したいと思います。 さて、今回のブログではnote

やってみる

[kedama-mz]

JavaScriptの.scrollYで背景のパララックスエフェクト

パララックスエフェクトを実装する時、JavaScriptのライブラリを使えば複雑なものも簡単に実装が可能です。 が、シンプルなものならJavaScriptのコードだけで実装が可能なので、今回はシンプルな「背景のパララック ...

[kedama-mz]

いきもの東急不動産

すべての生き物の住み心地を考える不動産会社へ。人類以外のための不動産のあり方を探るプロジェクト、いきもの東急不動産。季節にあわせて、はじめていきます。

鳥と虫の動きが可愛かった

[kedama-mz]

金楠水産株式会社｜最高品質が、明石の証し

海峡の激しい波と豊富な海藻が育てた唯一無二の明石のたこを、百年受け継がれてきた、たこ匠の技術で茹で上げる。本物の明石だこの味を、これからも届けるために。私たちが、金楠水産です。

かわいい

[kedama-mz]

一期コンサルティング：栃木県・北海道のFP事務所：家計・住宅ローン・保険・資産運用のご相談

栃木県・北海道のファイナンシャルプランナー（FP）事務所【一期コンサルティング】です。一人ひとりにあったライフプラン設計・家計見直し・住宅ローン・教育資金・年金・保険の見直し等を総合的にご提案・アドバイスいたします。お気軽にご相談ください。

めっちゃ挨拶しててかわいい