タグ

WEBデザインとコーディングに関するkjktkのブックマーク (5)

  • HTML5 でやりがちな間違い

    HTML5 Doctor で 「Avoiding common HTML5 mistakes」 という記事が上がっていましたので稚拙ではありますが翻訳など。HTML5 でマークアップする際にやりがちな間違いをいくつか挙げて、さらに正しいマークアップ例も紹介くれていますので、参考にしてみてはいかがでしょうか。 HTML5 Doctor で 「Avoiding common HTML5 mistakes」 という記事が上がっていましたので稚拙ではありますが翻訳など。HTML5 でマークアップする際にやりがちな間違いをいくつか挙げて、さらに正しいマークアップ例も紹介くれていますので、参考にしてみてはいかがでしょうか。 Avoiding common HTML5 mistakes : HTML5 Doctor 翻訳といっても要約みたいな感じですので、書いてあることをそのまま日語にしたものではあり

    HTML5 でやりがちな間違い
  • 自分のwebサイト作る工程 - MEMOGRAPHIX

    2. モック作る次に、Illustrator でモック作る。前は Photoshop で作ってたけど Illustrator に変えた。ラフスケッチでだいたいの構造は決まってるので、それを画面で見た時の見栄えを検証する。雑だけどこれは自分のサイトなのだから自分しか見ないという前提があって、雑でも問題ないということにしてる。8割くらい作り込んだところでやめて、コーディングに入るようにしている。2割くらい変更可能な余地を残しておくことで、コード書くとき融通が効く。 ラフとかモック描かずにコーディング始めることもたまにあるけど、それは余程デザインが頭のなかで固まっている場合に限る。ラフとかモック作るの、コーディングと同じくらい大事だと思ってて、コーディングを始めてしまうとデザインに気を配るのを疎かにしがち。デザインを考えつつ同時にコードを書くというのは結構難しくて、トレーニングが要る。全体のデザ

    自分のwebサイト作る工程 - MEMOGRAPHIX
  • Webサイトの作り方のまとめ!コーディングまで。

    サンプルサイトの制作を通して、「Webサイトのコーディング」についてまとめました。 ここで言うコーディングとは、「HTMLで文書を書いて(マークアップして)、CSSで見栄えを整える(CSSコーディングする)」ことを指します。主に「Webデザイナー」と呼ばれる人たちが担う範囲のコーディングについて書いてます。 以下は目次です。クリックするとその項目へ移動します。 コーディングの下準備 ディレクトリの構造を考える ディレクトリの設置 Web開発環境について CotEditorというテキストエディタ Zen-Codingという便利なプラグイン その他のWeb開発環境 コーディング!まずはマークアップ(HTML) index.htmlの基設定 トップページの内容をマークアップ コーディング!レイアウトを整える(CSS) style.cssの基設定 トップページのレイアウトを整える <heade

    Webサイトの作り方のまとめ!コーディングまで。
  • Border

    「現場のプロが教えるHTML+CSSコーディングの最新常識」を共著で執筆しました 2015年3月25日に株式会社エムディエヌコーポレーションより発売の、「現場のプロが教えるHTML+CSSコーディングの最新常識」を共著で執筆させていただきました。

    Border
  • イラレのアピアランスで作れたアイコンが凄かったので、HTMLとCSSで模写した。 - kojika17

    数カ月前に@suzukisan__が投稿された「Illustrator Unlimited Appearance - suzuki | JAYPEG」は、Illustratorのアピアランスを駆使して、1つのオブジェクトからカメラのアイコンを作るという、面白い試みをされていました。 アピアランスの可能性を示す、インパクトのある内容であったため、記憶に残っている方もいることでしょう。 このアイコンが投稿されてから時間がたっていますが、HTMLCSSに分解されるイメージが自然に湧いてきたので、少しばかりのHTMLCSSでアイコンを模写してみました。 HTMLCSS で作ったカメラアイコン 模写したカメラアイコンは、Internet Explorer 10以上 や、最新のChrome, Firefoxなどであれば表示されるはずです。 こちらがHTMLCSSで書いたものになります。 ソ

    イラレのアピアランスで作れたアイコンが凄かったので、HTMLとCSSで模写した。 - kojika17
  • 1