ウェブ学のすすめ

Study of Web Design & Programing

2012-07-01から1ヶ月間の記事一覧

略語を表す「abbr要素」|HTML5課題06

課題 USAを略語として表示させなさい。引用元:テキストの論理構造(2) - Webデザインの勉強|忘筌 解答 プレビュー ↓スマートフォンの方はこちらからプレビューできます。 略語を表す「abbr要素」 コード <html lang="ja"> <head> <meta charset="UTF-8"> <title>略語を表す「abbr要素」</title> <link rel="stylesheet" href="#"> <script src="#"></script> </link></meta></head></html>

定義語を表す「dfn要素」|HTML5課題05

課題 TPOを定義語として表示させなさい。引用元:テキストの論理構造(2) - Webデザインの勉強|忘筌 解答 プレビュー ↓スマートフォンの方はこちらからプレビューできます。 定義語を表す「dfn要素」 コード <html lang="ja"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="#"> <script src="#"></script> </link></meta></head></html>

前後の他のテキストと区別する「b 要素」|HTML5課題04

課題 「ロールケーキ」の部分を、他との違いを表して記述しなさい。最近コンビにで売っているケーキ類が美味しい。特にロールケーキが美味しい。引用元:テキストの論理構造(1) - Webデザインの勉強|忘筌 解答 プレビュー ↓スマートフォンの方はこちらか…

より強調したい内容を示す「strong要素」|HTML5課題03

課題 【HTML5課題03】「注意事項」の部分を、相対的に重要性な高いレベルとして記述しなさい。引用元:基本構造とテキストの論理構造 - Webデザインの勉強|忘筌 解答 プレビュー ↓スマートフォンの方はこちらからプレビューできます。 より強調したい内容を…

強調したい内容を示す「em要素」|HTML5課題02

課題 【HTML5課題02】「ソファーがあって」の部分を強調して記述しなさい。引用元:基本構造とテキストの論理構造 - Webデザインの勉強|忘筌 解答 プレビュー ↓スマートフォンの方はこちらからプレビューできます。 強調したい内容を示す「em要素」 コード <html lang="ja"></html>…

HTML5の基本構造|HTML5課題01

課題 【HTML5課題01】 ドキュメントタイプ宣言を記述し、エンコードタイプを「UTF-8」で記述しなさい。引用元:基本構造とテキストの論理構造 - Webデザインの勉強|忘筌 解答 プレビュー コード <html lang="ja"> <head> <meta charset="UTF-8"> <title>HTML5の基本構造</title> <link rel="stylesheet" href="#"> <script src="#"></script> </link></meta></head></html>

Windows 7でZen-Codingをカスタマイズする方法

Zen-Codingをカスタマイズするためには「zen_settings.js」という設定ファイルをコンピューター上から見つけてファイルを書き変えなければなりません。ただこの設定ファイルを探すのに苦労したので忘れないようにメモしておきたいと思います。<環境> OS:W…

Zen-CodingをDreamweaver CS6にインストール方法

Windows 7に入っているDreamweaver CS6に拡張機能であるZen-codingをインストールしてみました。 【1】zen-codingにアクセス zen-coding - Set of plugins for HTML and CSS hi-speed coding - Google Project Hosting 【2】「Downloads」タブをクリック 【3…

Illustratorでチラシを作る(グリッドレイアウト)

授業で作ったチラシの作り方をを復習してみました。※Illustrator CS6で作成 【1】「ファイル」>「新規」でA3(幅210mm、高さ420mm)を作成 【2】長方形ツールで幅210mm、高さ297mmの長方形を描く 【3】「オブジェクト」>「トリムマークを作成」 【4】【2】で…

Illustratorで名刺を作る

授業で作った名刺の作り方をを復習してみました。※Illustrator CS6で作成 【1】A4(210mm×297mm)の縦で新規作成 【2】長方形ツールで幅91mm、高さ55mmの長方形を描く 【3】「オブジェクト」>「トリムマークを作成」 【4】2で作った長方形を選択しガイドにす…

Illustratorでアップルのリンゴマークを作る方法

昨日作ったFacebookカバー写真(参考:Apple製品ロゴに使われているフォント「Myriad」でタイポグラフィックを作る - ウェブ学のすすめ)にアクセントをつけるためアップルのリンゴマークをIllustratorで作ってみました。↓参考にしたサイト(英語) TEMPLATIS …

Apple製品ロゴに使われているフォント「Myriad」でタイポグラフィックを作る

制作している「iPhone5の噂・流出情報まとめサイト|iPhone噂.com」のFacebookページを開設したので、カバー写真をApple製品ロゴに使われている「Myriad」でタイポグラフィック?風に作ってみました。※Photoshop CS6を使用 【1】新規作成 ↓Facebookページの…

サイトプレゼン【iPhone 5の噂・流出情報まとめサイト|iPhone噂.com】

iPhone5の発売の噂・流出情報まとめサイト|iPhone噂.com 2ヶ月間の勉強の成果であるサイトのプレゼンが終わりましたのでポイントをまとめてみたいと思います。 ロゴ アップルと同じフォント(Myriad)を使用しPhotoshopで作成。 灰色だけでは寂しいので「噂…

複数の写真を同じサイズにする方法【Photoshop CS6でドロップレット作成】

複数の写真を同じサイズにする方法をPhotoshop CS6で試してみたところ無事成功できたので手順を残します。※Windows 7 で、Adobe Photoshop CS4/CS5を使用している人は要注意です!!作成したドロップレットが動作しない問題があります。↓Adobe公式ヘルプペー…