HTML・コーディング

実務で通用するスキルを身につけたい人にお勧め -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

HTMLとCSSを真剣に学びたい人におすすめ！ 実務レベルの知識やテクニック、考え方がよく分かる解説書 -HTML/CSSブロックコーディング

2022/12/19(Mon) 08:58

HTMLとCSSの実務に役立つ知識やテクニック、考え方を学びたい人にお勧めの解説書を紹介します。デザイナーから渡されたモックアップを元に、情報の構造やデザイナーの意図を読み解き、コンテンツをブロックに分解し、コーディングの方針を検討し、HTMLのマークアップでどのように構造を設計し、CSSでスタイルする際に気をつけることなど、各ステップごとに詳しくていねいに解説されています。

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

HTMLが強みになる解説書、アクセシビリティやユーザビリティに配慮したコーディングを学べる -武器になるHTML

2022/12/05(Mon) 08:57

Webページを実装する際に重要なのは、HTMLです。しっかりと確かなHTMLが書けないと、CSSやJavaScriptにも影響を与えてしまいます。HTML Living Standardに基づいた知識、アクセシビリティやユーザビリティに配慮したコーディングを学べる、HTMLのみに特化された解説書を紹介します。

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

HTMLだけでスマホのカメラにアクセスできるの知ってた？ 前面・背面カメラにアクセスできるHTMLのcapture属性

2022/09/26(Mon) 08:53

HTMLだけでスマホやタブレットのカメラにアクセスできる、HTMLのcapture属性を紹介します。私はこの属性を知らなかったのですが、実際にiPhoneとiPadで試してみたところ、前面カメラにも背面カメラにもアクセスできました。JavaScriptなどは必要なく、簡単なHTMLでできます。

https://coliss.com/articles/build-websites/operation/work/html-capture-attribute.html

レスポンシブの確認が簡単に！ iPhone, iPad, Androidなど各モデルのサイズ、操作や動画にも対応した優れもの -モバイルシミュレーター

2022/08/05(Fri) 09:02

iPhoneをはじめ、PixelやGalaxyのAndroidスマホ、iPadやGalaxyのタブレット、ラップトップ、ワイドスクリーンなど各モデルのサイズでWebページを表示して確認ができるChromeの機能拡張を紹介します。

https://coliss.com/articles/build-websites/operation/work/mobile-simulator-for-responsive.html

HTMLとCSSの人が、Reactを学ぶのにぴったりな最高の一冊！ 解説がていねいで、すごく分かりやすい

2022/08/01(Mon) 08:56

HTMLとCSSだけではキャリアアップの限界を感じている、JavaScriptを今より使えるようになりたい、Next.jsやReactも気になるけどどこから手をつければよいか分からない、そんな人にお勧めの解説書を紹介します。

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

imgタグのwidthとheightを省略したらダメ！ 画像によるレイアウトシフトを回避する最近登場した2つの優れた解決方法

2022/07/22(Fri) 09:24

レイアウトシフトとは、Webページがロードされる時に画像のスペースが確保されず、画像が表示された時にその分レイアウトがずれてしまうことです。このレイアウトシフトを回避するために10年以上もの間、アスペクト比を手動で適用する必要がありました。しかし、現在ではそんな馬鹿げたハックは必要ありません。最近登場した2つの優れた解決方法を紹介します。

https://coliss.com/articles/build-websites/operation/work/avoiding-img-layout-shifts.html