タグ

HTMLに関するtatejimaruのブックマーク (7)

  • 化学系研究室ホームページ作成ガイド | Chem-Station (ケムステ)

    近頃はどこの研究室でも自前のホームページを持つことが普通になりました。 ウェブサイトを研究アピールの場としてうまく使うことができれば強力です。特に次世代を担う若者たちは、「まずウェブからはじめる」のがもはやノーマルな感覚です。彼らを化学の世界に引き込んで未来の化学を盛り立てていくためにも、しっかりしたウェブサイトを構築し、質の高い情報発信をしていくことが重要です。 しかし化学者はWebアピールにまだまだ不慣れなせいか、研究室によって意識格差がかなりあるようです。ホームページ作成ソフトの使い方やHTML記法を学ばなくてはならず、キレイなものを作るのはやはりそれなりの経験とセンスが必要になるという避けがたいハードルもあるでしょう。 しかしラボのアピールのために受け取り手に優しいホームページをつくる、というだけでよければ、そこまで難しいものは必要ありません。いくつかのポイントを押さえて作ればそれ

  • 古い感じがしてかっこわるいと思うコードの書き方10例

    ホームページを作り始めて8年近く経ち、たくさん作った方が上達するという思いもあって、今まで数多くのサイトを作ってきましたそんなサイトたちを改めて見直してみて、「何か古い感じがするな~」と思ったコードを挙げてみます。 完全にこれがダメと言っているのではなく、個人的な好みもあるので、温かい目で見てもらえればと思います。 1. フレームを使っている ホームページを作りはじめの頃、サイドにあるメニューが1つ増えるたびにすべてのページで変更しなくてはならず、すごい手間でした。 で、サイドのメニューとメインのコンテンツをフレームで分けて表示していました。 しかし、HTML4.01ではフレームは非推奨で、設定する場合の条件として、文書型宣言(DTD)にFrameset を指定しなくてはいけません。

    古い感じがしてかっこわるいと思うコードの書き方10例
  • http://blog.cntlog.net/sample/140920_bootstrap/layout.php

    Bootstrapを使う環境を作る Bootstrapを使うには2つの方法があります。 Bootstrapをダウンロードし、必要ファイルをサーバーにアップロードする ダウンロードせずにCDN(Content Delivery Network)を使用する ※ローカル環境だと動かない場合があります。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap Template</title> <link href="//maxcdn.b

    http://blog.cntlog.net/sample/140920_bootstrap/layout.php
    tatejimaru
    tatejimaru 2016/02/09
    Bootstrapをいつか使う日のために
  • jQueryライブラリをCDNで読み込んでローカルで動作確認する時に注意すべきこと - 22時に寝ようと思って2時に寝る。

    最近、HTMLCSSJavaScript、jQuery、…かっこ良く言えばフロントエンドな方面の勉強にモチベが上向いている感じです。 で、jQueryについて勉強し始めたときに初歩の初歩でハマったので、備忘録書いときます。(jQueryに限った話じゃないかも) jQueryライブラリを利用する方法 jQueryライブラリを読み込む方法は、2つある。 jQueryライブラリファイルをダウンロードして読み込む方法 CDN(Contents Delivery Network)を利用してjQueryライブラリを読み込む方法 jQueryライブラリをダウンロードして使うのは効率がよくない jQueryは世界中のサイトで広く利用されている。そのサイトがそれぞれjQueryライブラリファイルを自分自身で持っているとすると、そのサイトを見る閲覧者は何度も同じ内容のファイルをダウンロードすることになる。

    jQueryライブラリをCDNで読み込んでローカルで動作確認する時に注意すべきこと - 22時に寝ようと思って2時に寝る。
    tatejimaru
    tatejimaru 2016/02/09
    src部分で"http:"を頭につけないとローカルだと動かない、とのこと
  • 【JavaScript】共通部分を外部化してメンテナンス性を高めよう | blog.ks-product.com

    近年WordPressやMovableTypeといったCMSツールでサイト構築を行うことが一般的になってきて、メンテナンス性向上…近年WordPressやMovableTypeといったCMSツールでサイト構築を行うことが一般的になってきて、メンテナンス性向上の為にヘッダー、フッター、グローバルナビゲーション等、各ページの共通部分は外部ファイル化してインクルード(読み込み)することが多いと思います。 しかし、WordPressやMovableTypeが使えない、ましてやPHPなどのサーバーサイド言語が使えない案件も多いかと思います。 サーバーサイド言語が使えなくてもJavaScriptがあるじゃない 共通部分の外部化・インクルードはサーバーサイド言語でなくてもJavaScriptで行えます。iPhoneの登場以降JavaScriptの地位はかなり向上してデファクトスタンダード的な存在になりま

    【JavaScript】共通部分を外部化してメンテナンス性を高めよう | blog.ks-product.com
  • Emmetを始めるのに、とりあえずこれだけ覚えておけば大丈夫

    バイト先で「新ゆとり世代」と言われました。れこです。 HTMLCSSを省略して書けるZen-Codingの後見、 Emmetについて書こうと思います。 やれCoffeeだTypeScriptだSassだ〜と手をつける前に、 もっと簡単に、デメリット無く作業効率をあげられます。 CoffeeScriptやSassなどのプリプロセッサ系とは違い、 CoffeeやSassの知識を開発メンバー全員が持ってないとならず、 結局自由が効かなくなる、ということはありません。 個人から使えて、チームで使ってもなお良し。 さらに、展開後のカーソルの位置がいい感じだったりと、 細かい気配りまで完璧です。 そんなEmmetを 僕が頻繁に使っている機能に焦点を当てて、紹介したいと思います。 Emmetの導入 Emmetは各種エディタ・IDEのプラグイン形式で配布されています。 お値段は無料です。 Web系の人が

    Emmetを始めるのに、とりあえずこれだけ覚えておけば大丈夫
  • 紙面に近づけたい!HTML+CSSで作る文字レイアウト12個 | PRESSMAN*Tech

    印刷する紙のデザインと異なり、Webデザインは環境によって見た目が変わります。どの環境でも同じレイアウトで見せるには画像として書き出せば確実なのですが、テキストの部分はそうもいきません。 DTPデザイナーの方からも「こんな文字のレイアウトはWebだと無理?」といったご相談を受けることがよくあります。 今年に入って、HTML5&CSS3に対応したブラウザのシェアもかなり増えてきましたので、今回は文字のレイアウトに関するHTMLCSSをご紹介したいと思います。 目次:段組み縦組み(縦書き)行末揃え(両端揃え)先頭文字スタイル(ドロップキャップ)段落先頭1字下げ2行目から1字下げ(ぶら下げインデント)行頭禁則文字ふりがな(ルビ)圏点(傍点、脇点)大文字と小文字の変更スモールキャップス(スモールキャピタル)長体、平体(水平比率、垂直比率)※IE以外のブラウザは、2014年7月4日現在の最新版にて

    紙面に近づけたい!HTML+CSSで作る文字レイアウト12個 | PRESSMAN*Tech
  • 1