HTML/CSS│Design Note

2020年6月13日
0件

ドメインを取得するなら毎週金曜日にエックスドメインが一番安い

ドメインを取得する代表的なサービスドメインを取得するサービスといえばここら辺が有名です。どこで購入したとしてもしっかりとした会社なので安心です。エックスドメイン普段エックスサーバーでサイト運用している方も多いのでは無いでしょうか。そんな方には同じサービスで完結できるエックスドメインを使 […]

2020年6月13日
2020年6月13日
0件

なぜBEMはアンダースコア__、またはハイフン–と2個必要なのか

BEMとは何かの詳しい話はせず、簡単にだけ説明します。詳しくはこちらを確認ください。 https://en.bem.info/ BEMを利用する上で、BEMは気持ち悪いと感じる理由の１つ「なぜBEMはアンダースコア（アンダーバー）やハイフンを2つ連続でつける必要があるのか」それに対し、別の少し […]

2020年6月13日
2020年6月13日
0件

アクセシビリティに必要なWAI-ARIAの正しい使い方

WAI-ARIAの役割下記以外にもたくさんの機能がありまるが代表的なカテゴリを紹介。ここにほとんどの物が網羅されており、参考になります ARIAを利用するロール、ステート、プロパティロール（role）この要素の意味を定義する。 ex) role=“navigation”, banners […]

2019年10月13日
2020年7月5日
0件

HTMLメールの作成の仕方と注意点【2020年度版】各企業の状況も調べてみた。

HTMLメールとは HTMLメールとは HTMLタグで作られたメール。表組でレイアウトを変更したり、画像を使ったアピールをしたりできるメールです。また、HTMLメールの場合、開封率がわかり、またテキストメールに比べてクリック率（CTR）や購買率が高いと言われている。逆にテキストメールとは装飾が […]

2019年10月8日
2020年7月5日
0件

「テーブルレイアウト」はなぜだめか、使わない理由を説明できますか？

「テーブルレイアウトはするな」当たり前に言われています、がしかし、実際なぜ使ってはいけないのかを具体的に説明できる人が少ないですなので、その理由と、本当に使ってはいけないのかをまとめてみました。メリット・デメリットメリット崩れづらい昔ながらのタグな故、tableタグで組むと崩れが起きづら […]

2019年7月5日
2020年3月12日
0件

「CSS Modules」or「Scoped CSS」or「Styled Component」

BEMやMCSS、SMACSSとかはもう古い。といっても、正直まだあまり理解指定ない。とりあえずStyled Componentが今人気ということは聞いた。そしてどれもvueやreactで利用する。 CSS Modules vue ファイルで<style module> と記載。装 […]

2019年7月3日
2020年3月12日
0件

コーディング時によく使うツール一覧

私がコーディング時によく使うツールを紹介します。もし「こんなツールもあってよく使っているよ。」というのがあれば教えてください！ autoprefixer nodeでautoprefixerを使っていたが、node.jsを使わないケースでこれを使いたいと感じて探したらツールも提供していた。指定した […]

2019年6月30日
2020年6月13日
0件

リセットCSSのおすすめと非推奨【2020年度版】

リセットCSSはブラウザのデフォルトで設定されたCSSを打ち消してブラウザ間の表示を揃えるためのCSSファイル。新規サイトを作成するとき、コーディングルールを考えるとき、絶対に考えるreset.css。決定版が欲しいところなのでまとめました。実際、毎年大きな差分もなく、古いブラウザの最適化がさ […]

2019年6月19日
2020年3月12日
0件

コーディングガイドラインまとめ【2019年 → 2020年度版】

新規サービス開発や、古びたシステムを担当した時に毎回調べるHTML, CSS, Javascriptのコーディングガイドライン。こちらをまとめてみました。 Javascript google 英語版ですが、Good / Badで例が全パターンまとまっているのでとてもわかりやすいです。これを例にレビ […]

2019年6月7日
2020年3月12日
0件

CSS Modulesとは？

大規模化するCSSの問題点 Christopherは以下をあげています。 1. グローバルネームスペース　-> スタイルはグローバルスコープなので、全てに影響がある。JSでグローバル変数は懸念されるのにCSSは許容されている。 2. 依存性　-> ネストすることによるスコープ。パフォ […]

2019年6月2日
2020年3月12日
0件

javascriptのコメントアウトの記述方法ってまだ必要？

2019年5月3日
2020年3月12日
0件

cssのスタイルガイドライブラリ

はじめに CSSのコメントに書く cssが膨大になるのでミニマイズは必要環境によっては難しいペラ1ページには向かない目的モジュールの一覧化デザインの一貫性新モジュールが追加されたらすぐわかるマークアップのルールがわかる他のコードをパクりやすいスキルや感性に頼らないコーディング種類 […]

2019年5月3日
2020年6月13日
0件

OOCSS、BEM、SMACS、MCSS、FLOCSS、一番良いCSS設計手法はなにか。

一番良いCSSの設計手法とは過去にまとめたCSS設計についての考えをまとめてみた。今は、どういった設計をすべきだろうか。 ReactやVueを使う場面も増えていく環境で、どの設計手法が一番運用しやすいのか。 CSS設計手法の歴史 2009年 OOCSS レイアウトと見た目のclassをわける主 […]

2019年4月29日
2020年3月12日
0件

レスポンシブデザインのメリットデメリット

メリット運用ベースであれば1箇所変えれば全デバイスに対応できるので、更新は楽（記事の内容だけとか） googleがレスポンシブを推奨しているため、SEOに強いらしいスマホファーストな設計ができる端末の大きさに影響されなくなる URLがおなじになるデバイス判定が不要デメリット複雑なサイトに […]

2019年4月27日
2020年3月12日
0件

flexboxの使い方一覧

ツール試せる https://demos.scotch.io/visual-guide-to-css3-flexbox-flexbox-playground/demos/ 親要素 display: flex; flex-direction：子要素の配置方向 row：左から順に。デフォルト。 row […]