SVG textPathを使ってテキストを波状にする方法
htmlのSVGを使えば、テキストを波状や円形にできます。 SVGですがベクターデータではなくテキストデータなのでフォントを使ったりCSSで装飾することも可能です。 SVG textPathを使った実際のサンプル まずは続きを読む
WEBデザイン
htmlのSVGを使えば、テキストを波状や円形にできます。 SVGですがベクターデータではなくテキストデータなのでフォントを使ったりCSSで装飾することも可能です。 SVG textPathを使った実際のサンプル まずは続きを読む
CSSだけでテキスト文字にグラデーションカラーを付ける方法をご紹介します。 コピペで使えるコードもありますので、ぜひ参考にしてください。 グラデーション文字のサンプル ここに実際のサンプルを用意しました。 1、普通にグラ続きを読む
Google Fonts(グーグルフォント)にマテリアルアイコンが登場しました。 Google Fonts Iconsのサイトはこちら これを使えば、HTMLの中で文字を打つようにアイコンを出すことができます。 この記事続きを読む
CSSで、「項目は左側、内容は右側、その2つを点線でつなぐ」といったメニュー表や目次によくあるデザインの作り方をご紹介します。 この表現は“項目と内容”で構成されたレイアウトなので、次のような場面続きを読む
CSSのtext-shadowを使い文字にシャドウを付け、背景との差を出したいときなどにシャドウが薄すぎて困ったことはありませんか? もしtext-shadowのシャドウが薄い場合には“複数の同じ影を重ね掛け”することで続きを読む
簡単で今日にも販売開始できるECサービスや決済システムを探しているなら、STORES(ストアーズ) が最適です。 ECショップを出して販売を開始したい場合色々なサービスが候補にあがると思います。しかし、中には導入や審査な続きを読む
1つのボタンを押すと複数のサイトが開く方法のご紹介です。 この動作は通常のサイトで使うことはありませんし、そもそもブラウザのポップアップブロックなどのセキュリティーで制限されています。 しかし、個人的な検証用やチーム内で続きを読む
「任意のYoutubeチャンネルの最新動画を取得し、WEBサイトに表示させる」方法をご紹介します。 この方法を使えば、Youtubeに新しい動画が投稿されると自動的にWEBサイトにも最新動画が表示されます。表示する動画の続きを読む
canvas(カンバス)での表現で動きやアニメーションに残像を付ける方法を紹介します。 方法は簡単で、「背景に透明度を持たせる」ことです。 実際の例と理屈を解説していきます。 canvasアニメーションで残像を付けた実例続きを読む
CSSのanimationプロパティは便利だし表現力豊かなのですが、どうしてもコードが長くなりがちですよね。 効率的でスマートなCSS animationの書き方をご紹介します。 なにか特別な技術や表現ということではなく続きを読む
数あるECカートサービス(ASP)を比較してどれが良いのかを探すにも、機能やサービスが多すぎて何を比較したらいいのか判らない人も多いと思います。 沢山ある要素の中で「まず絶対に比較すべき要素」を紹介していきます。 これら続きを読む
ネットショップの作り方を解説していきます。 この記事では「ネットショップ」と呼びますが、「ECサイト」「販売サイト」なども同じ意味になります。 ネットショップには様々な種類があり、それぞれ作り方やサービス内容が違ってきま続きを読む