
2022年 WebPとは?対応ブラウザや変換フリーソフトを解説
WebP(読み方はウェッピー)とは、Googleが開発した次世代画像フォーマット。Web上で使われるPNGやJPEG、GIFなどを更に軽量化し、表示速度の高速化を実現しています。 これまで使える環境が限られていたWebP…
WebP(読み方はウェッピー)とは、Googleが開発した次世代画像フォーマット。Web上で使われるPNGやJPEG、GIFなどを更に軽量化し、表示速度の高速化を実現しています。 これまで使える環境が限られていたWebP…
フリーアイコンの中でも、シンプルなテイストのフリーアイコンが揃う素材サイトを紹介します。線画のアイコンで、白や黒などモノクロや、カラー変更が出来るサイトも。 シンプルなアイコンは使い勝手がとても良いので、ウェブサイトやブ…
Unsplash(アンスプラッシュ)とは商用利用できる著作権フリーの素材サイト。無料で世界中のおしゃれな写真をダウンロード出来ます。 しかし、Unsplashは海外サイト。日本語表記ではない為、使い方が分からなくて困りま…
どんどん便利な機能が実装されていくAdobe XDですが、それでもまだ基本機能では出来ない事もあります。逆に今ではプラグインを使わずとも出来る機能も沢山あります。 「何となく便利そうだけど要るのかな?」「でも無駄なものは…
Webサイト制作の現場ではもはや必須となったAdobe XDですが、まだ使った事が無くてこれから勉強しようと考えている方も多いはず。 XDの使い方を勉強するならAdobeの公式チュートリアル 「Adobe XD Trai…
この記事では無料でダウンロード出来て商用利用可能なフリーフォントやフリーフォントサイトを紹介しています。英語の筆記体でかわいいフリーフォント、漢字や毛筆の日本語のフリーフォントなどもあります。 筆記体フォントや可愛いフォ…
pタグはparagraph(パラグラフ)の事で、段落を意味します。ウェブサイトやブログなど、一番よく使うHTMLタグの一つです。 ブログのエディタを使っている等で、実は詳細を知らないまま文章を書いている方も多いと思います…
strongタグは内容の重要性、重大性、または緊急性が高いテキストを表します。WordPressなどのエディタツールでは「B」という表記になっていますが、実際はこのstrongタグが使われます。 ブラウザでは太字で表示さ…
aタグとはanchor(アンカー:錨)の略で、ハイパーリンクを意味します。一般的には略して「リンク」と呼んでいる物の事です。 このハイパーリンクにより、同じサイト内の別ページへのリンクや、別のウェブサイトへ移動する事が出…
HTMLのsection要素は、大抵の場合見出しを伴う文章内の章や節などで使います。 HTML5以前は具体的な要素が無かった為、セクションを表現するのにdivタグを使っていました。sectionがふさわしくない場合はdi…
hタグ(h tag)とはHeadingの略で、見出しを意味します。見出しはその重要性に応じて、h1~h6までの6段階でレベル分けされています。 HTMLは文書構造と言って本に例えられます。本にはタイトルだけでなく、内容に…
実は配色には幾つもの配色ルールやコツがあり、感覚で決めている訳ではありません。例えばwebサイトをデザインする際も、カラーパレットやカラーコードを用意して配色を決めます。 配色はとても重要で、配色次第でサービス全体の印象…
CSSを勉強し始めた人が良く悩むのが、CSSが効かない理由を特定出来ない事です。CSSが効かない時の理由は幾つかありますが、大きな理由の1つに「詳細度」があります。 ただ単純にclassやid、セレクターなどを正しく使っ…
これからCSSを勉強してみたいと考えている方向けに、超簡単に噛み砕いて解説しています。どんな感じなのかなぁ~、くらいの興味でオッケー。 今回は「CSSの疑似要素について」書いています。今回の疑似要素を理解し、使いこなせる…