Lesson HTML 入門 HTMLとはWebサイトの文書構造を作るための言語です。 全てのWebクリエーターに必要な知識になります。

viewportとは、PCやモバイル（スマホ、タブレット）といったデバイスごとにコンテンツの表示領域を設定するためのHTML属性値（meta要素のname属性の属性値）のことです。直訳すると「表示領域」を意味し、読み方は「ビューポート」です。 このviewport（meta viewport）を設定してうまくレスポンシブデザインにできれば、SEOへの良い影響が期待できます。 一方、viewportを設定しなければ、レスポンシブデザイン対応できません。 具体的には、モバイル（スマホ、タブレット）でコンテンツを閲覧したときに、PC向けサイトの横幅になるので表示領域が最適化されません。 この場合、文字が画像が小さくて見ずらかったり、見ずらいので都度ピンチアウトやピンチインで拡大縮小して閲覧する手間が増えます。 結果、ユーザーの利便性が低下するので、Googleから評価されづらくなるというわけです

高品質な無料写真素材・フリーフォトを40以上の有名ストックフォトサイトから日本語で横断検索できるサービス「O-DAN(オーダン)」

Webの仕事に興味を持った方の多くはまず最初にHTML・CSSの基本を覚えると思います。 では基本を覚えた後に最初にやるべきことは何だと思いますか？ それは実際にサイトを作ることです。 こんにちは。フロントエンドエンジニアのくめっち（@kume_KROWL）です。 今回は以前に下記の記事で掲載した内容をより細かく解説したものになります。 というのも実はこのソースコードは僕が入社前に練習で取り組んだWebサイト制作の一部になっていまして、 記事内にもある通りうまくいっている箇所も、そうでないところ・苦戦した痕跡が多く残っています。 今回はこのソースコードを現在の僕が書き換えていき、 HTML・CSSの勉強を始めたばかりの人がより実践に近い技術でコーディングできるようにしていきたいと思います。 完成形 上記のような簡単なランディングページ（LP）を作っていきます。 今回作成するサンプルサイトは

改行がある文章でphpを使ってhtmlに出力する際、改行なしで表示されて困ったと言う経験はないでしょうか？ 例えば、メールフォームやカスタムフィールド等でテキストエリア（textarea）に入力された文字を出力するときなどにこの問題に直面することがあると思います。 今回は、phpでこの改行を維持して表示させる方法をご紹介いたします。 phpで改行を挿入する方法 phpで改行を含む文字列が改行なしで表示されるのは改行位置に<br>が挿入されていないことが原因です。これを自動で行ってくれるphpの関数は「nl2br()」です。 「nl2br()」は改行コードの前に<br>を挿入してくれる関数です。ちなみに改行コードとはコンピュータで改行を識別するための特殊な文字(\r\n、 \n\r、\n および \r)のことです。 それでは早速使い方をみてみましょう。

作品紹介のためにポートフォリオ（実績をアピールするサイト）を用意したいとは思っても、重要なポートフォリオサイトのデザインが決まらない！と悩んでしまう方も多いのではないでしょうか。 作品の評価はもちろん、ポートフォリオサイト自体も当然評価対象となりますので、素敵なデザインに仕上げたいものです。 もしポートフォリオサイトをもっとカッコよくしたいと思ったら、クオリティの高い既存のデザインを参考にするといいでしょう。今回は、ポートフォリオサイト作成の参考になるデザイン20選とポートフォリオサイトの作り方をご紹介します。 【Webデザイナー・Webディレクター】のポートフォリオサイト 1. Mana's Portfolio Website http://www.webcreatormana.com/ Web関連で有名なブログ『Webクリエイターボックス』の運営者、Mana氏のポートフォリオサイトです

ポートフォリオサイトは、ただ作品を掲載するだけにとどまらず、それ自体で、自分の個性やセンス、スキルをアピールできるアイテム。したがって、こだわればこだわるほど、その作成者のデザイン性を色濃く表現することができるでしょう。 自分らしいポートフォリオサイトを作成するために、世のクリエイターたちは、さまざまなアイデア、Webデザイン、構成の仕方を熟慮しています。これまでにポートフォリオサイトを作ったことがない人でも、一流のクリエイターが作ったポートフォリオサイトを参考にすることで、新しい切り口やWebデザインを勉強することができるかもしれません。 それでは、早速参考にしたい20のポートフォリオサイトをご紹介できればと思います。 フリーランスとしてディレクション、デザイン、コーディングを手がけている徳田優一さんのポートフォリオサイト。そのトップページは、アイコンや画像を効果的に配置することによって

WebクリエイターボックスのX: @webcreatorboxでは毎日Webに関する記事や美しいデザイン・写真などを紹介しています。その中で今週人気だったWeb関連の情報トップ10を紹介します。見逃してしまった人はこちらでチェック！まだフォローしてない人はお気軽にフォローしてみてくださいね！ 続きを読む プレゼンをする時に必須なのがスライド。私も作成する機会がちょこちょこあります。基本的なデザインの原則はおさえつつ作っていくのですが、プレゼンテーションでの資料として参加者にみてもらうことを前提に考えた時に、特に気をつけているポイントを紹介します。 続きを読む WebクリエイターボックスのX: @webcreatorboxでは毎日Webに関する記事や美しいデザイン・写真などを紹介しています。その中で今週人気だったWeb関連の情報トップ10を紹介します。見逃してしまった人はこちらでチェック！ま