WEB KNOWLEDGE

コーディング

Webコーディングの良し悪しは表示速度、使い勝手、更新の利便性、SEO効果などWebサイトに様々な影響を与えます。表面上見えないパートですが、結果として見えます。

スクロール

2017年04月11日

埋め込みgoogleMapのホイールスクロールを停止しつつ、必要な...

ゆっくり読みたいのはやまやまなのですが社会人は忙しいので、やむなくサイトのページスクロールをホイ...

コーディング

牧場

2017年02月13日

CSSで背景のみをぼかす方法

今回はCSSで背景画像のみをぼかす方法を紹介します。 ぼかすとなると「 filter: blur();」を使うことは...

コーディング

スマホを見つめる猫

2017年02月06日

iOSでスクロールバーをCSSのみで表示する方法

iOSではスクロールバーが表示されません。 通常のブラウジングでは無意識でWebサイトは縦にスクロール...

コーディング

マグロの握り

2017年02月03日

GIFアニメーションを使用せずにloadingのアニメーションを実...

JSの読み込みや大きなサイズの画像の読み込みの際に一時的に表示するローディングのアニメーションです...

コーディング

噴水のある広場

2016年12月30日

CSS animationを制御しする@keyframesの使い方

サイトにローディング表示や動きが必要な際にプログレスバーや回転アイコンを表示することがありますが...

コーディング

地球儀を指さす教師

2016年11月07日

Google Mapの埋め込みコードでマウスホイールのスクロールを...

Webサイトに地図を表示するのにGoogle Mapは非常に便利です。Google Mapで表示したい場所の住所を検索し...

コーディング

ブラインドタッチ

2016年10月24日

CSSの属性セレクタを使いこなして効率よくコーディングしよう

CSSはセレクタを使いこなすことで効率よくスタイルを指定することができます。使う機会はそれほど多くな...

コーディング

スマホを2台同時使用

2016年10月12日

リッチな表示でSNSを拡散するためのOGP設定

シェアボタンに必須の設定OGPとは blogやサイトに設置するSNSへのシェアボタン。これらにはOGPの設定...

コーディング

鉄骨天井jの駅

2016年10月05日

高さが不定な要素の天地中央に画像やテキストを配置するcss

レスポンシブサイト制作で頻出する天地中央に配置したい問題を簡単に解決できるかもしれないテクニック...

コーディング

壁越しにのぞき込む男性

2016年09月15日

2カラムのスマホサイトで片側だけ可変の横幅にする方法

レスポンシブサイトではwidthをパーセントで指定することは珍しくありません。ですがどうしても片側だけ...

コーディング

あっかんべする女の子

2016年09月14日

レスポンシブ対応でサムネイルサイズを固定してテキストを右...

See the Pen thum+txt03 by tetsuro (@tetsuro) on CodePen. 知っていると簡単ですが、知らないとな...

コーディング

絵具のパレット

2016年09月08日

CSS などのカラーコードをわかりやすく表示するAtomパッケー...

スタイルシートを記述する際に、色を16進数のカラーコードで指定するのは一般的です。ですが数字の文字...

コーディング

フォークにからまるパスタ

2016年09月01日

ソースコードを綺麗にしてくれるatomパッケージ「atom-beauti...

atomというエディターを使っていると「パッケージ」という機能がとても便利です。自分の使いやすいよう...

コーディング

あっかんべする女の子

2016年08月31日

CSSだけで作成する画像にテキストを重ねるあしらい

See the Pen thum+txt01 by tetsuro (@tetsuro) on CodePen. 今回はWebサイトのよくあるあしらいの...

コーディング

扇状に並べたトランプ

2016年08月10日

for文とwhile文、ループ処理とその使い分け

wordpressやjavascriptのコーディングをしていると、同じブロックを複数回繰り返し表示したいことがあり...

コーディング

眉間に皺をよせる男性

2016年08月08日

TransmitMailでページ下部へのフォーム設置を実現する方法

TransmitMailはPHPで動作するシンプルな汎用メールフォームシステムです。 導入が簡単で細かい調整も融...

コーディング

道しるべ

2016年08月04日

条件分岐の基本形、javascriptでのif文の書き方

wordpressやjavascriptで頻出利用する条件分岐タグについて、最近業務でまとまって利用することがあった...

コーディング

計算機とメモ書き

2016年07月21日

jQueryやwordpressでよく使う演算子について

jQueryやwordpress、phpなどを記述する際に使われる演算子。主に条件分岐などで使われるこれらは、前後...

コーディング

ムーディーなステーキハウス

2016年06月23日

見やすくするための一工夫！レスポンシブでのtableの扱い

項目の多いテーブルをスマホで見ると・・・ 概要ページや情報のまとめをページに載せる際、tableでの表...

コーディング

美しいネイルの女性の手

2016年04月21日

古いブラウザ対策に必須の設定！ベンダープレフィックスの記...

ベンダープレフィックスは先行実装機能に対するリスクヘッジ CSS3で採用予定の機能が各ブラウザで先...

コーディング

関連記事

地図の梅にメガネが乗っている画像

2020年1月28日
複数アイコンやルート記述など便利機能で手軽にカスタムでき...

Pinterest風レイアウトのイメージ

2019年8月7日
jQuery MasonryでPinterest風グリッドデザインを実現する

jQueryなしで簡単にスクロールにあわせて追従してくるナビゲーションのアイキャッチ画像

2019年6月14日
jQueryなしで簡単にスクロールにあわせて追従してくるナビゲ...

Archive

キーワード

WEBSITE DESIGN REQUEST

ホームページ制作・リニューアルの
ご相談はお気軽に

TEL 06-6537-9941 平日 9：00〜19：00

〒550-0012 大阪府大阪市西区立売堀2-5−41

ホームページ制作を相談する