webデザイン初心者へおくる！自分が勉強するときに役立ったものまとめ前編 - IT女子、がんばる。
こんにちは。おはるです。 このブログの名前にもある通り、一応IT女子なのでそれっぽい話題を書いてみようかと！ 私は学生時代webではなく、グラフィックデザインを勉強していました。なので入社するときはhtml？文書構造？CSS3って普通のCSSとどう違うの？状態。 そんな時自分がフロントエンドを勉強するのに役だったものを紹介したいと思います。 はてな界隈はwebをやっている人が多いイメージなので、もしかしたらこんなの知ってるわーな話かもしれませんが（笑）もしもこれから始めてみようかな！って方がいたら参考になれば嬉しいです。 なお、htmlとcssの学習に絞った記事になっています。 ※私が勉強したのは2013年あたりなので、少々情報が古いかもしれません ※後編も書きました！ itjoshi.hatenablog.jp まずは手を動かしてみる どんなサービス？ 勉強のとっかかりとしておすすめ 手
Google、マテリアルデザインWebサイト作成キットを無償公開
米Googleは7月6日（現地時間）、マテリアルデザイン仕様のWebサイトを構築するためのツールキット「Material Design Lite」を公開したと発表した。 基本的なCSS、HTML、JavaScriptのコンポーネントとテンプレートで構成されており、公式サイト（これもMaterial Design Liteで構築されたようだ）からダウンロードできる。 マテリアルデザインとは、Googleが昨年6月に発表したモバイルOS「Android 5.0 Lollipop」から採用しているデザインコンセプト。シンプルで直感的なユーザーインタフェースで、ディスプレイサイズに応じてデザインが最適化されるのが特徴だ。 Material Design Liteの「Lite」には、依存性の少なさ、コードサイズの小ささ（27Kバイトに圧縮されている）、手軽にインストールして使えること、などの意味が込
「HTML 4.01」と「XHTML 1.0」と「HTML5」の違いまとめ フラップイズム
※2014年2月26日に更新しました。要素及び属性をなるべく新しい仕様書に準拠、その他頂いたコメントへの対応を行いました。 ※2014年3月3日更新しました。タグと要素の違いについて追記。本文内でタグと要素の記述が間違っていた部分を修正。「要素が要素をまたがってはいけない」というのはどの形式でも同じなので、記述を削除。 どうも、くーへいです。 今日はある方からリクエストされた記事を書こうかと思います。 皆さんは、コーディングをするときに「HTML 4.01」、「XHTML 1.0」、「HTML5」のどれを使っていますか？ 実際には案件ごとに使い分けているかもしれませんね。 この投稿では、それぞれの違いについて、考えていきたいと思います。 ※要素とタグを混同する方も多いですが、要素とタグでは意味が全く異なります。 例えば、「<html>・・・</html>」は要素ですが、「<html>」や「
WebデザイナーのためのSass/Compass入門 先生：石本 光司
ーーーーーーーーーーーーーーーーーーーーーーー schoo WEB-campusは「WEBに誕生した、学校の新しいカタチ」。 ＷＥＢ生放送の授業を無料で配信しています。 ▼こちらから授業に参加すると、先生への質問や、ユーザーとのチャット、資料の拡大表示等が可能です。 https://schoo.jp/class/228/room ーーーーーーーーーーーーーーーーーーーーーーーRead less
使用中のSublime Text 2のプラグインをまとめてみた | CodePlus
基本的には今使ってるもの中心ですが、僕のメインエディタであるSublime Text 2のプラグインをまとめてみました。 ※細かい設定は省いています。 コーディング関連 Emmet Zen Codingの次期バージョン。主にHTMLを書く際に Hayaku Emmet(Zen-Coding)を上回るCSSの展開 例)bdrds→border-radiusなど Dummy Image Generator Dynamic Dummy Image Generatorで使えるダミー画像の埋め込み BracketHighlighter タグやクォーテーションマークなどのハイライト表示 SCSS SCSSの補完 Compass Compassの補完 jQuery jQueryの補完 CSScomb CSSのプロパティの自動整列 WordPress WordPressの補完 SublimeLinter
使いこなせばもしや爆速！？ここ最近助けられたチートシート色々を厳選してご紹介！ | バンクーバーのうぇぶ屋
さて、以前このブログではチートシートに関する記事を書かせて頂きました。もう1年以上前の記事になるんですねー。本当時間が経つのは早い物です…。 無くても良いけど、あったら意外と便利なチートシート。得に初心者の間はチートシートと睨めっこしながら色々な技術なりアプリなりと向かい合う事も僕は少なくありません。 しかし、当然チートシート関連もアップデートし続けた方が良い物。いつまでも古いチートシートばかり見ていたら、折角の新機能や便利ツールの存在に気づかず、ぬあーーーー！って成る事もあるやもしれません。 というわけで、今日はここ最近見たチートシート紹介第二弾！チートシートとして手元に置いておけば、いざというとき便利かもしれない物を、比較的新しそうな物から共有させて頂こうかなと思います！ それで行ってみましょー！ OverAPI.com | Collecting all the cheat sheet
HTML5, きちんと。
This document describes how to configure Spring Security for authentication and authorization in a web application. It defines a WebSecurityConfig class that configures HTTP security with roles like OWNER and MANAGER for access control. It also defines a UserDetailsManager service for loading users and a User entity class implementing UserDetails. Tests are shown for security configuration, login,
これがスマートフォン向けサイトを作るときの viewport 設定３パターンだ
スマートフォン向けの Web サイトを作るとき、viewport の設定次第で使い勝手が大幅に変わる。 最近はレスポンシブ Web デザインが流行してるけども、その大前提として viewport の設定パターンを抑えておくのは重要だろう。 この記事では、viewport の設定によって、見た目・使い勝手がどう変わるかを解説する。 パターン1: 何も考えずに HTML を書く まずは、viewport を指定せずに、単純な HTML をスマートフォンで表示してみる。 <!DOCTYPE html> <head> <meta charset="utf-8"> </head> <body> <img src="/images/logo-ja.png"> <p>色んな素材がごった煮になった様子をお椀で表現しています。 湯気が<strong>「てっく」</strong>に見えるのが隠し味になっていま
GoogleドライブでWEBサイト(HTML/CSS)が公開できるようになりました。 | TechMemo
Tweet TweetGoogleドライブにHTMLやCSSファイルをアップロードして、WEBサイトの公開ができるようになったみたいですね。 試しに簡単にやってみたので、WEBサイトの公開方法をご紹介いたします。 HTMLやCSSの用意 WEBサイトを公開するためのHTMLやCSSなどを用意しましょう。 Googleアカウントにログイン Googleドライブを利用するには、Googleアカウントにログインする必要がありますので、まずはGoogleアカウントにログインしましょう。 フォルダの作成 Googleアカウントにログインしたら、Googleドライブにアクセスします。まずは、Googleドライブに公開用のフォルダを作成しましょう。 フォルダ名は「WEB」とかなんでもいいです。わかりやすい名前をつけておきましょう。 フォルダの共有設定 作成したフォルダを公開できるように共有設定を一般公開
ブラウザのしくみ: 最新ウェブブラウザの内部構造 - HTML5 Rocks
How browsers work Stay organized with collections Save and categorize content based on your preferences. Preface This comprehensive primer on the internal operations of WebKit and Gecko is the result of much research done by Israeli developer Tali Garsiel. Over a few years, she reviewed all the published data about browser internals and spent a lot of time reading web browser source code. She wrot
[HTML5 入門]HTML5の略された49タグの語源全てを調べた
タグ名がそのままタグの意味になっているものは抜いてあります。ここにあるのは108つあるHTML5タグのうち49個。 付け加えておきますと、この表はタグの英語での意味ではなく、単純にタグの名前になった元の単語を示しただけです。それでもどうしても分かりにくそうなものは熟語として加えてあります。 一応分かりにくいものだけ補足 hrタグについて よく昔hairline(細い線)と説明されているのを見かけましたが、正しくは水平方向の罫線と言う意味です。 dlタグ、dtタグ、ddタグについて dlはdescription listです。HTML4まで、dlは定義リスト、つまりdefinition listという意味でした。しかしHTML5からしれっとdescription list、つまり記述リストと言う意味に変わっており、用途も単に定義の言葉とその対応を示すもの、というものからターム(専門語と言うよ
![[HTML5 入門]HTML5の略された49タグの語源全てを調べた](https://cdn-ak-scissors.b.st-hatena.com/image/square/913d9625c96461318e055dbb38b3d26c92683092/height=288;version=1;width=512/http%3A%2F%2Fwebcre8.jp%2Fwordpress%2Fwp-content%2Fuploads%2F2012%2F10%2Fintroduction-to-html5-150x150.png)
DOCTYPE はなぜあるのか - 若葉もすなる☆日記というもの
DOCTYPE 宣言はなぜ作られたのですかという質問がありました。 HTML 文書の先頭には必ず DOCTYPE がなければならないとされています。しかし確かに DOCTYPE は一見何の役割も果たしておらず、無駄な行にしか見えません。なぜそんな DOCTYPE が作られ、今も必要とされているのかを理解するためには、少し昔の話をする必要があります。 SGML になりたかった HTML HTML は元々 SGML と呼ばれるマーク付け言語を参考に作られました。正確には SGML はマーク付け言語ではなく、マーク付け言語を定義するための枠組み、メタマーク付け言語とでも言うべきもので、どのような要素や属性、タグや実体参照を組み合わせてマーク付け言語を構成するかを SGML の規定に従って記述することになっていました。これが文書型定義 (DTD) であり、 DTD を宣言・参照するのが DOCTY
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ウェブ制作者の気になる疑問を解決へと導く、手元に置いておきたい一冊 -現場のプロが教えるWeb制作の最新常識
公海555000kk线路检测—首页（欢迎您）