概要

2019年内最後の開催となるDIST.30のテーマは、「一歩差がつくCSSテクニック」です。ちょっとした技を知っておくことで、今よりもっとラクに、そして何より楽しくCSSを書けるテクニックやTIPSを、LT10本に詰め込んでお送りします。クリスマスとお正月の足音が聞こえてくる12月は、CSSのLT祭りに全員集合！

LTスピーカー募集！

LTスピーカーの募集は終了しました。ご協力ありがとうございました。

• LTスピーカーを希望される方を広く募集します
  • 時間は5分です
  • 内容は「一歩差がつくCSSテクニック」というテーマにまつわることであれば、TIPS、テクニック、便利なサービスの紹介など何でもOKです（例：オレオレCSS設計、CSS in JSのコツ、CSS超絶技巧、など）
  • LTスピーカーに決定した場合の参加費は無料です
  • 希望者は事前にお申し出いただければ懇親会にも参加可能です（当日実費をお支払いください）
• 希望者は「LT希望枠」からお申し込みください
• お申し込み時のアンケートに連絡先のメールアドレス、タイトル、セッション概要を入力する欄がありますので、必ず入力をお願いします
• 応募者多数の場合、原則として抽選になります
  • タイトル、セッション概要の内容が優れていると主催者側が判断した場合、優先的に当選となる場合があります
  • LT希望枠にお申し込み後、落選して他の枠が埋まっていたとしても、一般参加は可能です
• PCからの映像出力切り替えの手間を省くため、スライドの投影は主催者側で用意したPCで行います
  • そのため、前日までにPDF形式でスライドをご用意いただけることが条件となります

更新履歴

更新日時	内容
12/12 13:25	スピーカー都合によりLT「フォントアニメーションの世界」が中止となり、新たにLT「HTMLとCSSだけでつくるリアルな絵」を追加しました。
12/9 15:50	LTの発表順を決定しました。
11/28 10:33	スタッフ枠を調整し、若干のみ事前決済枠（勉強会のみ）の定員数を増席しました。今度こそ最終増席になりますので、ご了承ください。
11/28 10:25	LT「CSSアニメーションに、なぜtransformを使ったほうが良いのか。」、「CSSがパフォーマンスに与える影響」、「CSSアニメーションの狂気」を追加しました。
11/21 12:05	LT「Google Material DesignのCSS設計をみてみよう！！（仮）」、「継承」を追加しました。
11/21 00:10	LT「レイアウトプリミティブ」を追加しました。
11/20 22:00	LT「フォントアニメーションの世界」を追加しました。
11/20 14:25	LT「アクセシビリティを高めるCSS」、「パフォーマンスを高めるCSS」を追加しました。
11/20 13:48	事前決済枠（勉強会のみ）の定員数を増席しました。以降の増席はありませんので、ご了承ください。
11/16 23:15	事前決済枠（勉強会のみ）の定員数を増席しました。
11/14 10:04	事前決済枠（勉強会のみ）の定員数を増席しました。
11/13 11:52	参加枠の定員バランスを調整しました。
11/13 10:00	イベントページを公開しました。

対象

• 三度の飯よりCSSが好きな方
• 三度の飯の方が好きだけどCSSも好きな方
• いやいや、俺は三食食わないよ、という方（？）
• 学生でWeb制作業界に興味を持っている方

LT一覧（各5分、順不同）

Google Material DesignのCSS設計をみてみよう！！（仮）

株式会社センティリオンシステム SE・プログラマ 山本 康介（YAMAMOTO Kousuke）

Google Material DesignのCSS設計からCSSテクニックを紐解きます。

HTMLとCSSだけでつくるリアルな絵

株式会社ICS インタラクションデザイナー 西原 翼（NISHIHARA Tsubasa）

HTMLとCSSだけを使って、写実的な絵を作る方法です。グラデーションやフィルター、トランスフォームなどを駆使してできるだけリアルな絵を再現する手法を紹介します。

CSSアニメーションの狂気

株式会社オロ、Meguro.css テクニカルクリエイター 中矢 雄介（NAKAYA Yusuke）

狂おしいCSSアニメーションテクニックを紹介。

令和元年ベストのfont-familyはこれだ

株式会社ICS 代表 池田 泰延（IKEDA Yasunobu）

OSやブラウザのアップデートによりウェブサイトのフォントは影響を受けてきました。最近だとiOS 13 Safariでフォントが激太りを起こしたり、macOS CatalinaとChromeの組み合わせで明朝体化するウェブサイトが多発しました。他にも「ＭＳ Ｐゴシック」の呪縛、「游ゴシック」の薄さ問題、アンチエイリアスの変化など問題はつきません。このライトニングトークでは、現代の最適解としてのフォント指定を紹介します。

継承

株式会社まぼろし 代表取締役社長COO 小林 信次（KOBAYASHI Shinji）

colorプロパティを例にもっと継承しようっていう内容です。

レイアウトプリミティブ

シフトブレイン／スタンダードデザインユニット フロントエンドエンジニア 安田 祐平（YASUDA Yuhei）

CSSの性質をうまく利用して実装を単純化するレイアウトプリミティブの考え方について解説します。

アクセシビリティを高めるCSS

株式会社トゥーアール フロントエンドエンジニア 森川 結子（MORIKAWA Yuko）

近年、ウェブ制作者の間でも関心が高まるアクセシビリティ。海外ではアクセシブルでないコンテンツに対する苦情や訴訟なども少なくありません。ウェブアクセシビリティを高める方法はWAI-ARIAだけではありません。スタイルのために適切なマークアップを諦めていませんか？このライトニングトークでは、適切なマークアップとCSSでアクセシビリティを高める方法をお伝えします。

CSSアニメーションに、なぜtransformを使ったほうが良いのか。

株式会社エウレカ フロントエンドエンジニア すぱいす（Spice）

transformを用いると、他の方法よりアニメーションのパフォーマンスが良いです。その理由はブラウザのレンダリングシステムにあります。そのあたりについて解説してみます。

CSSがパフォーマンスに与える影響

パーソルキャリア株式会社 Webディレクター、フロントエンジニア 和田 武（WADA Takeru）

CSSって実際にどれくらいパフォーマンスに影響あるの？パフォーマンスに影響が出そうなパターンの検証結果について発表します。

パフォーマンスを高めるCSS

株式会社メルカリ Software Engineer 泉水 翔吾（SENSUI Shogo）

Webページのパフォーマンスに影響するCSSの話をします。

---

※発表予定順に掲載していますが、当日の都合により前後する可能性があります。あらかじめご了承ください。

参加費

勉強会のみ

1,000円（当日券：一般1,300円、学割500円）

• PayPalによる事前決済、または当日支払いで参加費をお支払いください。
• 当日受付で学生証をご提示いただくと、学割料金でご参加いただけます。
  • ご提示がない場合、一般料金でのご参加となりますので、あらかじめご了承ください。
  • 事前決済、および懇親会参加を含めた学割枠は、今のところありません。

勉強会＋懇親会

5,000円

• 勉強会に加え、着席しての懇親会（4,000円相当のコース料理＋飲み放題）にご参加いただけます。
• PayPalによる事前決済のみとなります。
• 懇親会のみの参加は受け付けていません。
• 懇親会にはアルコールが提供されるため、未成年はご参加いただけません。
• 懇親会は完全禁煙です。
  • 喫煙者/非喫煙者の両者が過ごしやすい空間を作るため、ご協力をお願いいたします。
  • 喫煙時は近隣の喫煙スペースをご利用ください。
  • 懇親会が行われる店舗は喫煙可ですので、他の席からの煙が流れてくる可能性はあります。

事前決済についての注意事項

• 具体的な流れは、PayPalによる事前決済についてをご参考ください。
• 領収書を発行可能です。詳しくはconnpassご利用ガイドをご覧ください。
• キャンセル・払い戻しについては、キャンセルポリシーに従って対応します。

---

• DISTの収支は、すべてGitHub Wikiで公表しています。
• スタッフ枠は、通常参加の方はお使いいただけません。スタッフとして参加希望の方は、公式サイトのお問い合わせフォームよりお問い合わせください。

会場

中野セントラルパーク カンファレンス B1F コンベンションホール（アクセスマップ）

• JR中野駅 北口改札から徒歩5分
• 詳しい道順をご参考ください

タイムテーブル

時刻	内容
18:30～19:00	開場／受付
19:00～19:10	ごあいさつ
19:10～19:45	LT前半パート（5本）
19:45〜19:55	質疑応答
19:55～20:05	休憩
20:05～20:40	LT後半パート（5本）
20:40〜20:50	質疑応答
20:50～21:00	みんなでお片付け／閉場
21:15〜	近隣の店舗に移動して懇親会（懇親会参加の方のみ）

スポンサー

DISTは、以下のスポンサーにご協賛いただいております。

スペシャルスポンサー

ゴールドスポンサー

シルバースポンサー

ブロンズスポンサー

ツールスポンサー

YouTube配信

当日の様子は、開催2ヶ月後を目安にDISTのYouTubeチャンネルで公開予定です。公開不可の箇所やセッションはカットされますので、内容をすべてをご覧になりたい方は、ぜひ当日会場にお越しください。

DISTについて

DISTは、職種や技術の垣根を越えてWebに関わるすべての人を結ぶクリエイティブコミュニティです。有志が非営利で運営しています。

主な活動として、以下の3つをコンセプトとした勉強会を定期開催しています。

• 職種の垣根を越える
• 特定の技術に依存しない
• 今日から現場で使える

注意事項

• 会場のWi-Fi一般開放はありません。
• 動画、写真の撮影を予定しています。撮影NGの方は事前にお申し出ください。
• 主催者、参加者みんなで作り上げる勉強会です。準備や片付けにご協力をお願いします。