ブックマーク / webcre8.jp (7)

  • [HTML5]正しいfigure要素の使い方(文脈まで深く考えた)

    figure要素には何を入れられるのか figure要素には何を入れられるか、どう使うべきなのかが疑問になったので考えてみました。 発端:リストにタイトルをつけたい このfigure要素について考えるきっかけになったのは、ブログ内で「タイトルの付いたリスト」を作りたいと思った時です。 別に見出し要素の直後にリストを置けば読み手にはそれについてのリストだと認識されるんでしょうけど…場合によってはなんかしっくりきません。 だって画像はfigureで囲めばfigcaptionで、inputにはlabelで、tableにはcaptionでマークアップ的にしっかり関連づいたキャプションがつけられるのに、リストや定義リスト、あとコードにキャプションがつけられないのは変ですよ、変だよなー。と思ってたわけです。 figure要素の説明を読んだ HTML5.JPを読みに行きましょう。すると figure 要

    [HTML5]正しいfigure要素の使い方(文脈まで深く考えた)
    se7en1
    se7en1 2015/10/28
  • [HTML5]title属性の使い方から考えるコンテンツの意味と提供方法

    みなさん、最近title属性書いてますか?私は書いています。ははは。 先日、アクセシビリティーの事を考えながらアクセシビリティー以外のことも話すお茶会悪徳(AccTalk)に参加してきたのですが、そのときちょっとtitle属性のことが話に上がったのでブログにも書いてみようと思いました。ちなみにこのときはほかにもそばの話、技術的特異点の話、構造化データの話とか色々しました。 #AccTalk #10 – Togetterまとめ AccTalkについての説明がこれであってるのかはわからないですが、気になるひとはページを覗いてみてください★ もちろん参加も歓迎だと思いますよ!アクセシビリティーについていろんなことを質問するチャンスでもありますから。 title属性とは title属性は、HTML5の仕様にもあるグローバル属性のひとつであり、要素に主にツールチップで提供されるような、助言的な情報を

    [HTML5]title属性の使い方から考えるコンテンツの意味と提供方法
    se7en1
    se7en1 2015/05/28
  • HTML5の学習に役立つ(主に)日本語のサイトまとめ2012

    webにあるHTML5の情報は英語のものが多い 当然のことですが、HTML5の情報は殆どが英語です。W3Cのサイトだって英語で書かれていますし、大抵の情報は英語さえ分かればアクセスできますね。 まあとはいえ、HTML5を勉強しようと考えるいきなり誰もが英語を読めなければならないとなるとちょっと難しいですよね。最初は先輩方の翻訳または日語で書かれたオリジナルの文書から学びたい。そして情報の速度や判断の尺度のずれが気になってきてから、それから国外の情報で勉強しても遅くはないはずです。…そう思いたいですw HTML5に関する国内のサイトや情報源をまとめました と言う訳で、今回はwebcre8が認識しているHTML5に関する情報源やリソースサイト、参考になった記事、調べてたら出てきたものをざっくりとまとめてみます。サイト、ブログ記事、リファレンス、ツール等です。せっかくなので、知っているものは英

    HTML5の学習に役立つ(主に)日本語のサイトまとめ2012
    se7en1
    se7en1 2013/09/05
  • [SEO]大手サイトもやっているカテゴリーを使った内部リンク構築術

    Webサイトを上位表示させるためにはコンテンツの質が良いことは当然として、外部リンクの獲得、近年ではソーシャルの活用等も重要になってきています。 ですがそれだけではなく、特にWebサイトの設計段階においては検索エンジンによるWebページの評価の仕組みを理解して、適切にWebサイト内のリンクを構築していくということが重要です。 今回はその内部リンクについて、どういう内部リンクがその機能を果たしつつ検索エンジンに正当に評価されやすいのか、私の経験からその考え方をSEO初心者の方にも分かりやすく解説しようと思います。 内部リンク(Internal Link)とは 内部リンクとは、同じドメイン内から張られたそのドメイン内部のページへのリンクのことです。違うドメインから張られたリンクは外部リンク(External Link)といいます。 内部リンクの果たす役割 SEO的な観点で言うと、内部リンクは外

    [SEO]大手サイトもやっているカテゴリーを使った内部リンク構築術
    se7en1
    se7en1 2013/07/24
  • [web制作]webコンテンツの可読性を左右しそうな要素を思いつくだけ書き出した

    最初に定義をしておくと、可読性とは、素早く読めるか、理解しやすいか、読んでて疲れないかという事です。これらにおいて可能な限り優れたものを作ることが、コンテンツと、それを届けようとする各セクションに関わる人が考えるべきことだという事になります。 可読性とコンテンツ まず、何はなくともコンテンツです。文章が読み易いものであることを可読性が高いという言い方をするのは聞いたことがあるかと思います。そのうち、コンテンツ自体が読み易い内容であるかどうかをリーダビリティー(readability)と言います。 リーダビリティーに関わってくるのは 文章量 図版率 内容 表現、言葉遣い といったものです。コンテンツを作る人は、自分の書いている文章の長さ、文字と図の割合、内容、表現の複雑さ等を届ける相手に適したバランスにしなければいけません。 可読性の低いコンテンツ

    [web制作]webコンテンツの可読性を左右しそうな要素を思いつくだけ書き出した
    se7en1
    se7en1 2013/05/22
  • Sublime Text2との恋を見送り、Adobe Bracketsに巡り会いました

    永らくHTMLエディターを移ることなく過ごしてきたのですが、先日Adobe Bracketsの記事を見て一目ぼれし、インストールしてみました。ごめんな、Sublime Text…! どうもハマれなかったSublime Text 私は普段HTMLを書くときに結構適当なエディターを使ってきたんですが、いい加減ちゃんと効率のいい、Zen-Codingにも対応してて、HTML5の予測変換も出来てSassに対応したエディターを使わなきゃなーと思ってました。 そして現れたのがSublime Text。 ”恋に落ちるエディタ”「Sublime Text」 完全入門ガイド! | 株式会社LIG 確かに、知人友人web制作者達がこいつの魅力にバッタバッタとやられてました。私も望んでいる要件を満たしているこいつが気になってはいました。 恋する速度を爆速化。Sublime TextでZen-Codingを使用

    Sublime Text2との恋を見送り、Adobe Bracketsに巡り会いました
    se7en1
    se7en1 2013/05/20
  • [webサービス制作]「○○がwebサービスを作ってみた」系記事まとめ

    まとめる。 webとwebデザインに関しての、WEBCRE8.jpによる 情報まとめのカテゴリです。 素人がwebサービスを作る 最近、というか結構前からはてなブックマークのアノニマスダイアリー(匿名で書ける日記で閲覧率も高いようです)を中心に、webサービスを何カ月で作ったというような記事を見かけるようになりました。 中にはなんでそんな事がわかるの…良く気付いたね…みたいな事もあって我々としては当に素人か疑いたくもなりますよねw 素人といってもたまたまwebサービスを作ったことがなかっただけで、プログラミングの下地はあったという人もいるかとは思います。 今回はそうしたwebサービス制作秘話系記事をまとめてみます。ついでに、素人ではないにしても、同じように制作までの流れを明かしてくれている記事もいくつかピックアップしたので合わせてどうぞ。 webサービス制作してみた系記事まとめ 自分でW

    [webサービス制作]「○○がwebサービスを作ってみた」系記事まとめ
    se7en1
    se7en1 2013/05/16
  • 1