HTML・コーディング

プレーンなHTMLで、ミニマルなWebサイトを素早く構築できるシンプルなCSSのフレームワーク -Neat CSS

2023/05/17(Wed) 08:54

ポートフォリオやブログ、テキストサイトやシンプルなショップなど、ミニマルなWebサイトを素早く構築できるシンプルなCSSのフレームワークを紹介します。HTMLもシンプルでプレーンなため、実装は簡単です。CSSはそのままでもカスタマイズしても使用できます。もちろん、レスポンシブ対応で、ダークモードもサポートしています。

https://coliss.com/articles/build-websites/operation/css/minimalist-css-framework-neatcss.html

AIでコードを生成！ テキストを入力すると、UI要素やコンポーネントを実装するHTMLとCSSを生成してくれる -AI CODE

2023/04/05(Wed) 09:09

AIは、Web制作にもすごい速さで浸透しそうですね。今までも似たツールがいくつかあったのですが、かなり出来がよいので紹介したいと思います。テキストを入力、たとえば「シンプルでモダンなナビゲーション　アイテムは日本語」と入力すると、そのUI要素を実装するHTMLとCSSを生成してくれるAIツールを紹介します。

https://coliss.com/articles/build-websites/operation/work/text-into-html-and-css-with-ai.html

HTMLにsearch要素が追加されたぞ！

2023/03/30(Thu) 09:04

先週、HTML Living Standardの仕様にsearch要素が追加されました。ブラウザへの実装はまだ先になると思いますが、検索フォームを実装する時は下記のようなHTMLを使用できるようになります。アクセシビリティの面でも率先して使用していきたいですね。

https://coliss.com/articles/build-websites/operation/work/add-the-seach-element.html

Web制作に役立つ超便利ツールが登場！ HTMLやCSSやJavaScriptのさまざまなツールがひとまとめになったツールボックス -He3

2023/03/17(Fri) 09:00

HTMLやCSSやJavaScriptの軽量化・整形、FlexboxやGridやbox-shadowのジェネレーター、各種エンコード・デコード、データの暗号化、ダミーテキスト・ダミーデータ・ファビコン生成、テキスト比較（Diff）など、Web制作に役立つさまざまなツールがまとめて利用できる『He3』を紹介します。

https://coliss.com/articles/build-websites/operation/work/modern-developer-toolbox-he3.html

全部、完全に商用利用無料！ さまざまなデザインが揃ってる、ランディングページ用のHTMLテンプレート -HTMLrev

2023/03/15(Wed) 09:08

プロダクト、サービス、アプリやソフトウェアなどのランディングページ用のHTMLテンプレートを無料でダウンロードできるHTMLrevを紹介します。ランディングページ用のHTMLテンプレートはすべて無料で、商用プロジェクトでも帰属なしで利用できます。

https://coliss.com/articles/build-websites/operation/work/free-landing-page-html-templates-by-htmlrev.html

コピペで簡単！他と差のつくHTML/CSSスニペット30選まとめ

2023/02/27(Mon) 08:55

Webデザインをするとき、どんなデザインや仕掛けを採用したらよいか、迷うというひとも多いのではないでしょうか。今回は印象に残るウェブデザインを表現できる、最新のHTMLスニペットをまとめてご紹介します。

https://photoshopvip.net/144432

実務で通用するスキルを身につけたい人にお勧め -HTML/CSSスキルアップレッスン

2023/02/13(Mon) 09:00

HTMLとCSSは基本的には分かるけど、実装で悩むことがある、自分のやり方が正しいか不安に感じる、応用力が足りてない気がする、初心者を卒業してプロとして大きな一歩を踏み込もうとしている人にお勧めの解説書を紹介します。

https://coliss.com/articles/book-review/isbn-9784798173009.html

divはボタンではない、ボタンの実装について知っておくべきすべてのこと

2023/02/10(Fri) 08:51

クリックできるボタンを実装するとき、HTMLの何をよく使用しますか？buttonタグ、もしくはdivタグ？ divを使用してはいけない理由、buttonを使用するときの注意点、場合によってはaがよい理由を紹介します。

https://coliss.com/articles/build-websites/operation/work/need-to-know-about-buttons.html

2023年最新版: HTMLのheadの書き方、head内に記述する要素の総まとめ

2023/01/26(Thu) 09:02

HTMLページのhead内に記述する最小限の構成、そしてmeta要素やlink要素、ソーシャルサービス用の要素、デスクトップ・スマホのブラウザ用の要素などがまとめられた「HEAD」を紹介します。

https://coliss.com/articles/build-websites/operation/work/html-head-elements.html

便利なのが登場！ 最近見かけるさまざまなUI要素600種類以上をシンプルなHTMLとCSSで簡単に実装できる -UIverse

2023/01/19(Thu) 09:05

Webサイトやスマホアプリでよく使用される、ボタン、カード、検索ボックス、チェックボックス、ローダーなど、HTMLとCSSで実装されたUI要素がオープンソースで利用できるUIverseを紹介します。

https://coliss.com/articles/build-websites/operation/work/open-source-ui-elements-uiverse.html