記事一覧
ウェブデザイン技能検定を受験した話③
前回、この検定の２級に【実技試験のみ】合格し
筆記試験が不合格だったので、再試験をしてきました。
↓前回の話
今回は筆記試験、いけた!!!!!!!!!!
そして、3/25の合否発表で…受かった!!!!!!!!!!
泣ける…夜勤（子どもの夜泣き対応）しながら
明け方とかにコツコツ勉強した甲斐があった…(;へ;)
前回 不合格となってから勉強方法を少し変えたので
備忘録としてメモ。
（１）
ルビ関連要素（HTML）
以前、「ruby」について こちらの記事で書いたものの（↓）
関連する要素が理解できていなかったので、まとめ。
（１）ruby要素（２）以降の要素の「親」となる要素。
ルビを振るテキストの範囲を表す。
（例）
<ruby>朝寝坊<rt>あさねぼう</rt></ruby>
（２）rb要素Ruby Baseの略で、ruby要素の子要素として使用する。
ルビが難しくない場合は、ruby要素
HTML5で追加されたAPI（HTML）
HTML5で追加されたJavaScriptのAPIについて
虫食いで勉強していたものの、
差分だけでは追いつかない…
アレもコレも知らない…！（焦）
というのが実情だったので、まとめ。
（１）Web Storage これについては、まとめていました↓
（２）File APIJavaScriptで、ユーザのローカル環境保存ファイルを
直接参照、編集できる。
ただし、HTML上の「FileRe
WebStorageについて（HTML）
勉強したはずなのにズッコケた、
Webデザイン技能検定の筆記試験復習シリーズ。
（令和元年度第３回）
HTML5のAPIであるWeb Storageについて。
（１）sessionStorageについて
key-value型のデータ保存形式
データ：ウィンドウやタブを閉じるまで有効
別ウィンドウでのデータ共有：×
ウィンドウ間でデータが共有されることはない。
（２）localS
HTML5のグローバル属性（HTML）
勉強したはずなのにズッコケた、
Webデザイン技能検定の筆記試験復習シリーズ。
（令和元年度第３回）
☆：HTML5.1 ～
★：HTML5 ～
（１）ID・スタイル
①id=""
要素にIDを付ける。
②class=""
要素にクラス名を付ける。
③style=""
要素に直接スタイルシートを指定する。
（２）ユーザビリティ
①title=""
要素に補足情
ウェブデザイン技能検定を受験した話②
先日、こちらの記事を書きましたが
引き続き、この試験の２級を受験してきました。
結果、【実技は合格＋筆記は不合格】で
もうひと頑張り必要なはこびとなりました。
まぁ実技が結構個人的にヘビーだったので
これをパスできただけまだありがたいと思うことにします！
…ということで、２級実技の対策記録。
（１）購入が必要なもの ①Photoshop（必須）
②Dreamweaver
②については
ブロックレベル／インライン要素（HTML）
ブロックレベル要素（Block-Level Elements）見出し・段落・表など、文書を構成する基本となる要素。
一つのブロック（かたまり）として認識される。
ブラウザ表示でも一つのかたまりとして扱われることが多く、
一般的には前後で改行される。
【例】
<address><blockquote><center><div><dl><fieldset><form><h1>-<h6><hr>
自動切り替えバナーの作成（jQuery）
Webデザイン技能検定２級の受験勉強用に、
画像が自動で切り替わるバナーを作った時の備忘録。
（１）htmlファイルを記述<!DOCTYPE html><html language="ja"><!-- 文字コードセット --><meta charset="utf-8"><!-- ヘッダ情報 --><head> <!-- jQuery情報 --> <script type="text/ja
「lowercase」警告の解消（VSCode）
Angularを使って書いたHTMLソース内で「ngModel」を記載すると、
「小文字で書きなさい」的な警告文が出ている。
（一応、警告を無視しても正しく動作する。）
「[(ngModel)]」を「[(ngmodel)]」として書きなさい、ということなんだけれど
いや、小文字にするとコレ動かないし。
ということで、プラグインに「小文字にしなさい」を
「false」設定にする一文を追記。
双方向データバインディング（Angular）
まだまだ全然分かっていないけれど、双方向データバインディング（ngModel）をやってみたいと思ったのでggりながら実装。
今回は、Input要素に入力した内容を画面に反映する
仕組み。
（完成形は、TodoListとして使えるように入力内容を
画面にどんどん追加表示したい。）
１）tsファイルへインポート情報を追記双方向データバインディングのために「app.module.ts」ファイルに
ウェブデザイン技能検定を受験した話
先日、この試験の３級を受験してきました。
自分が今まで受けた資格試験とは少し違った部分があって
斬新だった…
１）受験番号が「学科」と「実技」で違う …と言っても、１桁くらいしか変わらないんだけど、
受験番号のマークや記入で間違えそうになるので
記入後には確認が必要。
２）学科よりも実技試験の方が先だった 今までは学科 → 実技の順だったけれども、午前中に実技試験だった。
３）
HTML5からの新タグ（HTML）
のうち、「ruby」と「detail」を試用してみた。
（１）rubyルビをふる用のタグ。
一文字ずつ振ってみると、ソースは結構うるさい感じもするけれど
見た目はこっちの方が親切かなぁ。
（ソース）
<ruby>普<rt>ふ</rt> 通<rt>つう</rt> 運<rt>うん</rt> 転<rt>てん</rt> 免<rt>めん</rt> 許<
パンくずリストを作る（HTML）
パンくずリストを入れるとアクセシビリティの向上になって…
とかいうことは聞いていたので、初めて実装してみた。
１）SEOとの関係調べてみると、まず「パンくずリスト」に
「SEO」がキーワードとしてくっついてくるのがよく分からず。
パッと見たところでは
パンくずリストは「そのページに至るまでの足跡」であって
コンテンツそのものではないから、検索エンジンでひっかかってしまうと
逆に都合が悪い。
「canvas」タグについて（HTML）
久しぶりにWebまわりを実装してみたら
HTML5から利用できるようになったという「canvas」タグに
大苦戦。（解決まで３日かかった…）
＜やりたかったこと＞
ウィンドウサイズに合わせて、画像の縮小・拡大を
縦横比率を保ったままページに表示したい。
＜実装方針＞
①HTMLに「canvas」タグを埋込む。
②onLoad( )処理で、ウィンドウサイズに合わせて「canvas」の
heig