Highlighting Code Blockがおかしい！Easy Table of Contentsをアップデートするとコンフリクトする。。 2022.10.31 突然、Highlighting Code Blockの表示に不具合が。 目次用のプラグイン「Highlighting Code Block」の表示が、突然おかしくなった。 ネット上に解決方法が見つからなかったので、もし参考になれば。 pets今回の現象としては... HTMLとPHPのコードは表示不可。PHPの方は壊滅的で、サイトのレイアウトまで崩壊。 ... memosWebデザインWordPress
縁取り文字はCSSのtext-strokeで可能。（非推奨の時代は終わり。） 2022.10.29 縁取り文字はtext-strokeを使った方が楽で確実。 CSSのtext-stroke。 DTPデザインでは当たり前で、イラレでもフォトショでもごく普通に使われている縁取り文字。 文字を縁取りするだけなので簡単そうだが、CSSではなかなか実装されなかった。 そのためWebデザインでは長年シャドウ用の「text-shadow」を駆使して代用していたが、そんな時代がよ... CSSmemosWebデザインデザイン
ドライブ・マイ・カーとCODAと。アカデミーにおいてのリスペクトやオマージュとパクりの違い。 2022.10.26 映画の批評ではなくある種のメタファー。 ドライブ・マイ・カーとCODA。 言語の掛け合わせ。 この記事は、映画「ドライブ・マイ・カー」と「CODA」と、Web業界を含む、教育・指導の現場でのパクり行為をなんとなく掛け合わせている。 ドライブ・マイ・カーとCODAには「手話」という言語が登場し、インターネットのサイトは「HTML」という言語でできており... Editormemos
CSS変数の使い方例。:rootを使ってカスタムプロパティを覚える。 2022.10.23 CSSで変数（カスタムプロパティ）を使うと、とにかく便利。 CSS変数を使う。 プログラムの基本。 JavaScriptやPHPなど、プログラミング言語ではごくごく基本の変数。 CSSでも使える便利な機能。 CSS変数のニーズ。 CSS変数（カスタムプロパティ）。 もともとCSSの生みの親であるホーコン・ウィウム・リー氏によると、CSSは意図的にプ... CSSmemosWebデザイン
CSSでフェードイン。JS不要、コピペ可。ちょっとリッチな雰囲気を。 2022.10.22 CSSでフェードインできる、animationプロパティ。 CSSだけでフェードイン。JavaScript不要。 フェードインがCSSのanimationで実装できるように。 数年前まではJavaScriptやjQueryプラグインで実装していた、Webサイトのフェードイン。 サイト訪問時にちょっとリッチな雰囲気を醸し出すフェードインは、今ではすっかりCSSだけで表... CSSmemosWebデザイン
SONYタイマーとAppleタイマーの実際のところ。 2022.10.21 SONYタイマー、SONYタイムとは？ SONYタイマーやAppleタイマー。 いつ頃からか、SONY製品はすぐに壊れるので、買ってから数年後（いわゆるSONYタイム）に故障するように「SONYタイマー」が付いていると揶揄されるようになった。 同様に、Apple製品もそう言われるようになっていた。（どっちが先かはわからない。） SONY製品を使ってみたところ... iPadiPhoneMacmemos
CSS カラーコードで透明度を指定したいとき。（16進数6つ+2つで。） 2022.10.20 16進数（HEX）のカラーコードで透明度を指定したい場合。 CSSで多い、色の指定。 CSSで色や透明度を指定する。 CSSで色を指定する際は、#を付けた6桁の英数字、16進数のカラーコードを使うことが多い。 カラーピッカーで感覚的に作った色でも、ロゴやイメージカラーと厳密に一致させたい場合でも、デザインツールで数値化ができるため再現性が高い。 16進数、16... CSSmemosWebデザインデザイン
「ダ・ヴィンチ」はなぜ「レオナルド」と呼ばれるようになっているのか？ 2022.10.19 レオナルド・ダ・ヴィンチという名前の意味。 ヴィンチ村のレオナルド？ ダ・ヴィンチは本名ではない。 レオナルド・ダ・ヴィンチという名は本名ではなく、直訳では「ヴィンチ村のレオナルド」、という意味となる。 なので「ダ・ヴィンチ」と言うと、「ヴィンチ村の」と言っているようなものであるという。 ただしこのことは、20世紀の時代から言われていた。 ... memosデザイン
ゴッホとピカソの違いがわからないのにデザイナー？知らなすぎて搾取されるWeb&DTPデザイン。 2022.10.18 デザイナーって？ ファッションデザイナーからWebデザイナー、DTPデザイナーへ。 デザイナーのイメージ。 MacやWindowsなどの家庭用コンピュータが現れる前までは、日本で「デザイナー」と言えば、「ファッションデザイナー」のイメージが強かった。 現在は「デザイナー」と言えば、パソコンを使った「Webデザイナー」や「DTPデザイナー」を指すことの... DTPデザインmemosWebデザイン脳
模写コーディングの際に気をつけるべきこと。学ぶは真似る。 2022.10.17 模写コーディングの注意点。 模写コーディングによるコーディング学習 学ぶは真似るは、コーディング学習でも一緒。 学ぶの語源は学ぶ、学ぶは真似る、というように、参考にしたい誰かの真似から始めるのは古来からの学習法の一つだ。 それは科学的にも裏付けがある。そもそも生命の遺伝子やミーム（文化的遺伝子）の伝達もコピー、模倣から始まる。 遺伝子もコピーに... memosWebデザインデザイン脳
ニュートンによる虹は７色というのは本当？（絵文字は６色だけど。） 2022.10.16 ニュートンが虹を7色と決めた？ ニュートンの光のスペクトルでは7色。 日本では7色。 日本では虹は7色であるというのは、一般的で、当たり前のこととなっている。 アメリカでは6色。 だが虹の色数は国や地域によって異なり、例えばアメリカでは6色が一般的だという。 2色や4色、5色という国、地域もあるらしい。 Appleの初期のレインボー... CSSmemosWebデザインデザイン脳
SVGテキストをセンタリングする方法。Safariの挙動も解決。 2022.10.12 SVGテキストのセンタリングは、ブラウザによって挙動が違う。 SVGテキストのセンタリング問題。 SVGでのアイコンやテキスト表示は簡単だが、位置やアニメーションの設定をしていると、思わぬところで落とし穴にハマることがある。 表示位置やアニメーションはCSSの方で指定できるが、SVGテキストの場合、何故かSafariでだけうまくいかない場合があった。 実際に検証した... CSSHTMLmemosWebデザイン
iPhoneで入力中の文字を取り消す方法。振ったりスワイプしたりで。 2022.10.10 iPhoneを振って入力文字を取り消す、「シェイクで取り消し」。 シェイクで取り消し。 取り消したい。 iPhoneでLINEやメール、メモなどを入力している時に、文字を打ち間違ってしまうことがある。 そんなときは、iPhone自体を上下や左右に振ると、心地よい感じの軽い振動があり、操作を取り消すことができる。 （※スクショはダークモード表示時... iPhonememos
ノーコードは必要なのだろうか？ノーコードはなぜ広がらない？ 2022.10.09 ここ数年話題のノーコード。 オーサリングとノーコード。 ここ数年Web業界でトレンドとなっている「ノーコード」。その名の通り、わざわざコードを書かなくてもカッコよくおしゃれなサイトが作れちゃう、というような一見最先端な技術。 と、言われているような雰囲気だが、そもそも同じようなことは20年ほど前も謳われていた。HTMLやCSSが分からなくても、ホームページ... CSSHTMLmemosWebデザイン
VSCodeのタブ「ピン留め」機能が手軽で快適。 2022.10.07 常に開いておきたいタブをピンで留められる。 VSCodeのタブをピンで固定。 VSCodeのタブのピン留め。 ブラウザでたまに使っていた機能のピン留め。いつの間にかVSCodeでも使えるようになっていた。2020年頃から実装されていた模様。 ファイルを閉じて開き直したり、VSCodeを終了して再度立ち上げたときにもピン留めしたタブはそのまま保持される。 VSC... EditormemosWebデザイン
WordPress pタグを投稿記事から削除する1行のコード。 2022.10.06 記事を書いた後に、意図せずにpタグが挿入されている！？ WordPressによる「wpautop」。 wpautop WordPressで記事を作成している時、想定外にレイアウトが変わってしまうことがある。 よくあるのが、ブログ投稿時の「pタグの自動挿入」。 これはデザイナーにとっては（もしかしたらブロガーにも）悩ましく、特にCSSでpタグにスタイルを設定して... HTMLmemosPHPWebデザインWordPress
パソコンと目と健康管理。VDT症候群の予防とダークモードの活用のすすめ。 2022.10.01 パソコンやスマホと、VDT症候群。 VDT症候群。目と健康管理。 VDT症候群とは？ 自分が職業訓練校で講師をしていたころ、カリキュラムの最初の段階で必ず「VDT症候群」についての内容があった。 VDT症候群とは、「Visual Display Terminal Syndrome（ビジュアル・ディスプレイ・ターミナル・シンドローム）」の略で、要するにパソコンの前での... DTPデザインmemosWebデザイン脳
