My Web道

WEB制作科 受講記録 …とその後も続くWEB制作に関する活動・学習記録です。

配色の選定にはこれが便利!オンラインツール「PHOTOCOPA」のご紹介

今日は、Web制作中の配色時にお役立ち、 「PHOTOCOPA」というツールをご紹介いたします。 「PHOTOCOPA」とは? PHOTOCOPAは、以下サイトで提供されているオンラインツールです。公式サイト: PHOTOCOPA | Photo Color Palettes by COLOURlovers :: COLOURlov…

【WordPress】サイトURLをhttpsにしたらログインできなくなった時の解決法

サイトhttps化にともない、WordPressでサイトURLを「https:// 」に変更したところ、直後から図のようなエラー画面が。 サイトにアクセスできない状態になっていましました。 【障害対応】常時SSL化でサイトアクセスエラー発生 以下、各ブラウザ別の表示例で…

Webデザイナーになるために ( これからWebデザイナーをめざす方々へ )

制作のスキルを上げるためには 「実際に報酬を得て仕事をすること、 それがスキルを上げる早道」これはかつての私が通っていたWeb制作科での恩師の言葉。 「まだこれができない」 「まだこれしかできない」 「スキルが足りない」 「だからまたとても仕事なん…

Webクリエイター向け求人充実の今がチャンス!Web業界に転職しよう

私がWeb制作科に通っていた2014年頃、クラスの半分以上の生徒はWeb業界には就職しないという残念な状況がありました。その主な理由は、 そもそも有効求人があまり多くない ゆえに、スクール卒を採用する企業が少ない スクール卒求職者への採用条件が非常に厳…

WordPressを手動で任意のバージョンにアップグレードする方法

たまに、WordPressを最新版ではなく「この特定のバージョンにしたい」ってことがあります。 あるいは、環境によっては自動アップデートでは更新できない場合とか。実際私も今日そんな場面に遭遇し、手動アップデートを実行することになりました。ということ…

タブメニュー(2) (jQueryとCSSで実装する超シンプルタブを作ってみました)

下記記事を参考にさせていただき、超シンプルタブメニューをページに実装してみました。【参考記事】 超シンプルなjQueryタブメニューの実装方法 - クルマ好きの幸福論 : https://hayakawayuki.com/4518 超シンプルなjQueryタブメニューの実装方法 - クルマ…

コーディング不要!簡単操作でプロ並みBootstrapサイトが作成できる「Mobirise」

ドラッグ & ドロップと簡単設定だけでBootstrapサイトが作成できる「Mobirise」 公式サイト Free Website Builder Software : https://mobirise.com mobirise.com Bootstrapのここ最近のテーマをチェックしていたところ、偶然こちらのツールを発見。なんだか…

同一ページ 別タブ内アンカーリンクへの移動実現方法

同一ページ内の異なるタブ内アンカーリンクに移動するには 通常、アンカーリンク(同一ページ内)への移動は、以下の方法(アンカーリンク先要素に付けたID名をhrefに設定するだけ)で可能です。 <li><a href="#ID名">リンクテキスト</a></li> しかし、アンカーリンク先が他のタブ内だったりす…

リファラ (REFERRER) 制御方法を確認しました

リファラ (REFERRER) 制御方法を確認しました こちらについてご説明する前に、「リファラって何?」という方のために、以下ご説明いたします。 リファラ (REFERRER) とは? どこから現在のページに来ているか、ユーザーのアクセス元を示す情報のことです。 ※…

CSSで実装する タブ機能

[jQuery不要] ラジオボタン + CSSで出来る タブ機能 以下記事を参考に、Webページにタブ機能を設置してみました。【参考記事】 qiita.com上記にてご紹介いただいたコードで、 おかげさまで思った通りのタブができました。と喜んだのも束の間、一つ問題が発覚…

おススメ Div要素 丸ごと スライド可能なスライダー 「Swiper」

jQuery不要の高機能スライダー 「Swiper」を実装してみました 今日は、ページ内の要素丸ごとスライド可能な高機能スライダー、「Swiper」をご紹介いたします。Swiperのダウンロードはこちらから可能です。 Swiperの使用に至ったキッカケ 見出しやボタン等の…

【WordPress】超簡単 記事内に吹き出し会話を挿入してみました

こんな感じで、WordPresの記事に吹き出し会話を作成してみました。 WordPress記事での吹き出し会話 以前から度々見かけて実装してみたいと思っていた吹き出し形式のコンテンツ。 調べてみると、専用プラグインとして、以下「Speech bubble (ふきだしプラグイ…

チュートリアル動画作成に使えるか!? Windows 10 意外な標準機能

意外なWindows 10標準機能 Xboxアプリでデスクトップ動画作成 Xboxアプリとは? MicrosoftのXboxと言えば、やはりゲーム、 日頃ゲームをされる方はきっとご存知のはず。 本来の目的は、Windows10上で、Xboxゲームを楽しむための機能。 ゲームの様子を録画す…

【WordPress】WordPressサイトアドレスを間違って設定してしまった場合の対応 

WordPressサイトアドレスを間違って設定してしまった場合の対応 今日は、WordPressでサイトアドレスが間違って設定されてしまったという問題が発生した場合の対応方法について確認してみました。 実際今回身近で起きた問題 httpサイトのサイトアドレス設定で…

「思わずエントリーしたくなるリクルートサイト 2018」 まとめ

[2017年版] 思わず引き込まれる採用情報Webページ 2018 思わず引き込まれる各社リクルートサイト(2018)、 以下、57 55サイト(2017.9.16 2サイトを追加)をご紹介いたします。 さすがの広告代理店 採用情報ページ 博報堂 求職者に向けての熱いコピー、 シング…

【WordPress】XSERVERでのSSL設定は超簡単

WordPressサイトにSSL設定を導入してみました SSLって? ブラウザのアドレスバーで以下のように表示されるページのことです。 ページをSSL化(セキュリティ的に強化される)することで、SEO的に有利になる(検索エンジンで表示してもらいやすくなる)と言われて…

【Chrome拡張】Local版 CodePenのようなエディタツール、「Web Maker」を使ってみました

Chrome拡張「Web Maker」の機能・特徴について Chrome 「Web Maker」とは? webmakerapp.com Local版 CodePen的Webエディタ Chrome拡張機能のWebエディタ、使い勝手はCodePenに似ています。 CodePen(※)同様、ソースコードの結果がブラウザでその場で確認でき…

CodePenを使ってみました

CodePenを使ってみました 以前から話題になっていたCodePenを使ってみましたちょっと戸惑うところもありましたので、以下より、その使い方(ユーザー登録から本ブログにコードを貼り付けるまでの手順)をご紹介いたします。 1. ユーザー登録 まず、以下のサイ…

Web制作 ビギナー要チェック!! 8/31までudemy各種講座 超特価セール実施中!

ウェブデザインコース:自分自身やクライアントのウェブサイトを構築する : https://www.udemy.com/courses/design/web-design/www.udemy.com今、udemyでセール実施中。 多くの講座で正価の95%オフ、1講座 1,200円という破格で購入可能です。これだけの安さ…

【WordPress】「メディアの追加」ボタンが反応しなくなった場合の対処法

WordPressで「メディアの追加」ボタンが反応しなくなった場合の対処法について 《この現象の特徴》 主に以下のような症状が見られます。 1. 「メディアの追加」ボタンをクリックしても何も反応しない ・メディア追加用の画面が表示されない ・画像のドラッグ…

【XAMPP】localhostでページ表示できない場合の原因・対処法

自宅環境でもXAMPPで問題発生。 localhostでページ表示ができなくなっているよう。以下、原因確認・問題解決までの記録です。 XAMPPでlocalhost表示できない場合の原因・対処法 エラーメッセージ確認 XAMPPコントロールパネル XAMPPのコントロールパネルでは…

忍者おまとめボタンを使ってみた

忍者ツールズでSNSボタンを作成 忍者ツールズ|ホームページ ブログ アクセス解析 カウンター メールフォーム : http://www.ninja.co.jp/「忍者ツールズ」というサービスはご存知でしょうか。 Webサイト用の便利ツール・パーツが揃っていて、無料登録だけで…

【XAMPP】Apacheが起動しなくなった 時の対処法

【XAMPP】Apacheが起動しなくなった時の原因・対処法 調査範囲 (関連ファイル) 今回、調査したファイルは以下の通り パス ファイル名 C:\Windows\System32\drivers\etc hosts C:\xampp\apache\conf httpd.conf C:\xampp\apache\conf\extra httpd-vhosts.conf…

XSERVERを契約・お名前.comでドメイン取得・設定する手順について

XSERVERで契約したサーバーにお名前.comで取得したドメインを設定するには 高速・高機能で定評あるXSERVER を新たに契約しました。 以下、備忘録まで。 手続きの流れ 1. レンタルサーバー契約・ドメイン取得 1.1. XSERVERで契約 1.2. お名前.comでドメインを…

Webマーケティングが学べる講座まとめ

Webマーケティングとは Web(サイトやツールなど)を活用して儲けを生む仕組みを作る集客・販売戦略活動 SEOやリスティング広告など、 Web制作に関わる以上、 日々、Webマーケティングのスキルアップの必要性を感じます。今日は、仕事に活かせそうなWebマーケ…

WordPress 海外テーマ適用時に表示される ??????? の解消方法

WordPress 海外テーマ適用時に表示される ??????? の解消方法について WordPressの海外テーマを適用している時、マルチバイトテキストが ??????? となってしまう現象が発生。今日は、この現象の解決方法に関する備忘録です。 原因・解消方法 原因: 原因は、…

数字型リストマーカー (箇条書き)

<目次> 数字型リストマーカー 標準的な数字タイプ (decimal) 2桁数字タイプ(decimal-leading-zero) ローマ数字[小文字] タイプ(lower-roman) 漢数字タイプ (cjk-ideographic) 数字型リストマーカー 今日は以下のような数字型の箇条書きをマークアップする…

【WordPress】メディアライブラリが表示されなくなった場合の原因・対処法 (admin-ajax.php 編)

メディアライブラリが表示されなくなった場合の原因・対処法 (admin-ajax.php 編) 「WordPressのメディアライブラリが突然表示されなくなった」 今日は、そんな場合の原因・対処法について、シェアします。※この障害の特徴としては、 メディアライブラリ画面…

【JavaScript】ページ遷移元情報取得用 パラメータ引き継ぎスクリプト

パラメータ引き継ぎスクリプト 今日は、現在のページに埋め込まれたリンクから遷移先にジャンプした際、遷移先で遷移元ページURLをパラメータで取得するためのJavaScriptをご紹介します。【目的】 遷移元URL情報が引き継がれているため、 どういった被リンク…

【Photoshop】Photoshop で枠線を描く

Photshopで枠線(塗りつぶしなし)図形を描く方法 マニュアルの説明書作成時など、 読み込んだ画像の一部に枠線でマーキングする際に使用する方法です。MSペイントでは難なくできるようなことが、慣れないと意外と分からなかったりします。「今さら?」という…