Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
脳内マークアップのススメ
Search
kobatatakayuki
February 18, 2017
Technology
1
940
脳内マークアップのススメ
2017-02-18 名古屋マークアップ勉強会
@kobatatakayuki - Takayuki Kobata
kobatatakayuki
February 18, 2017
Tweet
Share
More Decks by kobatatakayuki
See All by kobatatakayuki
Webアクセシビリティ脳のつくりかた
kobatatakayuki
0
850
アクセシビリティのあれこれ 〜まずは、意識することから始めよう〜
kobatatakayuki
0
870
ディレクターは「準備」と「調整」がすべて! 〜制作現場の「もやもや」を吹き飛ばそう〜
kobatatakayuki
0
310
【LT大会Vol3】a-blog cmsのススメ
kobatatakayuki
0
400
Other Decks in Technology
See All in Technology
はじめてのOSS開発からみえたGo言語の強み
shibukazu
3
960
会社紹介資料 / Sansan Company Profile
sansan33
PRO
6
380k
Autonomous Database - Dedicated 技術詳細 / adb-d_technical_detail_jp
oracle4engineer
PRO
4
10k
下手な強制、ダメ!絶対! 「ガードレール」を「檻」にさせない"ガバナンス"の取り方とは?
tsukaman
2
460
テストを軸にした生き残り術
kworkdev
PRO
0
210
バイブスに「型」を!Kent Beckに学ぶ、AI時代のテスト駆動開発
amixedcolor
2
580
Django's GeneratedField by example - DjangoCon US 2025
pauloxnet
0
150
要件定義・デザインフェーズでもAIを活用して、コミュニケーションの密度を高める
kazukihayase
0
120
Webアプリケーションにオブザーバビリティを実装するRust入門ガイド
nwiizo
7
880
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
10
75k
実践!カスタムインストラクション&スラッシュコマンド
puku0x
0
510
人工衛星のファームウェアをRustで書く理由
koba789
15
8.2k
Featured
See All Featured
We Have a Design System, Now What?
morganepeng
53
7.8k
Site-Speed That Sticks
csswizardry
10
820
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Agile that works and the tools we love
rasmusluckow
330
21k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
113
20k
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.7k
Done Done
chrislema
185
16k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
33
2.4k
4 Signs Your Business is Dying
shpigford
184
22k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.6k
Transcript
ϚʔΫΞοϓͷεεϝ 2017-02-18 ໊ݹϚʔΫΞοϓษڧձ @kobatatakayuki - Takayuki Kobata
10ؒ
ࣗݾհ
None
খാλΧϢΩ גࣜձࣾΞφάϥϜϫʔΫε CKO / γχΞςΫχΧϧσΟϨΫλʔ
ΞδΣϯμ • ϚʔΫΞοϓͱ • ϝϦοτ • ཁૉͷࢠؔΛΔ • HTML7ͭͷجຊߏཁૉ •
࣮ફํ๏ • ·ͱΊ
ΞδΣϯμ • ϚʔΫΞοϓͱ • ϝϦοτ • ཁૉͷࢠؔΛΔ • HTML7ͭͷجຊߏཁૉ •
࣮ફํ๏ • ·ͱΊ
ීஈίʔσΟϯάΛ͞ΕͯΔ ํ͍Βͬ͠Ό͍·͔͢ʁ
ϚʔΫΞοϓͬͯฉ͍ͨ ͜ͱ͋Γ·͔͢ʁ
಄ͷதͰ จॻΛߏԽ ͍ͯ͘͜͠ͱ
͍ΘΏΔ ໝͰ͢w
ΞδΣϯμ • ϚʔΫΞοϓͱ • ϝϦοτ • ཁૉͷࢠؔΛΔ • HTML7ͭͷجຊߏཁૉ •
࣮ફํ๏ • ·ͱΊ
ϝϦοτ • ಄ͷதͰίʔσΟϯά͕Ͱ͖ΔΑ͏ʹͳΔ • ͦΖΜͰݴ͏ɺ҉ࢉͱಉ͡ • จॻߏͷߟ͑ํ͕ʹͭ͘ • ͍ͭͰͲ͜ͰͰ͖Δʂ •
Ҋ݅Ͱ͑ɺઃܭਤʹͳΔ • ίʔσΟϯά࣌ͷޮԽʹܨ͕Δ • ৽ਓڭҭʹ࠷దʂ • ฐࣾͷݚमϓϩάϥϜʹΈࠐΜͰ·͢
४උ 8ׂɺ࣮ 2ׂ
ࣄલ४උʹͲΕ͚ͩ࣌ؒΛ ͑Δ͔͕ɺίʔσΟϯάʹ͓ ͚ΔޮԽͷ伴ͱͳΔ
ΞδΣϯμ • ϚʔΫΞοϓͱ • ϝϦοτ • ཁૉͷࢠؔΛΔ • HTML7ͭͷجຊߏཁૉ •
࣮ફํ๏ • ·ͱΊ
HTML4.01࣌ͷϒϩοΫཁ ૉͱΠϯϥΠϯཁૉͷ֓೦Λ ͓ͬͯ͘
ਆ࡚ઌੜͷ͘͝؆୯ͳHTML ͷઆ໌ඞಡ ࢀߟɿ͘͝؆୯ͳHTMLͷઆ໌ -- ཁૉλΠϓҰཡʢ֎෦ϦϯΫʣ
None
DTDΛಡΊΔਓಡΜͰΈͯ ͍ͩ͘͞ɻ ࢀߟɿHTML 4 Document Type Definitionʢ֎෦ϦϯΫʣ
None
ΞδΣϯμ • ϚʔΫΞοϓͱ • ϝϦοτ • ཁૉͷࢠؔΛΔ • HTML7ͭͷجຊߏཁૉ •
࣮ફํ๏ • ·ͱΊ
·ͣ7ͭͷཁૉ͚ͩʂ
1. ݟग़͠ʢϒϩοΫཁૉʣ 2. ςΩετʢϒϩοΫཁૉɾΠϯϥΠϯཁૉʣ 3. ϦετʢϒϩοΫཁૉʣ 4. දΈʢϒϩοΫཁૉʣ 5. ը૾ʢΠϯϥΠϯཁૉʣ
6. ϦϯΫʢΠϯϥΠϯཁૉʣ 7. άϧʔϓԽʢϒϩοΫཁૉɾΠϯϥΠϯཁૉʣ
ϚʔΫΞοϓύζϧͷΑ͏ ͳͷ
7ͭͷجຊߏཁૉΛ͍͜ ͳͤɺίϯϙʔωϯτઃܭ ʹཱͭ
ΞδΣϯμ • ϚʔΫΞοϓͱ • ϝϦοτ • ཁૉͷࢠؔΛΔ • HTML7ͭͷجຊߏཁૉ •
࣮ફํ๏ • ·ͱΊ
1. ͓ؾʹೖΓͷαΠτΛΩϟϓνϟ͠ɺϓϦϯτΞτ 2. ϨΠΞτߏΛܬޫϖϯͰғ͍ͬͯ͘ 3. ֤ཁૉΛݟ͚ͭͯߏԽ͍ͯ͘͠ 4. id໊ɺclass໊Λ༩͍ͯ͘͠ 5. ը૾͕͋Δ߹ɺϑΝΠϧ໊Λهࡌ͍ͯ͘͠
6. font-sizeɺcolorɺmarginɺpaddingɺbackground͜ͷ࣌ ʹݕ౼͓ͯ͘͠ 7. ࣮ɺ͜Ε͕࣮ࡍʹίʔσΟϯά͢ΔࡍͷઃܭॻͱͳΔ 8. αΠτશମͰͳͯ͘ɺύʔπ͝ͱʹϚʔΫΞοϓ͢Δͷ OK 9. ͱʹ͔͘ɺΛ͜ͳ͢͜ͱ 10. ͜Ε͕ܦݧͱͳΓɺ࣮ફʹ׆͖͖ͯ·͢
ΞδΣϯμ • ϚʔΫΞοϓͱ • ϝϦοτ • ཁૉͷࢠؔΛΔ • HTML7ͭͷجຊߏཁૉ •
࣮ફํ๏ • ·ͱΊ
1. ϚʔΫΞοϓͱɺ಄ͷதͰจॻΛߏԽ ͍ͯ͘͜͠ͱ 2. HTML4.01࣌ͷϒϩοΫཁૉͱΠϯϥΠϯཁ ૉͷ֓೦Λ͓ͬͯ͘ 3. ·ͣ7ͭͷཁૉ͚ͩʂ 4. ࣮ફ͋ΔͷΈʂ
PR
ϑϩϯτΤϯυ͔ΒWebͷະདྷΛߟ͑Δձ http://frontend-x.github.io/
Thank you! http://www.kobatatakayuki.com @kobatatakayuki