WEBデザイン 【コーディング備忘録】border-bottomだけじゃない！cssで下線を引く方法。
文字に下線を引くとき、私が毎回使うのが「border-bottom」 こちらは、直線だけでなく点線や破線にもできるので大変便利なプロパティです。 See the Pen border-bottom by M S (@attlabo_m-s)...
WEBデザイン
WEBデザイン 
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で出来るのだろうか？とふと疑問に思ったものが出てきまし...
WEBデザイン 【Googleマップ】ピンを立てた地図をブログやサイトに埋め込む方法
今現在、業務で観光施設のLPのコーディングをやらせてもらっています。 観光系のサイトでは必ず出てくるのがアクセスマップ。 観光施設などの複数のスポットが一箇所に集約された地図が載っていると大変便利ですよね。ルートや場所決めの後押しになったり...
WEBデザイン 【Photoshop】建物などの汚れを消す写真加工術をご紹介！
先日、クライアントさんから「弊社の建物（の壁面）の写真をキレイにしてほしい」とのご依頼がありました。既にサイト上にアップされているその画像の建物は、白い壁面なだけあって広範囲の黒ずみが目立っていました。 確かに、建物の汚れは悪印象を与えかね...
WEBデザイン 【コーディング備忘録】HTML上で文字色を指定できる「span style」
先日、コーディングをしている時に困ってしまったこと。 ひとつのキャッチコピーの中に複数の色や大きさの違う文字が使われていて、それぞれにどう指定したらいいか頭を悩ませました。なるべくスタイルシートの記述を増やさずに対処できないかなぁと模索して...
WEBデザイン 【簡単3ステップ】Illustratorで文字にモザイクをかける方法
先日、会社のホームページリニューアルに伴い、印刷物の掲載ページのデザインを担当させてもらいました。 そこでは実案件の名刺を掲載するのですが、氏名や携帯番号などの個人情報をそのまま載せるわけにはいかず...。最終的に、個人情報にモザイク処理を...
WEBデザイン Macが固まったとき、どう対処する？
たまーに、イラレのデータを保存する際にMacが固まることがあります。 そんな時はDock内のアプリケーションアイコンを右クリックしてイラレの「終了」を試みるのですが、全く反応しないことがあります。 Windowsを使っていた時は、Alt +...