mkasumi.com


少し前に、11月にあった色彩検定の結果がきました。
なんとか、無事に合格できました〜!
いきなり2級を受けるという荒技を実行したのですが、
無事に合格できて安心です。



さて、実は前からa-blog cmsさんのテーマを使わせてもらって、HTMLとCSSを書いていました。
ある程度できてきたので、今日、実際の物と答え合わせをしました!
・・・まあ、間違っていますよね。
そんな中、合っているところがあると嬉しくなるもんですね。

答え合わせをしていて疑問に思った物がありました。
text-align:-webkit-match-parent
なんだこれ、と思って調べても出てこない・・・。
CSSリファレンスのサイトをみてもtext-alignのところにない・・・。
ちょうど話しかけてくれたウェブデザイン学科の先生に聞くことで解決できました。(ほんとにタイミングよく話しかけてくれて助かりました)

-webkit-

match-parent
は別々のようで、

-webkit-は、ベンダープレフィックスというもので、
safariやgooglechromeに使われる物です。

webkit以外にも種類があり、

moz : firefox
o : opera
ms : IE
これらはCSS3を使うときに適用します。
それぞれのブラウザ向けのベンダープレフィックスをつける必要があるのです。

ですが、すでにgooglechromeやfirefoxなどのブラウザでは、ベンダープレフィックス無しでも
動作できるようになっています。
そのため、ベンダープレフィックス無しのものも一緒に書いておくと良いみたいです!

ちなみに、もうひとつのmatch-parentというものは、CSS3の一つでした。
CSS3だったため、いつも使っているCSSのリファレンスサイトにはなく、ドリームウィバーにもなかったみたいです。


ベンダープレフィックスは、ドットインストールなどでよく単語を聞いていたんですが、
実際になるときちんと理解できていなかったことが分かりました。
CSS3も、どんどん覚えていかないといけないですね。
既にあるサイトを作ることで、自分がもっと勉強するべきところが発見できて、ためになりました。


では、これから土曜日に参加予定のWCANのために名刺を作ります!
それでは〜


Tag:a-blogcms 

Posted by 森田かすみ at 20:21  Permalink

12月8日に「WEBデザインハンズオンセミナーVol.1」に参加させて頂きました。

自分自身、初めてこういったWEBデザインのセミナーに参加したので、

若干緊張しつつも、わくわくしながら行ってきました!



まずセミナーが行われる前なのですが、複数の方々から名刺を頂きました。

こういったセミナーのときには皆さん名刺を配るんですね〜!

そんなことも知らなかったため、名刺は用意できず・・・。

今度からは持っていこう・・・。



今回のセミナーは、WEBデザインをし始めた人や、WEBデザインの仕事をし始めた人などを対象にされています。

そのため、本当に基礎のことから丁寧に教えてくれました。

前半の座学の部分では、例えば、実際の仕事の流れ、就職についてからインターネットの歴史、仕組みなど・・・!

なんでもインターネットが冷戦時代に作られたらしくて、驚きました!

他にも、今回はWEBデザインのセミナーだったため、

デザインの基礎についても教えてくださいました。

文字は端に揃えるときれい、とか、文字の間隔は同じ方がきれい、とか。

人にはちょっと聞きにくい基礎知識で、

知らなかったことなどがたくさんあり、とても勉強になりました。



後半に行われたハンズオンセミナーでは、まずはじめに4人1組になり、

クライアントからウェブサイトの制作依頼という内容で、ワイヤーフレームを作りました。

1つめは、一般的な企業サイトを、2つめは挑戦的なものを、というお題でした。

挑戦的なものの方は、どのグループもアイデアが面白くて、

楽しくプレゼンを聞いていました。



つぎには、実際にPhotoshopを使ってのテクニックを学びました。

実際に制作する前に、webデザインにとっておすすめのPhotoshopの設定から始まりました。

設定が終わると、ボタンを制作する際に、影などを意識することで

ボタンっぽさを出すことができる方法を教えてくださいました。



初めてのセミナーでしたが、そんなに固い感じではなくて、

座学も2時間くらいあったはずなのですが、楽しく、あっという間でした。

初めて会った人とも、お知り合いになることができました。

他にも教えてくださる予定みたいでしたが、丁寧に教えてくださったので、

とても分かりやすかったと思います。



また次回の開催を予定されているようなので、

参加できたら良いなあ、と思っております。

今度はきちんと名刺を作って、名刺交換ができるようにしたいです!


Tag:セミナー 

Posted by 森田かすみ at 20:21  Permalink

やっと日曜日に色彩検定が終わりました!
と、いうことでウェブの勉強を再開したいと思います。
最近、印刷用のCSSというものを知りました。
印刷用CSSとは簡単に言ってしまうとウェブ上の画面を印刷したとき用のCSS、そのまんまのことです。
ウェブ上の画面をそのまま印刷すると、レイアウトが崩れしまったり、読みにくくなってしまうことがあるみたいです。
それを防ぐのが印刷用CSSです。
印刷用CSSを用意しておけば、印刷されたときに印刷用CSSが適用されます。

印刷用CSSでできること

  • フォントの指定
  • 印刷に不要な内容の非表示化
  • 印刷時にリンクURLを出力する

印刷用CSSで気をつけること

  • 印刷可能領域の制限
  • 印刷したときの改ページ位置
  • マルチカラムレイアウト

印刷用CSSという機能がありますが、パソコンのモニタをそのまま印刷したい!という場合には、キャプチャやプリントスクリーンのほうが良いみたいですね〜。
私もウェブサイトを印刷したいときには、用途を分けて使用したいと思います。


Posted by 森田かすみ at 20:17  Permalink


前から憧れていたレスポンシブサイト、作れました!
今回はサーバーやドメインを取得したので見れるようになっています。

今回作ったサイト:http://mkasumi.com/

■始めにやろうと思ったこと

端末によって対応させるCSSの指定
画像サイズの可変


■最終的にやったこと

メディアクエリー
画像サイズの可変
javascript
FTPサーバー
サーバー
ドメイン
SEO対策

■後から思いついたこと

HTML5
CSS3でシャドウとかつけたい。

「レスポンシブ・ウェブデザイン」のつづきを読む


Tag:レスポンシブ 

Posted by 森田かすみ at 20:51  Permalink

プロフィール

森田かすみ

名古屋のWeb制作会社でマークアップエンジニアとして働いています。マークアップ勉強会名古屋という勉強会の主催もやっています。

  • はてなブックマーク

カテゴリー