Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
0
Help us understand the problem. What is going on with this article?
@aachan_studyrecords

2/14 授業ノート

More than 1 year has passed since last update.

お話

・自分が習ったこと、できること、やったことを出来る限り日本語で書き出す
 (リストアップして説明できるようにする)
 →実際説明しようとすると何をどこまでできます、と話すのがとても難しい=理解不足

今日習ったこと

SEOについて
・検索エンジンはCSSまで読んでいる→読みにくいHTML/CSSを使うと上位表示されない
 ex:)文字の大きさが小さすぎる、リンクとリンクの間が空いていないなど

CSSの記述
・1w=16px
・1.5w=24px→20px
・2w=32px→30px
h1タグ→pタグの倍の大きさが初期値
・文字の共通とユニークについて
 共通→h2,p{…}
 ユニーク→p{…}

・line-heightの考え方について
 →line-heightは文字の大きさ+上下の余白のことである。
・emについて
 →16px≒1em(1文字分)。
 ex:)padding: 10px 1.0rem 8px;→10px(上) 1.0rem(左右) 8px(下)という余白を空ける
 ・emを使うメリット
 →em=親要素の大文字の高さ(フォントサイズ)を1emとする単位。
 つまり文字の大きさを変更したいとき、font-sizeを修正すれば自動的にemがそれを拾って調整してくれるため、修正箇所が減る
 ex:)
h2{
padding: 10px 1.0em 8px; /* emがfont-sizeの値を反映してpadding(この場合は左右の余白)を自動調整する */
font-size: 28px;
text-align: center;
}

class名の命名規則について←まとめきれなかった!

[HTML]
<div class="box">
<div class="box box2">

[CSS]
.box{
width: 500px;
margin: 50px auto;
padding: 40px;
background-color: #ccefff;
}
.box2{
background-color: #ffccf1;
}
.box2>h2{
background-color: #f02121;
}

・「index.html」というファイル名はリンクで表示されない
 検索エンジンは子ページは拾わず、index.html文書のみを読み込んで表示する

感想

今回全然まとめられなかった。
幹ではなく枝葉の情報が多かったから、という感想。
もう少し学習が進めばあの時のあれはそうだったのか!現象が起こると祈ります。

0
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
aachan_studyrecords
HTML/CSS、js、jQuery、PHPのお勉強をしている。

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
0
Help us understand the problem. What is going on with this article?