LogoMark.png

宇都宮楓/Webデザイン演習 の変更点


#author("2026-07-14T17:12:01+09:00","default:member","member")
#author("2026-07-14T17:17:57+09:00","default:member","member")
*宇都宮楓 | &scale(70){Webデザイン演習};
[[Webデザイン演習]]
~
**HTML
-HTMLの練習:[[html_sample_01>https://utsunomiyak.github.io/html_sasmple01/]]※Github
-<p>:  [[html_sample_02>https://utsunomiyak.github.io/html_sample02/]]
-<h1>~<h6>[[html_sample_03>https://utsunomiyak.github.io/html_sample03/]]
-<ul><ol><dl>:[[html_sample_04>https://utsunomiyak.github.io/html_sample04/]]
-<a>:[[html_sample_05>https://utsunomiyak.github.io/html_sample05/]]
-<table>:[[html_sample_06>https://utsunomiyak.github.io/html_sample06/]]
-<img>:[[html_sample_07>https://utsunomiyak.github.io/html_sample07/]]
-<audio><video>:[[html_sample_08>https://utsunomiyak.github.io/html_sample08/]]
-<iframe>:[[html_sample_09>https://utsunomiyak.github.io/html_sample09/]]
-Semantic HTML:[[semantic_html>https://utsunomiyak.github.io/semantic_html/]]
&color(red){演習内容をリンク};
~
~
**CSS
-CSSの練習:[[css_sample_01>https://utsunomiyak.github.io/css_sample_01]]
-CSSまとめ:[[css_sample_02>https://utsunomiyak.github.io/css_sample_02/]]
-CSSボックスモデル:[[css_box>https://utsunomiyak.github.io/css_box/]]
-CSS Layout 1(flex):[[layout_sample_01>https://utsunomiyak.github.io/layout_sample_01/]]
-CSS Layout 2(position):[[layout_sample_02>https://utsunomiyak.github.io/layout_sample_02/]]
-CSS Layout 3(grid):[[layout_sample_03>https://utsunomiyak.github.io/layout_sample_03/]]
-Responsive Design 1 (Mobile First):[[responsive_sample_01>https://utsunomiyak.github.io/responsive_sample_01/]]
-Responsive Design 2 (Menu):[[responsive_sample_02>https://utsunomiyak.github.io/responsive_sample_02/]]
~
&color(red){演習内容をリンク};
~
~
**JavaScript
-BLANK FILE:[[javascript_blank>https://utsunomiyak.github.io/javascript_blank/]]
-BASIC SAMPLE 1:[[javascript_sample_01>https://utsunomiyak.github.io/javascript_sample_01/]]
-BASIC SAMPLE 2:[[javascript_sample_02>https://utsunomiyak.github.io/javascript_sample_02/]]
-Swiper:[[javascript_swiper>https://utsunomiyak.github.io/javascript_swiper/]]
-Hamburger Menu:[[javascript_menu>https://utsunomiyak.github.io/javascript_menu/]]
&color(red){演習内容をリンク};
~
~
**最終成果物
***資料
&color(red){サイトマップやワイヤーフレームのデータをリンク};
-サイトマップ
#image(サイトマップ.jpg)
-ワイヤーフレーム
#image(ワイヤーフレーム.png)
~
***公開リポジトリ
&color(red){Githubリポジトリと最終提出物のURLをリンク};
-GitHub:https://github.com/utsunomiyak/portfolio
-Portfolio:https://utsunomiyak.github.io/portfolio/
~
***制作環境
&color(red){制作環境を記載};
-OS:
-Editor:
-Browser:
-OS:macOS Tahoe 26.3.1
-Editor:Visual Studio Code
Browser:Chrome,  Safari,