タグ

2016年1月21日のブックマーク (5件)

  • [HTML5 入門]実制作で迷わない為のマークアップ例:会話文

    文書構造を意識したマークアップ例 今回から始める不定期連載です。HTMLのコーディングのやり方はリファレンスサイト等で例文を用いて行われることが多いですが、どうも抽象的だったり、実際の運用に即していない印象のものが多く見られるように感じています。 仕様に関する解説やコードの書き方も、遠まわしだったり、「だから結局どう書けばいいの?」という感は拭えません。また、ドキュメント自体が書かれた地域の文化を基準にしており、我々日web制作現場の実際にそぐわない場合もありますよね。 こういったことについて、一つ一つ実際の事例や具体的な使われ方を挙げながらHTMLCSSのコーディングについて解説したいと思います。 また、この連載にはブログの記事と同じく私個人のHTML5のマークアップに対する考え方が強く織り交ぜられることと思います。もし見解の相違などありましたらご意見頂きたいと考えています。 シン

    [HTML5 入門]実制作で迷わない為のマークアップ例:会話文
    yomikodesign
    yomikodesign 2016/01/21
    ふむふむ
  • 更新するのが面倒!サイトの共通部分を簡単に作る様々な方法

    サイトにはヘッダーやフッター、ナビゲーション部分など全ページに共通して入る要素があります。 この部分を修正する時はHTMLを全ページ修正するととても手間がかかって大変です。自分のサイトはだいたいCMSで管理しているのでテンプレートを直せばあっと言う間なのですが、それ以外の場合の共通部分を簡単に治す方法を改めて調べてみました。 がんばって直に書いてるものを置換する Dreamweaverのテンプレート機能を使う JavaScriptを使う PHPを使う SSIを使う Node.jsやRubyのツールを使う がんばって直に書いてるものを置換する とりあえず普通にコーディングして、修正などある場合はソフトの一斉置換を使ってなんとかする方法です。 数ページものならあまり気にならないがページが増えていく毎に大変になる。リンクや画像が相対パス指定だと階層が増えると更に大変になります。 <footer>

    更新するのが面倒!サイトの共通部分を簡単に作る様々な方法
    yomikodesign
    yomikodesign 2016/01/21
    ほおおお
  • 「生きるのに向いていないから」健康な24歳女性の安楽死が認められる!!=ベルギー - TOCANA

    現在、世界において積極的安楽死人の自発的意思のもと、医師が自殺幇助すること)が認められているのは、ヨーロッパの数カ国や米国の一部の州に限られている。その中の1国であるベルギーでは、「生きるのに向いていない」という理由で死を望んでいる女性に対する安楽死が行われようとしているようだ。 6月19日付のベルギー紙「De Morgen」によると、今回複数の精神科医によって安楽死が承認されたのは、ラウラさん(仮名)という24歳の女性。安楽死と聞くと、末期症状などの“肉体的苦痛”から解放されるための手段というイメージが強いが、ラウラさんは健康に何の問題も抱えていない。ただし彼女は、幼少期から一貫して自殺願望が頭から離れないという“精神的苦痛”に悩まされてきたのだという。 インタビューに応じたラウラさんは、この自殺願望には自身の生い立ちが少なからず影響を与えていることを認める。彼女の両親にとって、ラウ

    「生きるのに向いていないから」健康な24歳女性の安楽死が認められる!!=ベルギー - TOCANA
  • 【HTML5・CSS3】おしゃれなテーブルデザインのサンプルソース5点 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作

    地味な離島ライター内藤です。普段はコーダーとして仕事をしていますが、たまにはデザイナーさんのように人の目に触れる仕事もしてみたい! そこで日は、日々の業務で見かけてこれは使えるぞと思ったtableを、独自に再構築してソースコードを公開しようと思います。 table作成時に参考になるサイト 題に入る、その前に。XPの公式サポートも終了し、HTML5+CSS3の普及が進んでいます。今更ながら、この技術でどんなtableが実現できるのか、とてもわかりやすく説明されていたサイトをまずご紹介します。 table専門参考ページ4選 table専門の参考ページを4つほど選んでみました。 CSS3を使って美しく装飾されたテーブルの作り方|Webpark CSS3でのtableの作り方を、見た目とソースから解説してあります。 テーブル|CSSデザイン|スタイルシート(CSS)|PHP & JavaScr

    【HTML5・CSS3】おしゃれなテーブルデザインのサンプルソース5点 | 株式会社LIG(リグ)|DX支援・システム開発・Web制作
  • jQueryでレスポンシブ対応の際にウィンドウサイズによって読み込む画像を切り替える実験|BLACKFLAG

    最近ではWebサイトを構築する際にレスポンシブ対応として、PCでの表示のみならずスマートフォンやタブレットでの表示を考慮して構成する必要があります。 レスポンシブ対応でレイアウトに関してはCSSのMediaQueriesを使ったりすることで、ウィンドウサイズによって画面上のレイアウトを調整させたりすることが可能ですが、大きな画像を使用する画面デザインなどの場合ではスマートフォンで表示する際のレンダリング負荷が問題になったりします。 そんな際に使えるようにMediaQueriesと同様の方法で、ウィンドウサイズによって読み込む画像を切り替える動作をjQueryを使って実験的に作ってみたので紹介してみます。 【2016/05/22】 ウィンドウサイズを取得して画像を切り替える部分のスクリプト動作を一部改修しました。 ウィンドウサイズによって切り替える画像については、PCで表示させる為の大きな画

    jQueryでレスポンシブ対応の際にウィンドウサイズによって読み込む画像を切り替える実験|BLACKFLAG