Webデザインの勉強と製作 | あかとんぼ

フェリカテクニカルアカデミーの学習をベースに、Webについての勉強と製作の過程をまとめています。

HTML

[html][css] 動画を表示する

videoタグで背景いっぱいに動画を表示

[HTML][CSS]スマホ対応

head部の記述 meta name = viewportの記述 <meta name = "viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> content="width=device-width"→デバイスの横幅で描画するように指定 initial-scale→横向き (Landscape mode) にしたとき、iphoneの自動拡大機能を停止 user-scalable…ピンチで拡大するかの有無 meta name = format</meta>…

[HTML][CSS]実践的コーディングにおける注意点

全般 HTML HTML内で、imgのwidth,heightは念のためつけておくこと。 サイズを指定する際は奇数にならないよう注意すること。 インデントのルールを統一すること。(タグで統一、半角スペ2つで統一など…) 機種依存文字(半角かな、囲み数字、<>など)は数値…

[HTML][CSS][自由課題]企業系サイトを制作②

説明 自主課題として制作した企業サイト コピー、ロゴ等設計 写真は今回パブリックドメインのものを使用 テーマカラー青、アソートカラーピンク・黄 バリデーション済

[HTML][CSS][自由課題]企業系サイトを制作①

サイト説明 授業課題で制作した企業サイト 写真を自由に選び、それを元にカラー設計 写真は今回パブリックドメインのものを使用 テーマカラー青、アソートカラーオレンジ バリデーション済

[Web][HTML][CSS][デザイン]Webサイト構築(4/8)

はじめに 今日は一つのスタイルシートでデザインを制御する複数のWebページを作り、階層構造を作ってそれらをリンクしました。 製作手順 ページの固有性を作る(CSSシグネチャ) その他CSS知識:CSSで画像の角を丸くする その他デザイン知識:modernとは何か …

[HTML][CSS] [HTML][CSS]リード文とは/デザイン豆知識/line-heightの性質/CSSの書き方

はじめに 今日は基礎のまとめとして、ワンカラムサイトのレイアウト演習を行いました。 ちょっとしたテクニックについて備忘録的にまとめました。 リード文とは HTMLではp.leadでクラス指定することがありますが、リード文自体の意味をはっきり理解できてい…

[HTML][CSS]ワンカラムページの制作

はじめに 今日はHTML+CSSを使い、画像を多く使うワンカラムのWebページを制作しました。 ポイント ブロック要素とインラインレベル要素を使い分ける 画像ボタンを横に並べる 画像のalt属性を有効に使う backgroundとimgの違いを意識する 適切に画像を配置す…

[HTML]ブロックレベル要素とインライン要素

はじめに 今日は文書構造の理解に必須である、ブロックレベル要素とインライン要素について勉強しました。 ブロックレベル要素とインライン要素とは ブロック要素は「入れ物」インライン要素は「中身」にあたります。 ブロック要素の中には、インライン要素…

[HTML]マークアップの方法とbody要素

はじめに 今日はbody要素の記述方法(マークアップ)の基本と、body内の代表的な要素について勉強しました。 body要素のマークアップ 見出しと段落 body要素の内容は、主に「見出し」と「段落」から成り立ちます。 見出し(Heading)→内容が一目で把握できるも…

[HTML]head要素

はじめに 今日はhead要素の記述内容について学習しました。 HTML文書のメタデータ メタデータとは、HTMLでは“その文書に関する様々な情報”を意味します。 HTML文書のメタデータは、head要素の中に、 <title>タイトル <base>基準URL <link>リンク情報 <style>スタイルシート <script>スクリプト </link></base>…

[HTML]マークアップとHTMLの構造

はじめに 今日はHTMLのマークアップの記述方法と、HTMLの構造について学びました。 マークアップとは マークアップ(Markup)マーク(目印、荷札、タグ)をつけること。 日本語の情報はそのまま理解表示されない→言語指定 マークアップし意味づけることで表示…

[HTML][基礎知識]HTMLとは

はじめに 今日はHTMLの基礎知識について学習しました。 HTMLとは ブラウザに情報を伝えるには、HTMLで記述する必要があります。 Webで情報を発信するには必ずHTMLのルールを理解しなければなりません。 HTML:HyperText Markup Language ・Webページを記述す…