WEBデザイン

【コーディング備忘録】border-bottomだけじゃない!cssで下線を引く方法。

文字に下線を引くとき、私が毎回使うのが「border-bottom」 こちらは、直線だけでなく点線や破線にもできるので大変便利なプロパティです。 See the Pen border-bottom by M S (@attlabo_m-s)...
WEBデザイン

【Google Fonts】無料で使えるWebフォント6選

Adobeのアプリケーションでデザインをしていると、フォントにはついついAdobe Fontsを選びがちではないでしょうか。 しかしWebフォントとして使うには、ちょっと難しいのが現状。(サイト制作者だけでなく、サイトの持ち主もAdobeプ...
WEBデザイン

【コーディング備忘録】CSSで文字を斜めにする方法

最近、CSSで文字に角度をつける方法を学びました。デザインソフト上で文字を斜めにすることはあっても、コーディングでは意外と機会がなくやってこなかったんですよね。 またいつか役立つかもしれないので忘れないうちに共有しておきます! font-s...
WEBデザイン

【Illustrator】環境設定で変更した単位が、なぜか反映されない!?

タイトルはイラレデータでコーディングしている時にたまに発生する、地味に困るトラブル。 環境設定では単位を「ピクセル」にしているのに アートボード上ではドキュメントの単位が「mm」になっている…。 思わず「どういうことなの!?」と頭を抱えてし...
WEBデザイン

【コーディング備忘録】CSSで文字を縁取る

cssの進化が凄まじい昨今。cssだけで作ったスロットゲームなんてのもあったりします。 私は加工の施された見出しを実装する際、基本はSVGやPNGで書き出す事が多いのですが、これはcssで出来るのだろうか?とふと疑問に思ったものが出てきまし...
ブログ

【Cocoonカスタマイズ】WordPressブログにファビコン(サイトアイコン)を設定しよう

みなさん、ファビコンをご存知でしょうか? そう、ブラウザのタブ左側に表示される小さなアイコンのことです。 "Favorite icon"を略してfavicon(ファビコン)と呼ばれているそうな。 ファビコンを設定するメリットとしては、 サイ...
ブログ

【Cocoonカスタマイズ】ロゴを設置!…しかし、何故かフッターのロゴがつぶれてる?

最近、地味に当ブログ(WordPress)の体裁を整えはじめました。 ↑イラレでつくった まず手始めに行ったのがタイトルロゴの作成&設置 制作時間およそ10分!…と、かなり簡易的ではありますが、これひとつ設定するだけでもだいぶ違って見えます...
WEBデザイン

【Googleマップ】ピンを立てた地図をブログやサイトに埋め込む方法

今現在、業務で観光施設のLPのコーディングをやらせてもらっています。 観光系のサイトでは必ず出てくるのがアクセスマップ。 観光施設などの複数のスポットが一箇所に集約された地図が載っていると大変便利ですよね。ルートや場所決めの後押しになったり...
雑記

2022年にやりたいことや挑戦したいこと

年が明けてあっという間に半月が経過してしまいました。 みなさま、本年もよろしくお願いいたします! さっそくですが、今年の抱負について考えてみました。 コーディングを学ぶ 2021年の抱負にもあった「コーディングの習得」から引き続き学習を続け...
雑記

2021年を振り返る

今年もあと数日となりました。 結局今年もコロナウイルスの流行は収束することなく、まだまだ長い付き合いになりそうですね。今年こそはあそこに行くぞ、あれをするぞ!と意気込んでいたのですが、それもお預けになってしまい残念でした。 来年こそは。 目...