Category
Web制作
HTMLとCSSでWebサイトを作って、「さあ公開しよう！」と思った時にレンタルサーバーの登録だったり、ドメインの取得だったり面倒な作業がたくさん発生すると嫌になってしまいますよね。 すでにレンタルサ...
いざWebサイトを作ろうと思っても、どうやって作ればいいのか分からないという方が多いと思います。 Webサイトを作成する際は、目的やスキルに見合った方法を選ばなければ途中で挫折してしまったり、完成した...
Webサイト制作と言えばWordPressと言われるほど、WordPressはWebサイトを作るための人気ツールです。 一見難しく見えるかもしれませんが、大変なのは初期設定が大半で、一度サイトを作って...
HTMLとCSSはWeb制作を行うための基本中の基本です。どんなWebサイトを作るにしても、HTMLとCSSを使わずに作ることはできません。 今回は、初めてHTMLとCSSを勉強する人におすすめの入門...
メディアやブログのコンテンツページに目次を設置することで、ユーザーにそのページに書かれている内容を最初に伝えることができるので、ユーザビリティの向上に繋がります。 WordPressを使っている場合は...
HTMLとCSSは、Webサイトを作るためには欠かせない言語です。HTMLとCSSが扱えるようになれば、一人でWebサイトのコーディングが行えるようになります。 Webサイトのコーディングができれば、...
WordPressにある程度慣れてくると、テーマを編集して色々なカスタマイズを行いたくなると思います。しかし、テーマの編集は注意しなければならないポイントがたくさんあるため、慎重に行わなければなりませ...
Facebook、TwitterなどのSNSに記事をシェアしてもらうのに必要なのが「シェアボタン」です。サービスごとにURLやパラメータが異なるため、オリジナルでシェアボタンを作成する場合はそれぞれ設...
UX Planetに「How to Work Smarter as a Product Designer（訳：プロダクトデザイナーとしてよりスマートに働く方法）」という記事が投稿されました。 プロダク...
CSS Gridの使い方はよく分からないけど、Flexboxの方が簡単そうだからFlexboxを使っているという方も多いのではないでしょうか。 確かに、CSS GridはFlexboxと比べると少し扱...
SEO対策において、ページの表示速度は注意すべき指標の1つです。 ページの読み込みに3秒以上かかると50％以上のユーザーが離脱してしまうと言われており、たった数秒の違いで与える影響の大きさは計り知れま...
前回はネストや変数などSassの基本機能をご紹介しましたが、今回はもっと便利にスタイルシートを記述するためのSassの機能をご紹介したいと思います。 前回の記事はこちら↓ インポート（@import）...
WordPressはブラウザ上で簡単にWebサイトを管理することができ、多くのWebサイトがWordPressを使って公開されていますが、一方でアカウントが他の人に知られてしまうと誰でも簡単にアクセス...
CSSの記述を効率化し、メンテナンス性も向上するSassの導入から基本的な使い方までまとめました。 対象の方は下記のとおりです。 Sassで書きたいけどコンパイルがよく分からない Sassをコンパイル...
Webのコーディングを行うテキストエディタの中でも、多くの人に使われている人気のエディタがMicrosoftが提供する「Visual Studio Code（VS Code）」です。 他にもAtomや...
CSSの設計手法とは、CSSのメンテナンス性や作業効率を向上させるためのHTMLのクラス名の付け方と、CSSのコードの管理方法の考え方のことを言います。命名規則などとも呼ばれたりしますね。 ページ数が...
CSS FlexboxはWebコーディングのレイアウトを柔軟に作成できるため、様々な場面で使われています。 今回は、CSS Flexboxを使って要素の左寄せ・中央寄せ・右寄せするための指定方法とTi...
ファビコン(favicon)や、iOSやAndroidでホーム画面に保存した時に表示される画像、Windows8や10でスタート画面にピン留めした時の画像など、Webサイトでは様々なアイコン画像に関す...
Webアイコンフォントを使うことによって、Webサイトに簡単にアイコン素材をデザインに取り入れることができ、デザインの幅が広がります。 一度使ってみるとその便利さに気づくのですが、初めて使う場合には使...
Font Awesomeとは、無料で利用可能なWebアイコンフォントで、アイコンの種類がとても豊富なのでWeb制作の様々な場面で活用することができます。 ただ、CDNを使ったり疑似要素（::befor...
CSS Flexboxとは、CSSによるレイアウトの代表的な手法の1つで、CSS Flexboxを使用することによって、完結なコードで柔軟にレイアウトを組むことができるようになります。 普段CSSフレ...
著作権の表記不要で商用利用も可能なフリー写真・画像素材を提供するストックフォトサービスの中から、本当に使える6つのサイトに厳選しました。 無料で利用できるフリー写真素材は、Webデザインで気軽に写真素...
WordPressで投稿ページやカテゴリーページのURLをカスタマイズするには、パーマリンクの設定が必要です。 一見簡単そうに思えるかもしれませんが、SEO最適化や管理を考えると色々なことを考えて設定...
Webサイトやブログを運営する上で、サイドバーに適切に表示を行うことによって訪問者にとって使いやすいサービスを提供することができます。 WordPressには、簡単な設定でサイドバーに様々なカスタマイ...