nao

Webクリエイターです。 2008年に独立起業し、現在は法人です。 デザインからシステ…

nao

Webクリエイターです。 2008年に独立起業し、現在は法人です。 デザインからシステム開発まで一人で可能です。 趣味はCMS作り。

detailsでカンタン！ハンバーガーメニュー

ハンバーガーメニュー。 それは、多くのWebサイトで当たり前のように使われているUIでありながら、未だ専用のHTMLが用意されていない難しい存在。 初期はJavaScriptを使用…

nao
nao
9か月前
6

AIによってコーディングがなくなる

Webページというものが生まれて以来、HTMLコーディングという作業はあり続け、それによって健常者のみではなく、多くの人がWebによる情報発信を受け取ることが可能になって…

nao
nao
10か月前
6

Web業界のUIはちょっとおかしい

UI自体ではなくて、UIという言葉の定義の話。 そもそもUIとは？UIはユーザーインターフェース。 インターフェースは接点ですが、コンピューター界隈においてはユーザーが…

nao
nao
1年前
2

Twitterを通して分かったWeb界隈の今

「Web業界」と「Twitterの中のWeb界隈」は違う・・・。 そんなことが少しわかりました。 WordPress蔓延界隈Twitterを見ていると、CMSとしてWordPressを使っている人・勉強…

nao
nao
1年前
11

borderを使わない三角付き角丸ボックス

三角付き（ふきだし風）のボックスを作るとき、三角部分をどうやって作りますか？ borderの3方向を透明にして三角に見せる方法は昔から使われていますが、記述が複雑ですし…

nao
nao
1年前
6

Web制作が仕事になった日【後編】

こんにちは、naoです。 前回は、ぼくがWebサイトを作りはじめたきっかけについてでした。 今回は仕事としてスタートするまでのお話・・。 液晶工場と印刷会社例のポータ…

nao
nao
1年前
11

疑似要素を使わないスライドボタン

ボタンにマウスが重なると、背景の色がスライドして変化するボタンですが、ネット上に掲載されているものは疑似要素を使うものばかりでしたので、疑似要素を使わないタイプ…

nao
nao
1年前
4

Web制作が仕事になった日【前編】

こんにちは、naoです。 最近Twitterで、Web制作初学者の方と接することが多くて、悩んだり焦ったりする姿を見るに、自分が駆け出しの頃ってどうだったっけ？とふと思い返す…

nao
nao
1年前
10

CSSだけで作る角丸ラインマーカー　（改行対応）

CSSだけで複数行（改行）対応のラインマーカーを引くことができます。 角丸になっているのがポイントです！ <p>「これをお持ちなさい。生憎あいにくマツチを切らしました…

nao
nao
1年前
14
nao

nao

detailsでカンタン！ハンバーガーメニュー

detailsでカンタン！ハンバーガーメニュー

ハンバーガーメニュー。
それは、多くのWebサイトで当たり前のように使われているUIでありながら、未だ専用のHTMLが用意されていない難しい存在。

初期はJavaScriptを使用して出し入れをしていましたが、その後checkboxを使って出し入れをするというトリッキーな技が発明され、ある程度広まりました。
しかし、checkboxの本来の用途とは異なる使い方ですし、CSSが外れるとcheckb

もっとみる
nao

nao

AIによってコーディングがなくなる

AIによってコーディングがなくなる

Webページというものが生まれて以来、HTMLコーディングという作業はあり続け、それによって健常者のみではなく、多くの人がWebによる情報発信を受け取ることが可能になっていました。
近年もコーディングを行うマークアップエンジニアの職はありつづけ、また多くの人が新しくこの職に就いています。
しかし、AIの登場によって、この仕事は消滅する可能性が大きいのです。

直近の未来1、2年のうちに変わるであろ

もっとみる
nao

nao

Web業界のUIはちょっとおかしい

Web業界のUIはちょっとおかしい

UI自体ではなくて、UIという言葉の定義の話。

そもそもUIとは？UIはユーザーインターフェース。
インターフェースは接点ですが、コンピューター界隈においてはユーザーが入力するための仕組みを指しています。
マウスやキーボード、タッチパネルなどがそうで、マンマシンインターフェースともいわれます。

ゲームにおけるUIWeb業界の10年先輩にあたるゲーム業界では、コントローラーなどのハードウェアから

もっとみる
nao

nao

Twitterを通して分かったWeb界隈の今

「Web業界」と「Twitterの中のWeb界隈」は違う・・・。
そんなことが少しわかりました。

WordPress蔓延界隈Twitterを見ていると、CMSとしてWordPressを使っている人・勉強している人が多い・・・というより、WPしか見かけないということに気が付きます。

恐ろしいことに。

どうしてそこまでしてWPばかり使うのか？
どうしてWPさえ勉強すれば仕事がバンバン来ると思って

もっとみる
nao

nao

borderを使わない三角付き角丸ボックス

borderを使わない三角付き角丸ボックス

三角付き（ふきだし風）のボックスを作るとき、三角部分をどうやって作りますか？
borderの3方向を透明にして三角に見せる方法は昔から使われていますが、記述が複雑ですし、何より困ったことがあります。

borderは幅や高さに％が使えない！borderを使った方法では、三角のサイズを決めるborderの幅に％を使うことができないため、幅や高さが可変する場合は使用できません。
無理やり使うためにボッ

もっとみる
nao

nao

Web制作が仕事になった日【後編】

Web制作が仕事になった日【後編】

こんにちは、naoです。
前回は、ぼくがWebサイトを作りはじめたきっかけについてでした。

今回は仕事としてスタートするまでのお話・・。

液晶工場と印刷会社例のポータルサイトを閉じてから、しばらくは液晶モジュール工場のライン管理という仕事をしていました。精密機器の工場ということで、チリひとつないクリーンルーム、歩留まり改善、トヨタ式（カンバン、カイゼン）など、それまで知らなかった様々なことを学

もっとみる
nao

nao

疑似要素を使わないスライドボタン

疑似要素を使わないスライドボタン

ボタンにマウスが重なると、背景の色がスライドして変化するボタンですが、ネット上に掲載されているものは疑似要素を使うものばかりでしたので、疑似要素を使わないタイプをご紹介します。

なぜ疑似要素はダメなのか？疑似要素は<a>要素には使用できますが、<button>要素には使用できません。これではWebサイト内のインタラクションが統一できなくて困る場合があります。

コードですbutton ,a.sl

もっとみる
nao

nao

Web制作が仕事になった日【前編】

Web制作が仕事になった日【前編】

こんにちは、naoです。
最近Twitterで、Web制作初学者の方と接することが多くて、悩んだり焦ったりする姿を見るに、自分が駆け出しの頃ってどうだったっけ？とふと思い返すようになりました。
今回は、〇十年前のことを思い出しながら、どうやって今の仕事につながったのかを書いてみたいと思います。

Welcome to My Homepage!時は1998。
ISDN回線、テレホーダイの時代。
ぼく

もっとみる
nao

nao

CSSだけで作る角丸ラインマーカー　（改行対応）

CSSだけで作る角丸ラインマーカー　（改行対応）

CSSだけで複数行（改行）対応のラインマーカーを引くことができます。
角丸になっているのがポイントです！

<p>「これをお持ちなさい。生憎あいにくマツチを切らしましたから。」<br>お持ちなさいと云ふのは煙草に添へる一番小型のマツチである。<br>「貰ふのは気の毒だ。ぢや朝日あさひを一つくれ給へ。」<br>「何、かまひません。お持ちなさい。」<br>「いや、まあ朝日をくれ給へ。」</p>

HT

もっとみる