#朝までマークアップ　フォローアップsp

2023年11月に開催し、好評いただいた #朝までマークアップ から3セッションをロングバージョンでお届けします。

• 当日参加できない方には、 アーカイブ視聴（有料）をご用意しています。
• アーカイブ視聴チケットはスライドやサンプルファイルなどの特典付きです。

当日の視聴は無料ですので、お早めに参加登録なさってください！

アーカイブの視聴方法は、終了後、数日内にメールにて連絡します。

イベント概要

YouTube Liveにてライブ配信します。当日の視聴は無料です。

• イベント名：#朝までマークアップ フォローアップsp
• 開催日：2023年12月12日[火] 21:00-23:00（20:30から予備配信開始）
• 形式：オンライン（YouTube Live）
• 参加費：当日の視聴は無料（参加登録が必要）
• ロゴ制作：モンブラン
• テーマソング：ロックオン柳田
• MV制作：オクモト、この、おかしん、ニワダイスケ
• 主催：CSS Nite
• 共催：DTP Transit
• 協賛：フォントワークス、Webフォント・サービス FONTPLUS、KDDIウェブコミュニケーションズ、文賢（ブンケン）、foriio - すべてのクリエイターにポートフォリオを、ウェブライダー、ゴンウェブイノベーションズ、un-T factory!、ヘルツ、コンセント、トゥーアール（to-R）、LINICA、サービシンク

配信URL

YouTube Liveでライブ配信します。

• https://youtube.com/live/1xfjlOveWqg

予期せぬトラブルで配信URLを変更することがあります。その場合にはX（Twitter）にてお知らせします。

お申し込みと参加費

参加にはお申し込みが必要です。終演時刻まで受け付けています。

• 当日の視聴のみ：無料
• アーカイブ視聴を含む：
  • 2,200円（終演時刻まで、カード決済）
  • 2,530円（開催の3日前まで、銀行振込）
  • 3,000円（後日のお申し込み）※note
  • 11,000円（会社として申し込み、社内で共有）

「無料」のチケットから「アーカイブ視聴を含む」のチケットに切り替えるには、いったん、ご自身でキャンセルしてから再度、お申し込みください。終演時刻まで可能ですが、ギリギリだと決済が間に合わないことがあるため、余裕を持ってお願いします。

• 銀行振込は照合の手間が発生するため、金額が異なります。なるべくカード決済にてお願いします！
• アーカイブはnoteでもお申し込みいただけますが、終演まではDoorkeeperの方が1,000円安いです。

インボイス対応の領収書

インボイス対応の領収書は開催翌日にダウンロード方法をメールにてご案内します。

詳しくは、こちらのnoteをご覧ください。

アンケート、CommentScreen、UDトークのURLなどについて

Doorkeeperにログインし、日付の下に記載されているURLからリンクしているNotionに掲載しています。

• アンケート
• CommentScreen（画面にスタンプを送る）
• UDトーク（リアルタイムの文字情報）

オンラインセミナーに関して（方針やスタイルなど）

noteにまとめていますので、ご一読ください！

• DTP Transit（およびCSS Nite）のオンラインセミナーに参加される方へ

アーカイブ動画について

• 終了後、数日内にセッションごとに切り出した動画のURLをご案内します。
• 配信したURLとは別です。
• アーカイブ視聴期限はありません。基本的に永久に見れます。

セッションと出演者（順不同）

次の3セッションで構成します。

• 脱初心者！　開発者ツール（DevTools）を使いこなそう！／相原 典佳 @noir44_aihara
• コピペ要らずでCSSを反映！Figma for VS Codeを使ってみよう／長谷川 喜洋 @hiro_ghap1
• もう迷わない！アクセシビリティのためのHTMLコーディング／ゆうてん @cloud10designs

脱初心者！　開発者ツール（DevTools）を使いこなそう！

マークアップエンジニアならば、日常的にさわるツールの一つが開発者ツール（DevTools）です。でも、初心者だと、どのように使っていいのか分からなかったり、「なんとなく」で使っていたり、などとなってしまいがちです。

そこで、このセッションでは「脱初心者」と題して、Google Chromeの開発者ツールを使うことで、コーディング初心者さんがよくハマりやすい「こんなことに困った」ケースと、それらを開発者ツールで解決する方法を紹介します！

※今回は、#朝までマークアップ のセッションをより詳細に深掘りします。

コピペ要らずでCSSを反映！Figma for VS Codeを使ってみよう

アドビによる買収発表、XDのメンテナンスモード（新規開発の停止）発表以降、Figmaのデザインカンプからのコーディングが増えてきたのではないでしょうか。

「Figma上で表現できることは、CSSで表現できる」のがFimgaの強みです。

このセッションでは、公式プラグインであるFigma for VS Codeを用いて、効率よくコーディングする方法を紹介します。

Figma上で表現された内容が、コピペすらせずにCSSとして反映される様子をご覧ください。

もう迷わない！アクセシビリティのためのHTMLコーディング

最近「アクセシビリティ」や「WAI-ARIA」という名前を目にすることが多くなったと思います。しかしコーディングでは何をしたらいいのか、どんな勉強をしたらいいのか、どんなツールを使ったらいいのかわからないという方いらっしゃいませんか？

今回はそんなお悩みを解決します。明日から取り組めることたくさんあります。迷わず、安心してコーディングできる情報をお届けします。