【簡単にレベルアップ!】初心者が気をつけるべきポイント4選

今回はWebflow初心者がやりがちな実装をみなさんにお伝えして、今までよりもレベルアップしサイト制作スキルを身に着ける方法について紹介していきます!今回紹介する方法を改善しこれからの実装で意識をしていくだけでWebflowを使ったサイト制作スキルを一気に上げることが出来ます。

2022
3
15

こんにちは!

LikePayアカデミーの矢野です。
今回はWebflow初心者がやりがちな実装をみなさんにお伝えして、今までよりもレベルアップしたサイト制作スキルを身に着ける方法について紹介していきます!

今回紹介する方法を改善しこれからの実装で意識をしていくだけでWebflowを使ったサイト制作スキルを一気に上げることが出来ます。

それでは、早速紹介していきます!

1.クラス名を決める

いますぐ要素にクラス名を付与しましょう。力づくの作成で、Div block192 なんてことになっていませんか?(昔の僕はなってました)

しっかりとクラス名を付与し、綺麗なCSSを作成し管理をしやすいようにするとサイト制作のスピードが上がりますし、編集もラクに行うことができるようになります。

引用:Twitter @webflowmemes

2.テンプレを使わない

いきなりテンプレートを使用してサイトを作成すると、編集方法がわからなかったり思ったようなデザインを作成することが出来なかったりします。理由は、テンプレートはWebflowの上級者が作成しているのでクラス名や構造が初心者の方がいじるには少し難しくなっています。

まずは自分で要素を組み立て、HTML/CSS、Webflowの基礎を身につけていきましょう!

全ての土台になるので、とても大事です!

3.スタイルシートを作成する

綺麗なデザインは、必ず統一されたレイアウトが繰り返し使われています。
WebflowテンプレートはStyleのページが作成されておりそちらには、
・H1,H2,H3,H4,H5,H6
・テキストのサイズ
・セクションテキストのサイズ
・ボタンのカラー、サイズ
・サイトで使われるカラー

などなど、サイトに使用されるスタイルがまとめられています。
カッコ悪いサイトの特徴は、統一感の無いデザインです。
テキストのカラー、サイズがバラバラだったり、余白の感覚が不揃いだとどうしてもダサくなってしまいます。

最初にスタイルシートを作成して、サイトで使用する要素のルールを自分で決めておくだけで簡単に整ったレイアウトのサイトを作成することができるようになります。

4.デザインを統一させる

3の内容と被ってしまいますが、デザインを統一されることでオシャレでかっこいいウェブサイトを作成することが出来ます。

他のノーコードツールとWebflowを比べた時、Webflowの強みは”ハイクオリティなサイトがノーコードで作れる”です。

是非Webflowの強みを活かし、ハイクオリティでカッコいいデザインのWebサイトを作成しましょう!

まとめ

今回紹介した項目を気をつけて今後のサイト制作を行うだけで、Webflowで制作するスキルアップになります。最初から完璧に出来る人はいないですし、そうである必要はありません。
少しづつ慣れていき、レベルアップを目指しましょう🔥

この記事をシェア

Accelerate your growth on web

We build websites which empower your team to grow rapidly. Submit your project request and we will be in touch shortly to discuss how we can help.

Our customers
株式会社リコー凸版印刷株式会社株式会社NTTドコモフォースタートアップス株式会社株式会社ニジボックス株式会社E-Housing株式会社ファンディオBooko株式会社unique onTerackathon株式会社ココウリE-Three

あなたもNoCodeのプロに

充実したサポートであなたも、最短3ヶ月間でノーコードWeb制作のプロになれます。

  • 300以上のノーコード動画教材

  • チャットサポート

  • 個別ビデオ通話相談