MD-Blog_Search

独学でプログラミングを学んで、フリーランスを経て制作会社にジョインしたマークアップエンジニアの道のりとは？

FigmaやXDのデザインをコードへ変換できるコード自動生成プラグイン「Locofy」！ 制作の流れやポイントをWebデザイナーがご紹介します。

aタグ？ span？ パンくずリストのマークアップについて多角的視点で考察してみる。

Web制作における基本スキルのひとつ「SEOの内部対策」。元Webマーケターのクリエイターが、誰でもすぐに意識して実践できるポイントを5つご紹介します。

ミニマムでシンプルな静的サイトジェネレーター「Eleventy」を試してみよう！　インストールから複数ページの出力までHow toをご紹介します。

アクセシビリティに配慮したインクルーシブなHTMLマークアップを実践するシリーズ。第３回は状態に応じたaria-hidden, aria-expandedを紹介します。

アクセシビリティに配慮したインクルーシブなHTMLマークアップを実践するシリーズ。第2回は実際の操作を意識したrole属性、aria属性の実装を行ないます。

アクセシビリティに配慮したインクルーシブなHTMLマークアップとは？　グローバルメニュー的なナビゲーションを例に挙げて解説します。

知っているようで実は曖昧な「ウェブアクセシビリティ」の基本をおさらい

効率性重視でラクしたいマークアッパーの時短テンプレート

A.I.時代の本格的な到来に危機感を抱くマークアップエンジニアが、キャリアアップ・キャリアパス（≒「サバイブ」）の方向性を考察してみました。

「ブラウザでの見た目そのままで印刷したい！」という、まれによくあるクライアントからのご要望。SVGは？　PNGは？　IEでは？　かんたんそうに見えて意外と厄介なこの課題に、マークアッパーが挑む！

最近よく見かけるカミナリアイコン、その正体が「AMP」（Accelerated Mobile Pages）。スマートフォン向けモバイルサイトを爆速にするこの仕組みをWordPressに適用するには？　MDのWP担当大臣ことmioが解説します。

途中で引き継いだ案件にスタイルガイドがあれば！ってマークアップエンジニアなら誰しもが思う近頃の事案。なら作ってみればいいじゃない、というわけで、「aigis」で作ってみました。

遅れてきたルーキーことオーサリング／マークアップエンジニアのOhkiが、MS製のコードエディタ「Visual Studio Core」に乗り換えてみた！　ブームを先取るこのベータ版、自分好みに環境をカスタマイズするポイントをご紹介します。

「私だってぐにゃっとさせたい！」SVGを簡単な記述で効果的に動かせるSnap.svgを使って、ぐにゃっとしたアニメーションを作ってみました。

対象ブラウザ限定ではあるけれど、ジャギらずキレイに表示できる「SVG」でアニメーションを作ってみよう！

スマートフォン向けWebサイトの制作につきまとう「軽量化」の宿命。HTMLやCSSなどフロントサイドで施せる実践テクニックをまとめてみました。

"黒い画面"（コマンドプロンプトやターミナル）に理由なき恐怖心を覚えるWebクリエイターでも大丈夫！　CSSを効率的に使いこなす「Sass」、そのインストール＆設定を実践してみます。

Sass初心者必見！　便利なんだけどイマイチどれを使っていいかわからない、「extend（継承）」「mixin（ミックスイン）」「function（自作関数）」について比較してみます。