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
930
脳内マークアップのススメ
2017-02-18 名古屋マークアップ勉強会
@kobatatakayuki - Takayuki Kobata
kobatatakayuki
February 18, 2017
Tweet
Share
More Decks by kobatatakayuki
See All by kobatatakayuki
Webアクセシビリティ脳のつくりかた
kobatatakayuki
0
840
アクセシビリティのあれこれ 〜まずは、意識することから始めよう〜
kobatatakayuki
0
860
ディレクターは「準備」と「調整」がすべて! 〜制作現場の「もやもや」を吹き飛ばそう〜
kobatatakayuki
0
300
【LT大会Vol3】a-blog cmsのススメ
kobatatakayuki
0
390
Other Decks in Technology
See All in Technology
SEQUENCE object comparison - db tech showcase 2025 LT2
nori_shinoda
0
280
[ JAWS-UG千葉支部 x 彩の国埼玉支部 ]ムダ遣い卒業!FinOpsで始めるAWSコスト最適化の第一歩
sh_fk2
2
150
データ基盤からデータベースまで?広がるユースケースのDatabricksについて教えるよ!
akuwano
3
160
関数型プログラミングで 「脳がバグる」を乗り越える
manabeai
2
220
クラウド開発の舞台裏とSRE文化の醸成 / SRE NEXT 2025 Lunch Session
kazeburo
1
450
CDK Toolkit Libraryにおけるテストの考え方
smt7174
1
450
CDKTFについてざっくり理解する!!~CloudFormationからCDKTFへ変換するツールも作ってみた~
masakiokuda
1
200
Claude Code に プロジェクト管理やらせたみた
unson
8
4.9k
ソフトウェアテストのAI活用_ver1.25
fumisuke
1
560
AWS CDKの仕組み / how-aws-cdk-works
gotok365
10
890
Four Keysから始める信頼性の改善 - SRE NEXT 2025
ozakikota
0
220
ビジネス職が分析も担う事業部制組織でのデータ活用の仕組みづくり / Enabling Data Analytics in Business-Led Divisional Organizations
zaimy
1
310
Featured
See All Featured
For a Future-Friendly Web
brad_frost
179
9.8k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
331
22k
Side Projects
sachag
455
42k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
We Have a Design System, Now What?
morganepeng
53
7.7k
How STYLIGHT went responsive
nonsquared
100
5.6k
Testing 201, or: Great Expectations
jmmastey
43
7.6k
Making the Leap to Tech Lead
cromwellryan
134
9.4k
Fashionably flexible responsive web design (full day workshop)
malarkey
407
66k
Optimizing for Happiness
mojombo
379
70k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
50
5.5k
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