意外と知られていないHTMLの基本の話
私はWeb制作が初めての方向け講座だけでなく現役の制作者の方向けに様々なWeb講座をしていますが、現役のWeb制作者の方でもHTMLに関して意外と知られていないんだなと思うことがいくつかあります。 特に、HTML5以前の古いHTMLの使い方のまま覚えている方が多いように思われますので、この記事ではそれを中心に取り上げてみました。 なお、この記事はHTML 5.1およびWHATWG HTML Standardの仕様書を参考に書いています。 width=”100%” のように数値以外の文字列を “” に入れるのはNG たとえばimg要素などで、ブラウザの幅いっぱいに画像を表示したいという場合、昔はimg要素に width=”100%” のような属性をつけることがありましたが、HTML5からはwidthなどの属性値に数値以外を含めることができなくなっています。（つまり%などの単位を含めることがで
エビスコムの本のロードマップ (2014) | エビスコム
昨年の本あたりから、同じ本に初級者向きだというレビューと中～上級者向きだというレビューをいただくケースが増えてきました。 これは、狙い通りではありますし、エビスコムの本をご贔屓にしていただいている方にはご理解いただけると思います。しかし、はじめて手にとっていただく方には「？」以外の何ものでもありませんので、このあたりでエビスコムの本のロードマップを公開したいと思います。 HTML5 スタンダード・デザインガイド CSS3 スタンダード・デザインガイド【改訂第2版】 この2冊のメインテーマは、「これまで第一線でバリバリと仕事をしてきたものの、忙しすぎてHTML5やCSS3といった最近のトレンドにちょっと乗れてないな…なんて方が、これまでに積み上げたスキルを生かしてこれからも第一線でがんばってもらうためには何が必要か？」というところから始まっています。 そのため、現状＆ちょっと未来までの把握と
Exciting Feature of WordPress 3.6: Native Audio & Video Support
We’re all eagerly looking forward to WordPress 3.6 with its beautiful updates to Post Format UI and bright new default Twenty Thirteen theme. But there’s one feature that far and away surpasses all the others. The upcoming WordPress 3.6 release will add native support for audio and video files. This one is a real game changer. We’re going to give you a full introduction to the new capabilities and
[HTML5]datalist要素の基本的な使い方・応用(WordPressで全タグを検索の入力候補にしたりする)
調べる。 備忘録としてwebやデザインについて調べたり 新しく知ったことなどを書き残していくカテゴリです。 datalist要素とは HTML5で新しく加わったdatalist要素は、list属性で紐付けられたinput要素にユーザーが入力する際に、datalist要素内に置かれたoption要素の値をその入力候補として表示させる為の要素です。 datalistタグ内に入力候補としたいワードをvalue属性に持つoptionタグを複数記述します。 <form method="get" action=""> <input type="text" list="tools"> <datalist id="tools"> <option value="手裏剣"> <option value="まきびし"> <option value="煙玉"> </datalist> <input type="s
![[HTML5]datalist要素の基本的な使い方・応用(WordPressで全タグを検索の入力候補にしたりする)](https://cdn-ak-scissors.b.st-hatena.com/image/square/778ae00a3dda92b39324406dab3406d3736f6df8/height=288;version=1;width=512/http%3A%2F%2Fwebcre8.jp%2Fwordpress%2Fwp-content%2Fuploads%2F2013%2F04%2Fhtml5-tag-datalist-01-150x150.png)
Kraken
A lightweight, mobile-first boilerplate for front-end developers. Kraken isn't a framework. It's a starting point for your web projects. A starting point for front-end projects Designed to be lightweight and style agnostic, Kraken includes just the essentials. A minimal, modern CSS reset A responsive, mobile-first grid built on flexbox A well-designed, fluid typographic scale CSS buttons Simple ta
WP-Mix | A fresh mix of code snippets and tutorials
Block Multiple IP Addresses from Text File with PHP Here is a fun little tutorial. It shows how to block multiple IP addresses that are listed in a plain text file. It’s a nice little system to block bad IP addresses without using any database. For example, this is useful if you’ve got a bunch of IP addresses that you want to block quickly. […] CSS Selectors and Default Styles for the WordPress Ad
WordPressのテーマファイルをHTML5にするチュートリアル
このサイトはまだHTML5にしてないので、WordPressのテーマファイルをXHTMLからHTML5にするステップごとに解説されたチュートリアルを紹介します。 Convert Your WordPress Theme to HTML5 下記は各ポイントを意訳したものです。 チュートリアルのゴール HTML5のベーシックなレイアウト Step 1: header.phpをHTML5化 Step 2: index.phpをHTML5化 Step 3: sidebar.phpをHTML5化 Step 4: footer.phpをHTML5化 Step 5: single.phpをHTML5化 Step 6: style.cssをHTML5化 チュートリアルのゴール このチュートリアルは、XHTMLでつくられたWordPressのテーマファイルをHTML5にするものです。テーマファイルはそれぞれ
おれはHTML5 Boilerplate(ボイラープレート)を使い始めるぞ！ジョジョーッ！！
おれはHTML5 Boilerplate(ボイラープレート)を使い始めるぞ！ジョジョーッ！！ 2012.11.20 | この方法お勧めです！ ほらみんなも！ | レスポンシブ ども、パープル・ヘイズのフィギュア買うかどうかどうしようかなあ。と悩み中のパープルです。表題でも叫ばしていただきました通り、今日はHTML5でサイトを構築していくためのベスト・プラクティスと言われているHTML5 Boilerplate(ボイラープレート)についてのお話です。知っている人は知っていますし、すでに使い初めているでしょう。というかこれを使わないと話にならないよ。ぐらいの感じかもしれません。 転換期を迎えたっぽいWEB制作環境 なにやら昨今は、インブラウザデザインや、Sassにless、フレームワークにパッケージ、レスポンシブでモバイルファーストで、プログレッシブ・エンハンスメントですから、WEBサイト構築
WordPressのオリジナルテーマを作るまでに3ヶ月でやった8つのこと
先月リニューアルしたこのブログのテーマを含め、3ヶ月で3つのWordPressテーマを作りました。空いている時間を利用しながらの制作だったので3ヶ月もかかってしまいましたが、Web制作に関してほぼ素人だった自分がオリジナルテーマを作れるようになれるまでの流れを書いてみようと思います。 WordPressのオリジナルテーマに挑戦してみたいと思っている方の参考になれば嬉しいです。 はじめに まず僕がWordPressのオリジナルテーマを作る前の実力は既存のWordPressのテーマをちょっとカスタマイズできるくらい。HTML/CSSの知識は中途半端でほとんどありませんでした。ただ、WordPressを利用したブログ歴は結構長かったのでWordPressに関しての最低限の知識はありました。 目次 1. HTML/CSSの基礎を学ぶ 2. チュートリアルを見ながらWebサイトを作ってみる 3. 自
How To Enable HTML5 In Chrome | Robots.net
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
Blank & Bare WordPress HTML5 Frameworks - Best SEO Companies
If your looking to give your WordPress theme a new design or simply looking to upgrade your code to more modern technologies such as HTML5/CSS3, you will these free WordPress HTML5 frameworks very handy. These HTML5 WordPress frameworks are stripped back bare and mostly include little or no styling which provides a perfect HTML5 framework for you to build your new WordPress site on. Roots Roots is
30 Exceptionally Designed HTML 5 Websites - Dezign Matterz
A constant evolution in the use of new technologies and programming languages is continually evolving across the web, when Paul Irish’s HTML5 Boilerplate project was first introduced it served as an exceptional starting point for creating websites of any type. The HTML5 Boilerplate provided an incredibly useful set of CSS, JavaScript, image, and HTML files which enabled users to kickstart their HT
Bones - An HTML5, Mobile-First starter theme for rapid WordPress development. - Themble
Bones – An HTML5, Mobile-First starter theme for rapid WordPress development. Bones is a WordPress Theme for DevelopersBuilt around the latest in Web Standards, Bones is a rock solid foundation to start any WordPress project. Keep what you need, remove what you don’t. It’s totally up to you. Bones is not a FrameworkFrameworks are great, but sometimes they make things more complicated than they nee
Youtubeの動画を背景に
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ウェブ制作者に必ず役立つ！iOS, HTML5, CSS, jQuery, WordPress, .htaccessなどのチートシートのまとめ
Blogs and tutorials on Angular, NGRX, TypeScript, RxJS, React and everything web!
CSS 20 stunning examples of CSS 3D transforms
MdN Design｜総合情報サイト