コピペで簡単実装OK! ホバーアニメーションボタン集
コピペでOK! ホバーアニメーション集 今回のBAオンラインはコピペで簡単に実装できるホバーアニメーション集です！ 個人的にコーディング作業の中で一番好きなのがこのホバー時のアニメーションだったりします。 一見シンプルなサイトでもぐっと華やかになるのが楽しいところです。 今回はこのホバー時の効果をつけたボタンをいろいろ作ってみました！ ぜひご利用ください♪ 作成時のルール ①サイズはwidth10 […]
UI
Webサイト製作のヒント～長いテキストを省略して表示する
長いテキストを省略して表示したいことってありませんか？ webサイトやwebアプリなどの製作で役立ちそうな情報をまとめている連載、今回はスタイルシートで長いテキストを省略して表示する方法をご紹介します。 「サイズを超えた部分の文字を省略して、サイズに収まる部分だけを表示する」方法で、これがスタイルシートの設定で可能です。 あるサイズの範囲内にテキストを配置したいんだけど、収まらなくなってレイアウト […]
よりぬきBAオンライン～デザインのお話を始めようと思う
朝食のプロテイン飲んでたらお腹急降下！袋を見れば賞味期限が半年前！ギニャー！ 誰かのせいにしたいけど自分の顔しか思い浮かばない！ 取り乱しました。こんにちわ。（紳士的） さて、今回はデザインの話でございます。デザインの話と言いますと、大長編確定になりそうな 業の深い話題ですが、複数回にわたって書き散らかしていこうかと思います。 元記事はこちら デザインのお話を始めようと思う。
Webサイト製作のヒント～スクロールバーを装飾する
はじめに ～ちょっと余談～ 更新が停止して何年も経っているMicrosoft社製webブラウザ「Internet Explorer（以下IE）」のサポート終了まであとわずかです。webサイト製作やwebアプリ開発ではIEでも問題なく閲覧できるようにする為、使うのを控えてきた多くの技術や表現があります。それがサポート終了によって躊躇なく使えるようになるのは大きいですね～！待ってましたって感じです。 […]
デザインのお話を始めようと思う。【第4回】Webデザインのトレンド変遷
Webデザインのトレンド変遷 拝啓、皆様いかがお過ごしでしょうか。 春の足音が聞こえてくる昨今、私の現在の関心事はウクライナ情勢と4月8日の花祭りに二分されております。ウクライナ情勢に関わるサイバー戦争や壮絶な情報戦とか、思うことも多いので今回の記事で書こうかと思いましたが、微妙に私の土俵じゃないのでやめときました。じゃ、花祭りについて。いや、それはチラシの裏にでも書いておこう。 さて本題ですが、 […]
Webサイト製作のヒント～JavaScriptを使わないでON/OFF切替ボタンを作る
webサイト製作に役立つ情報をご紹介します これまで製作してきたwebサイトやアプリで採用したり、 これは使えるかも？便利かも？というような使える情報をこちらでお伝えしてみようと思います。 BAOnlineをご覧頂いている皆様の中にも仕事や趣味でwebサイトを作っていたり、 これから作ってみようかな？とお考えの方もいらっしゃると思いますので、 製作作業のお役に立てたら幸いです。 実践！オンとオフを […]
UI/UXのおはなし～写真の説明は上なの？下なの？戸惑いを解消するスペース(余白)のおはなし
webサイトを見ていてどう見たらいいのか戸惑ったり、 圧迫感感じてもやっとしたことってありませんか？ こんな構成よくありますよね 写真とその写真の説明がセットになっている構成よくありますよね。 なんの写真かパッと見てすぐわかります。 今回はこの構成を例として話を進めていきます。 （季節がら紅葉の写真をチョイスしてみました。） 複数並べてみました 同じ構成の固まりがたくさん並んでたりする事もあります […]
UI/UXのおはなし～ボタンはON？OFF？
業務をする上でいろいろなアプリケーションを触る機会も多いと思いますが、 操作に戸惑ってしまったり、期待してた結果と違っていたりした事ありませんか？ こんなボタン見た事ありませんか？ 出始めた当初、web製作者界隈で何かと話題になったこんなボタンがあります。 ボタンをクリックするとONとOFFが切り替わる切替ボタンです。トグルって呼ばれてます。 実際に動かせますので、触ってみてください。 通知を許可 […]