WebPとは？その特徴と実装方法
UPDATE : 2024.06.06こんにちは。コーダーの兼山です。 WebPはGoogleが開発した画像フォーマットで、従来のJPEGやPNGよりも高品質かつ小さいファイルサイズを実現します。 これにより、ウェブサイトの読み込み速度が向上し、ユーザー体験が向上します。 この記事では、WebPのメリ...
兼山 暖美
エンジニア
全国対応！外注・下請けのホームページ制作会社をお探しの会社様。
人員リソース不足、技術不足でお困りなら外注・下請け専門のランランドにお任せ下さい
Web Blog WEBブログ
CSSで画像やコンテンツを左右反転させる方法
UPDATE : 2023.04.14こんにちは。コーダーの兼山です。 画像やコンテンツを左右上下に反転させる方法を紹介します。
兼山 暖美
エンジニア
テーブルの行や列を固定しスクロールする方法
UPDATE : 2023.02.22こんにちは。コーダーの兼山です。 テーブルをモバイル画面などの小さな範囲で表を見せる際に役立つ、行や列を固定してスクロールさせる方法を紹介します。
兼山 暖美
エンジニア
スクリプトで作るシンプルなカウント
UPDATE : 2023.01.15こんにちは。コーダーの兼山です。 今回は、ECサイトのタイムセールや、数値を強調するサイトなどで使える、動きのあるカウントの作り方を紹介します。
兼山 暖美
エンジニア
お知らせなどの記事一覧をコーディングする際に便利な技を紹介します！
UPDATE : 2022.12.21こんにちは。コーダーの兼山です。 お知らせなどの記事一覧をコーディングする際、 記事タイトルやお知らせテキストなど、レイアウトのバランス上、文字数を制限したい場合に指定した文字数以上のテキストを非表示にしたり、 画像を指定する際、どのようなバランスの画像でも指定範囲内...
兼山 暖美
エンジニア
CSSでテキストにグラデーションや背景を設定する方法
UPDATE : 2022.10.18こんにちは。コーダーの兼山です。 コーディングでのテキストの装飾は、基本的なフォント指定以外では画像で処理するのが一般的でした。 現在は、いくつかのプロパティを使用することで、CSSだけでも簡単にテキストへグラデーションや背景を装飾することができます。 今回は...
兼山 暖美
エンジニア
スライダー(slick)のドットをプログレスバーにする方法
UPDATE : 2022.08.29こんにちは。コーダーの兼山です。 スライダープラグインの設置をする機会は多く、加えてドットのデザインを変更することもあると思います。 今回は、数あるスライダーの中でも凡庸性の高い「slick」を使用したスライダーのオプションのドットを利用して、次のスライド切り替えまでの...
兼山 暖美
エンジニア
ブロック要素や画像を境にテキストの文字色を変える方法
UPDATE : 2022.06.30こんにちは。コーダーの兼山です。 最近、ブロックの境界を跨いだテキストを、ブロックに重なる部分、そうでない部分で異なる文字色を指定するデザインのコーディングをする機会があり、その際に役に立った手法を紹介します。
兼山 暖美
エンジニア
テキストエリアのリサイズをCSSで制御する方法
UPDATE : 2022.05.13こんにちは。コーダーの兼山です。 フォーム要素のテキストエリアの領域の拡大、縮小などのリサイズをCSSで制御する方法を紹介します。
兼山 暖美
エンジニア
画像を比較表示するjQueryプラグイン「twentytwenty.js」のご紹介
UPDATE : 2022.01.03こんにちは。コーダーの兼山です。 今回はドラッグで左右の比較表示ができるjQueryプラグイン「twentytwenty.js」を紹介します。 設置も簡単で、PC、スマホの両方に対応できるプラグインです。
兼山 暖美
エンジニア
