web研究会

Web研究会　第７回例会
　日毎に冷え冬に向かって野山の木々の紅葉の色も枯葉色に変っていきますが、
Web研究会第７回例会は美術館研究室で行われました。

★今日の主な学習

◎先月の復習であるが<!DOCTYPE HTML>の説明・<head>でCSSパックを利用している種類。
　Javascriptでスライドする画像で、次に切り替わる画像の時間を変えて確かめてみる。

◎<body> ⇒　<pagewrap>で表示されるページ枠の範囲の説明。

◎<header>　⇒　<h1>タイトル<h1> ⇒　<nav>　
<nav>ナビリンクの増減をしてみる。
　<ul class="menubar ko5 clearfix">のko5と記述しているのはナビが５個あるということ。
　この　ko〇　を増減してみる。
　ナビのリンク先、<li><clss="href="#">リンク先</a></li>・・・・"#"にリンク先のアドレスを
　貼る。
　※絶対パスと相対パスの説明。

◎<nav>：ナビバーの色を変更してみる。

◎ヘッダー画像でスライドしない画像( <img alt=""src=photo/〇〇〇.png"> )の表示される
　位置を変更してみる。
　※変更するとき:CSSでスタイルの管理のfixpicを右クリック⇒スタイルの変更⇒配置で
　　topとrightの数値を変更する。

◎Web4の機能のインテリセンスを利用してhtmlのソースを記述する練習をする。
　<!--この間のコメントはブラウザに表示されない-->
※ファイル「1b.html」を使って <body>～</body>部位のソースを書く練習をする。
　　<!--<body>　～　</body>-->

◎１番目の記事の1b.htmlの84行目(人によって行は違うが)<p clss="bun"で文章の文字の
　大きさ(em)や余白(margin)の説明。ここの数値を変えると文章の表示される余白・文字の
　大きさが変ることを体験。

・・・・・・ほかでした。

★今日の学習は小樽美術館-研究室で午後1時30分～4時20分頃迄

　講師含めて13名が出席しました。
投稿者
みぞいゆき
投稿日
2013/11/24(Sun) 01:53
No.
27

Re: Web研究会　第７回例会


学習の様子　　その1

投稿者
みぞいゆき
投稿日
2013/11/25(Mon) 20:03
No.
28

Re: Web研究会　第７回例会


学習会の様子　その２

投稿者
みぞいゆき
投稿日
2013/11/25(Mon) 20:05
No.
29

Web研究会　第６回例会
今日は小雨模様の肌寒い日でしたが、午後１時30分よりマリンホール２階２号室に於いて
『Web研究会』第６回例会が開催されました。

先ず久原豊子部長よりのUSBのファイル(2013-10-26)を1Web研究会の資料倉庫にコピーする。

★今日の主な学習
(既にグループメールで配布済みのファイルを、各自で印刷の上、更に詳しく解説した。)

〇「サンプルページ３」を画像化したものを例とし、HTML文章はいくつもの要素を組合わせ
て構成されて、別の要素を組み込んでいく　入れ子の構造である(子要素)の説明。

〇header はwidthが100％・heightが100％にする必要性の説明。

〇コンテンツ内の #leftbox部分・#rightbox部分について、#がつている説明・・・
※注：#を使っているleftbox・rightbox・には、<div id></div>がついている。

〇headerには<div id></div>は使っていないので、#はheaderには付かない。

〇９ッのデザインを参考に「サンプルページ３」・「OSSのホームページ」はこの内のどの
デザインにあたるか

〇Web4を起ち上げて今日USBで配布した資料倉庫内の(2013-10-26)のファイル「1a.css」と
「1ah.html」を読み込み、練習したい部分にコメントを使って、タグを書く練習をした。
※注：コメント<!--〇〇〇〇-->の意味と使い方について
例：<!--から始まり、改行があってもかまいません-->

〇注：コメントの意味は、一時的に文章を隠す用途に使えます。ブラウザにも表れません。
ただし、H・Pを公開したときに、ソースが消えた訳ではなく表示を無視されているだけで、
ソースの表示でコメントの部分が丸見えなので注意が必要です。

〇デザインの変更をしてみる
「1a.css」のスタイルの管理で"pagewrap"を右クリック"スタイルの変更"から、変更したい処
に数値、#色などを入れてみる。変更されたデザインの確認をした後、元のデザインに戻した。
・・・・・などなど。受講生も熱心に取り組んでおりました。

★なお、次回の例会迄に今日渡した３８個のファイルの内、残り36個の"〇〇.css.txt" と
"〇〇.html.txt"のcssとtxtをはずす作業をして欲しい。また、web研究会例会で分からない
ことがあった時には、OSSサロンの日にもサポートしますので是非おいで下さい。
・・・・との久原豊子部長からの要望でした。

※例会出席者は講師を含めて１３名でした。
投稿者
みぞいゆき
投稿日
2013/10/27(Sun) 13:51
No.
24

Re: Web研究会　第６回例会


Web研究会　例会の様子①

画像をクリックすると大きく表示されます。

投稿者
みぞいゆき
投稿日
2013/10/27(Sun) 14:00
No.
25

Re: Web研究会　第６回例会


Web研究会　例会の様子②

投稿者
みぞいゆき
投稿日
2013/10/27(Sun) 14:03
No.
26

Ｗｅｂ研究会　第５回例会

9/28(土)　例会がありました。

朝夕の気温もぐんと冷え込むようになりましたが、気温も上がり青空と夏が戻ってきたような午后に、
マリンホール２階４号室に於いて１３時３０分より例会が開催されました。

先ず、久原部長により今日の学ぶことの予定について説明がありました。受講者は部長よりＵＳＢで
配布されたファイル(2013-09-28)をＭysiteの資料倉庫フォルダに納め、拡張子txt形式を、それぞれを
拡張子html・cssにReネームし、またＭysite内にあるphotoフォルダ内の写真(画像)を、ページ作成の為
以外の写真は削除しphotoフォルダ内をスッキリさせることをしてもらいました。

前回例会でも大まかな説明があったＨＴＭＬの構造につて、今日は少し詳しくブラウザには現れないが
<head>の部分で、ページのタイトルや、また、どのような種類のファイルで構成されているのか？
<head>では何種類ものCSSが使われていることで、CSSファイルとhtmlファイルと関連性を解説。
また<html>の構造を図解で説明しました。

<body>の中に<pagewarap>があり<pagewarap>の中に<header>・<contents>・<footer>があることの基本的な
ことの解説。<JavaScript>・についても触れました。

またホームページのレイアウトの９種類の類型について、今日使用するsample3.htmlは９個の内のどの型か？


◎基本的なことの解説の後、受講生各自で用意してきた画像(決められた大きさの)の挿入を行い、サンプルの
　ページを仕上げていく作業に入りました。<JavaScript>で動く、スライドする画像を入れて初めての体験に
　感動の声を上げる受講者に、資料を作った久原部長も疲れが少し軽くなったのではと・・・？思いました。
　１６時過ぎまで熱心にページ作りに取り組みました。

◎画像を入れたら　あとは　あなたの思いを説明文章で記述しページ作りをして下さい。

★今日の出席者は講師を含め１２名でした。
投稿者
みぞいゆき
投稿日
2013/09/29(Sun) 00:59
No.
20

Re: Ｗｅｂ研究会　第５回例会

Ｗｅｂ講習の様子　その1

画像をクリック　　大きくなります

投稿者
みぞいゆき
投稿日
2013/09/29(Sun) 01:09
No.
21

Re: Ｗｅｂ研究会　第５回例会


Ｗｅｂ講習の様子　　その２

投稿者
みぞいゆき
投稿日
2013/09/29(Sun) 01:12
No.
22

Re: Ｗｅｂ研究会　第５回例会


Ｗｅｂ研究会のホームページ　９月例会用、資料のあるところを示す一画面

投稿者
みぞいゆき
投稿日
2013/09/29(Sun) 01:17
No.
23

Ｗｅｂ研究会 第4回例会

8/24(土)　例会ありました

　蒸し暑い日でしたが、マリンホール ２階２号に於いて１３時３０分より第４回例会が開催されました。

始めにsample1.htmlとsample1.cssの名前の変更(自分の名前が判る)を行い、７月でやり残している
受講生もおりますので、復習でsample1にyoutubeを貼ってみることを、ゆっくり丁寧にやってみました。

受講生の殆どが出来ましたので、新規に自分の名前を付けたフォルダを作り、”photo ”と先にリネーム
した”〇sample1.htmlと〇〇sample1.cssを収め、フォルダを久原講師のＵＳＢにコピーし渡しました。

その後、松本講師がＨＴＭＬの構造について①使用するhtmlの種類の宣言の部分②htmlの要素でhead要素
・body要素を説明。その中に入れ子によってhtmlが作られることを大まかに解説しました。

また、”タグ”についても基本的に必要なタグについて解説。

”リンク”の意味と実際に他のホームページを訪問したり、ホームページのデザインなどについて学び
ました。


１６時少し前に例会は終了。　出席人数は１４名でした。

投稿者
みぞいゆき
投稿日
2013/08/25(Sun) 00:51
No.
15

Re: Ｗｅｂ研究会 第4回例会

例会の様子①

写真クリックしてください。大きくなります

写真提供は　佐藤和春さんです

投稿者
みぞいゆき
投稿日
2013/08/25(Sun) 00:59
No.
16

Re: Ｗｅｂ研究会 第4回例会


例会の様子②

投稿者
みぞいゆき
投稿日
2013/08/25(Sun) 01:01
No.
17

Re: Ｗｅｂ研究会 第4回例会


例会の様子③

投稿者
みぞいゆき
投稿日
2013/08/25(Sun) 01:02
No.
18

Re: Ｗｅｂ研究会 第4回例会


例会の様子④

投稿者
みぞいゆき
投稿日
2013/08/25(Sun) 01:04
No.
19
Pages:

Page: | 1 | 2 | 3 | 4 | 5 | 6 |

先頭へ戻る
閲覧回数
12391

最新の技術で綺麗なホ-ムペ-ジ作成を目指すクラブです。月1回の例会ですが、希望の方にはサロンで補習を行っています
最新のwebページ作成に興味のある方はクラブ員までお申込み下さい。

Web研究会のページ

「WelcomeBoard」は、皆様の日常の声をお聞かせ戴いています。貴方の投稿お待ちしてます。

閉じる

修正または削除

処理

記事No

照合キー

閉じる

新記事投稿

おなまえ
タイトル
コメント
掲載画像
照合キー 修正、削除のときに必要です（英数字で8文字以内)
合言葉
文字色 ■ ■ ■ ■ ■ ■ ■

- Joyful Note -