【Illustrator】クリッピングマスクした画像はCCライブラリとアセットの書き出しで保存
クリッピングマスクをした画像の書き出しに困っていませんか。アセットの書き出しパネルにそのままドラッグ&ドロップすると、マスクで隠れている範囲まで対象になってしまいます。 これを防ぐにはCCライブラリにドラッグ&a...
IllustratorIllustrator
TIPSGoogle Analyticsの公式デモアカウントを追加！本物のデータを使って実践的な学習を
公式デモアカウントを使って、アナリティクスの勉強ができるのを知っていますか。アナリティクスを活用するにはWebサイトが必要なので、導入するまでの道のりを考えると少しためらいますよね。 今回ご紹介するデモアカウントを追加す...
WordPress【WordPress】the_dateは同じ日が表示されない！日付表示ならthe_timeで
自作のテーマを作成するときは、テンプレートタグを使う機会が増えますよね。特にWordpressはブログを運営するためのソフトなので、投稿日時の表示は欠かせません。 the_dateは投稿日時、the_timeは投稿時間と...
CSS【CSS】position:stickyで指定した位置にサイドバーを固定し追従型メニューにする
ヘッダーメニューやサイドバーを固定するときのプロパティといえば「position : fixed」ですが、「position : sticky」を使うと、同じ動作ができるのを知っていますか。こちらは指定した位置に到達する...
サイト制作Webサイトのシンボル「ファビコン」を作成！.icoなど拡張子別の正しい設置方法
ブラウザで検索してページを開くと、タブの左にアイコンが表示されます。これはファビコンと呼ばれ、訪れたサイトのシンボルやイメージを設置しています。 例えば、任天堂公式ホームページではマリオのドット絵になっていました。ページ...
Photoshop【Photoshop】なげなわツールで画像の人やものをきれいに消す方法
景色だけを使いたいとき、一緒に写っている人やものは消したいですよね。きれいに馴染ませるには、複雑な形を丁寧に囲まなければいけないと考えていませんか。 実は全くその必要はありません。不要な部分をフリーハンドで囲んで、Pho...
サイト制作【jQuery】コピペでOK！slideToggleとhasClassでアコーディオンメニューを簡単実装
スマホメニューを一から実装するのは時間がかかりますよね。手早く作りたい方向けに、コピペでできるアコーディオンメニューを用意しました。ヘッダー付きなので、簡単なスタイルの調整のみでサイトに合うメニューがすぐにできますよ！ ...
Photoshop【Photoshop】選択とマスクで背景を消して青空と差し替える
素材サイトで見つけた動物や人の写真。サムネイル画像としては使いやすいものの、バナー作成などで背景を取り除きたいときもあります。 すぐに背景を消したいならPhotoshopの「選択とマスク」がおすすめです！ 元の画像を直接...
SASS【SASS】実務で使うならSassがおすすめ！VSCodeではじめるSass入門
CSSのプロパティを覚えて、スタイル指定ができるようになってきたら「Sass（サス）」に挑戦してみましょう。変数や継承によるスタイルの定義で、コーディングの手間が省けるため、生産性も上がりますよ！ 例えば、複数箇所で同じ...
デザインFont Awesome 5のアイコンをIllustratorやXDで使う方法！UIデザインにおすすめ！
WebアイコンフォントのFont Awesome。表示にはHTMLやCSSが必要な「サイトを作るためのツール」として認識されているかもしれません。その場合は、以下の記事のようにhead内に読み込んでから利用しますよね。 ...
TIPSTwitterのタイムラインをブログに表示。埋め込みコードの発行とカスタマイズ
SNSのボタンが用意されているページを見かけたことはありますか？LINEやTwitter、Facebookなど、気に入った情報をすぐにシェアできてとても便利ですよね。 同じように、発信した情報をWebサイトでリアルタイム...
サイト制作Font Awesome 5のアイコンをCDNとダウンロードデータで指定してブラウザに表示
ユーザーに伝わりやすいWebサイトにしたいとき、簡単、無料で利用できるイラストがあると嬉しいですよね。画像以外にも、Webアイコンフォントを使うと、ひと目で分かるフラットなデザインが実装できるのでおすすめです！ よく使わ...
TIPSFTPソフトといえばFileZilla！サーバーへの接続からファイルの転送まで
FileZillaをダウンロード FileZillaの公式サイトにアクセスします。Download FileZilla Clientをクリック。 bit数を確認し、ダウンロードします。こちらはWindows7以降のWin...
WordPress【WordPress】URLにある「wp」の消し方！WordPressアドレスを変更した時の復旧法
WordPressで作ったサイトを公開するときに、URLの末尾にある「/wp」に気づく方もいるかもしれません。運営上不都合はないので、入れたままにしているサイトも見かけます。 ただ、独自ドメインで好きな文字列にした場合は...
マーケティングサイトの順位や評価がわかるSearch Consoleの初期設定。Analyticsとの連携方法も
アナリティクスでユーザー分析するのと同様に自分のサイトの状態が分かると対策も取りやすいですよね。今回設定する「サーチコンソール」は、検索エンジンのサイト順位を確認したり、流入キーワードから記事の見直しができたりと、より良...
サイト制作SSL化でセキュリティ対策。ChromeはHTTPとHTTPSの混在禁止を明言
Webサイトのセキュリティ対策といえば、SSL化がすぐに浮かびますよね。見分け方はアドレスバーに表示されるURL部分。使用するブラウザにより表示は異なりますが、 HTTPSからはじまるSSL化済みのサイトは鍵のマークがつ...
プロフィール
しろとうふ
一般企業からWebデザイナー兼フロントエンドエンジニアに転身。現在はフリーランスとして活動中。
「好きなことで好きなひとたちと生きる」が目標。少しずつできることを増やそうと奮闘中。
日々の気づきや基本操作などを備忘録としてまとめています。
人気の記事
-
Sublime Text 3のインストールと日本語化の手順！Shift-JISの文字化け対応も
-
xampp-control.iniにアクセス拒否された！管理者権限の付与ですぐ解決
-
VSCodeの「W3C Validation」でHTMLとCSSコードをチェック
-
Font Awesome 5のアイコンをIllustratorやXDで使う方法！UIデザインにおすすめ！
-
【WordPress】CSSとJavaScriptをfunctions.phpで読み込みヘッダーに出力する方法
-
【CSS】SVGファイルの作り方！CSSを使った手書き風アニメーション
-
VPNでリモートワークも安心！固定IPアドレスによる安全なネットワーク接続
-
【CSS】position:stickyで指定した位置にサイドバーを固定し追従型メニューにする
-
【Git】リモート&ローカルリポジトリの作り方！はじめての基本操作①
-
【Git】ブランチ＆プルリクエストでデータの分岐と統合依頼！はじめての基本操作④