TECH-BLOG

Web制作関連の記事を掲載しています。

  • CSSでグロー効果っぽいやつ

    0件のコメント

    イラスト制作でよく使うフィルター効果を、CSS3 filterでも実現できないかなと思ってやってみました。イメージとちょっと違ったけどこんな感じに。わかりやすくするためにアニメーションさせています。 cssはこんな感じ。 コントラスト上げて、少しぼかして、透明度下げて、ブレンドモード覆い焼き。元の絵もグロー効果付けてる...

  • 初回訪問時のみダイアログ表示

    0件のコメント

    GDPR対策とかなんとかで、初回訪問時のみダイアログを表示する機会も増えてるようなのでまとめてみます。 HTML CSS jQuery ページ読み込み完了時にcookie([onceDialogAccessFlg]でcookie名指定)があるか判定して、なかったら表示します。閉じるボタンを押すと該当のcookieが保存...

  • WordPressのテーマメニューをレスポンシブでハンバーガーメニューにする

    0件のコメント

    自作テーマでタイトルのような設計をしたい場面がよくある気がするんですが、検索するとプラグインを使った実装以外まとまった情報がなかったのでざっくりまとめてみます。テーマメニューの設定がされている状態で、jQueryとCSSを追加します。 jQuery クラス名は適宜調整してください。[menu-global-nav-co...

  • 要素の高さを画面100%に調整する

    0件のコメント

    要素の高さが画面100%に足りないときにフッターの位置がおかしくなるのを防ぐための調整です。jQueryとCSSの2パターン掲載しています。 まずはjQuery。 画面内の要素のうち、高さ調整したい要素(targetItem、1要素のみ)と高さ調整しない要素(staticItem、配列指定可)を指定して使います。マーク...

  • 速度改善でとりあえずやったこと

    0件のコメント

    あまりに読み込みが遅いのでまずはすぐにやれるところだけでもやってみようかと。 画像の遅延読み込み プラグイン「Lazy Load by WP Rocket」で、画像を遅延読み込みさせてレンダリングブロックを軽減してみました。設定のチェックは全部入れてます。 キャッシュの利用 プラグイン「WP Super Cache」で...

  • あんぷら屋はWordPressに移行しました。

    0件のコメント

    更新頻度やらメンテナンス性やら考えた結果、あんぷら屋をWordPressに移行することにしました。することに、というかしました。ブログっぽくすることで今後の更新頻度を上げていきたいところです。 構成としては、イラストや漫画関連の更新は「ART-BLOG」、Web関連の記事は「TECH-BLOG」という感じで分けています...

  • WDCP2018行ってきました

    0件のコメント

    「Web Design Creative Plus - 今とこれからのウェブデザイン」に行ってきました。最近のWebの情報をいろいろ勉強させていただいたので、復習がてらさらっとまとめます。自分用のメモを読みやすくしただけですが、驚いたことも多々あったので共感できるところがあるかもしれません。 AIで変わるこれからのWe...

  • WSLの導入

    0件のコメント

    WinとMac、制作環境としてどちらを使うか、どちらが優れているか、とは昔からよく言われることですが、個人的には、どっちでも慣れているほうを使えばよいと思ってます。今のご時勢、ソフト面ハード面ともに、極端なメリデメはなくなっていますし、どちらかでしか実現できない機能も稀になりました。 カラープロファイルの扱いが必要なデ...

  • GDPRざっくりまとめ

    0件のコメント

    まったく対応していなかったり、振り回されて過剰に反応したりしてるサイトをちらほら見かけるようになってきたので、ざっくり概要と対応についてまとめ。ちなみにちょうど今日、gaとかにもそれに関わるインフォメーションが出てました。 GDPR。EU一般データ保護規則(General Data Protection Regulat...

  • Web用語ざっくりまとめ

    0件のコメント

    最終的にユーザーがChromeやIEなどのブラウザでWebページを表示する過程と、そのあたりの用語を、コンテンツから順に、ブラウザにたどり着くまでざっくりまとめ。ほんとにざっくりなので気が向き次第追加するかも。 コンテンツ サイトのページ、リソース(画像やhtmlファイル等)。 html ハイパーテキストを記述するため...