スキップしてメイン コンテンツに移動

7Day's Reportを見ずにー(HTML5とCSS3で書く最新のWebページとはの2回目です)

こんばんは。
毎週土曜日は本来ならばあるテレビを見て寝落ちするのが一般的ですが、部屋の片づけと同時に、昨日のブログ、大幅な反響がありそうなので連続していきます。

今日はさっそく記事を書いていきます!!
卓上にあったのは、昨年度の通信 6月号。この一部記事をWeb化していきたいと思います。
完成記事は後日アップされていますので、こちらをご覧ください。

それでは、さっそくページを書いていくことにします。
ニュースサイト立ち上げにおいては、全然レイアウトを検討していません。そこで、今回は記事を書きながらスタイルを作成していこうと思います。

手元の参考書では、「企画書かけ」・「デザイン下書き」という言葉もあります。そこは頭の中ではある程度こねあがっています。3月から製作を開始しようと考えてもいます。しかし、作るにあたっては、デバイスをどうするのかという疑問も多いのではないでしょうか。

てなわけで、今日はこの号のニュースをまず打ち込むだけ打ち込んでいきたいと思います。
今日はタイトルと本文を書いていきます。

でも、ここだけは注意しないといけないことがあります。
テキストのエディタやVisiual Studioなどでは編集の際に開業しても、ブラウザ側では改行してくれません。必ず区切りのいいところで改行を示す<br />を入力しないとだめです。Wordでは必ず改行してくれます。しかし、Wordなどでの編集の際はコードが大量になってしまいます・・・私はお勧めできません・・・

本来なら先に仕込みの部分をしっかりしないといけないですね。はい。
ということなので、先に仕込みをしてしまいましょう。
ということで今の作業をそのままにして、もう一つ新しいウインドウを開きます。アイコンのところで右クリック→アプリケーションの名前をクリックをすれば新規にウインドウが開けます。
ファイル→新規作成→ファイルで1枚の空のファイルを作ることが可能です。
すると、HTMLページが表示されますので、そこから作っていくのです。
VS2015のHTMLファイルは最新の5を完全に採用しています。最初から書式が書いてあるのでわざわざ準備する必要がありません。下記にその最初の段階のコードを書いていきます。

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>
    
  </title>
</head>
<body>

</body>
</html>


ここに、タイトルとBodyの部分(本体の部分)に手をくわえていきます。最初の仕込みをしっかりしないと後の部分が大変なことになるかもしれません。ですので、仕込みのテンプレートはきちんと仕込まなければだめです。計画は念入りに行いましょう。

ここで気を付けることとしては、「html lang」をjpにすること。enはEnglishの略、jpはJapaneseの略なのでそこは注意しておきましょう。

先ほどの記事部分はBodyの中に書いていくのです。
作成したら、保存をして文字がおかしくなっていないかを確認していきましょう。
今はエディタの中で改行をして、ある程度のところでまとまれば大丈夫だと思います。

次回は、htmLのバージョンを一目で見る方法を説明します!

※ この作業はVisiual Studio 2015で行っています。

コメント

このブログの人気の投稿

Windows 10の歴史を振り返ってみる

みなさんこんにちは。

今週は「de:code」があり、今回も盛りだくさんのセッションになっています。重なっていてかなり大変なので、後日の録画を楽しみにしております。(勿論キーノートはライブで見ます)

さて、7月29日に予定されているWindows 10のUpdateは「Anniversary Update」といいます。 そのUpdateは発売から1年を祝うもので、またこれも大きく機能追加がなされようとしています。
そこで、今回は開発開始からここまでの「Windows 10」を見てみたいと思います。 あのー、今話題の「ちょまどさん」のあの ブログ をまねしたわけではございません!! こっちのほうが内容は大きいです!!

ただ、自分なりの主観などもあるかもしれないので、閲覧の際はお気を付けを!!

ポイントとしては、大きく進路変更がなされるのは、「記者会見か開発者会議」の時です。十分に注目してみてください!

また、この10関係の連載はこちらで随時時間のある時に再掲載しているので、こちらもご覧ください。(ブログ更新時にこちらのリンクへたどれるようにしておきます。)

オリジナルページ:http://shutokenrepoort.is-mine.net/rensai/win10/win10-001.html(一回目の記事へリンクしております)

もしWindows 10がなければ Windows 8を自分で見たのは高校1年の終わりの春休み前日でした。(その時は先に帰った人に駅の指定席券売機で座席照会を電話で頼んだことも・・・)その日は、学校の近場にショッピングセンターがオープンしたので、終業式であったので行ってみることにしました。

まあ行ったのはフードコート、模型屋をメインに一周はしましたね。家電量販店で立ち止まったときのことでした。このときのチラシで売り出されているのはほとんどが「Windows 8」。デモ機を触ってみると、かなりの操作感に戸惑いを感じたことが記憶にあります。まず、スタートメニューは?? なにこの全画面アプリ?? クラシックモードは?? という感じでした。

それをみて、「やはりWindows 7」という印象がかなり自分の中に入り込んでしまったのが印象深いです。学校の中でも、遅いけどWindows 7(大量のソフト積んでるのにメモリ2GB)、家に帰れ…

Nikon Coolpix B700レビュー @鉄道編

だいぶ晴れの日や暖かくなる日が多くなりました。しかし、大気の状態が夕方には不安定になる日が多発していますね。となると夜の車の運転はかなり怖く、先日は法定速度-10Km/hで走った(夜かつ大雨)のですが、隣に親を乗せていると「下手くそ」とか「とろくさい」と言われています。しかし、ここは安全のため。
今は車庫入れと複数車線の走り方がまだまだですので、行く機会があるときはしっかりと学んでいきたいと思います。

それはさておき、今週金曜日に東武鉄道がダイヤ改正するようです。今回の目玉は何といっても新型特急「リバティ」運転開始と、6050型の浅草口撤退です。てなわけで、新型カメラを使ってのレビューをジャンルを絞って書いていきます。

まず、6050の結果というと・・・ 少々不満な形でした。というのも、印刷した時刻表を忘れたおかげで散々な羽目になったのです。。。区間快速の時間は忘れるは所要時間はわからない。。。
んでも初めてフル形式で撮ったのはいい記念になったと思います。



下りで2本来てたのに・・・
さらにはリバティも来ていたので、これもまた大事件。新型特急の時刻も分かればまた改正後に行ければいいなと思っています。

そのほか、急行や回送などを取って、夕方にはアイスクリームのプレゼントをもらって帰宅しました。

久しぶりに大量にカードの容量を使ったな・・・って
まあ、夕ラッシュの輸送障害を除いてね

直ったぞ!Xamarin!~環境が変に壊れたときの修復方法~

こんにちは。
Xamarin初心者というかはじめる際には環境構築が結構大変だと言ってますが、実は私も別のわなにはまってしまってました。
しかし、環境を直すことに成功したので、今回その手法などについて書いていきたいと思います。

トラブルの内容:Visual Studio 2015の設定項目の中にある「Xamarin」をクリックすると、「このページを読み込む際にエラーが生じました」と表示される。この影響でプロジェクトがWindows系以外作成できなくなってしまう。

ずっと悩んでいて検索かけてもこの手法はあまり見当たらない・・・ということでハッシュつけて聞いてみました。ひとまずXamarinを抜こうとトライ。
抜き方(アンインストール)についてはこちらを参考にさせていただきました。

https://www.xlsoft.com/jp/products/xamarin/uninstall_from_vs.html(エクセルソフト:Visual Studio から Xamarin を完全アンインストール)

コントロールパネルからアンインストールしても、フォルダ系は残っていますので、確実に削除という方法をとりました。

その後、Xamarinの公式サイトからXamarinアカウントを作ることにしました。
アカウントを作成する際のパスワードの制限がかなり強くなっているので忘れないことが重要。
12文字以上で記号をつけろ?とのことでした。

アカウントを作成し、トップから“Dashboard”をクリックすると、下のような画像のページに。(初期はコンピューターとの連携の画面が出てきます。)

最初にコンピューターの連携が出てしまった場合は、上の“Downloads”をクリックして上記の画像のページに飛んでください。
余談ですがマーカーされているところは旧バージョンの話だと思うのですが、今回はそこは無視でいけました。もし必要ならばクリックしてやってください。

話を戻し、最新のでよいというなら次のマークしている部分をクリックしてください。すると、ひょっこりと出てきます。
私はこの中の“Xamarin.iOS”のWindows版を選びました。
すると、どのインストーラーにしますか的な質問が飛んでくるので、下の赤枠のところをクリック。

msiファイルをダウンロードしますので実行してください。(…