作成:2013/02/4 更新:2014/11/01Web制作 > 基本的なところを簡単に、楽しく覚えたい 自分でサービス作ったり、会社や違う職種でも 色々と「基本」はおさえておきたい 今回はサイト制作に必要な「基本的な知識・情報」を、分かりやすいサイトを中心にまとめました。必ずおさえておきたいスキル・知識です。エンジニア速報はTwitter の@commteで配信しています。 もくじ 1.HTML5 2.CSS 3.レスポンシブ 4.配色 5.視線誘導 / 心理学 6.インターフェース / ユーザビリティ 7.SEO 8.ディレクション 9.アクセス解析 10.WEBマーケティング 11.コピーライティング 12.ソーシャル 1.HTML5HTML5って何?HTML5とは何かを簡単にまとめてみた -Yahoo! JAPANTechBlog Canvasについて知っておく
<!DOCTYPEhtml> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Hello!</title> <meta name="description" content="description"/> <meta name="author" content="author" /> <meta name="keywords" content="keywords" /> <link rel="stylesheet" href="./stylesheet.css" type="text/css" /> <style type="text/css">.body { width: auto; }</style> </head> <body> </body>

webcre8はまだまだ不勉強なところもありますが、HTML5の学習を進めるとともに、このセマンティックWebについて深く興味を持っています。それを通じて学んだことや考えたことはこのブログに残していこうと思います。ご指摘などありましたらブログのコメント欄や@webcre8の方にご連絡頂ければと思います! セクショニングの立ち位置HTML5にはセクショニングと言う概念が存在します。文書構造を明確にする考え方のことで、要素としてはセクショニング・コンテンツやヘッディング・コンテンツに分類されている要素がそのマークアップ上の役割を担っており、これらの要素を用いてセクショニングすることで、文書は正しいアウトラインを得ます。これについては過去記事の[HTML5]アウトラインで迷わない! sectionと見出しについてをお読み頂ければと思います。ある程度勉強したけどsectionとかarticleの
![[HTML5]文を書くのも上手くなる!セクショニングを理解する](/image.pl?url=https%3a%2f%2fcdn-ak-scissors.b.st-hatena.com%2fimage%2fsquare%2fa579b466a9d9646edbe9cc1cec01abca7601b9fc%2fheight%3d288%3bversion%3d1%3bwidth%3d512%2fhttp%253A%252F%252Fwebcre8.jp%252Fwordpress%252Fwp-content%252Fuploads%252F2011%252F09%252Fhtml5-section-outline-150x150.png&f=jpg&w=240)
webcre8はHTML5を勉強中です(APIだとかCanvasだとかはまだです)。当ブログWEBCRE8.jpもHTML5を用いた自作テーマで作成されています。 皆さんもコーディングしていて「これはどう書くのがベストなんだ?」「これであってるのか?」と迷う事ってよくありますよね。HTML5でコーディングしていて最近ホントにこれでいいのか?と迷っていたのはsectionと見出しについて。コーディングレベルのHTML5でよく取り沙汰されるアウトラインの話題ですね。 これについて何人かのweb制作者、特に@HissyNCさんと@kojika17さんと話をしてみたことも含めて、HTML5のアウトラインについて今までのwebcre8と同じように「…つまりどういうことだってばよ?」と混乱している人の為にわかりやすく整理してみようかなーと思います。 厳密な解説はこの記事を読まずとももっと信頼できる文
![[HTML5]アウトラインで迷わない! sectionと見出しについて](/image.pl?url=https%3a%2f%2fcdn-ak-scissors.b.st-hatena.com%2fimage%2fsquare%2fa579b466a9d9646edbe9cc1cec01abca7601b9fc%2fheight%3d288%3bversion%3d1%3bwidth%3d512%2fhttp%253A%252F%252Fwebcre8.jp%252Fwordpress%252Fwp-content%252Fuploads%252F2011%252F09%252Fhtml5-section-outline-150x150.png&f=jpg&w=240)
Dirty Markup [ad#ad-2] Dirty Markupはウェブ制作者がよく使う下記のツールをまとめたような感じです。HTML TidyCSS Tidy JS Beautify Dirty Markupの使い方は簡単で、右側にコードをペーストし、左側でHTML/CSS/JavaScriptを設定し「Clean」ボタンをクリックするだけです。
前回の記事でCSSフレームワークを紹介させてもらいましたが、CSSフレームワークが”如何に凄いのか”は実際に使ってみないとわからないと思って、自分なりのデモも兼ねてTOPページをペラ1枚でも良いので作ってみようと考えました。CSSフレームワークはどれにしようか少し悩みつつ、使いやすそうだなと感じた『HTML KickStart』を採用して、ページを書いてみました。HTML KickStartの概要 ■特徴HTML5,CSS,jQueryをベースにしたフレームワーク フォームやリスト、ボタンなどの基本パーツ完備 スライドショーやタブといったJSパーツも レイアウトはお好きなように、テーブルも4種類 シンプルなアイコンが沢山あります本家サイト :HTML KickStart 紹介サイト : 人と違うデザインのサイトをスクラッチで作るならHTML KickStartをベースにするとい
どうも、@OZPA です。 先月、当ブログのテーマをWordPressにて自作した私。 しかしながら、実はそれまでWordPressの知識どころかhtmlすらろくすっぽきちんと理解していない人間だったのです。 今回はそんな私がWordpressのテーマを一から自作するまでにやったことを備忘録がわりに纏め上げておこうかと思います。 ひとりじゃ出来なかった 今回、テーマを作り始めたのが2011年の12月29日、そしてテーマが完成したのが年が開けて1月の12日。 だいたい2週間弱で自作テーマ発表まで漕ぎ着けたわけなんですが、そこにはそうそうたる方々によります手助けがありました。 そんな方々に敬意を払いつつ、テーマ自作までにやったことと手順を備忘録として残しておこうかと。WordPressのテーマ作成の手順 さて、WordPressのテーマを作成するためには、 0.WordPressをローカルに

ブログやウェブサイトのパフォーマンス改善や運営・セキュリティに役立つ「.htaccess」の設定を紹介します。 .htaccess Files for the Rest of Us [ad#ad-2] 下記は各ポイントを意訳したものです。 リダイレクトとリライト オリジナルのエラーページ 特定のリソースへのアクセス制限 特定のIPのアクセス阻止 IEのレンダリングモードの設定 有効期限を設定してトラフィックを軽減 gzip圧縮の利用 リダイレクトとリライト リダイレクト サイトを移転したなど、永続的なリダイレクトには「HTTP301リダイレクト」で設定します。 転送先のURLは絶対URLで指定します。 Redirect 301 ^old\.html$ http://ドメイン/new.html リライト リライト(書き換え)をする場合は、下記のようになります。 RewriteEngine o
中古ドメインを取得したときに必ず確認することのひとつに、 もともと運営されていたサイトがwwwありなのか、wwwなしなのかということがあります。 これを知る方法は、その中古ドメインのバックリンクを確認します。 たとえば、www.aaa.comにバックリンクがあれば、wwwありですし、 aaa.comにバックリンクがあれば、wwwなしになります。 バックリンク調査サイトによっては、 リンクが多くついているページを表示する機能がありますので、 そちらを使います。 一般的には、 MOZのopen site exploreや https://suite.searchmetrics.com/en/research/links/linked-pages/all-linked-pages https://siteexplorer.info/ あたりのバックリンク調査サイトを使うことで簡単にご確認いただけ
iPhoneもGmailもなかった2000年頃、たとえばメールであれば、一般ユーザーはOutlook Express、ハイエンドユーザーはBecky!を使う、といった習慣があった。Outlook Expressはデフォルトのメッセージ形式がHTMLメールだったので「Outlook Expressにはセキュリティ上の問題があるため、必ずテキスト形式に設定を変更してから使いましょう」というのが雑誌の定番解説だった。MB単位のファイルを添付して送ったら瞬時に送り先から電話がかかってきて、激怒されたこともある。瞬時に届いているのに。 当時HTMLメールを毛嫌いしていた人はいつごろWebメールを受け入れたのだろうか。いまではGmailのようなWebメールは、テキスト形式で送られてきたメールでもHTMLで表示するし、iPhoneの3G回線でMB単位の添付PDFファイルを普通に客先で表示している。どうや

2017年7月25日 Webサイト制作, 便利ツール 今より少しでもコーディングを早くできれば、細かいデザインや機能にも時間をかけて取り組めそう…という事で今回はコーディングのスピードを上げるためにできる事を紹介します。便利なツールを使ったり、ちょっとやり方を変えるだけでより早くコーディングができるようになると思います! ↑私が10年以上利用している会計ソフト! 1. コーディング手順を簡略化する これは自分のコーディング能力を高めて手順を省く、便利なツールを使って手間を省くという事です。例えば私は昔このような手順でコーディングを進めていました。CSSのレイアウトをノートに書き出す レイアウト部分(ヘッダー・メイン・サイド・フッター)のHTMLマークアップCSSでレイアウト部分のスタイリング 表示確認 うまく表示できない箇所の修正 ヘッダー内のHTMLマークアップCSSでヘッダー内の

【公式】バイナリーオプションを牽引するbubingaのアカウント無料作成ならこちら。只今7,000円以上の初回入金で100%ボーナスをゲットできます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く